@lapis-notes/api 0.1.0

package/dist/components/editor/language-service/index.js

@@ -0,0 +1,342 @@
+import { Facet } from "@codemirror/state";
+import { hoverTooltip, ViewPlugin, } from "@codemirror/view";
+import { editorViewField, fromPosition, toPosition, } from "../../../editor.svelte";
+import { lapisCodeMirrorAutocomplete } from "../extensions/autocomplete";
+import { lapisCodeMirrorLint, lintGutter, mapToLapisLintDiagnostic, markdownlintRuleUrl, setDiagnostics, } from "../extensions/lint";
+import { createLanguageServiceHoverDom } from "./dom";
+export const languageServiceDocumentContext = Facet.define({
+    combine(values) {
+        return values.at(-1) ?? null;
+    },
+});
+const trackedOpenDocuments = new WeakMap();
+export function languageServiceExtensions(options = {}) {
+    const extensions = [];
+    const wantsDiagnostics = options.diagnostics ?? true;
+    const wantsGutter = options.lintGutter ?? true;
+    if (wantsDiagnostics) {
+        extensions.push(openDocumentTrackingExtension(options), ...lapisCodeMirrorLint({
+            source: async (view) => collectLanguageServiceDiagnostics(view, options),
+            gutter: wantsGutter ? undefined : false,
+        }));
+    }
+    else if (wantsGutter) {
+        extensions.push(lintGutter());
+    }
+    if (options.completion ?? true) {
+        extensions.push(...languageServiceCompletions(options));
+    }
+    if (options.hover ?? true) {
+        extensions.push(languageServiceHover(options));
+    }
+    return extensions;
+}
+function openDocumentTrackingExtension(options) {
+    return ViewPlugin.define((view) => {
+        const sync = (nextView) => {
+            const resolved = resolveDocumentContext(nextView, options.languageId);
+            if (!resolved)
+                return;
+            retainOpenDocument(nextView, resolved.document.uri, resolved.info.app.languageServices);
+        };
+        sync(view);
+        return {
+            update(update) {
+                sync(update.view);
+            },
+            destroy() {
+                trackedOpenDocuments.get(view)?.release();
+                trackedOpenDocuments.delete(view);
+            },
+        };
+    });
+}
+async function collectLanguageServiceDiagnostics(view, options) {
+    const globalFlags = globalThis;
+    if (globalFlags.__LAPIS_SUPPRESS_LANGUAGE_SERVICE_LINT__) {
+        const payload = globalFlags.__LAPIS_SYNTHETIC_LINT__;
+        if (!payload) {
+            return [];
+        }
+        const line = view.state.doc.line(payload.lineIndex + 1);
+        return payload.ranges.map((range) => {
+            const startCol = Math.max(0, Math.min(range.startCol, line.length));
+            const endCol = Math.max(startCol, Math.min(range.endCol, line.length));
+            return mapToLapisLintDiagnostic({
+                from: line.from + startCol,
+                to: line.from + endCol,
+                severity: "warning",
+                message: "e2e synthetic lint",
+            });
+        });
+    }
+    const context = resolveDocumentContext(view, options.languageId);
+    if (!context) {
+        return [];
+    }
+    retainOpenDocument(view, context.document.uri, context.info.app.languageServices);
+    const diagnostics = await context.info.app.languageServices.diagnostics(context.document);
+    const mapped = await Promise.all(diagnostics.map(async (diagnostic) => {
+        const mappedRange = context.fromVirtualRange?.(diagnostic.range) ?? diagnostic.range;
+        if (!mappedRange) {
+            return null;
+        }
+        const displayRange = normalizeDiagnosticDisplayRange(view.state.doc, diagnostic, mappedRange);
+        const from = positionToOffset(view.state.doc, displayRange.start);
+        const to = positionToOffset(view.state.doc, displayRange.end);
+        const codeActions = context.info.app.languageServices.cachedCodeActionsFor(context.document.uri, diagnostic);
+        return mapToLapisLintDiagnostic({
+            from,
+            to,
+            severity: languageServiceSeverityToLint(diagnostic.severity),
+            message: diagnostic.message,
+            source: diagnostic.source,
+        }, {
+            code: diagnostic.code,
+            ruleId: diagnostic.code != null ? String(diagnostic.code) : undefined,
+            ruleUrl: diagnostic.source === "markdownlint" && diagnostic.code != null
+                ? markdownlintRuleUrl(diagnostic.code)
+                : undefined,
+            sourceLabel: diagnostic.source,
+        }, {
+            actions: codeActionsToLintActions(codeActions, view),
+        });
+    }));
+    return mapped.filter((diagnostic) => Boolean(diagnostic));
+}
+function retainOpenDocument(view, uri, manager) {
+    const current = trackedOpenDocuments.get(view);
+    if (current?.uri === uri)
+        return;
+    current?.release();
+    trackedOpenDocuments.set(view, {
+        uri,
+        release: manager.retainDocument(uri),
+    });
+}
+export async function refreshLanguageServiceDiagnostics(view, options = {}) {
+    const diagnostics = await collectLanguageServiceDiagnostics(view, options);
+    view.dispatch(setDiagnostics(view.state, diagnostics));
+}
+function normalizeDiagnosticDisplayRange(doc, diagnostic, range) {
+    if (diagnostic.source !== "markdownlint" ||
+        range.start.line !== range.end.line ||
+        range.start.character !== 0 ||
+        range.end.character - range.start.character > 1) {
+        return range;
+    }
+    const line = doc.line(range.start.line + 1);
+    return {
+        start: range.start,
+        end: {
+            line: range.end.line,
+            character: Math.max(range.end.character, line.length),
+        },
+    };
+}
+function languageServiceSeverityToLint(severity) {
+    if (severity === "error") {
+        return "error";
+    }
+    if (severity === "warning") {
+        return "warning";
+    }
+    if (severity === "information") {
+        return "info";
+    }
+    return "hint";
+}
+function codeActionsToLintActions(codeActions, view) {
+    return codeActions
+        .map((action) => {
+        if (!action.title) {
+            return null;
+        }
+        return {
+            name: action.title,
+            apply(editorView, from, to) {
+                void applyLanguageServiceCodeAction(editorView ?? view, action, from, to);
+            },
+        };
+    })
+        .filter((action) => Boolean(action));
+}
+async function applyLanguageServiceCodeAction(view, action, from, to) {
+    const edit = action.edit;
+    if (edit && typeof edit === "object") {
+        const record = edit;
+        const changes = record.changes;
+        if (Array.isArray(changes)) {
+            const mappedChanges = changes
+                .map((change) => {
+                if (typeof change !== "object" || change === null) {
+                    return null;
+                }
+                const entry = change;
+                const insert = typeof entry.insert === "string"
+                    ? entry.insert
+                    : typeof entry.text === "string"
+                        ? entry.text
+                        : undefined;
+                const changeFrom = typeof entry.from === "number" ? entry.from : from;
+                const changeTo = typeof entry.to === "number" ? entry.to : to;
+                if (insert === undefined) {
+                    return null;
+                }
+                return { from: changeFrom, to: changeTo, insert };
+            })
+                .filter((change) => Boolean(change));
+            if (mappedChanges.length) {
+                view.dispatch({ changes: mappedChanges });
+            }
+        }
+    }
+    if (!action.command) {
+        return;
+    }
+    const resolved = resolveDocumentContext(view);
+    if (!resolved) {
+        return;
+    }
+    await resolved.info.app.languageServices.applyCommand({
+        ...resolved.document,
+        text: view.state.doc.toString(),
+    }, action.command);
+}
+export function languageServiceCompletions(options = {}) {
+    return lapisCodeMirrorAutocomplete({
+        override: [
+            async (completionContext) => {
+                if (!completionContext.view) {
+                    return null;
+                }
+                const resolved = resolveDocumentContext(completionContext.view, options.languageId);
+                if (!resolved) {
+                    return null;
+                }
+                const localPosition = offsetToPosition(completionContext.state.doc, completionContext.pos);
+                const virtualPosition = resolved.toVirtualPosition?.(localPosition) ?? localPosition;
+                if (!virtualPosition) {
+                    return null;
+                }
+                const completions = await resolved.info.app.languageServices.completions(resolved.document, virtualPosition);
+                if (!completions?.items.length) {
+                    return null;
+                }
+                return {
+                    from: completions.from === undefined
+                        ? completionContext.pos
+                        : positionToOffset(completionContext.state.doc, resolved.fromVirtualRange?.({
+                            start: completions.from,
+                            end: completions.to ?? virtualPosition,
+                        })?.start ?? localPosition),
+                    to: completions.to === undefined
+                        ? completionContext.pos
+                        : positionToOffset(completionContext.state.doc, resolved.fromVirtualRange?.({
+                            start: completions.from ?? virtualPosition,
+                            end: completions.to,
+                        })?.end ?? localPosition),
+                    options: completions.items.map(toCodeMirrorCompletion),
+                };
+            },
+        ],
+    });
+}
+export function languageServiceHover(options = {}) {
+    return hoverTooltip(async (view, pos) => {
+        const resolved = resolveDocumentContext(view, options.languageId);
+        if (!resolved) {
+            return null;
+        }
+        const localPosition = offsetToPosition(view.state.doc, pos);
+        const virtualPosition = resolved.toVirtualPosition?.(localPosition) ?? localPosition;
+        if (!virtualPosition) {
+            return null;
+        }
+        const hover = await resolved.info.app.languageServices.hover(resolved.document, virtualPosition);
+        if (!hover?.contents) {
+            return null;
+        }
+        const range = hover.range ? resolved.fromVirtualRange?.(hover.range) : null;
+        const dom = createLanguageServiceHoverDom(view.dom.ownerDocument, hover.contents);
+        return {
+            pos: range ? positionToOffset(view.state.doc, range.start) : pos,
+            end: range ? positionToOffset(view.state.doc, range.end) : pos,
+            above: true,
+            create() {
+                return { dom };
+            },
+        };
+    });
+}
+function resolveDocumentContext(view, languageId) {
+    const facetContext = view.state.facet(languageServiceDocumentContext);
+    const info = view.state.field(editorViewField, false) ?? {
+        app,
+        file: null,
+    };
+    if (facetContext) {
+        const document = resolveVirtualDocument(facetContext);
+        if (!document) {
+            return null;
+        }
+        return {
+            info,
+            document,
+            toVirtualPosition: facetContext.toVirtualPosition,
+            fromVirtualRange: facetContext.fromVirtualRange,
+        };
+    }
+    const file = info.file;
+    if (!file) {
+        return null;
+    }
+    return {
+        info,
+        document: {
+            uri: `vault:///${file.path}`,
+            languageId: languageId ?? languageIdFromExtension(file.extension),
+            version: view.state.doc.length,
+            text: view.state.doc.toString(),
+        },
+    };
+}
+function resolveVirtualDocument(context) {
+    return typeof context.document === "function"
+        ? context.document()
+        : context.document;
+}
+function languageIdFromExtension(extension) {
+    if (extension === "md" || extension === "markdown") {
+        return "markdown";
+    }
+    if (extension === "ts") {
+        return "typescript";
+    }
+    if (extension === "js") {
+        return "javascript";
+    }
+    return extension;
+}
+function positionToOffset(doc, position) {
+    return fromPosition(doc, {
+        line: position.line,
+        ch: position.character,
+    });
+}
+function offsetToPosition(doc, offset) {
+    const position = toPosition(doc, offset);
+    return {
+        line: position.line,
+        character: position.ch,
+    };
+}
+function toCodeMirrorCompletion(item) {
+    return {
+        label: item.label,
+        detail: item.detail,
+        info: item.documentation,
+        type: item.kind,
+        apply: item.apply,
+    };
+}

