Added contribution scopes page to compare scopes between languages

Author: AndreasArvidsson

packages/common/src/index.ts

@@ -104,6 +104,7 @@ export * from "./util/itertools";
 export * from "./util/Notifier";
 export * from "./util/object";
 export * from "./util/omitByDeep";
+export * from "./util/prettifyLanguageName";
 export * from "./util/range";
 export * from "./util/regex";
 export * from "./util/selectionsEqual";

packages/common/src/util/prettifyLanguageName.ts

@@ -0,0 +1,33 @@
+import { capitalize } from "./stringUtils";
+
+export function prettifyLanguageName(name: string): string {
+  switch (name) {
+    case "cpp":
+      return "C++";
+    case "csharp":
+      return "C#";
+    case "javascript":
+      return "JavaScript";
+    case "typescript":
+      return "TypeScript";
+    case "javascriptreact":
+      return "JavaScript React";
+    case "typescriptreact":
+      return "TypeScript React";
+    case "jsonl":
+      return "JSON lines (JSONL)";
+    case "jsonc":
+      return "JSON with comments (JSONC)";
+    case "scm":
+      return "Tree sitter query language (scm)";
+    case "css":
+    case "scss":
+    case "json":
+    case "php":
+    case "html":
+    case "xml":
+      return name.toUpperCase();
+    default:
+      return capitalize(name);
+  }
+}

packages/common/src/util/serializeScopeType.ts

@@ -1,8 +1,10 @@
+import { capitalize } from "lodash-es";
 import type {
   ScopeType,
   ScopeTypeType,
   SimpleScopeTypeType,
 } from "../types/command/PartialTargetDescriptor.types";
+import { camelCaseToAllDown } from "./stringUtils";
 
 export function serializeScopeType(
   scopeType: SimpleScopeTypeType | ScopeType,
@@ -12,3 +14,9 @@ export function serializeScopeType(
   }
   return scopeType.type;
 }
+
+export function prettifyScopeType(
+  scopeType: SimpleScopeTypeType | ScopeType,
+): string {
+  return capitalize(camelCaseToAllDown(serializeScopeType(scopeType)));
+}

packages/common/src/util/stringUtils.ts

@@ -10,7 +10,7 @@
  */
 export function camelCaseToAllDown(input: string): string {
   return input
-    .replace(/([A-Z])/g, " $1")
+    .replace(/(?<=[a-z0-9])([A-Z])/g, " $1")
     .split(" ")
     .map((word) => word.toLowerCase())
     .join(" ");

packages/cursorless-org-docs/src/docs/user/languages/components/Code.css renamed to packages/cursorless-org-docs/src/docs/components/Code.css

@@ -28,9 +28,14 @@
   counter-reset: line;
 }
 
+.code-container .shiki {
+  /* line-height: 1rem; */
+}
+
 .code-container .line {
   position: relative;
   margin-left: 1.5rem;
+  /* display: inline-block; */
 }
 
 .code-container .line::before {

packages/cursorless-org-docs/src/docs/user/languages/components/Code.tsx renamed to packages/cursorless-org-docs/src/docs/components/Code.tsx

@@ -3,6 +3,7 @@ import React from "react";
 
 interface Props {
   className?: string;
+  value?: string;
   title?: string;
   children: string;
 }
@@ -19,12 +20,16 @@ export function H4(props: Props) {
   return renderHeader(4, props);
 }
 
+export function H5(props: Props) {
+  return renderHeader(5, props);
+}
+
 function renderHeader(
   level: number,
-  { className, title, children }: Props,
+  { className, value, title, children }: Props,
 ): React.JSX.Element {
   const Tag = `h${level}` as keyof React.JSX.IntrinsicElements;
-  const href = uriEncodeHashId(children);
+  const href = uriEncodeHashId(value ?? children);
   return (
     <Tag
       id={href}