@scalar/use-codemirror 0.9.0 → 0.10.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @scalar/use-codemirror
 
+## 0.10.0
+
+### Minor Changes
+
+- 0e64a36: refactor: rename all --theme-_ variables to --scalar-_
+
+### Patch Changes
+
+- 22f2858: chore: ran syncpack to update packages
+
+## 0.9.1
+
+### Patch Changes
+
+- 6889ad9: feat: tab and shift+tab codemirror, and escape codeblock hotkeys
+
 ## 0.9.0
 
 ### Minor Changes

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2023 Scalar
+Copyright (c) 2023-present Scalar
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/dist/hooks/useCodeMirror.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useCodeMirror.d.ts","sourceRoot":"","sources":["../../src/hooks/useCodeMirror.ts"],"names":[],"mappings":"AAkBA,OAAO,EAAE,KAAK,SAAS,EAAe,MAAM,mBAAmB,CAAA;AAC/D,OAAO,EACL,UAAU,EAKX,MAAM,kBAAkB,CAAA;AACzB,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,GAAG,EAMT,MAAM,KAAK,CAAA;AAGZ,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAA;AAGlD,KAAK,cAAc,GAAG;IACpB,yCAAyC;IACzC,aAAa,EAAE,GAAG,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IACzC,mDAAmD;IACnD,UAAU,CAAC,EAAE,gBAAgB,CAAC,SAAS,EAAE,CAAC,CAAA;IAC1C,8BAA8B;IAC9B,YAAY,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;IACpD,mDAAmD;IACnD,QAAQ,EAAE,gBAAgB,CAAC,kBAAkB,GAAG,SAAS,CAAC,CAAA;IAC1D,2CAA2C;IAC3C,OAAO,CAAC,EAAE,gBAAgB,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,CAAA;IAChD,yCAAyC;IACzC,QAAQ,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;IAChD,gDAAgD;IAChD,WAAW,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;IACnD,aAAa,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;IACrD,YAAY,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;IACpD,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAC5B,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,uBAAuB,GAC/B,CAAC,cAAc,GAAG;IAChB,qEAAqE;IACrE,OAAO,EAAE,gBAAgB,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAC7C,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9B,CAAC,GACF,CAAC,cAAc,GAAG;IAChB,QAAQ,EAAE,gBAAgB,CAAC,SAAS,GAAG,IAAI,CAAC,CAAA;IAC5C,OAAO,CAAC,EAAE,gBAAgB,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAC9C,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC/B,CAAC,CAAA;AAsBN,sCAAsC;AACtC,eAAO,MAAM,aAAa,WAChB,uBAAuB;qCAEE,MAAM,KAAK,IAAI;gBACpC,IAAI,UAAU,GAAG,IAAI,CAAC;CA+HnC,CAAA"}
+{"version":3,"file":"useCodeMirror.d.ts","sourceRoot":"","sources":["../../src/hooks/useCodeMirror.ts"],"names":[],"mappings":"AAmBA,OAAO,EAAE,KAAK,SAAS,EAAe,MAAM,mBAAmB,CAAA;AAC/D,OAAO,EACL,UAAU,EAKX,MAAM,kBAAkB,CAAA;AACzB,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,GAAG,EAMT,MAAM,KAAK,CAAA;AAGZ,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAA;AAGlD,KAAK,cAAc,GAAG;IACpB,yCAAyC;IACzC,aAAa,EAAE,GAAG,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IACzC,mDAAmD;IACnD,UAAU,CAAC,EAAE,gBAAgB,CAAC,SAAS,EAAE,CAAC,CAAA;IAC1C,8BAA8B;IAC9B,YAAY,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;IACpD,mDAAmD;IACnD,QAAQ,EAAE,gBAAgB,CAAC,kBAAkB,GAAG,SAAS,CAAC,CAAA;IAC1D,2CAA2C;IAC3C,OAAO,CAAC,EAAE,gBAAgB,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,CAAA;IAChD,yCAAyC;IACzC,QAAQ,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;IAChD,gDAAgD;IAChD,WAAW,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;IACnD,aAAa,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;IACrD,YAAY,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;IACpD,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAC5B,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,uBAAuB,GAC/B,CAAC,cAAc,GAAG;IAChB,qEAAqE;IACrE,OAAO,EAAE,gBAAgB,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAC7C,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9B,CAAC,GACF,CAAC,cAAc,GAAG;IAChB,QAAQ,EAAE,gBAAgB,CAAC,SAAS,GAAG,IAAI,CAAC,CAAA;IAC5C,OAAO,CAAC,EAAE,gBAAgB,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAC9C,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC/B,CAAC,CAAA;AAsBN,sCAAsC;AACtC,eAAO,MAAM,aAAa,WAChB,uBAAuB;qCAEE,MAAM,KAAK,IAAI;gBACpC,IAAI,UAAU,GAAG,IAAI,CAAC;CA+HnC,CAAA"}

