@inkandswitch/patchwork-pkg-base 0.0.7 → 0.0.8

package/packages/account-history/dist/assets/HistoryViewer-Ct5g7zek.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HistoryViewer-Ct5g7zek.js","sources":["../../src/HistoryViewer.tsx"],"sourcesContent":["import { createSignal, createMemo, createEffect, For, Show } from \"solid-js\";\nimport { render } from \"solid-js/web\";\nimport type { AutomergeUrl } from \"@automerge/automerge-repo\";\nimport { makeDocumentProjection } from \"solid-automerge\";\nimport { OpenDocumentEvent } from \"@inkandswitch/patchwork-elements\";\nimport {\n  getRegistry,\n  type ToolDescription,\n  type ToolImplementation,\n} from \"@inkandswitch/patchwork-plugins\";\nimport {\n  type PatchworkToolProps,\n  type HistoryDoc,\n  type HistoryEntry,\n} from \"./types.ts\";\nimport \"./index.css\";\n\ntype GroupingMode = \"date\" | \"document\";\ntype DocumentSortMode = \"recent\" | \"visits\";\n\nconst dateGroupFormatter = new Intl.DateTimeFormat(\"en-US\", {\n  year: \"numeric\",\n  month: \"long\",\n  day: \"numeric\",\n});\n\nconst timeFormatter = new Intl.DateTimeFormat(\"en-US\", {\n  hour: \"numeric\",\n  minute: \"2-digit\",\n  hour12: true,\n});\n\nconst shortDateFormatter = new Intl.DateTimeFormat(\"en-US\", {\n  month: \"short\",\n  day: \"numeric\",\n  hour: \"numeric\",\n  minute: \"2-digit\",\n});\n\n// Helper function to get tool metadata from registry\nfunction getToolMetadata(toolId: string): { name: string; icon?: string } {\n  const toolRegistry = getRegistry<ToolDescription>(\"patchwork:tool\");\n  const tool = toolRegistry.get(toolId);\n\n  if (tool) {\n    return {\n      name: tool.name || toolId,\n      icon: tool.icon,\n    };\n  }\n\n  // Fallback if tool not found in registry\n  return {\n    name: toolId,\n    icon: \"File\",\n  };\n}\n\nfunction HistoryEntryRow(props: {\n  entry: HistoryEntry;\n  timeDisplay: string;\n  urlDisplay: string;\n  onOpen: (entry: HistoryEntry) => void;\n  onDelete: (e: MouseEvent, entry: HistoryEntry) => void;\n}) {\n  const toolMetadata = getToolMetadata(props.entry.toolId);\n\n  return (\n    <div class=\"account-history-entry\">\n      <div class=\"account-history-entry-time\">{props.timeDisplay}</div>\n      <div\n        class=\"account-history-entry-content\"\n        onClick={() => props.onOpen(props.entry)}\n      >\n        <span class=\"account-history-entry-title\">{props.entry.docTitle}</span>\n        <span class=\"account-history-entry-tool\">— {toolMetadata.name}</span>\n        <span class=\"account-history-entry-url\">{props.urlDisplay}</span>\n      </div>\n      <div class=\"account-history-entry-actions\">\n        <button\n          class=\"account-history-entry-delete\"\n          onClick={(e) => props.onDelete(e, props.entry)}\n          aria-label=\"Delete from history\"\n          title=\"Delete from history\"\n        >\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          >\n            <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n            <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n          </svg>\n        </button>\n      </div>\n    </div>\n  );\n}\n\nexport function HistoryViewer(props: PatchworkToolProps<HistoryDoc>) {\n  const historyDoc = makeDocumentProjection<HistoryDoc>(props.handle);\n\n  // Load preferences from localStorage\n  const savedGroupingMode = (localStorage.getItem(\"history-grouping-mode\") ||\n    \"date\") as GroupingMode;\n  const savedSortMode = (localStorage.getItem(\"history-document-sort-mode\") ||\n    \"recent\") as DocumentSortMode;\n  const savedSearchQuery = localStorage.getItem(\"history-search-query\") || \"\";\n\n  const [groupingMode, setGroupingMode] =\n    createSignal<GroupingMode>(savedGroupingMode);\n  const [documentSortMode, setDocumentSortMode] =\n    createSignal<DocumentSortMode>(savedSortMode);\n  const [searchQuery, setSearchQuery] = createSignal<string>(savedSearchQuery);\n  const [expandedGroups, setExpandedGroups] = createSignal<Set<AutomergeUrl>>(\n    new Set()\n  );\n\n  // Save preferences to localStorage when they change\n  createEffect(() => {\n    localStorage.setItem(\"history-grouping-mode\", groupingMode());\n  });\n\n  createEffect(() => {\n    localStorage.setItem(\"history-document-sort-mode\", documentSortMode());\n  });\n\n  createEffect(() => {\n    localStorage.setItem(\"history-search-query\", searchQuery());\n  });\n\n  // Filter entries based on search query\n  const filteredEntries = createMemo(() => {\n    const query = searchQuery().toLowerCase().trim();\n    if (!query) {\n      return historyDoc.entries || [];\n    }\n\n    return (historyDoc.entries || []).filter((entry) => {\n      const titleMatch = entry.docTitle?.toLowerCase().includes(query);\n      const urlMatch = entry.docUrl?.toLowerCase().includes(query);\n      return titleMatch || urlMatch;\n    });\n  });\n\n  // Group entries by date (returns array of [dateString, entries] tuples)\n  const groupedByDate = createMemo(() => {\n    const groups = new Map<string, HistoryEntry[]>();\n\n    // Reverse to show most recent first\n    const entries = [...filteredEntries()].reverse();\n\n    for (const entry of entries) {\n      const date = dateGroupFormatter.format(new Date(entry.timestamp));\n\n      if (!groups.has(date)) {\n        groups.set(date, []);\n      }\n      groups.get(date)!.push(entry);\n    }\n\n    return Array.from(groups);\n  });\n\n  // Group entries by document\n  const groupedByDocument = createMemo(() => {\n    const groups = new Map<AutomergeUrl, HistoryEntry[]>();\n\n    // Reverse to show most recent first within each document group\n    const entries = [...filteredEntries()].reverse();\n\n    for (const entry of entries) {\n      if (!groups.has(entry.docUrl)) {\n        groups.set(entry.docUrl, []);\n      }\n      groups.get(entry.docUrl)!.push(entry);\n    }\n\n    return groups;\n  });\n\n  // Sorted document groups\n  const sortedDocumentGroups = createMemo(() => {\n    const groups = Array.from(groupedByDocument());\n    const sortMode = documentSortMode();\n\n    if (sortMode === \"visits\") {\n      // Sort by number of visits (descending)\n      return groups.sort((a, b) => b[1].length - a[1].length);\n    } else {\n      // Precompute max timestamps to avoid recalculating in comparator\n      const maxTimestamps = new Map<AutomergeUrl, number>();\n      for (const [url, entries] of groups) {\n        let max = 0;\n        for (const e of entries) {\n          if (e.timestamp > max) max = e.timestamp;\n        }\n        maxTimestamps.set(url, max);\n      }\n      return groups.sort(\n        (a, b) => maxTimestamps.get(b[0])! - maxTimestamps.get(a[0])!\n      );\n    }\n  });\n\n  const openDocument = (entry: HistoryEntry) => {\n    // TODO: it makes sense to load the document at the specific moment in history, but for now\n    // this isn't indicated well in the UI, so it's likely to be confusing.\n    // const url =\n    //   entry.heads.length > 0\n    //     ? (`${entry.docUrl}#${entry.heads[0]}` as AutomergeUrl)\n    //     : entry.docUrl;\n    const url = entry.docUrl;\n\n    // Open document with saved tool\n    props.element.dispatchEvent(\n      new OpenDocumentEvent({\n        url,\n        toolId: entry.toolId,\n      })\n    );\n  };\n\n  const formatTime = (timestamp: number) => {\n    return timeFormatter.format(new Date(timestamp));\n  };\n\n  const formatShortDate = (timestamp: number) => {\n    return shortDateFormatter.format(new Date(timestamp));\n  };\n\n  const deleteEntry = (e: MouseEvent, entryToDelete: HistoryEntry) => {\n    e.stopPropagation();\n\n    props.handle.change((doc) => {\n      const index = doc.entries.findIndex(\n        (e) =>\n          e.timestamp === entryToDelete.timestamp &&\n          e.docUrl === entryToDelete.docUrl\n      );\n      if (index !== -1) {\n        doc.entries.splice(index, 1);\n      }\n    });\n  };\n\n  const toggleGroup = (docUrl: AutomergeUrl) => {\n    setExpandedGroups((prev) => {\n      const newSet = new Set(prev);\n      if (newSet.has(docUrl)) {\n        newSet.delete(docUrl);\n      } else {\n        newSet.add(docUrl);\n      }\n      return newSet;\n    });\n  };\n\n  const openDocumentGroup = (docUrl: AutomergeUrl) => {\n    // Open document without specifying heads or tool (opens most recent version with default tool)\n    props.element.dispatchEvent(\n      new OpenDocumentEvent({\n        url: docUrl,\n      })\n    );\n  };\n\n  return (\n    <div class=\"account-history-viewer\">\n      <div class=\"account-history-header\">\n        <h1 class=\"account-history-title\">Account History</h1>\n        <div class=\"account-history-header-controls\">\n          <span class=\"account-history-group-label\">Group by:</span>\n          <button\n            onClick={() => setGroupingMode(\"date\")}\n            class={`account-history-toggle-button ${groupingMode() === \"date\" ? \"active\" : \"\"}`}\n          >\n            Date\n          </button>\n          <button\n            onClick={() => setGroupingMode(\"document\")}\n            class={`account-history-toggle-button ${groupingMode() === \"document\" ? \"active\" : \"\"}`}\n          >\n            Document\n          </button>\n          <Show when={groupingMode() === \"document\"}>\n            <span class=\"account-history-sort-label\">Sort by:</span>\n            <button\n              onClick={() => setDocumentSortMode(\"recent\")}\n              class={`account-history-sort-button ${documentSortMode() === \"recent\" ? \"active\" : \"\"}`}\n            >\n              Most Recent\n            </button>\n            <button\n              onClick={() => setDocumentSortMode(\"visits\")}\n              class={`account-history-sort-button ${documentSortMode() === \"visits\" ? \"active\" : \"\"}`}\n            >\n              Most Visits\n            </button>\n          </Show>\n        </div>\n        <div class=\"account-history-search\">\n          <svg\n            class=\"account-history-search-icon\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          >\n            <circle cx=\"11\" cy=\"11\" r=\"8\" />\n            <path d=\"m21 21-4.35-4.35\" />\n          </svg>\n          <input\n            type=\"text\"\n            class=\"account-history-search-input\"\n            placeholder=\"search history\"\n            value={searchQuery()}\n            onInput={(e) => setSearchQuery(e.currentTarget.value)}\n          />\n        </div>\n      </div>\n\n      <div class=\"account-history-content\">\n        <Show when={groupingMode() === \"date\"}>\n          <For each={groupedByDate()}>\n            {([date, entries]) => (\n              <div class=\"account-history-group\">\n                <div class=\"account-history-group-header\">\n                  <h2 class=\"account-history-group-title\">{date}</h2>\n                </div>\n                <div class=\"account-history-entries\">\n                  <For each={entries}>\n                    {(entry) => (\n                      <HistoryEntryRow\n                        entry={entry}\n                        timeDisplay={formatTime(entry.timestamp)}\n                        urlDisplay={entry.docUrl}\n                        onOpen={openDocument}\n                        onDelete={deleteEntry}\n                      />\n                    )}\n                  </For>\n                </div>\n              </div>\n            )}\n          </For>\n        </Show>\n\n        <Show when={groupingMode() === \"document\"}>\n          <For each={sortedDocumentGroups()}>\n            {([docUrl, entries]) => {\n              const isExpanded = () => expandedGroups().has(docUrl);\n\n              return (\n                <div class=\"account-history-group\">\n                  <div\n                    class=\"account-history-group-header account-history-group-header-clickable\"\n                    onClick={() => openDocumentGroup(docUrl)}\n                  >\n                    <div class=\"account-history-group-header-content\">\n                      <h2 class=\"account-history-group-title\">\n                        {entries[0]?.docTitle ?? \"Untitled\"}\n                      </h2>\n                      <p class=\"account-history-group-meta\">\n                        {entries[0]?.docType ?? \"unknown\"} • {entries.length}{\" \"}\n                        {entries.length === 1 ? \"visit\" : \"visits\"}\n                      </p>\n                    </div>\n                    <button\n                      class=\"account-history-group-toggle\"\n                      onClick={(e) => {\n                        e.stopPropagation();\n                        toggleGroup(docUrl);\n                      }}\n                      aria-label={isExpanded() ? \"Collapse\" : \"Expand\"}\n                      title={isExpanded() ? \"Collapse\" : \"Expand\"}\n                    >\n                      {isExpanded() ? \"−\" : \"+\"}\n                    </button>\n                  </div>\n                  <Show when={isExpanded()}>\n                    <div class=\"account-history-entries\">\n                      <For each={entries}>\n                        {(entry) => (\n                          <HistoryEntryRow\n                            entry={entry}\n                            timeDisplay={formatShortDate(entry.timestamp)}\n                            urlDisplay={`(#${entry.heads})`}\n                            onOpen={openDocument}\n                            onDelete={deleteEntry}\n                          />\n                        )}\n                      </For>\n                    </div>\n                  </Show>\n                </div>\n              );\n            }}\n          </For>\n        </Show>\n\n        <Show when={!historyDoc.entries || historyDoc.entries.length === 0}>\n          <div class=\"account-history-empty\">\n            No history yet. Open some documents to start tracking your history.\n          </div>\n        </Show>\n      </div>\n    </div>\n  );\n}\n\nexport const renderHistoryViewer: ToolImplementation<HistoryDoc> = (\n  handle,\n  element\n) => render(() => <HistoryViewer handle={handle} repo={element.repo} element={element} />, element);\n"],"names":["dateGroupFormatter","Intl","DateTimeFormat","year","month","day","timeFormatter","hour","minute","hour12","shortDateFormatter","getToolMetadata","toolId","toolRegistry","getRegistry","tool","get","name","icon","HistoryEntryRow","props","toolMetadata","entry","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_el$4","_el$5","_el$7","_el$8","_el$9","_$insert","timeDisplay","$$click","onOpen","docTitle","urlDisplay","e","onDelete","HistoryViewer","historyDoc","makeDocumentProjection","handle","savedGroupingMode","localStorage","getItem","savedSortMode","savedSearchQuery","groupingMode","setGroupingMode","createSignal","documentSortMode","setDocumentSortMode","searchQuery","setSearchQuery","expandedGroups","setExpandedGroups","Set","createEffect","setItem","filteredEntries","createMemo","query","toLowerCase","trim","entries","filter","titleMatch","includes","urlMatch","docUrl","groupedByDate","groups","Map","reverse","date","format","Date","timestamp","has","set","push","Array","from","groupedByDocument","sortedDocumentGroups","sortMode","sort","a","b","length","maxTimestamps","url","max","openDocument","element","dispatchEvent","OpenDocumentEvent","formatTime","formatShortDate","deleteEntry","entryToDelete","stopPropagation","change","doc","index","findIndex","splice","toggleGroup","prev","newSet","delete","add","openDocumentGroup","_el$0","_tmpl$6","_el$1","_el$10","_el$11","_el$12","_el$13","_el$14","_el$18","_el$19","_el$20","_el$21","_$createComponent","Show","when","children","_tmpl$2","_el$16","_tmpl$3","_$effect","_$className","_el$17","_tmpl$4","$$input","currentTarget","value","For","each","_el$23","_tmpl$7","_el$24","_el$25","_el$26","isExpanded","_el$27","_tmpl$9","_el$28","_el$29","_el$30","_el$31","_el$32","_el$34","_el$35","docType","_el$36","_tmpl$8","heads","_p$","_v$3","_v$4","_$setAttribute","t","undefined","_tmpl$5","_v$","_v$2","renderHistoryViewer","render","repo","_$delegateEvents"],"mappings":"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"}

