@lapis-notes/history 0.1.4 → 0.2.2

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

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

package/dist/repository/components/RepositoryWorkspacePicker.svelte

@@ -0,0 +1,158 @@
+<script lang="ts">
+  import { Button } from "@lapismd/design-core/shadcn/button";
+  import * as CommandView from "@lapismd/design-core/shadcn/command-view";
+  import * as Popover from "@lapismd/design-core/shadcn/popover";
+  import CircleCheckIcon from "@lucide/svelte/icons/circle-check";
+  import ChevronDownIcon from "@lucide/svelte/icons/chevron-down";
+  import FolderGit2Icon from "@lucide/svelte/icons/folder-git-2";
+  import RepositoryPickerSearch from "./RepositoryPickerSearch.svelte";
+  import { encodeJjChangeId } from "../controllers/graph/repository-log-graph.js";
+  import type { RepositoryWorkspace } from "../controllers/workspaces.js";
+  let {
+    workspaces,
+    selected,
+    disabled = false,
+    onOpen,
+    onSelect,
+  }: {
+    workspaces: readonly RepositoryWorkspace[];
+    selected: string | null;
+    disabled?: boolean;
+    onOpen?(): void;
+    onSelect(workspace: string | null): void;
+  } = $props();
+  let open = $state(false),
+    query = $state(""),
+    highlighted = $state("");
+  let input = $state<HTMLInputElement | null>(null);
+  const options = $derived([
+    {
+      value: "overview",
+      name: "Repository overview",
+      description: "Browse without workspace context",
+      workspace: null,
+    },
+    ...workspaces.map(({ name, commit }) => ({
+      value: `workspace:${name}`,
+      name,
+      description: `${encodeJjChangeId(commit.change_id).slice(0, 12)} · ${commit.description.split("\n")[0] || "No description"}`,
+      workspace: name,
+    })),
+  ]);
+  const visible = $derived(
+    options.filter((option) =>
+      `${option.name} ${option.description}`
+        .toLocaleLowerCase()
+        .includes(query.trim().toLocaleLowerCase()),
+    ),
+  );
+</script>
+
+<Popover.Root
+  {open}
+  onOpenChange={(next) => {
+    open = next;
+    if (next) {
+      onOpen?.();
+      query = "";
+      highlighted = selected ? `workspace:${selected}` : "overview";
+    }
+  }}
+>
+  <Popover.Trigger
+    >{#snippet child({ props })}
+      <Button
+        {...props}
+        variant="outline"
+        size="sm"
+        class="repository-review-workspace-trigger"
+        role="combobox"
+        aria-label="Repository workspace"
+        title="Select workspace"
+        {disabled}
+      >
+        <FolderGit2Icon aria-hidden="true" /><span
+          >{selected ?? "Repository overview"}</span
+        >
+        <ChevronDownIcon aria-hidden="true" />
+      </Button>
+    {/snippet}</Popover.Trigger
+  >
+  <Popover.Content
+    align="end"
+    role="dialog"
+    aria-label="Select workspace"
+    style="--ui-popover-width:min(28rem,calc(100vw - 2rem));--ui-popover-padding:0;--ui-popover-gap:0"
+    onOpenAutoFocus={(event) => {
+      event.preventDefault();
+      input?.focus();
+    }}
+  >
+    <CommandView.Root
+      bind:value={highlighted}
+      label="Select workspace"
+      shouldFilter={false}
+      loop
+    >
+      <RepositoryPickerSearch
+        grid={false}
+        bind:inputRef={input}
+        bind:query
+        label="Search workspaces"
+        placeholder="Search loaded workspaces"
+        closeLabel="Close workspace selector"
+      />
+      <CommandView.List aria-label="Repository workspaces">
+        {#if !visible.length}<CommandView.Empty
+            >No matching workspaces.</CommandView.Empty
+          >
+        {:else}<CommandView.Group>
+            {#each visible as option (option.value)}
+              <CommandView.Item
+                value={option.value}
+                aria-label={option.name}
+                data-current={option.workspace === selected || undefined}
+                onSelect={() => {
+                  open = false;
+                  onSelect(option.workspace);
+                }}
+              >
+                <CommandView.ItemIcon
+                  >{#if option.workspace === selected}<CircleCheckIcon
+                      fill="var(--foreground)"
+                      stroke="var(--background)"
+                      aria-hidden="true"
+                    />
+                  {:else}<FolderGit2Icon
+                      aria-hidden="true"
+                    />{/if}</CommandView.ItemIcon
+                >
+                <CommandView.ItemLabel>{option.name}</CommandView.ItemLabel>
+                <CommandView.ItemDescription
+                  >{option.description}</CommandView.ItemDescription
+                >
+              </CommandView.Item>
+            {/each}
+          </CommandView.Group>{/if}
+      </CommandView.List>
+    </CommandView.Root>
+  </Popover.Content>
+</Popover.Root>
+
+<style>
+  :global(.repository-review-workspace-trigger[data-ui-component="button"]) {
+    min-width: 0;
+    max-width: 10.5rem;
+    flex: 0 1 auto;
+    height: 1.75rem;
+    padding-inline: 0.45rem;
+    font-size: 0.75rem;
+    --ui-button-radius: var(--radius);
+  }
+  :global(.repository-review-workspace-trigger > span) {
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+</style>

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

@@ -0,0 +1,11 @@
+import type { RepositoryWorkspace } from "../controllers/workspaces.js";
+type $$ComponentProps = {
+    workspaces: readonly RepositoryWorkspace[];
+    selected: string | null;
+    disabled?: boolean;
+    onOpen?(): void;
+    onSelect(workspace: string | null): void;
+};
+declare const RepositoryWorkspacePicker: import("svelte").Component<$$ComponentProps, {}, "">;
+type RepositoryWorkspacePicker = ReturnType<typeof RepositoryWorkspacePicker>;
+export default RepositoryWorkspacePicker;

package/dist/repository/components/backup/AdoptionSettings.svelte

@@ -0,0 +1,95 @@
+<script lang="ts">
+  import { onMount } from "svelte";
+  import BackupCard from "./BackupCard.svelte";
+  import { Button } from "@lapismd/design-core/shadcn/button";
+  import { Skeleton } from "@lapismd/design-core/shadcn/skeleton";
+  import GitMerge from "@lucide/svelte/icons/git-merge";
+  import RefreshCw from "@lucide/svelte/icons/refresh-cw";
+  import type { AdoptionController } from "../../controllers/adoption-controller.js";
+  import type { AdoptionState } from "../../controllers/adoption.js";
+  let { controller }: { controller: AdoptionController } = $props();
+  let snapshot = $state<AdoptionState>({ busy: true, phase: "loading" });
+  onMount(() => {
+    const stop = controller.subscribe((value) => (snapshot = value));
+    void controller.refresh();
+    return stop;
+  });
+</script>
+
+<section aria-label="Original repository history" aria-busy={snapshot.busy}>
+  <BackupCard
+    title="Original repository history"
+    Icon={GitMerge}
+    description="Keep the vault’s existing JJ repository independent, or import its recorded Git ancestry into automatic history."
+  >
+    {#snippet actions()}<Button
+        variant="ghost"
+        size="icon-sm"
+        disabled={snapshot.busy}
+        aria-label="Refresh original history"
+        onclick={() => controller.refresh()}><RefreshCw /></Button
+      >{/snippet}
+    {#if !snapshot.data && snapshot.busy}<div
+        class="loading"
+        role="status"
+        aria-label="Loading original history"
+      >
+        <Skeleton style="height:2rem;width:70%" /><Skeleton
+          style="height:1rem;width:90%"
+        />
+      </div>
+    {:else if snapshot.request}<p>
+        An original import needs reconciliation. Resume that request or stop
+        tracking it. Stopping does not remove ancestry already imported.
+      </p>
+      <div class="actions">
+        <Button disabled={snapshot.busy} onclick={() => controller.resume()}
+          >Resume original import</Button
+        ><Button
+          variant="outline"
+          disabled={snapshot.busy}
+          onclick={() => controller.stop()}>Stop tracking import</Button
+        >
+      </div>
+    {:else if snapshot.data?.source_unavailable}<p>
+        Original history is unavailable. Refresh after the original repository
+        is accessible again.
+      </p>
+    {:else if snapshot.data?.source}<p>
+        Current vault files stay in place. The original repository’s operations
+        and evolution history remain available through the history source
+        selector.
+      </p>
+      <div class="actions">
+        <Button disabled={snapshot.busy} onclick={() => controller.adopt()}
+          ><GitMerge data-icon="inline-start" />Import recorded history</Button
+        >
+      </div>
+    {:else if snapshot.data}<p>
+        No separate original JJ repository was found in this vault.
+      </p>
+    {:else}<p>Refresh to discover recorded repository history.</p>{/if}
+    {#snippet footer()}<p>
+        This action requires automatic local history to be enabled. It does not
+        change remote synchronization settings.
+      </p>{/snippet}
+  </BackupCard>
+</section>
+
+<style>
+  .actions {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.75rem;
+    margin-top: 0.75rem;
+  }
+  .loading {
+    display: grid;
+    gap: 0.75rem;
+  }
+  p {
+    margin: 0;
+    font-size: 0.8rem;
+    color: var(--muted-foreground);
+  }
+</style>

package/dist/repository/components/backup/AdoptionSettings.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { AdoptionController } from "../../controllers/adoption-controller.js";
+type $$ComponentProps = {
+    controller: AdoptionController;
+};
+declare const AdoptionSettings: import("svelte").Component<$$ComponentProps, {}, "">;
+type AdoptionSettings = ReturnType<typeof AdoptionSettings>;
+export default AdoptionSettings;

package/dist/repository/components/backup/BackupCard.svelte

@@ -0,0 +1,79 @@
+<script lang="ts">
+  // Adapted from jj-store StoreSettingsCard/Heading/Footer (Apache-2.0).
+  import type { Component, Snippet } from "svelte";
+  import * as Card from "@lapismd/design-core/shadcn/card";
+  let {
+    title,
+    description,
+    Icon,
+    icon,
+    actions,
+    footer,
+    children,
+    padded = true,
+  }: {
+    title: string;
+    description?: string;
+    Icon?: Component;
+    icon?: Snippet;
+    actions?: Snippet;
+    footer?: Snippet;
+    children: Snippet;
+    padded?: boolean;
+  } = $props();
+</script>
+
+<Card.Root
+  size="sm"
+  style="gap:0;padding:0;overflow:hidden;background:var(--background)"
+>
+  <div class="backup-card-header">
+    <Card.Header style="padding:0;display:flex;align-items:center;gap:.75rem">
+      {#if Icon || icon}<span class="backup-card-icon" aria-hidden="true">
+          {#if Icon}<Icon />{:else}{@render icon?.()}{/if}
+        </span>{/if}
+      <div class="backup-card-heading">
+        <Card.Title>{title}</Card.Title>
+        {#if description}<Card.Description>{description}</Card.Description>{/if}
+      </div>
+      {@render actions?.()}
+    </Card.Header>
+  </div>
+  <Card.Content
+    style={`padding:${padded ? ".85rem 1rem" : "0"};min-width:0;background:var(--background)`}
+    >{@render children()}</Card.Content
+  >
+  {#if footer}<Card.Footer
+      style="padding:.85rem 1rem;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;background:var(--background)"
+    >
+      {@render footer()}
+    </Card.Footer>{/if}
+</Card.Root>
+
+<style>
+  .backup-card-header {
+    padding: 0.85rem 1rem;
+    background: color-mix(in srgb, var(--muted) 35%, var(--card));
+    border-bottom: 1px solid var(--border);
+  }
+  .backup-card-heading {
+    flex: 1;
+    min-width: 0;
+    display: grid;
+    gap: 0.25rem;
+  }
+  .backup-card-icon {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex: none;
+    width: 2.25rem;
+    height: 2.25rem;
+    border-radius: 50%;
+    background: color-mix(in srgb, var(--muted) 60%, transparent);
+  }
+  .backup-card-icon :global(svg) {
+    width: 1.2rem;
+    height: 1.2rem;
+  }
+</style>

package/dist/repository/components/backup/BackupCard.svelte.d.ts

@@ -0,0 +1,14 @@
+import type { Component, Snippet } from "svelte";
+type $$ComponentProps = {
+    title: string;
+    description?: string;
+    Icon?: Component;
+    icon?: Snippet;
+    actions?: Snippet;
+    footer?: Snippet;
+    children: Snippet;
+    padded?: boolean;
+};
+declare const BackupCard: Component<$$ComponentProps, {}, "">;
+type BackupCard = ReturnType<typeof BackupCard>;
+export default BackupCard;

package/dist/repository/components/backup/BackupField.svelte

@@ -0,0 +1,45 @@
+<script lang="ts">
+  // Adapted from jj-store StoreWorkField.svelte (Apache-2.0).
+  import * as Field from "@lapismd/design-core/shadcn/field";
+  import type { Snippet } from "svelte";
+  let {
+    id,
+    label,
+    description,
+    children,
+  }: { id: string; label: string; description?: string; children: Snippet } =
+    $props();
+</script>
+
+<Field.Field class="backup-field">
+  <div class="backup-field-copy">
+    <Field.Label for={id}>{label}</Field.Label>
+    {#if description}<Field.Description>{description}</Field.Description>{/if}
+  </div>
+  <div class="backup-field-control">{@render children()}</div>
+</Field.Field>
+
+<style>
+  :global(.backup-field) {
+    display: grid;
+    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
+    gap: 1rem;
+    align-items: start;
+    padding: 0.75rem 1rem;
+    border-bottom: 1px solid var(--border);
+  }
+  .backup-field-copy {
+    display: grid;
+    gap: 0.35rem;
+    min-width: 0;
+  }
+  .backup-field-control {
+    min-width: 0;
+  }
+  @media (max-width: 40rem) {
+    :global(.backup-field) {
+      grid-template-columns: minmax(0, 1fr);
+      gap: 0.65rem;
+    }
+  }
+</style>

package/dist/repository/components/backup/BackupField.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { Snippet } from "svelte";
+type $$ComponentProps = {
+    id: string;
+    label: string;
+    description?: string;
+    children: Snippet;
+};
+declare const BackupField: import("svelte").Component<$$ComponentProps, {}, "">;
+type BackupField = ReturnType<typeof BackupField>;
+export default BackupField;

package/dist/repository/components/backup/BackupSelect.svelte

@@ -0,0 +1,71 @@
+<script lang="ts" generics="T extends string | null">
+  // Adapted from jj-store StoreSettingsSelect.svelte (Apache-2.0).
+  import * as Select from "@lapismd/design-core/shadcn/select";
+  let {
+    id,
+    value = $bindable(),
+    options,
+    disabled = false,
+    "aria-label": ariaLabel,
+    onValueChange,
+  }: {
+    id?: string;
+    value: T;
+    options: readonly { value: T; label: string; disabled?: boolean }[];
+    disabled?: boolean;
+    "aria-label"?: string;
+    onValueChange?: (value: T) => void;
+  } = $props();
+  // Encode null/default choices without reserving a domain value.
+  const selected = $derived(
+    options.findIndex((option) => option.value === value),
+  );
+  const display = $derived(
+    options[selected]?.label ?? value ?? "Choose an option",
+  );
+</script>
+
+<Select.Root
+  type="single"
+  value={selected < 0 ? "" : String(selected)}
+  {disabled}
+  onValueChange={(next) => {
+    const option = next === "" ? undefined : options[Number(next)];
+    if (!option || option.disabled) return;
+    value = option.value;
+    onValueChange?.(value);
+  }}
+>
+  <Select.Trigger
+    {id}
+    aria-label={ariaLabel ? `${ariaLabel}: ${display}` : undefined}
+    style="width:100%"
+  >
+    <span class="selected-label">{display}</span>
+  </Select.Trigger>
+  <Select.Content
+    aria-label={ariaLabel}
+    aria-labelledby={ariaLabel ? undefined : id ? `${id}-label` : undefined}
+  >
+    <Select.Group>
+      {#each options as option, index (option.value)}
+        <Select.Item
+          value={String(index)}
+          label={option.label}
+          disabled={option.disabled}
+        >
+          {option.label}
+        </Select.Item>
+      {/each}
+    </Select.Group>
+  </Select.Content>
+</Select.Root>
+
+<style>
+  .selected-label {
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+</style>

package/dist/repository/components/backup/BackupSelect.svelte.d.ts

@@ -0,0 +1,35 @@
+declare function $$render<T extends string | null>(): {
+    props: {
+        id?: string;
+        value: T;
+        options: readonly {
+            value: T;
+            label: string;
+            disabled?: boolean;
+        }[];
+        disabled?: boolean;
+        "aria-label"?: string;
+        onValueChange?: (value: T) => void;
+    };
+    exports: {};
+    bindings: "value";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T extends string | null> {
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "value";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T extends string | null>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T extends string | null>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const BackupSelect: $$IsomorphicComponent;
+type BackupSelect<T extends string | null> = InstanceType<typeof BackupSelect<T>>;
+export default BackupSelect;

package/dist/repository/components/backup/BackupSettings.svelte

@@ -0,0 +1,122 @@
+<script lang="ts">
+  import { onMount } from "svelte";
+  import RepositoryShell from "../RepositoryShell.svelte";
+  import * as Dialog from "@lapismd/design-core/shadcn/dialog";
+  import type { SyncController } from "../../controllers/sync-controller.js";
+  import SyncConflictEditor from "./SyncConflictEditor.svelte";
+  import SyncSettings from "./SyncSettings.svelte";
+  import ForgeAccounts from "./ForgeAccounts.svelte";
+  import RemoteSettings from "./RemoteSettings.svelte";
+  import AdoptionSettings from "./AdoptionSettings.svelte";
+  import type { AdoptionController } from "../../controllers/adoption-controller.js";
+  import StorageSettings from "./StorageSettings.svelte";
+  import type { StorageController } from "../../controllers/storage-controller.js";
+  import RepositoryRestoreDialog from "../RepositoryRestoreDialog.svelte";
+  import type { ForgeController } from "../../controllers/forge-controller.js";
+  import type { RemoteController } from "../../controllers/remote-controller.js";
+  import type { RestoreController } from "../../controllers/restore.js";
+  let {
+    controller,
+    remote,
+    restore,
+    sync,
+    setSyncEnabled,
+    storage,
+    adoption,
+  }: {
+    controller: ForgeController;
+    remote?: RemoteController;
+    restore?: RestoreController;
+    sync?: SyncController;
+    setSyncEnabled?: (enabled: boolean) => Promise<void>;
+    storage?: StorageController;
+    adoption?: AdoptionController;
+  } = $props();
+  let conflictsOpen = $state(false);
+  let syncBusy = $state(false);
+  onMount(() => {
+    let active = false;
+    return sync?.subscribe((snapshot) => {
+      syncBusy = snapshot.busy;
+      if (active && !snapshot.busy) void remote?.refresh();
+      active = snapshot.busy;
+    });
+  });
+</script>
+
+<div class="backup-settings-content">
+  <ForgeAccounts {controller}>
+    {#snippet remoteSettings()}
+      {#if storage}<StorageSettings controller={storage} />{/if}
+      {#if adoption}<AdoptionSettings controller={adoption} />{/if}
+      {#if sync && setSyncEnabled}<SyncSettings
+          controller={sync}
+          setEnabled={setSyncEnabled}
+          onReview={() => (conflictsOpen = true)}
+        />{/if}
+      {#if remote}<RemoteSettings
+          controller={remote}
+          accounts={controller}
+          {restore}
+        />{/if}
+    {/snippet}
+  </ForgeAccounts>
+  {#if restore}<RepositoryRestoreDialog controller={restore} />{/if}
+</div>
+{#if sync && conflictsOpen}
+  <Dialog.Root
+    open={conflictsOpen}
+    onOpenChange={(value) => {
+      if (value || !syncBusy) conflictsOpen = value;
+    }}
+  >
+    <Dialog.Content
+      class="backup-conflicts-dialog"
+      showCloseButton={false}
+      onEscapeKeydown={(event) => {
+        if (syncBusy) event.preventDefault();
+      }}
+    >
+      <Dialog.Title class="visually-hidden"
+        >Resolve backup synchronization conflicts</Dialog.Title
+      >
+      <Dialog.Description class="visually-hidden"
+        >Review and resolve retained local and remote changes.</Dialog.Description
+      >
+      <RepositoryShell>
+        {#snippet surface()}<SyncConflictEditor
+            controller={sync}
+            open={conflictsOpen}
+            onClose={() => (conflictsOpen = false)}
+          />{/snippet}
+        <div></div>
+      </RepositoryShell>
+    </Dialog.Content>
+  </Dialog.Root>
+{/if}
+
+<style>
+  .backup-settings-content {
+    display: grid;
+    gap: 1rem;
+    min-width: 0;
+    width: 100%;
+  }
+  :global(.backup-conflicts-dialog) {
+    width: 100dvw;
+    max-width: 100dvw;
+    height: 100dvh;
+    max-height: 100dvh;
+    padding: 0;
+    gap: 0;
+    border: 0;
+    border-radius: 0;
+  }
+  :global(.backup-conflicts-dialog .visually-hidden) {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+    clip-path: inset(50%);
+  }
+</style>

package/dist/repository/components/backup/BackupSettings.svelte.d.ts

@@ -0,0 +1,18 @@
+import type { SyncController } from "../../controllers/sync-controller.js";
+import type { AdoptionController } from "../../controllers/adoption-controller.js";
+import type { StorageController } from "../../controllers/storage-controller.js";
+import type { ForgeController } from "../../controllers/forge-controller.js";
+import type { RemoteController } from "../../controllers/remote-controller.js";
+import type { RestoreController } from "../../controllers/restore.js";
+type $$ComponentProps = {
+    controller: ForgeController;
+    remote?: RemoteController;
+    restore?: RestoreController;
+    sync?: SyncController;
+    setSyncEnabled?: (enabled: boolean) => Promise<void>;
+    storage?: StorageController;
+    adoption?: AdoptionController;
+};
+declare const BackupSettings: import("svelte").Component<$$ComponentProps, {}, "">;
+type BackupSettings = ReturnType<typeof BackupSettings>;
+export default BackupSettings;