package/dist/index.js

@@ -18793,6 +18793,49 @@ const completionKeymap = [
   { key: "Enter", run: acceptCompletion }
 ];
 const completionKeymapExt = /* @__PURE__ */ Prec.highest(/* @__PURE__ */ keymap.computeN([completionConfig], (state) => state.facet(completionConfig).defaultKeymap ? [completionKeymap] : []));
+function changeBySelectedLine(state, f) {
+  let atLine = -1;
+  return state.changeByRange((range) => {
+    let changes = [];
+    for (let pos = range.from; pos <= range.to; ) {
+      let line = state.doc.lineAt(pos);
+      if (line.number > atLine && (range.empty || range.to > line.from)) {
+        f(line, changes, range);
+        atLine = line.number;
+      }
+      pos = line.to + 1;
+    }
+    let changeSet = state.changes(changes);
+    return {
+      changes,
+      range: EditorSelection.range(changeSet.mapPos(range.anchor, 1), changeSet.mapPos(range.head, 1))
+    };
+  });
+}
+const indentMore = ({ state, dispatch }) => {
+  if (state.readOnly)
+    return false;
+  dispatch(state.update(changeBySelectedLine(state, (line, changes) => {
+    changes.push({ from: line.from, insert: state.facet(indentUnit) });
+  }), { userEvent: "input.indent" }));
+  return true;
+};
+const indentLess = ({ state, dispatch }) => {
+  if (state.readOnly)
+    return false;
+  dispatch(state.update(changeBySelectedLine(state, (line, changes) => {
+    let space2 = /^\s*/.exec(line.text)[0];
+    if (!space2)
+      return;
+    let col = countColumn(space2, state.tabSize), keep = 0;
+    let insert2 = indentString(state, Math.max(0, col - getIndentUnit(state)));
+    while (keep < space2.length && keep < insert2.length && space2.charCodeAt(keep) == insert2.charCodeAt(keep))
+      keep++;
+    changes.push({ from: line.from + keep, to: line.from + space2.length, insert: insert2.slice(keep) });
+  }), { userEvent: "delete.dedent" }));
+  return true;
+};
+const indentWithTab = { key: "Tab", run: indentMore, shift: indentLess };
 class Stack {
   /**
   @internal
@@ -23598,87 +23641,87 @@ var createTheme = (_ref) => {
 const customTheme = createTheme({
   theme: "light",
   settings: {
-    background: "var(--theme-background-2, var(--default-theme-background-2))",
-    foreground: "var(--theme-color-1, var(--default-theme-color-1))",
-    caret: "var(--theme-color-1, var(--default-theme-color-1))",
+    background: "var(--scalar-background-2)",
+    foreground: "var(--scalar-color-1)",
+    caret: "var(--scalar-color-1)",
     // Selection likely needs a hardcoded color due to it not accepting variables
     selection: "rgba(151, 183, 205, 0.2)",
     selectionMatch: "#e3dcce",
-    gutterBackground: "var(--theme-background-2, var(--default-theme-background-2))",
-    gutterForeground: "var(--theme-color-3, var(--default-theme-color-3))",
+    gutterBackground: "var(--scalar-background-2)",
+    gutterForeground: "var(--scalar-color-3)",
     gutterBorder: "transparent",
-    lineHighlight: "var(--theme-background-3, var(--default-theme-background-3))",
-    fontFamily: "var(--theme-font-code, var(--default-theme-font-code))"
+    lineHighlight: "var(--scalar-background-3)",
+    fontFamily: "var(--scalar-font-code)"
   },
   styles: [
     {
       tag: [tags$1.standard(tags$1.tagName), tags$1.tagName],
-      color: "var(--theme-color-purple, var(--default-theme-color-purple))"
+      color: "var(--scalar-color-purple)"
     },
     {
       tag: [tags$1.comment],
-      color: "var(--theme-color-3, var(--default-theme-color-3))"
+      color: "var(--scalar-color-3)"
     },
     {
       tag: [tags$1.className],
-      color: "var(--theme-color-orange, var(--default-theme-color-orange))"
+      color: "var(--scalar-color-orange)"
     },
     {
       tag: [tags$1.variableName, tags$1.propertyName, tags$1.attributeName],
-      color: "var(--theme-color-1, var(--default-theme-color-1))"
+      color: "var(--scalar-color-1)"
     },
     {
       tag: [tags$1.operator],
-      color: "var(--theme-color-2, var(--default-theme-color-2))"
+      color: "var(--scalar-color-2)"
     },
     {
       tag: [tags$1.keyword, tags$1.typeName, tags$1.typeOperator],
-      color: "var(--theme-color-green, var(--default-theme-color-green))"
+      color: "var(--scalar-color-green)"
     },
     {
       tag: [tags$1.string],
-      color: "var(--theme-color-blue, var(--default-theme-color-blue))"
+      color: "var(--scalar-color-blue)"
     },
     {
       tag: [tags$1.bracket, tags$1.regexp, tags$1.meta],
-      color: "var(--theme-color-3, var(--default-theme-color-3))"
+      color: "var(--scalar-color-3)"
     },
     {
       tag: [tags$1.number],
-      color: "var(--theme-color-blue, var(--default-theme-color-blue))"
+      color: "var(--scalar-color-blue)"
     },
     {
       tag: [tags$1.name, tags$1.quote],
-      color: "var(--theme-color-3, var(--default-theme-color-3))"
+      color: "var(--scalar-color-3)"
     },
     {
       tag: [tags$1.heading],
-      color: "var(--theme-color-3, var(--default-theme-color-3))",
+      color: "var(--scalar-color-3)",
       fontWeight: "bold"
     },
     {
       tag: [tags$1.emphasis],
-      color: "var(--theme-color-3, var(--default-theme-color-3))",
+      color: "var(--scalar-color-3)",
       fontStyle: "italic"
     },
     {
       tag: [tags$1.deleted],
-      color: "var(--theme-color-3, var(--default-theme-color-3))",
+      color: "var(--scalar-color-3)",
       backgroundColor: "transparent"
     },
     {
       tag: [tags$1.atom, tags$1.bool, tags$1.special(tags$1.variableName)],
-      color: "var(--theme-color-3, var(--default-theme-color-3))"
+      color: "var(--scalar-color-3)"
     },
     {
       tag: [tags$1.url, tags$1.escape, tags$1.regexp, tags$1.link],
-      color: "var(--theme-color-1, var(--default-theme-color-1))"
+      color: "var(--scalar-color-1)"
     },
     { tag: tags$1.link, textDecoration: "underline" },
     { tag: tags$1.strikethrough, textDecoration: "line-through" },
     {
       tag: tags$1.invalid,
-      color: "var(--theme-color-3, var(--default-theme-color-3))"
+      color: "var(--scalar-color-3)"
     }
   ]
 });
@@ -23894,6 +23937,7 @@ function getCodeMirrorExtensions({
       keymap.of([
         ...completionKeymap,
         ...closeBracketsKeymap,
+        indentWithTab,
         selectAllKeyBinding
       ])
     );
@@ -23976,7 +24020,7 @@ const _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const CodeMirror = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-88edf4c8"]]);
+const CodeMirror = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-74ed365a"]]);
 export {
   CodeMirror,
   colorPicker,

package/dist/style.css

@@ -1,15 +1,15 @@
 
-.codemirror-container[data-v-88edf4c8] {
+.codemirror-container[data-v-74ed365a] {
   width: 100%;
   height: 100%;
   padding-top: 4px;
   min-height: 76px;
-  background: var(--theme-background-2, var(--default-theme-background-2));
-  color: var(--theme-color-1, var(--default-theme-color-1));
+  background: var(--scalar-background-2);
+  color: var(--scalar-color-1);
   display: flex;
   align-items: stretch;
 }
-.copy-to-clipboard-button[data-v-88edf4c8] {
+.copy-to-clipboard-button[data-v-74ed365a] {
   background: red;
 }
 
@@ -17,7 +17,7 @@
   flex-grow: 1;
   max-width: 100%;
   cursor: text;
-  font-size: var(--theme-small, var(--default-theme-small));
+  font-size: var(--scalar-small);
   /* Don't scale wide text on mobile because we let it scroll */
   -webkit-text-size-adjust: 100%;
 }

package/dist/themes/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/themes/index.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,WAAW,uCAwFtB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/themes/index.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,WAAW,uCAsFtB,CAAA"}

package/package.json

@@ -11,7 +11,7 @@
     "vue",
     "vue3"
   ],
-  "version": "0.9.0",
+  "version": "0.10.0",
   "engines": {
     "node": ">=18"
   },
@@ -32,6 +32,7 @@
   },
   "dependencies": {
     "@codemirror/autocomplete": "^6.12.0",
+    "@codemirror/commands": "^6.3.3",
     "@codemirror/lang-css": "^6.2.1",
     "@codemirror/lang-html": "^6.4.8",
     "@codemirror/lang-json": "^6.0.0",
@@ -49,11 +50,11 @@
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.0.4",
-    "@vitest/coverage-v8": "^1.2.2",
+    "@vitest/coverage-v8": "^1.5.0",
     "tsc-alias": "^1.8.8",
-    "vite": "^5.1.1",
-    "vitest": "^1.2.2",
-    "vue": "^3.3.0",
+    "vite": "^5.2.9",
+    "vitest": "^1.5.0",
+    "vue": "^3.4.21",
     "vue-tsc": "^1.8.19"
   },
   "peerDependencies": {