@youtyan/code-viewer 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +22 -0
- package/README.md +39 -0
- package/package.json +54 -0
- package/web/app.js +1762 -0
- package/web/index.html +97 -0
- package/web/style.css +1584 -0
- package/web/vendor/README.md +12 -0
- package/web/vendor/diff2html/LICENSE.md +14 -0
- package/web/vendor/diff2html/diff2html-ui.min.js +1 -0
- package/web/vendor/diff2html/diff2html.min.css +1 -0
- package/web/vendor/highlight.js/LICENSE +29 -0
- package/web/vendor/highlight.js/highlight.min.js +1213 -0
- package/web/vendor/highlight.js/styles/github-dark.min.css +10 -0
- package/web/vendor/highlight.js/styles/github.min.css +10 -0
- package/web-src/server/git.ts +197 -0
- package/web-src/server/preview.ts +414 -0
- package/web-src/server/runtime.d.ts +40 -0
- package/web-src/types.ts +86 -0
package/web/index.html
ADDED
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
6
|
+
<title>git diff preview</title>
|
|
7
|
+
|
|
8
|
+
<!-- diff2html/highlight.js assets are vendored so the preview works offline
|
|
9
|
+
and does not make network requests from the browser. The highlighter JS is
|
|
10
|
+
loaded on demand from the toolbar. -->
|
|
11
|
+
<link rel="stylesheet" href="/vendor/diff2html/diff2html.min.css" />
|
|
12
|
+
<link rel="stylesheet" href="/vendor/highlight.js/styles/github.min.css" id="hljs-light" />
|
|
13
|
+
<link rel="stylesheet" href="/vendor/highlight.js/styles/github-dark.min.css" id="hljs-dark" disabled />
|
|
14
|
+
<script src="/vendor/diff2html/diff2html-ui.min.js"></script>
|
|
15
|
+
|
|
16
|
+
<link rel="stylesheet" href="/style.css" />
|
|
17
|
+
</head>
|
|
18
|
+
<body>
|
|
19
|
+
<div id="app">
|
|
20
|
+
<header id="topbar">
|
|
21
|
+
<div class="brand">
|
|
22
|
+
<span class="dot"></span>
|
|
23
|
+
<span class="title">git diff preview</span>
|
|
24
|
+
</div>
|
|
25
|
+
<div id="meta"></div>
|
|
26
|
+
<div class="ref-pickers">
|
|
27
|
+
<input class="ref-input" id="ref-from" placeholder="from…" autocomplete="off" />
|
|
28
|
+
<span class="ref-dots">…</span>
|
|
29
|
+
<input class="ref-input" id="ref-to" placeholder="to…" autocomplete="off" />
|
|
30
|
+
<button id="ref-apply" title="apply range (Enter)">→</button>
|
|
31
|
+
<button id="ref-reset" title="reset to HEAD .. worktree">×</button>
|
|
32
|
+
<button id="reload-prom" title="reload diff (R)">↻</button>
|
|
33
|
+
<button id="auto-reload" title="auto refresh every 3s">auto</button>
|
|
34
|
+
</div>
|
|
35
|
+
<div id="ref-popover" hidden>
|
|
36
|
+
<div class="rp-quick">
|
|
37
|
+
<button class="rp-chip" data-val="worktree">worktree</button>
|
|
38
|
+
<button class="rp-chip" data-val="HEAD">HEAD</button>
|
|
39
|
+
<button class="rp-chip" data-val="--staged">--staged</button>
|
|
40
|
+
</div>
|
|
41
|
+
<div class="rp-tabs" role="tablist">
|
|
42
|
+
<button class="rp-tab active" data-tab="commits">Commits</button>
|
|
43
|
+
<button class="rp-tab" data-tab="branches">Branches</button>
|
|
44
|
+
<button class="rp-tab" data-tab="tags">Tags</button>
|
|
45
|
+
</div>
|
|
46
|
+
<div class="rp-search-wrap">
|
|
47
|
+
<input class="rp-search" placeholder="filter…" autocomplete="off" />
|
|
48
|
+
</div>
|
|
49
|
+
<div class="rp-body"></div>
|
|
50
|
+
</div>
|
|
51
|
+
<div class="spacer"></div>
|
|
52
|
+
<div class="controls">
|
|
53
|
+
<input id="filter" type="search" placeholder="filter files…" />
|
|
54
|
+
<div class="seg" role="group" aria-label="layout">
|
|
55
|
+
<button data-layout="line-by-line" class="active">unified</button>
|
|
56
|
+
<button data-layout="side-by-side">split</button>
|
|
57
|
+
</div>
|
|
58
|
+
<button id="ignore-ws" title="ignore whitespace changes (-w)">ws</button>
|
|
59
|
+
<button id="syntax-highlight" title="syntax highlighting on">syntax on</button>
|
|
60
|
+
<button id="hide-tests" title="hide test files (test|spec)">no test</button>
|
|
61
|
+
<button id="theme" title="toggle theme">🌗</button>
|
|
62
|
+
<button id="collapse" title="collapse/expand all">▤</button>
|
|
63
|
+
<span id="status" class="status"></span>
|
|
64
|
+
</div>
|
|
65
|
+
</header>
|
|
66
|
+
|
|
67
|
+
<div id="load-bar" aria-hidden="true"></div>
|
|
68
|
+
|
|
69
|
+
<aside id="sidebar">
|
|
70
|
+
<div class="sb-head">
|
|
71
|
+
<span class="sb-title">Files</span>
|
|
72
|
+
<span id="totals"></span>
|
|
73
|
+
<div class="seg sb-view-seg" role="group" aria-label="view">
|
|
74
|
+
<button data-view="tree" class="active" title="tree view">tree</button>
|
|
75
|
+
<button data-view="flat" title="flat list">flat</button>
|
|
76
|
+
</div>
|
|
77
|
+
</div>
|
|
78
|
+
<div class="sb-filter-wrap">
|
|
79
|
+
<input id="sb-filter" type="search" placeholder="filter files… (/)" autocomplete="off" />
|
|
80
|
+
</div>
|
|
81
|
+
<ul id="filelist"></ul>
|
|
82
|
+
<div id="sidebar-resizer" aria-hidden="true"></div>
|
|
83
|
+
</aside>
|
|
84
|
+
|
|
85
|
+
<main id="content">
|
|
86
|
+
<div id="empty" class="empty hidden">
|
|
87
|
+
<div class="emoji">✨</div>
|
|
88
|
+
<h2>No changes</h2>
|
|
89
|
+
<p>The working tree is clean against this ref.</p>
|
|
90
|
+
</div>
|
|
91
|
+
<div id="diff"></div>
|
|
92
|
+
</main>
|
|
93
|
+
</div>
|
|
94
|
+
|
|
95
|
+
<script src="/app.js"></script>
|
|
96
|
+
</body>
|
|
97
|
+
</html>
|