package/packages/account-history/dist/assets/NotebookViewer-BkYJL6Jc.js

@@ -0,0 +1,504 @@
+(function() {
+  "use strict";
+  try {
+    if (typeof document != "undefined") {
+      var elementStyle = document.createElement("style");
+      elementStyle.appendChild(document.createTextNode('/* ===== Notebook Viewer Layout ===== */\n\n.notebook-viewer {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;\n  color: var(--account-history-text);\n  background: var(--account-history-hover);\n  overflow: hidden;\n  box-sizing: border-box;\n  position: relative;\n}\n\n/* ===== Timeline Controls (top section) ===== */\n\n.notebook-viewer-timeline {\n  flex-shrink: 0;\n  padding: var(--account-history-space-sm) var(--account-history-space-lg);\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--account-history-space-2xs);\n  background: transparent;\n  z-index: 2;\n}\n\n.notebook-viewer-date-label {\n  font-size: var(--account-history-text-md);\n  font-weight: 600;\n  color: var(--account-history-text);\n  font-variant-numeric: tabular-nums;\n}\n\n/* Playback controls — floating top-left */\n.notebook-viewer-playback {\n  position: absolute;\n  top: var(--account-history-space-sm);\n  left: var(--account-history-space-sm);\n  display: flex;\n  align-items: center;\n  gap: var(--account-history-space-xs);\n  z-index: 3;\n}\n\n.notebook-viewer-play-button {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  border: 1px solid var(--account-history-border);\n  background: var(--account-history-bg);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--account-history-text);\n  transition: background-color var(--account-history-transition-fast) var(--easing),\n              color var(--account-history-transition-fast) var(--easing);\n  padding: 0;\n}\n\n.notebook-viewer-play-button:hover {\n  background: var(--account-history-primary);\n  color: var(--account-history-primary-line);\n  border-color: var(--account-history-primary);\n}\n\n/* Direction toggle switch */\n.notebook-viewer-direction-toggle {\n  position: relative;\n  display: flex;\n  align-items: center;\n  border-radius: 12px;\n  border: 1px solid var(--account-history-border);\n  background: var(--account-history-bg);\n  cursor: pointer;\n  overflow: hidden;\n  user-select: none;\n  height: 24px;\n}\n\n.notebook-viewer-direction-option {\n  position: relative;\n  z-index: 1;\n  padding: 0 var(--account-history-space-xs);\n  font-size: var(--account-history-text-2xs);\n  font-weight: 600;\n  color: var(--account-history-text-tertiary);\n  transition: color var(--account-history-transition-fast) var(--easing);\n  line-height: 24px;\n}\n\n.notebook-viewer-direction-option.active {\n  color: var(--account-history-primary-line);\n}\n\n.notebook-viewer-direction-thumb {\n  position: absolute;\n  top: 1px;\n  bottom: 1px;\n  width: 50%;\n  border-radius: 10px;\n  background: var(--account-history-primary);\n  transition: left var(--account-history-transition-base) var(--easing);\n}\n\n.notebook-viewer-direction-thumb.left {\n  left: 1px;\n}\n\n.notebook-viewer-direction-thumb.right {\n  left: calc(50% - 1px);\n}\n\n.notebook-viewer-timeline-row {\n  display: flex;\n  align-items: center;\n  gap: var(--account-history-space-sm);\n  width: 100%;\n  max-width: 660px;\n}\n\n.notebook-viewer-timeline-label {\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  font-size: var(--account-history-text-sm);\n  font-weight: 500;\n  color: var(--account-history-text-secondary);\n  padding: var(--account-history-space-2xs) var(--account-history-space-xs);\n  border-radius: var(--account-history-radius);\n  white-space: nowrap;\n  transition: color var(--account-history-transition-fast) var(--easing);\n  font-family: inherit;\n}\n\n.notebook-viewer-timeline-label:hover {\n  color: var(--account-history-primary);\n}\n\n.notebook-viewer-timeline-slider {\n  flex: 1;\n  min-width: 0;\n  cursor: pointer;\n  accent-color: var(--account-history-primary);\n}\n\n/* ===== Page Area (middle section) ===== */\n\n.notebook-viewer-page-area {\n  flex: 1;\n  display: flex;\n  align-items: stretch;\n  min-height: 0;\n  padding: 0 var(--account-history-space-sm);\n  gap: var(--account-history-space-xs);\n}\n\n/* Arrow buttons */\n.notebook-viewer-arrow {\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 48px;\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  color: var(--account-history-text-secondary);\n  font-size: 2rem;\n  transition: color var(--account-history-transition-fast) var(--easing),\n              opacity var(--account-history-transition-fast) var(--easing);\n  border-radius: var(--account-history-radius);\n  padding: 0;\n}\n\n.notebook-viewer-arrow:hover:not(:disabled) {\n  color: var(--account-history-primary);\n  background: rgba(0, 0, 0, 0.04);\n}\n\n.notebook-viewer-arrow:disabled {\n  opacity: 0.25;\n  cursor: default;\n}\n\n/* The "page" - the central patchwork-view container */\n.notebook-viewer-page {\n  flex: 1;\n  min-width: 0;\n  min-height: 0;\n  background: var(--account-history-bg);\n  border-radius: 6px;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1), 0 0 1px rgba(0, 0, 0, 0.08);\n  overflow: hidden;\n  position: relative;\n}\n\n.notebook-viewer-page patchwork-view {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\n/* ===== Bottom Controls ===== */\n\n.notebook-viewer-bottom {\n  flex-shrink: 0;\n  padding: var(--account-history-space-sm) var(--account-history-space-lg);\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--account-history-space-xs);\n  z-index: 2;\n}\n\n/* Step row — single-line layout: [dropdown] [dropdown?] [slider] [value] */\n.notebook-viewer-step-row {\n  display: flex;\n  align-items: center;\n  gap: var(--account-history-space-sm);\n  font-size: var(--account-history-text-sm);\n  color: var(--account-history-text-secondary);\n}\n\n.notebook-viewer-select {\n  padding: var(--account-history-space-2xs) var(--account-history-space-xs);\n  border-radius: var(--account-history-radius);\n  border: 1px solid var(--account-history-border);\n  background: var(--account-history-bg);\n  color: var(--account-history-text);\n  font-size: var(--account-history-text-sm);\n  font-family: inherit;\n  cursor: pointer;\n}\n\n.notebook-viewer-step-slider {\n  width: 150px;\n  accent-color: var(--account-history-primary);\n  cursor: pointer;\n}\n\n.notebook-viewer-step-value {\n  min-width: 2em;\n  text-align: center;\n  font-variant-numeric: tabular-nums;\n  white-space: nowrap;\n}\n\n.notebook-viewer-entry-info {\n  font-size: var(--account-history-text-sm);\n  color: var(--account-history-text-tertiary);\n  display: flex;\n  gap: var(--account-history-space-sm);\n  align-items: center;\n}\n\n.notebook-viewer-entry-info-position {\n  font-weight: 500;\n  color: var(--account-history-text-secondary);\n}\n\n/* ===== Open Document Button (top-right) ===== */\n\n.notebook-viewer-open-doc {\n  position: absolute;\n  top: var(--account-history-space-sm);\n  right: var(--account-history-space-sm);\n  z-index: 3;\n}\n\n.notebook-viewer-open-doc-button {\n  height: 36px;\n  border-radius: 18px;\n  border: 1px solid var(--account-history-border);\n  background: var(--account-history-bg);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  gap: var(--account-history-space-2xs);\n  color: var(--account-history-text);\n  font-size: var(--account-history-text-sm);\n  font-weight: 500;\n  font-family: inherit;\n  padding: 0 var(--account-history-space-sm) 0 var(--account-history-space-xs);\n  transition: background-color var(--account-history-transition-fast) var(--easing),\n              color var(--account-history-transition-fast) var(--easing);\n  white-space: nowrap;\n}\n\n.notebook-viewer-open-doc-button:hover {\n  background: var(--account-history-primary);\n  color: var(--account-history-primary-line);\n  border-color: var(--account-history-primary);\n}\n\n.notebook-viewer-open-doc-button svg {\n  flex-shrink: 0;\n}\n\n.notebook-viewer-version-dropdown {\n  position: absolute;\n  top: calc(100% + var(--account-history-space-2xs));\n  right: 0;\n  min-width: 160px;\n  background: var(--account-history-bg);\n  border: 1px solid var(--account-history-border);\n  border-radius: var(--account-history-radius);\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12), 0 0 1px rgba(0, 0, 0, 0.08);\n  z-index: 4;\n  overflow: hidden;\n}\n\n.notebook-viewer-version-option {\n  display: block;\n  width: 100%;\n  padding: var(--account-history-space-xs) var(--account-history-space-sm);\n  background: none;\n  border: none;\n  cursor: pointer;\n  text-align: left;\n  font-size: var(--account-history-text-sm);\n  font-family: inherit;\n  color: var(--account-history-text);\n  transition: background-color var(--account-history-transition-fast) var(--easing);\n}\n\n.notebook-viewer-version-option:hover {\n  background: var(--account-history-hover);\n}\n\n.notebook-viewer-version-option + .notebook-viewer-version-option {\n  border-top: 1px solid var(--account-history-border);\n}\n\n/* ===== Empty State ===== */\n\n.notebook-viewer-empty {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--account-history-text-tertiary);\n  font-size: var(--account-history-text-md);\n}\n\n\n\n/* ===== Responsive ===== */\n@media (max-width: 640px) {\n  .notebook-viewer-arrow {\n    width: 32px;\n    font-size: 1.5rem;\n  }\n\n  .notebook-viewer-step-slider {\n    width: 100px;\n  }\n}'));
+      document.head.appendChild(elementStyle);
+    }
+  } catch (e) {
+    console.error("vite-plugin-css-injected-by-js", e);
+  }
+})();
+import { e as render, f as createComponent, g as delegateEvents, c as createMemo, b as createSignal, o as onCleanup, h as createEffect, i as insert, S as Show, j as createRenderEffect, s as setAttribute, k as className, l as getOwner, F as For, m as memo, t as template } from "./store-CRmRL4Cv.js";
+import { m as makeDocumentProjection } from "./makeDocumentProjection-DXgEZYyv.js";
+import { OpenDocumentEvent } from "@inkandswitch/patchwork-elements";
+var _tmpl$ = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg width=20 height=20 viewBox="0 0 24 24"fill=currentColor stroke=none><polygon points="6 3 20 12 6 21">`), _tmpl$2 = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg width=20 height=20 viewBox="0 0 24 24"fill=currentColor stroke=none><rect x=5 y=3 width=5 height=18></rect><rect x=14 y=3 width=5 height=18>`), _tmpl$3 = /* @__PURE__ */ template(`<div class=notebook-viewer-playback><div class=notebook-viewer-direction-toggle><span>Rev</span><span>Fwd</span><div></div></div><button class=notebook-viewer-play-button>`), _tmpl$4 = /* @__PURE__ */ template(`<div class=notebook-viewer-version-dropdown><button class=notebook-viewer-version-option>Latest version</button><button class=notebook-viewer-version-option>This version`), _tmpl$5 = /* @__PURE__ */ template(`<div class=notebook-viewer-open-doc><button class=notebook-viewer-open-doc-button title="Open this document"><svg xmlns=http://www.w3.org/2000/svg width=16 height=16 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path><polyline points="15 3 21 3 21 9"></polyline><line x1=10 y1=14 x2=21 y2=3></line></svg>Open document`), _tmpl$6 = /* @__PURE__ */ template(`<div class=notebook-viewer-timeline><div class=notebook-viewer-date-label></div><div class=notebook-viewer-timeline-row><button class=notebook-viewer-timeline-label title="Go to first entry">First</button><input type=range class=notebook-viewer-timeline-slider min=0><button class=notebook-viewer-timeline-label title="Go to latest entry">Latest`), _tmpl$7 = /* @__PURE__ */ template(`<div class=notebook-viewer-page-area><button class=notebook-viewer-arrow aria-label="Go back"><svg xmlns=http://www.w3.org/2000/svg width=32 height=32 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><polyline points="15 18 9 12 15 6"></polyline></svg></button><div class=notebook-viewer-page></div><button class=notebook-viewer-arrow aria-label="Go forward"><svg xmlns=http://www.w3.org/2000/svg width=32 height=32 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><polyline points="9 18 15 12 9 6">`), _tmpl$8 = /* @__PURE__ */ template(`<select class=notebook-viewer-select>`), _tmpl$9 = /* @__PURE__ */ template(`<input type=range class=notebook-viewer-step-slider min=0>`), _tmpl$0 = /* @__PURE__ */ template(`<span class=notebook-viewer-step-value>`), _tmpl$1 = /* @__PURE__ */ template(`<div class=notebook-viewer-bottom><div class=notebook-viewer-step-row><select class=notebook-viewer-select><option value=entries>Step by entries</option><option value=time>Step by time</option></select></div><div class=notebook-viewer-entry-info><span class=notebook-viewer-entry-info-position>Entry <!> of </span><span>`), _tmpl$10 = /* @__PURE__ */ template(`<div class=notebook-viewer>`), _tmpl$11 = /* @__PURE__ */ template(`<div class=notebook-viewer-empty>No history entries yet. Open some documents to start tracking history.`), _tmpl$12 = /* @__PURE__ */ template(`<patchwork-view>`, true, false, false), _tmpl$13 = /* @__PURE__ */ template(`<option>`);
+const LS_INDEX_KEY = "notebook-viewer-current-index";
+const LS_STEP_KEY = "notebook-viewer-step-size";
+const LS_STEP_MODE_KEY = "notebook-viewer-step-mode";
+const LS_TIME_UNIT_KEY = "notebook-viewer-time-unit";
+const LS_TIME_AMOUNT_KEY = "notebook-viewer-time-amount";
+const ALL_STEP_SIZES = [1, 5, 10, 25, 50, 100, 250, 500, 1e3, 2500, 5e3, 1e4];
+const TIME_UNIT_OPTIONS = [{
+  unit: "minutes",
+  label: "min",
+  amounts: [1, 5, 15, 30, 60],
+  msPerUnit: 60 * 1e3
+}, {
+  unit: "hours",
+  label: "hr",
+  amounts: [1, 2, 4, 6, 8, 12, 24],
+  msPerUnit: 60 * 60 * 1e3
+}, {
+  unit: "days",
+  label: "day",
+  amounts: [1, 2, 3, 5, 7],
+  msPerUnit: 24 * 60 * 60 * 1e3
+}, {
+  unit: "weeks",
+  label: "wk",
+  amounts: [1, 2, 4, 6, 13, 26, 52],
+  msPerUnit: 7 * 24 * 60 * 60 * 1e3
+}];
+const dateTimeFormatter = new Intl.DateTimeFormat("en-US", {
+  year: "numeric",
+  month: "long",
+  day: "numeric",
+  hour: "numeric",
+  minute: "2-digit",
+  hour12: true
+});
+function findNearestEntryIndex(entries, currentIdx, targetTimestamp, direction) {
+  if (direction === "back") {
+    for (let i = currentIdx - 1; i >= 0; i--) {
+      if (entries[i].timestamp <= targetTimestamp) return i;
+    }
+    return 0;
+  } else {
+    for (let i = currentIdx + 1; i < entries.length; i++) {
+      if (entries[i].timestamp >= targetTimestamp) return i;
+    }
+    return entries.length - 1;
+  }
+}
+function NotebookViewer(props) {
+  const historyDoc = makeDocumentProjection(props.handle);
+  const entries = createMemo(() => historyDoc.entries || []);
+  const totalEntries = createMemo(() => entries().length);
+  const historySpanMs = createMemo(() => {
+    const e = entries();
+    if (e.length < 2) return 0;
+    return e[e.length - 1].timestamp - e[0].timestamp;
+  });
+  const availableStepSizes = createMemo(() => {
+    const total = totalEntries();
+    return ALL_STEP_SIZES.filter((s) => s <= total);
+  });
+  const availableTimeAmounts = createMemo(() => {
+    const span = historySpanMs();
+    const result = {
+      minutes: [],
+      hours: [],
+      days: [],
+      weeks: []
+    };
+    for (const opt of TIME_UNIT_OPTIONS) {
+      result[opt.unit] = opt.amounts.filter((a) => a * opt.msPerUnit <= span);
+    }
+    return result;
+  });
+  const availableTimeUnits = createMemo(() => TIME_UNIT_OPTIONS.filter((opt) => availableTimeAmounts()[opt.unit].length > 0));
+  const savedIndexRaw = localStorage.getItem(LS_INDEX_KEY);
+  const hasSavedIndex = savedIndexRaw !== null;
+  const savedIndex = hasSavedIndex ? parseInt(savedIndexRaw, 10) : -1;
+  const savedStepSize = parseInt(localStorage.getItem(LS_STEP_KEY) || "1", 10);
+  const savedStepMode = localStorage.getItem(LS_STEP_MODE_KEY) || "entries";
+  const savedTimeUnit = localStorage.getItem(LS_TIME_UNIT_KEY) || "hours";
+  const savedTimeAmount = parseInt(localStorage.getItem(LS_TIME_AMOUNT_KEY) || "1", 10);
+  const [rawCurrentIndex, setRawCurrentIndex] = createSignal(hasSavedIndex && Number.isFinite(savedIndex) ? Math.max(0, savedIndex) : -1);
+  const [stepSize, setStepSize] = createSignal(Number.isFinite(savedStepSize) ? Math.max(1, savedStepSize) : 1);
+  const [stepMode, setStepMode] = createSignal(savedStepMode);
+  const [timeUnit, setTimeUnit] = createSignal(savedTimeUnit);
+  const [timeAmount, setTimeAmount] = createSignal(Number.isFinite(savedTimeAmount) ? Math.max(1, savedTimeAmount) : 1);
+  const currentIndex = createMemo(() => {
+    const total = totalEntries();
+    if (total === 0) return 0;
+    const raw = rawCurrentIndex();
+    if (raw < 0) return total - 1;
+    return Math.min(Math.max(0, raw), total - 1);
+  });
+  const currentEntry = createMemo(() => {
+    const e = entries();
+    const idx = currentIndex();
+    return e.length > 0 ? e[idx] : void 0;
+  });
+  const currentDateLabel = createMemo(() => {
+    const entry = currentEntry();
+    if (!entry) return "";
+    return dateTimeFormatter.format(new Date(entry.timestamp));
+  });
+  const viewDocUrl = createMemo(() => {
+    const entry = currentEntry();
+    if (!entry) return void 0;
+    if (entry.heads && entry.heads.length > 0) {
+      return `${entry.docUrl}#${entry.heads.join("|")}`;
+    }
+    return entry.docUrl;
+  });
+  const viewToolId = createMemo(() => currentEntry()?.toolId);
+  const viewKey = createMemo(() => {
+    const url = viewDocUrl();
+    const toolId = viewToolId();
+    return url ? `${url}-${toolId || "default"}` : void 0;
+  });
+  const canGoBack = createMemo(() => currentIndex() > 0);
+  const canGoForward = createMemo(() => {
+    const total = totalEntries();
+    return total > 0 && currentIndex() < total - 1;
+  });
+  const timeStepMs = createMemo(() => {
+    const unit = timeUnit();
+    const amount = timeAmount();
+    const opt = TIME_UNIT_OPTIONS.find((o) => o.unit === unit);
+    return opt ? amount * opt.msPerUnit : 0;
+  });
+  const goBack = () => {
+    if (stepMode() === "entries") {
+      setRawCurrentIndex(Math.max(0, currentIndex() - stepSize()));
+    } else {
+      const entry = currentEntry();
+      if (!entry) return;
+      const targetTs = entry.timestamp - timeStepMs();
+      const newIdx = findNearestEntryIndex(entries(), currentIndex(), targetTs, "back");
+      setRawCurrentIndex(newIdx);
+    }
+  };
+  const goForward = () => {
+    if (stepMode() === "entries") {
+      setRawCurrentIndex(Math.min(totalEntries() - 1, currentIndex() + stepSize()));
+    } else {
+      const entry = currentEntry();
+      if (!entry) return;
+      const targetTs = entry.timestamp + timeStepMs();
+      const newIdx = findNearestEntryIndex(entries(), currentIndex(), targetTs, "forward");
+      setRawCurrentIndex(newIdx);
+    }
+  };
+  const stepSizeSliderIndex = createMemo(() => {
+    const sizes = availableStepSizes();
+    const idx = sizes.indexOf(stepSize());
+    if (idx >= 0) return idx;
+    for (let i = sizes.length - 1; i >= 0; i--) {
+      if (sizes[i] <= stepSize()) return i;
+    }
+    return 0;
+  });
+  const updateStepSizeFromSlider = (sliderIndex) => {
+    const sizes = availableStepSizes();
+    const clamped = Math.max(0, Math.min(sliderIndex, sizes.length - 1));
+    setStepSize(sizes[clamped] || 1);
+  };
+  const currentTimeAmounts = createMemo(() => availableTimeAmounts()[timeUnit()] || []);
+  const timeAmountSliderIndex = createMemo(() => {
+    const amounts = currentTimeAmounts();
+    const idx = amounts.indexOf(timeAmount());
+    if (idx >= 0) return idx;
+    for (let i = amounts.length - 1; i >= 0; i--) {
+      if (amounts[i] <= timeAmount()) return i;
+    }
+    return 0;
+  });
+  const updateTimeAmountFromSlider = (sliderIndex) => {
+    const amounts = currentTimeAmounts();
+    const clamped = Math.max(0, Math.min(sliderIndex, amounts.length - 1));
+    setTimeAmount(amounts[clamped] || 1);
+  };
+  const timeStepLabel = createMemo(() => {
+    const amount = timeAmount();
+    const unit = timeUnit();
+    const opt = TIME_UNIT_OPTIONS.find((o) => o.unit === unit);
+    if (!opt) return "";
+    const label = amount === 1 ? opt.label : opt.label + "s";
+    return `${amount} ${label}`;
+  });
+  const goToFirst = () => setRawCurrentIndex(0);
+  const goToLatest = () => setRawCurrentIndex(totalEntries() - 1);
+  const [isPlaying, setIsPlaying] = createSignal(false);
+  const [playDirection, setPlayDirection] = createSignal("forward");
+  let playIntervalId;
+  const stopPlayback = () => {
+    setIsPlaying(false);
+    if (playIntervalId !== void 0) {
+      clearInterval(playIntervalId);
+      playIntervalId = void 0;
+    }
+  };
+  const togglePlayback = () => {
+    if (isPlaying()) {
+      stopPlayback();
+    } else {
+      setIsPlaying(true);
+      playIntervalId = window.setInterval(() => {
+        const dir = playDirection();
+        if (dir === "forward") {
+          if (!canGoForward()) {
+            stopPlayback();
+            return;
+          }
+          goForward();
+        } else {
+          if (!canGoBack()) {
+            stopPlayback();
+            return;
+          }
+          goBack();
+        }
+      }, 1e3);
+    }
+  };
+  onCleanup(stopPlayback);
+  const [showVersionDropdown, setShowVersionDropdown] = createSignal(false);
+  const hasHeads = createMemo(() => {
+    const entry = currentEntry();
+    return !!(entry && entry.heads && entry.heads.length > 0);
+  });
+  const openDocument = (useLatest) => {
+    const entry = currentEntry();
+    if (!entry) return;
+    let url;
+    if (useLatest || !entry.heads || entry.heads.length === 0) {
+      url = entry.docUrl;
+    } else {
+      url = `${entry.docUrl}#${entry.heads.join("|")}`;
+    }
+    props.element.dispatchEvent(new OpenDocumentEvent({
+      url,
+      toolId: entry.toolId
+    }));
+    setShowVersionDropdown(false);
+  };
+  const handleOpenDocClick = () => {
+    if (hasHeads()) {
+      setShowVersionDropdown((v) => !v);
+    } else {
+      openDocument(true);
+    }
+  };
+  const onClickOutside = (e) => {
+    const target = e.target;
+    if (!target.closest(".notebook-viewer-open-doc")) {
+      setShowVersionDropdown(false);
+    }
+  };
+  document.addEventListener("click", onClickOutside);
+  onCleanup(() => document.removeEventListener("click", onClickOutside));
+  const onKeyDown = (e) => {
+    const target = e.target;
+    if (target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.isContentEditable) {
+      return;
+    }
+    if (e.key === "ArrowLeft") {
+      e.preventDefault();
+      goBack();
+    } else if (e.key === "ArrowRight") {
+      e.preventDefault();
+      goForward();
+    }
+  };
+  document.addEventListener("keydown", onKeyDown);
+  onCleanup(() => document.removeEventListener("keydown", onKeyDown));
+  createEffect(() => localStorage.setItem(LS_INDEX_KEY, String(currentIndex())));
+  createEffect(() => localStorage.setItem(LS_STEP_KEY, String(stepSize())));
+  createEffect(() => localStorage.setItem(LS_STEP_MODE_KEY, stepMode()));
+  createEffect(() => localStorage.setItem(LS_TIME_UNIT_KEY, timeUnit()));
+  createEffect(() => localStorage.setItem(LS_TIME_AMOUNT_KEY, String(timeAmount())));
+  const stepDescription = createMemo(() => {
+    if (stepMode() === "entries") {
+      const s = stepSize();
+      return `${s} ${s === 1 ? "entry" : "entries"}`;
+    }
+    return timeStepLabel();
+  });
+  return (() => {
+    var _el$ = _tmpl$10();
+    insert(_el$, createComponent(Show, {
+      get when() {
+        return totalEntries() > 0;
+      },
+      get fallback() {
+        return _tmpl$11();
+      },
+      get children() {
+        return [(() => {
+          var _el$2 = _tmpl$3(), _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling, _el$6 = _el$5.nextSibling, _el$7 = _el$3.nextSibling;
+          _el$3.$$click = () => setPlayDirection((d) => d === "forward" ? "reverse" : "forward");
+          _el$7.$$click = togglePlayback;
+          insert(_el$7, createComponent(Show, {
+            get when() {
+              return !isPlaying();
+            },
+            get children() {
+              return _tmpl$();
+            }
+          }), null);
+          insert(_el$7, createComponent(Show, {
+            get when() {
+              return isPlaying();
+            },
+            get children() {
+              return _tmpl$2();
+            }
+          }), null);
+          createRenderEffect((_p$) => {
+            var _v$ = `Direction: ${playDirection()}`, _v$2 = `notebook-viewer-direction-option ${playDirection() === "reverse" ? "active" : ""}`, _v$3 = `notebook-viewer-direction-option ${playDirection() === "forward" ? "active" : ""}`, _v$4 = `notebook-viewer-direction-thumb ${playDirection() === "forward" ? "right" : "left"}`, _v$5 = isPlaying() ? "Pause" : "Play";
+            _v$ !== _p$.e && setAttribute(_el$3, "title", _p$.e = _v$);
+            _v$2 !== _p$.t && className(_el$4, _p$.t = _v$2);
+            _v$3 !== _p$.a && className(_el$5, _p$.a = _v$3);
+            _v$4 !== _p$.o && className(_el$6, _p$.o = _v$4);
+            _v$5 !== _p$.i && setAttribute(_el$7, "title", _p$.i = _v$5);
+            return _p$;
+          }, {
+            e: void 0,
+            t: void 0,
+            a: void 0,
+            o: void 0,
+            i: void 0
+          });
+          return _el$2;
+        })(), (() => {
+          var _el$0 = _tmpl$5(), _el$1 = _el$0.firstChild;
+          _el$1.$$click = handleOpenDocClick;
+          insert(_el$0, createComponent(Show, {
+            get when() {
+              return showVersionDropdown();
+            },
+            get children() {
+              var _el$10 = _tmpl$4(), _el$11 = _el$10.firstChild, _el$12 = _el$11.nextSibling;
+              _el$11.$$click = () => openDocument(true);
+              _el$12.$$click = () => openDocument(false);
+              return _el$10;
+            }
+          }), null);
+          return _el$0;
+        })(), (() => {
+          var _el$13 = _tmpl$6(), _el$14 = _el$13.firstChild, _el$15 = _el$14.nextSibling, _el$16 = _el$15.firstChild, _el$17 = _el$16.nextSibling, _el$18 = _el$17.nextSibling;
+          insert(_el$14, currentDateLabel);
+          _el$16.$$click = goToFirst;
+          _el$17.$$input = (e) => setRawCurrentIndex(parseInt(e.currentTarget.value, 10));
+          _el$18.$$click = goToLatest;
+          createRenderEffect(() => setAttribute(_el$17, "max", totalEntries() - 1));
+          createRenderEffect(() => _el$17.value = currentIndex());
+          return _el$13;
+        })(), (() => {
+          var _el$19 = _tmpl$7(), _el$20 = _el$19.firstChild, _el$21 = _el$20.nextSibling, _el$22 = _el$21.nextSibling;
+          _el$20.$$click = goBack;
+          insert(_el$21, createComponent(Show, {
+            get when() {
+              return viewKey();
+            },
+            keyed: true,
+            children: (_key) => (() => {
+              var _el$38 = _tmpl$12();
+              _el$38._$owner = getOwner();
+              createRenderEffect((_p$) => {
+                var _v$0 = viewDocUrl(), _v$1 = viewToolId();
+                _v$0 !== _p$.e && (_el$38.docUrl = _p$.e = _v$0);
+                _v$1 !== _p$.t && (_el$38.toolId = _p$.t = _v$1);
+                return _p$;
+              }, {
+                e: void 0,
+                t: void 0
+              });
+              return _el$38;
+            })()
+          }));
+          _el$22.$$click = goForward;
+          createRenderEffect((_p$) => {
+            var _v$6 = !canGoBack(), _v$7 = `Go back ${stepDescription()}`, _v$8 = !canGoForward(), _v$9 = `Go forward ${stepDescription()}`;
+            _v$6 !== _p$.e && (_el$20.disabled = _p$.e = _v$6);
+            _v$7 !== _p$.t && setAttribute(_el$20, "title", _p$.t = _v$7);
+            _v$8 !== _p$.a && (_el$22.disabled = _p$.a = _v$8);
+            _v$9 !== _p$.o && setAttribute(_el$22, "title", _p$.o = _v$9);
+            return _p$;
+          }, {
+            e: void 0,
+            t: void 0,
+            a: void 0,
+            o: void 0
+          });
+          return _el$19;
+        })(), (() => {
+          var _el$23 = _tmpl$1(), _el$24 = _el$23.firstChild, _el$25 = _el$24.firstChild, _el$31 = _el$24.nextSibling, _el$32 = _el$31.firstChild, _el$33 = _el$32.firstChild, _el$35 = _el$33.nextSibling;
+          _el$35.nextSibling;
+          var _el$36 = _el$32.nextSibling;
+          _el$25.addEventListener("change", (e) => setStepMode(e.currentTarget.value));
+          insert(_el$24, createComponent(Show, {
+            get when() {
+              return stepMode() === "time";
+            },
+            get children() {
+              var _el$26 = _tmpl$8();
+              _el$26.addEventListener("change", (e) => {
+                const unit = e.currentTarget.value;
+                setTimeUnit(unit);
+                const amounts = availableTimeAmounts()[unit];
+                if (amounts.length > 0 && !amounts.includes(timeAmount())) {
+                  setTimeAmount(amounts[0]);
+                }
+              });
+              insert(_el$26, createComponent(For, {
+                get each() {
+                  return availableTimeUnits();
+                },
+                children: (opt) => (() => {
+                  var _el$39 = _tmpl$13();
+                  insert(_el$39, () => opt.unit);
+                  createRenderEffect(() => _el$39.value = opt.unit);
+                  return _el$39;
+                })()
+              }));
+              createRenderEffect(() => _el$26.value = timeUnit());
+              return _el$26;
+            }
+          }), null);
+          insert(_el$24, createComponent(Show, {
+            get when() {
+              return stepMode() === "entries";
+            },
+            get children() {
+              return [(() => {
+                var _el$27 = _tmpl$9();
+                _el$27.$$input = (e) => updateStepSizeFromSlider(parseInt(e.currentTarget.value, 10));
+                createRenderEffect(() => setAttribute(_el$27, "max", Math.max(0, availableStepSizes().length - 1)));
+                createRenderEffect(() => _el$27.value = stepSizeSliderIndex());
+                return _el$27;
+              })(), (() => {
+                var _el$28 = _tmpl$0();
+                insert(_el$28, stepSize);
+                return _el$28;
+              })()];
+            }
+          }), null);
+          insert(_el$24, createComponent(Show, {
+            get when() {
+              return memo(() => stepMode() === "time")() && currentTimeAmounts().length > 0;
+            },
+            get children() {
+              return [(() => {
+                var _el$29 = _tmpl$9();
+                _el$29.$$input = (e) => updateTimeAmountFromSlider(parseInt(e.currentTarget.value, 10));
+                createRenderEffect(() => setAttribute(_el$29, "max", Math.max(0, currentTimeAmounts().length - 1)));
+                createRenderEffect(() => _el$29.value = timeAmountSliderIndex());
+                return _el$29;
+              })(), (() => {
+                var _el$30 = _tmpl$0();
+                insert(_el$30, timeStepLabel);
+                return _el$30;
+              })()];
+            }
+          }), null);
+          insert(_el$32, () => currentIndex() + 1, _el$35);
+          insert(_el$32, totalEntries, null);
+          insert(_el$36, () => currentEntry()?.docTitle);
+          createRenderEffect(() => _el$25.value = stepMode());
+          return _el$23;
+        })()];
+      }
+    }));
+    return _el$;
+  })();
+}
+const renderNotebookViewer = (handle, element) => render(() => createComponent(NotebookViewer, {
+  handle,
+  get repo() {
+    return element.repo;
+  },
+  element
+}), element);
+delegateEvents(["click", "input"]);
+export {
+  NotebookViewer,
+  renderNotebookViewer
+};
+//# sourceMappingURL=NotebookViewer-BkYJL6Jc.js.map