@lapis-notes/history 0.1.4 → 0.2.0

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # History changelog
 
+## 0.2.0
+
+### Minor Changes
+
+- [#28](https://github.com/lapismd/lapis-plugins/pull/28) [`d27467e`](https://github.com/lapismd/lapis-plugins/commit/d27467ee80c273011b7eb6ae792fa8e0330a11c1) Thanks [@stevejuma](https://github.com/stevejuma)! - Share the existing repository-history views and controllers through injected host services. Preserve the legacy file-history plugin and provide public repository entrypoints for desktop and hosted applications.
+
+### Patch Changes
+
+- [#28](https://github.com/lapismd/lapis-plugins/pull/28) [`9c21eb6`](https://github.com/lapismd/lapis-plugins/commit/9c21eb6038363c2398231e04b318c1d5ff9568f7) Thanks [@stevejuma](https://github.com/stevejuma)! - Expose an App-owned observer for acquired replacement guards so hosted services can coordinate existing protection without reacquiring the same guard.
+
+- [#28](https://github.com/lapismd/lapis-plugins/pull/28) [`b1cdd70`](https://github.com/lapismd/lapis-plugins/commit/b1cdd70ae9444cb8de28c46bbba23b3b0eb54534) Thanks [@stevejuma](https://github.com/stevejuma)! - Separate explicit persisted backup selection from passive native observation
+  while preserving legacy backup-service behavior and retained settings/status UI.
+
+- [#28](https://github.com/lapismd/lapis-plugins/pull/28) [`56b5d6c`](https://github.com/lapismd/lapis-plugins/commit/56b5d6c1a016ef9bca43703b5fecf57f8234d1af) Thanks [@stevejuma](https://github.com/stevejuma)! - Consume published Design Core 0.4.0 with prepared browser CSS and bundled font assets through normal npm ranges.
+
+  Restore Bases picker input/list accessibility relationships and name property actions.
+
+- [#28](https://github.com/lapismd/lapis-plugins/pull/28) [`c9febb1`](https://github.com/lapismd/lapis-plugins/commit/c9febb1c8b431db30ecdcf7507cfff8f727bc4ed) Thanks [@stevejuma](https://github.com/stevejuma)! - Consume the published Notes next packages, Mira 0.1.4, and Design Core 0.7.4. The semver floors require those published versions. Markdown dependents accept ^0.2.0. History keeps its public repository entrypoints, and Bases keeps the file-icon contract on API 0.2.0.
+
 ## 0.1.4
 
 ### Patch Changes

package/README.md

@@ -13,7 +13,7 @@ Register the exported plugin class in the application's `PluginProfile`. Import
 registration so the host owns its lifecycle.
 
 The runtime plugin ID is `history`. A matching signed
-`history-0.1.4.lapis-plugin` archive is attached to the
+`history-0.2.0.lapis-plugin` archive is attached to the
 package-scoped GitHub release for manual or registry installation.
 
 See the [repository README](https://github.com/lapismd/lapis-plugins#readme) for

package/dist/repository/NOTICE.md

@@ -0,0 +1,11 @@
+# Repository History notices
+
+Repository presentation and controllers were extracted from Lapis Desktop
+(52516ae9) under Apache-2.0. Maintained adaptations of JJ Store repository
+presentation and graph geometry retain their original Apache-2.0 attribution,
+including upstream Lapis Community graph attribution. GitHub and Forgejo brand
+paths in components/backup/forge-icons.ts derive from Simple Icons under CC0-1.0.
+
+Exact source revisions, source paths, destinations and licenses are retained in
+https://github.com/lapismd/lapis-plugins/blob/main/docs/repository-history-provenance.json.
+Application/native admission, credential custody and persistence remain host-owned.

package/dist/repository/components/RepositoryAuthorAvatar.svelte

@@ -0,0 +1,77 @@
+<script lang="ts">
+  import { AuthorCard } from "@lapismd/design-core/shadcn/author-card";
+  import { avatarInitials } from "@lapismd/design-core/shadcn/avatar";
+  import type {
+    AvatarIdentity,
+    AvatarSize,
+  } from "@lapismd/design-core/shadcn/avatar";
+  import { reviewGravatar } from "../controllers/author.js";
+  let {
+    name,
+    email = "",
+    avatarUrl,
+    handle,
+    size = "xs",
+  }: {
+    name: string;
+    email?: string;
+    avatarUrl?: string;
+    handle?: string;
+    size?: AvatarSize;
+  } = $props();
+  let gravatar = $state<{ email: string; src: string }>();
+  const normalizedEmail = $derived(email.trim().toLowerCase());
+  const author = $derived<AvatarIdentity>({
+    id: normalizedEmail || handle || name.trim() || "unknown-author",
+    name: name.trim() || email.trim() || "Unknown author",
+    src:
+      avatarUrl ||
+      (gravatar?.email === normalizedEmail ? gravatar.src : undefined),
+  });
+  $effect(() => {
+    const requested = normalizedEmail;
+    let live = true;
+    if (!avatarUrl) {
+      void reviewGravatar(requested)
+        .then((src) => {
+          if (live) gravatar = src ? { email: requested, src } : undefined;
+        })
+        .catch(() => {
+          // Image enrichment is optional; the shared Avatar retains name fallback.
+          if (live) gravatar = undefined;
+        });
+    }
+    return () => {
+      live = false;
+    };
+  });
+</script>
+
+<!-- Keep profile activation separate from graph and command-item activation. -->
+<span
+  class="repository-review-author-avatar"
+  onpointerdown={(event) => event.stopPropagation()}
+  onclick={(event) => event.stopPropagation()}
+  onkeydown={(event) => {
+    if (event.key === "Enter" || event.key === " ") event.stopPropagation();
+  }}
+  role="presentation"
+>
+  <AuthorCard
+    {author}
+    label={`${avatarInitials(author.name)} · About ${author.name}`}
+    {size}
+    handle={email.trim() || handle}
+    interaction="hover"
+  />
+</span>
+
+<style>
+  .repository-review-author-avatar {
+    display: inline-flex;
+    flex: none;
+    align-items: center;
+    pointer-events: auto;
+    --ui-author-card-avatar-size: 1.75rem;
+  }
+</style>

package/dist/repository/components/RepositoryAuthorAvatar.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { AvatarSize } from "@lapismd/design-core/shadcn/avatar";
+type $$ComponentProps = {
+    name: string;
+    email?: string;
+    avatarUrl?: string;
+    handle?: string;
+    size?: AvatarSize;
+};
+declare const RepositoryAuthorAvatar: import("svelte").Component<$$ComponentProps, {}, "">;
+type RepositoryAuthorAvatar = ReturnType<typeof RepositoryAuthorAvatar>;
+export default RepositoryAuthorAvatar;

package/dist/repository/components/RepositoryBackupStatus.svelte

@@ -0,0 +1,236 @@
+<script lang="ts">
+  import { onMount } from "svelte";
+  import RepositoryUpstreamActions from "./RepositoryUpstreamActions.svelte";
+  import type { SyncController } from "../controllers/sync-controller.js";
+  import * as Popover from "@lapismd/design-core/shadcn/popover";
+  import { RelativeTime } from "@lapismd/design-core/shadcn/relative-time";
+  import { Skeleton } from "@lapismd/design-core/shadcn/skeleton";
+  import History from "@lucide/svelte/icons/history";
+  import RefreshCw from "@lucide/svelte/icons/refresh-cw";
+  import Check from "@lucide/svelte/icons/check";
+  import CircleAlert from "@lucide/svelte/icons/circle-alert";
+  import RepositoryIdentifiers from "./RepositoryIdentifiers.svelte";
+  import { encodeJjChangeId } from "../controllers/graph/repository-log-graph.js";
+  import type {
+    BackupController,
+    BackupStatus,
+  } from "../controllers/backup.js";
+  let {
+    controller,
+    openRevision,
+    copyText,
+    upstream,
+  }: {
+    controller: BackupController;
+    openRevision(operation: string, revision: string): Promise<void>;
+    copyText(value: string): Promise<void>;
+    upstream?: SyncController;
+  } = $props();
+  let value: BackupStatus = $state({
+    phase: "saving",
+    checkpoint: null,
+    error: null,
+  });
+  let open = $state(false);
+  const label = $derived(
+    value.phase === "saving"
+      ? "Saving locally"
+      : value.phase === "ready"
+        ? "Saved locally"
+        : value.phase === "closed"
+          ? "History paused"
+          : "History needs attention",
+  );
+  onMount(() => controller.subscribe((status) => (value = status)));
+  async function inspect() {
+    if (!value.checkpoint) return;
+    open = false;
+    await openRevision(value.checkpoint.operation, value.checkpoint.commit);
+  }
+</script>
+
+<div
+  class="backup-status"
+  aria-label="Vault backup"
+  aria-busy={value.phase === "saving"}
+>
+  <Popover.Root bind:open>
+    <Popover.Trigger>
+      {#snippet child({ props })}
+        <button
+          {...props}
+          type="button"
+          class="summary"
+          aria-label={`Vault history: ${label}`}
+        >
+          {#if value.phase === "ready"}<Check aria-hidden="true" />
+          {:else if value.phase === "failed"}<CircleAlert aria-hidden="true" />
+          {:else}<History aria-hidden="true" />{/if}
+          {label}
+        </button>
+      {/snippet}
+    </Popover.Trigger>
+    <Popover.Content
+      side="top"
+      align="end"
+      collisionPadding={8}
+      sideOffset={6}
+      style="width:min(26rem,calc(100vw - 1rem));padding:0"
+    >
+      <section class="backup-card" aria-label="Vault history details">
+        <header>
+          <History aria-hidden="true" /><strong>Local history</strong>
+          <RepositoryUpstreamActions
+            controller={upstream}
+            unavailable={value.phase !== "ready"}
+          />
+        </header>
+        {#if value.checkpoint}
+          <button type="button" class="subject" onclick={inspect}
+            >{value.checkpoint.description}</button
+          >
+          <RepositoryIdentifiers
+            {copyText}
+            placement="inline"
+            commitId={value.checkpoint.commit}
+            changeId={encodeJjChangeId(value.checkpoint.change_id)}
+          />
+          <span
+            >Last saved <RelativeTime
+              timestamp={value.checkpoint.timestamp_millis}
+            /></span
+          >
+          <p>
+            Saved editor and external file changes are captured automatically.
+            Unsaved editor changes appear after saving.
+          </p>
+          <button type="button" class="open-log" onclick={inspect}
+            >Open in JJ Log</button
+          >
+        {:else if value.phase === "saving"}
+          <div
+            class="loading"
+            role="status"
+            aria-label="Preparing local history"
+          >
+            <Skeleton style="height:1rem;width:90%" /><Skeleton
+              style="height:1rem;width:65%"
+            />
+          </div>
+        {:else}<p>
+            {value.phase === "closed"
+              ? "Automatic history is paused in Repository History settings."
+              : "History is unavailable. Retry to resume automatic capture."}
+          </p>{/if}
+      </section>
+    </Popover.Content>
+  </Popover.Root>
+  <button
+    type="button"
+    class="refresh"
+    aria-label="Save vault checkpoint now"
+    title="Save vault checkpoint now"
+    disabled={value.phase === "saving" || value.phase === "closed"}
+    onclick={() => controller.refresh()}
+    ><RefreshCw aria-hidden="true" /></button
+  >
+</div>
+
+<style>
+  .backup-status {
+    display: inline-flex;
+    min-height: 1.25rem;
+    align-items: stretch;
+    border: 0;
+    border-radius: var(--radius);
+    color: inherit;
+    font: inherit;
+    background: color-mix(
+      in oklab,
+      var(--ui-workspace-muted-foreground) 6%,
+      var(--ui-workspace-panel)
+    );
+  }
+  button {
+    appearance: none;
+    border: 0;
+    background: transparent;
+    color: inherit;
+    font: inherit;
+    cursor: pointer;
+  }
+  button:hover {
+    background: var(--accent);
+    color: var(--accent-foreground);
+  }
+  button:focus-visible {
+    outline: 2px solid var(--ring);
+    outline-offset: 1px;
+  }
+  button:disabled {
+    opacity: 0.5;
+    cursor: default;
+  }
+  .summary,
+  .refresh {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.35rem;
+    padding: 0 0.4rem;
+    line-height: 1;
+    white-space: nowrap;
+  }
+  .summary {
+    border-radius: var(--radius) 0 0 var(--radius);
+  }
+  .refresh {
+    border-radius: 0 var(--radius) var(--radius) 0;
+    background: color-mix(
+      in oklab,
+      var(--ui-workspace-muted-foreground) 12%,
+      var(--ui-workspace-panel)
+    );
+  }
+  .backup-status :global(svg),
+  header :global(svg) {
+    width: 0.875rem;
+    height: 0.875rem;
+    flex: none;
+  }
+  .backup-card {
+    display: flex;
+    flex-direction: column;
+    gap: 0.6rem;
+    padding: 0.85rem;
+    color: var(--foreground);
+    font-size: 0.8rem;
+  }
+  header {
+    display: flex;
+    align-items: center;
+    gap: 0.4rem;
+  }
+  .subject {
+    padding: 0;
+    text-align: left;
+    font-weight: 600;
+  }
+  .subject:hover {
+    background: transparent;
+    color: var(--primary);
+  }
+  p {
+    margin: 0;
+    color: var(--muted-foreground);
+    line-height: 1.5;
+  }
+  .open-log {
+    align-self: flex-start;
+    padding: 0.35rem 0.5rem;
+    border-radius: var(--radius);
+  }
+  .loading {
+    display: grid;
+    gap: 0.6rem;
+  }
+</style>

package/dist/repository/components/RepositoryBackupStatus.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { SyncController } from "../controllers/sync-controller.js";
+import type { BackupController } from "../controllers/backup.js";
+type $$ComponentProps = {
+    controller: BackupController;
+    openRevision(operation: string, revision: string): Promise<void>;
+    copyText(value: string): Promise<void>;
+    upstream?: SyncController;
+};
+declare const RepositoryBackupStatus: import("svelte").Component<$$ComponentProps, {}, "">;
+type RepositoryBackupStatus = ReturnType<typeof RepositoryBackupStatus>;
+export default RepositoryBackupStatus;

package/dist/repository/components/RepositoryChangedFiles.svelte

@@ -0,0 +1,104 @@
+<script lang="ts">
+  import RepositorySkeleton from "./RepositorySkeleton.svelte";
+  import {
+    FileListing,
+    FileListingViewModeToggle,
+    type FileListingFile,
+    type FileListingViewMode,
+  } from "@lapismd/design-core/diff";
+  import { Skeleton } from "@lapismd/design-core/shadcn/skeleton";
+  let {
+    files,
+    selectedPath,
+    initialLoading = false,
+    loading = false,
+    hasMore = false,
+    onSelect,
+    onMore,
+  }: {
+    files: FileListingFile[];
+    selectedPath?: string;
+    initialLoading?: boolean;
+    loading?: boolean;
+    hasMore?: boolean;
+    onSelect(path: string): void;
+    onMore(): void;
+  } = $props();
+  let mode = $state<FileListingViewMode>("tree");
+</script>
+
+<section
+  class="repository-changed-files"
+  aria-label="Changed files"
+  aria-busy={loading || initialLoading}
+>
+  <header>
+    <strong>Changed files</strong><span class="file-count"
+      >{#if initialLoading}<Skeleton />{:else}{files.length}{/if}</span
+    ><FileListingViewModeToggle bind:mode />
+  </header>
+  <div class="file-list">
+    {#if initialLoading}<RepositorySkeleton
+        kind="files"
+        label="Loading changed files…"
+      />
+    {:else}<FileListing
+        {files}
+        {mode}
+        {selectedPath}
+        virtualize={false}
+        {hasMore}
+        {loading}
+        onSelectPath={onSelect}
+        onLoadMore={onMore}
+      />{/if}
+  </div>
+</section>
+
+<style>
+  .repository-changed-files {
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+    max-height: 16rem;
+    overflow: hidden;
+    border: 1px solid var(--border);
+    border-radius: 0.5rem;
+    background: var(--background);
+    --ui-diff-row-hover: color-mix(
+      in srgb,
+      var(--foreground) 7%,
+      var(--background)
+    );
+    --ui-diff-selected: color-mix(
+      in srgb,
+      var(--foreground) 12%,
+      var(--background)
+    );
+  }
+  header {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    padding: 0.45rem 0.65rem;
+    border-bottom: 1px solid var(--border);
+  }
+  strong {
+    flex: 1;
+    min-width: 0;
+    font-size: 0.8125rem;
+  }
+  .file-count {
+    display: inline-flex;
+    border-radius: 999px;
+    padding: 0.05rem 0.4rem;
+    background: var(--muted);
+    font-size: 0.75rem;
+  }
+  .file-list {
+    min-width: 0;
+    min-height: 0;
+    overflow: auto;
+    padding: 0.25rem 0.35rem;
+  }
+</style>

package/dist/repository/components/RepositoryChangedFiles.svelte.d.ts

@@ -0,0 +1,13 @@
+import { type FileListingFile } from "@lapismd/design-core/diff";
+type $$ComponentProps = {
+    files: FileListingFile[];
+    selectedPath?: string;
+    initialLoading?: boolean;
+    loading?: boolean;
+    hasMore?: boolean;
+    onSelect(path: string): void;
+    onMore(): void;
+};
+declare const RepositoryChangedFiles: import("svelte").Component<$$ComponentProps, {}, "">;
+type RepositoryChangedFiles = ReturnType<typeof RepositoryChangedFiles>;
+export default RepositoryChangedFiles;

package/dist/repository/components/RepositoryCommitMessage.svelte

@@ -0,0 +1,93 @@
+<script lang="ts">
+  import { MarkdownContent } from "@lapismd/design-core/chat";
+  import { Button } from "@lapismd/design-core/shadcn/button";
+  import ChevronDownIcon from "@lucide/svelte/icons/chevron-down";
+  let { description }: { description: string } = $props();
+  const id = $props.id();
+  let expanded = $state(false),
+    overflowing = $state(false);
+  // The graph row owns the subject; its expanded area retains the full body.
+  const body = $derived(description.split("\n").slice(1).join("\n").trim());
+  $effect(() => {
+    void description;
+    expanded = false;
+  });
+  function measure(node: HTMLDivElement) {
+    const update = () => {
+      const rem = parseFloat(
+        getComputedStyle(node.ownerDocument.documentElement).fontSize,
+      );
+      overflowing = node.getBoundingClientRect().height > 9 * rem + 1;
+    };
+    const observer = new ResizeObserver(update);
+    observer.observe(node);
+    return { destroy: () => observer.disconnect() };
+  }
+</script>
+
+{#if body}
+  <section
+    class="repository-review-commit-message"
+    aria-label="Commit message body"
+  >
+    <div
+      {id}
+      class="repository-review-message-viewport"
+      data-clamped={(overflowing && !expanded) || undefined}
+      onfocusin={() => {
+        // Keyboard focus on Markdown links must reveal their full context.
+        if (overflowing) expanded = true;
+      }}
+    >
+      <div use:measure>
+        <MarkdownContent content={body} compact fullWidth />
+      </div>
+    </div>
+    {#if overflowing}
+      <div class="repository-review-message-action">
+        <Button
+          variant="ghost"
+          size="xs"
+          aria-controls={id}
+          aria-expanded={expanded}
+          aria-label={expanded
+            ? "View less of commit message"
+            : "View more of commit message"}
+          onclick={() => (expanded = !expanded)}
+        >
+          {expanded ? "View less" : "View more"}
+          <ChevronDownIcon
+            data-icon="inline-end"
+            data-expanded={expanded}
+            aria-hidden="true"
+          />
+        </Button>
+      </div>
+    {/if}
+  </section>
+{/if}
+
+<style>
+  .repository-review-commit-message {
+    min-width: 0;
+    margin: 0.25rem 0.75rem 0.75rem;
+    padding: 0.75rem;
+    border-radius: calc(var(--radius) * 0.8);
+    background: color-mix(in srgb, var(--foreground) 5%, var(--background));
+    --ui-chat-markdown-padding: 0;
+    --ui-chat-markdown-font-size: 0.8125rem;
+    --ui-chat-markdown-line-height: 1.5;
+  }
+  .repository-review-message-viewport[data-clamped] {
+    max-height: 9rem;
+    overflow: hidden;
+    mask-image: linear-gradient(to bottom, #000 calc(100% - 3rem), transparent);
+  }
+  .repository-review-message-action {
+    display: flex;
+    margin-block-start: 0.375rem;
+  }
+  .repository-review-message-action :global([data-expanded="true"]) {
+    transform: rotate(180deg);
+  }
+</style>

package/dist/repository/components/RepositoryCommitMessage.svelte.d.ts

@@ -0,0 +1,6 @@
+type $$ComponentProps = {
+    description: string;
+};
+declare const RepositoryCommitMessage: import("svelte").Component<$$ComponentProps, {}, "">;
+type RepositoryCommitMessage = ReturnType<typeof RepositoryCommitMessage>;
+export default RepositoryCommitMessage;