rwb-codemirror-helix 0.2.2 → 0.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -196,7 +196,48 @@ var helixBaseTheme = EditorView.baseTheme({
196
196
  fontStyle: "italic",
197
197
  opacity: "0.7"
198
198
  },
199
- "& .helix-status-register": { color: "var(--helix-register-color, #7000c0)" }
199
+ "& .helix-status-register": { color: "var(--helix-register-color, #7000c0)" },
200
+ // Which-key panel
201
+ "& .helix-whichkey-panel": {
202
+ display: "flex",
203
+ flexWrap: "wrap",
204
+ alignItems: "center",
205
+ gap: "2px 14px",
206
+ padding: "4px 8px",
207
+ fontSize: "0.82em",
208
+ fontFamily: "monospace",
209
+ background: "var(--helix-status-bg, inherit)",
210
+ color: "var(--helix-status-fg, inherit)",
211
+ borderTop: "1px solid var(--helix-status-border, #999)",
212
+ userSelect: "none"
213
+ },
214
+ "& .helix-whichkey-title": {
215
+ fontWeight: "bold",
216
+ opacity: "0.45",
217
+ marginRight: "6px",
218
+ textTransform: "uppercase",
219
+ letterSpacing: "0.06em",
220
+ fontSize: "0.9em"
221
+ },
222
+ "& .helix-whichkey-item": {
223
+ display: "inline-flex",
224
+ alignItems: "center",
225
+ gap: "5px"
226
+ },
227
+ "& .helix-whichkey-key": {
228
+ fontWeight: "bold",
229
+ color: "var(--helix-normal-color, #0080e0)",
230
+ background: "rgba(128, 128, 128, 0.12)",
231
+ padding: "0 5px",
232
+ borderRadius: "3px",
233
+ border: "1px solid rgba(128, 128, 128, 0.25)",
234
+ minWidth: "1.5em",
235
+ textAlign: "center",
236
+ lineHeight: "1.5"
237
+ },
238
+ "& .helix-whichkey-desc": {
239
+ opacity: "0.7"
240
+ }
200
241
  });
201
242
 
202
243
  // src/keymap.ts
@@ -3813,6 +3854,93 @@ function buildHelixKeymap() {
3813
3854
  ];
3814
3855
  }
3815
3856
 
3857
+ // src/whichkey.ts
3858
+ import { showPanel as showPanel4 } from "@codemirror/view";
3859
+ var MENUS = {
3860
+ goto: [
3861
+ ["g", "file start"],
3862
+ ["e", "file end"],
3863
+ ["h", "line start"],
3864
+ ["l", "line end"],
3865
+ ["s", "first non-ws"],
3866
+ ["t", "screen top"],
3867
+ ["c", "screen middle"],
3868
+ ["b", "screen bottom"],
3869
+ ["j", "move down"],
3870
+ ["k", "move up"],
3871
+ [".", "last change"],
3872
+ ["w", "word jump"],
3873
+ ["|", "column"]
3874
+ ],
3875
+ view: [
3876
+ ["z / c", "center"],
3877
+ ["t", "scroll top"],
3878
+ ["b", "scroll bottom"],
3879
+ ["j / \u2193", "scroll down"],
3880
+ ["k / \u2191", "scroll up"]
3881
+ ],
3882
+ match: [
3883
+ ["m", "matching bracket"],
3884
+ ["s", "surround add"],
3885
+ ["d", "surround delete"],
3886
+ ["r", "surround replace"],
3887
+ ["i", "select inside"],
3888
+ ["a", "select around"]
3889
+ ],
3890
+ bracket_next: [
3891
+ ["p", "next paragraph"],
3892
+ ["Space", "newline below"]
3893
+ ],
3894
+ bracket_prev: [
3895
+ ["p", "prev paragraph"],
3896
+ ["Space", "newline above"]
3897
+ ]
3898
+ };
3899
+ var TITLE = {
3900
+ goto: "goto",
3901
+ view: "view",
3902
+ match: "match",
3903
+ bracket_next: "]",
3904
+ bracket_prev: "["
3905
+ };
3906
+ function render(dom, view) {
3907
+ const hs = getHelixState(view.state);
3908
+ const entries = hs.pendingOp ? MENUS[hs.pendingOp.type] ?? null : null;
3909
+ if (!entries) {
3910
+ dom.style.display = "none";
3911
+ return;
3912
+ }
3913
+ dom.style.display = "";
3914
+ dom.innerHTML = "";
3915
+ const title = dom.appendChild(document.createElement("span"));
3916
+ title.className = "helix-whichkey-title";
3917
+ title.textContent = TITLE[hs.pendingOp.type] ?? "";
3918
+ for (const [key, desc] of entries) {
3919
+ const item = dom.appendChild(document.createElement("span"));
3920
+ item.className = "helix-whichkey-item";
3921
+ const keyEl = item.appendChild(document.createElement("span"));
3922
+ keyEl.className = "helix-whichkey-key";
3923
+ keyEl.textContent = key;
3924
+ const descEl = item.appendChild(document.createElement("span"));
3925
+ descEl.className = "helix-whichkey-desc";
3926
+ descEl.textContent = desc;
3927
+ }
3928
+ }
3929
+ var whichKeyExtension = showPanel4.of((view) => {
3930
+ const dom = document.createElement("div");
3931
+ dom.className = "helix-whichkey-panel";
3932
+ render(dom, view);
3933
+ return {
3934
+ dom,
3935
+ top: false,
3936
+ update(u) {
3937
+ const prev = getHelixState(u.startState).pendingOp;
3938
+ const next = getHelixState(u.state).pendingOp;
3939
+ if (prev !== next) render(dom, u.view);
3940
+ }
3941
+ };
3942
+ });
3943
+
3816
3944
  // src/index.ts
3817
3945
  function helixKeymap(options = {}) {
3818
3946
  const { defaultMode = "normal", statusBar = true } = options;
@@ -3837,6 +3965,7 @@ function helixKeymap(options = {}) {
3837
3965
  // Panels
3838
3966
  searchPanelExtension,
3839
3967
  multiSelectPanelExtension,
3968
+ whichKeyExtension,
3840
3969
  // Keybindings + input blocking
3841
3970
  ...buildHelixKeymap()
3842
3971
  ];