From a268da65b297ed5160785659a93366cb69e18c92 Mon Sep 17 00:00:00 2001 From: Andrew Michael McNutt Date: Thu, 6 Jul 2023 18:19:59 -0500 Subject: [PATCH] who knows --- sites/docs/.gitignore | 4 +- sites/docs/package.json | 12 +-- sites/docs/public/QuietModeCodeMirror.tsx | 126 ---------------------- sites/docs/public/QuietModeCompare.tsx | 48 --------- sites/docs/public/QuietModeUs.tsx | 40 ------- 5 files changed, 9 insertions(+), 221 deletions(-) delete mode 100644 sites/docs/public/QuietModeCodeMirror.tsx delete mode 100644 sites/docs/public/QuietModeCompare.tsx delete mode 100644 sites/docs/public/QuietModeUs.tsx diff --git a/sites/docs/.gitignore b/sites/docs/.gitignore index 624d6ff..96e47e2 100644 --- a/sites/docs/.gitignore +++ b/sites/docs/.gitignore @@ -24,4 +24,6 @@ dist-ssr *.sw? public/data/* -public/data/ \ No newline at end of file +public/data/ + +public/QuietM* \ No newline at end of file diff --git a/sites/docs/package.json b/sites/docs/package.json index 18a7227..8a3007b 100644 --- a/sites/docs/package.json +++ b/sites/docs/package.json @@ -5,13 +5,13 @@ "scripts": { "dev": "vite", "old-build": "tsc && vite build", - "build": "tsc && vite build && npm run prep-data-prod && npm run cp-quiets && npm run cp-docs", + "build": "vite build && npm run prep-data-prod && npm run cp-quiets && npm run cp-docs", "lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0", "preview": "vite preview", - "cp-quiets": "cp src/examples/Quiet* ./public/", - "cp-docs": "cp README.md ./public/", - "prep-data-prod": "mkdir -p dist/data && rm -rf dist/data && mkdir dist/data && cp node_modules/vega-datasets/data/* ./dist/data/", - "prep-data": "rm -rf public/data && mkdir public/data && cp node_modules/vega-datasets/data/* ./public/data/" + "cp-quiets": "cp ./src/examples/Quiet* ./public/", + "cp-docs": "cp ../../README.md ./public/", + "prep-data-prod": "mkdir -p dist/data && rm -rf dist/data && mkdir dist/data && cp ../../node_modules/vega-datasets/data/* ./dist/data/", + "prep-data": "rm -rf public/data && mkdir public/data && cp ../../node_modules/vega-datasets/data/* ./public/data/" }, "dependencies": { "@codemirror/lang-javascript": "^6.1.4", @@ -57,4 +57,4 @@ "typescript": "^5.0.2", "vite": "^4.4.0" } -} +} \ No newline at end of file diff --git a/sites/docs/public/QuietModeCodeMirror.tsx b/sites/docs/public/QuietModeCodeMirror.tsx deleted file mode 100644 index 0a88efb..0000000 --- a/sites/docs/public/QuietModeCodeMirror.tsx +++ /dev/null @@ -1,126 +0,0 @@ -import { useEffect, useRef, useState } from "react"; -import { syntaxTree } from "@codemirror/language"; -import { WidgetType } from "@codemirror/view"; -import { json } from "@codemirror/lang-json"; -import { basicSetup } from "codemirror"; -import { - EditorView, - ViewUpdate, - ViewPlugin, - DecorationSet, - Decoration, -} from "@codemirror/view"; -import { EditorState, Range } from "@codemirror/state"; - -const coloring: Record = { - String: "#0551A5", - Number: "#17885C", - Boolean: "#0551A5", - PropertyName: "#A21615", - Null: "#0551A5", -}; - -const trim = (x: string) => - x.at(0) === '"' && x.at(-1) === '"' ? x.slice(1, x.length - 1) : x; - -function QuietModeCodeMirror(props: { - onChange: (code: string) => void; - code: string; -}) { - const { code, onChange } = props; - const cmParent = useRef(null); - - const [view, setView] = useState(null); - useEffect(() => { - const localExtension = EditorView.updateListener.of((v: ViewUpdate) => { - if (v.docChanged) { - onChange(v.state.doc.toString()); - } - }); - - const editorState = EditorState.create({ - extensions: [basicSetup, quietMode, json(), localExtension], - doc: code, - })!; - const view = new EditorView({ - state: editorState, - parent: cmParent.current!, - }); - setView(view); - return () => view.destroy(); - // eslint-disable-next-line - }, []); - - useEffect(() => { - if (view && view.state.doc.toString() !== code) { - view.dispatch( - view.state.update({ - changes: { from: 0, to: view.state.doc.length, insert: code }, - }) - ); - } - }, [code, view]); - return ( -
-
-
- ); -} - -class QuietWidget extends WidgetType { - constructor(readonly content: string, readonly nodeType: string) { - super(); - } - - eq(other: QuietWidget): boolean { - return this.content === other.content; - } - - toDOM(): HTMLDivElement { - const wrap = document.createElement("div"); - wrap.setAttribute( - "style", - `display: inline-block; color:${coloring[this.nodeType]}` - ); - wrap.innerText = trim(this.content); - return wrap; - } -} -const quietMode = ViewPlugin.fromClass( - class { - decorations: DecorationSet; - constructor(view: EditorView) { - this.decorations = this.makeQuietRepresentation(view); - } - - makeQuietRepresentation(view: EditorView) { - const widgets: Range[] = []; - const code = view.state.doc.sliceString(0); - syntaxTree(view.state).iterate({ - from: 0, - to: code.length, - enter: ({ node, from, to, type }) => { - if (coloring[node.type.name]) { - const widget = new QuietWidget(code.slice(from, to), type.name); - widgets.push(Decoration.replace({ widget }).range(from, to)); - } - }, - }); - try { - return Decoration.set(widgets.sort((a, b) => a.from - b.from)); - } catch (e) { - console.log("problem creating widgets", e); - return Decoration.set([]); - } - } - - update(update: ViewUpdate) { - if (update.docChanged || update.viewportChanged) { - this.decorations = this.makeQuietRepresentation(update.view); - } - } - }, - { decorations: (v) => v.decorations } -); - -export default QuietModeCodeMirror; diff --git a/sites/docs/public/QuietModeCompare.tsx b/sites/docs/public/QuietModeCompare.tsx deleted file mode 100644 index b56eef3..0000000 --- a/sites/docs/public/QuietModeCompare.tsx +++ /dev/null @@ -1,48 +0,0 @@ -import { useState, useEffect } from "react"; -import QuietModeUs from "./QuietModeUs"; -import QuietModeCodeMirror from "./QuietModeCodeMirror"; -import { produceExample } from "./example-data"; -import "../stylesheets/quiet-styles.css"; - -function QuietModeCompare() { - const [code, setCode] = useState(produceExample); - const [examples, setExamples] = useState({ codeMirror: "", us: "" }); - useEffect(() => { - Promise.all( - ["QuietModeCodeMirror.tsx", "QuietModeUs.tsx"].map((el) => - fetch(el).then((x) => x.text()) - ) - ).then(([codeMirror, us]) => setExamples({ codeMirror, us })); - }, []); - return ( -
-
-

Prong

-

Lines of code {examples.us.split("\n").length}

- -

Raw

- - {examples.us.split("\n").map((x, idx) => ( -
{x}
- ))} - -
-
-

Vanilla Code Mirror

-

Lines of code {examples.codeMirror.split("\n").length}

- -

Raw

- - {examples.codeMirror.split("\n").map((x, idx) => ( -
{x}
- ))} - -
-
- ); -} - -export default QuietModeCompare; diff --git a/sites/docs/public/QuietModeUs.tsx b/sites/docs/public/QuietModeUs.tsx deleted file mode 100644 index 281f775..0000000 --- a/sites/docs/public/QuietModeUs.tsx +++ /dev/null @@ -1,40 +0,0 @@ -import Editor from "../components/Editor"; -import { produceSchema } from "./example-data"; - -const coloring: Record = { - String: "#0551A5", - Number: "#17885C", - Boolean: "#0551A5", - PropertyName: "#A21615", - Null: "#0551A5", -}; -const nodeTypes = ["PropertyName", "Number", "String", "Null", "False", "True"]; - -const trim = (x: string) => - x.at(0) === '"' && x.at(-1) === '"' ? x.slice(1, x.length - 1) : x; - -const QuietModeUs = (props: { - onChange: (code: string) => void; - code: string; -}) => ( - ( -
- {trim(props.currentValue).length ? trim(props.currentValue) : '""'} -
- ), - hasInternalState: false, - }, - ]} - /> -); - -export default QuietModeUs;