package/dist/components/empty-view/empty-view.css

@@ -0,0 +1,39 @@
+[data-ui-component="empty-view"] {
+  --ui-empty-view-max-width: 480px;
+  --ui-empty-view-max-height: 280px;
+  --ui-empty-view-margin: 1.25rem;
+  --ui-empty-view-title-size: 1.25rem;
+  --ui-empty-view-gap: 0.25rem;
+}
+
+[data-ui-component="empty-view"][data-ui-part="root"] {
+  position: absolute;
+  top: 0;
+  display: flex;
+  height: 100%;
+  width: 100%;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  overflow: auto;
+  background: var(--background);
+}
+
+[data-ui-component="empty-view"][data-ui-part="panel"] {
+  margin: var(--ui-empty-view-margin);
+  max-height: var(--ui-empty-view-max-height);
+  max-width: var(--ui-empty-view-max-width);
+  text-align: center;
+}
+
+[data-ui-component="empty-view"][data-ui-part="title"] {
+  margin-block: var(--ui-empty-view-margin);
+  font-size: var(--ui-empty-view-title-size);
+  font-weight: 600;
+}
+
+[data-ui-component="empty-view"][data-ui-part="actions"] {
+  display: flex;
+  flex-direction: column;
+  gap: var(--ui-empty-view-gap);
+}

package/dist/components/empty-view/empty-view.svelte

@@ -0,0 +1,26 @@
+<script lang="ts">
+  import { useLocale } from "../../localization-manager.svelte";
+  import { Button } from "@lapismd/design-core/shadcn/button";
+  import type { App } from "../../context.svelte";
+  import "./empty-view.css";
+  const { t } = useLocale('base/empty-view');
+ 
+  let {
+    app,
+    onClose,
+  }: {
+    app: App;
+    onClose: (evt: MouseEvent) => void;
+  } = $props();
+</script>
+
+<div data-ui-component="empty-view" data-ui-part="root">
+  <div data-ui-component="empty-view" data-ui-part="panel">
+    <div data-ui-component="empty-view" data-ui-part="title">{t('No file is open')}</div>
+    <div data-ui-component="empty-view" data-ui-part="actions">
+      <Button variant="ghost" onclick={() => app.commands.executeCommand('app:go-to-file')}>{t('Go to file ({{key}})', {key: "⌘ O"})}</Button>
+      <Button variant="ghost" onclick={() => app.commands.executeCommand('app:go-to-file')}>{t('See recent files ({{key}})', {key: "⌘ O"})}</Button>
+      <Button variant="ghost" onclick={(evt) => onClose(evt)}>{t('Close')}</Button>
+    </div>
+  </div>
+</div>

package/dist/components/empty-view/empty-view.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { App } from "../../context.svelte";
+import "./empty-view.css";
+type $$ComponentProps = {
+    app: App;
+    onClose: (evt: MouseEvent) => void;
+};
+declare const EmptyView: import("svelte").Component<$$ComponentProps, {}, "">;
+type EmptyView = ReturnType<typeof EmptyView>;
+export default EmptyView;

package/dist/components/empty-view/index.d.ts

@@ -0,0 +1,2 @@
+import Root from "./empty-view.svelte";
+export { Root, Root as EmptyView };

package/dist/components/empty-view/index.js

@@ -0,0 +1,2 @@
+import Root from "./empty-view.svelte";
+export { Root, Root as EmptyView };

package/dist/components/icon/icon-list.css

@@ -0,0 +1,74 @@
+[data-ui-component="icon-list"] {
+  --ui-icon-list-trigger-width: 200px;
+  --ui-icon-list-content-width: 250px;
+  --ui-icon-list-group-width: 350px;
+  --ui-icon-list-icon-size: 1rem;
+  --ui-icon-list-icon-gap: 0.5rem;
+}
+
+[data-ui-component="icon-list"][data-ui-part="trigger"],
+[data-ui-component="icon-list"] .icon-list-trigger,
+.icon-list-trigger {
+  width: var(--ui-icon-list-trigger-width);
+  justify-content: space-between;
+}
+
+[data-ui-component="icon-list"][data-ui-part="trigger-icon"],
+[data-ui-component="icon-list"] .icon-list-trigger-chevron {
+  width: var(--ui-icon-list-icon-size);
+  height: var(--ui-icon-list-icon-size);
+  margin-inline-start: var(--ui-icon-list-icon-gap);
+  flex-shrink: 0;
+  opacity: 0.5;
+}
+
+[data-ui-component="icon-list"][data-ui-part="content"],
+.icon-list-content {
+  padding: 0;
+  width: var(--ui-icon-list-content-width);
+}
+
+[data-ui-component="icon-list"][data-ui-part="virtual-root"] {
+  position: relative;
+  padding-inline-end: 0.25rem;
+}
+
+[data-ui-component="icon-list"][data-ui-part="group"],
+.icon-list-group {
+  color: var(--foreground);
+  padding: 0.25rem;
+  width: var(--ui-icon-list-group-width);
+  white-space: nowrap;
+}
+
+[data-ui-component="icon-list"][data-ui-part="heading"],
+.icon-list-heading {
+  color: var(--muted-foreground);
+  padding: 0.375rem 0.5rem;
+  font-size: 0.75rem;
+  font-weight: 500;
+}
+
+[data-ui-component="icon-list"][data-ui-part="item"],
+.icon-list-item {
+  padding-inline-end: 0.25rem;
+}
+
+[data-ui-component="icon-list"][data-ui-part="check"],
+[data-ui-component="icon-list"] .icon-list-check {
+  width: var(--ui-icon-list-icon-size);
+  height: var(--ui-icon-list-icon-size);
+  margin-inline-end: var(--ui-icon-list-icon-gap);
+}
+
+[data-ui-component="icon-list"][data-ui-part="check"][data-ui-unchecked],
+[data-ui-component="icon-list"] .icon-list-check.is-unchecked {
+  color: transparent;
+}
+
+[data-ui-component="icon-list"][data-ui-part="item-icon"],
+[data-ui-component="icon-list"] .icon-list-item-icon {
+  width: var(--ui-icon-list-icon-size);
+  height: var(--ui-icon-list-icon-size);
+  margin-inline-end: var(--ui-icon-list-icon-gap);
+}