@kgdiff/viewer 0.4.0 → 0.6.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.
Files changed (257) hide show
  1. package/README.md +43 -16
  2. package/custom-elements.json +2347 -0
  3. package/dist/bind.d.ts +41 -0
  4. package/dist/bind.d.ts.map +1 -0
  5. package/dist/bind.js +47 -0
  6. package/dist/bind.js.map +1 -0
  7. package/dist/context.d.ts +42 -0
  8. package/dist/context.d.ts.map +1 -0
  9. package/dist/context.js +87 -0
  10. package/dist/context.js.map +1 -0
  11. package/dist/controller.d.ts +26 -237
  12. package/dist/controller.d.ts.map +1 -1
  13. package/dist/controller.js +33 -1484
  14. package/dist/controller.js.map +1 -1
  15. package/dist/dom.d.ts +10 -0
  16. package/dist/dom.d.ts.map +1 -1
  17. package/dist/dom.js +29 -0
  18. package/dist/dom.js.map +1 -1
  19. package/dist/element.d.ts +51 -42
  20. package/dist/element.d.ts.map +1 -1
  21. package/dist/element.js +381 -602
  22. package/dist/element.js.map +1 -1
  23. package/dist/elements/actions.d.ts +27 -0
  24. package/dist/elements/actions.d.ts.map +1 -0
  25. package/dist/elements/actions.js +81 -0
  26. package/dist/elements/actions.js.map +1 -0
  27. package/dist/elements/bound.d.ts +63 -0
  28. package/dist/elements/bound.d.ts.map +1 -0
  29. package/dist/elements/bound.js +213 -0
  30. package/dist/elements/bound.js.map +1 -0
  31. package/dist/elements/change-detail.d.ts +25 -0
  32. package/dist/elements/change-detail.d.ts.map +1 -0
  33. package/dist/elements/change-detail.js +19 -0
  34. package/dist/elements/change-detail.js.map +1 -0
  35. package/dist/elements/change-list.d.ts +27 -0
  36. package/dist/elements/change-list.d.ts.map +1 -0
  37. package/dist/elements/change-list.js +29 -0
  38. package/dist/elements/change-list.js.map +1 -0
  39. package/dist/elements/filters.d.ts +25 -0
  40. package/dist/elements/filters.d.ts.map +1 -0
  41. package/dist/elements/filters.js +19 -0
  42. package/dist/elements/filters.js.map +1 -0
  43. package/dist/elements/legend.d.ts +40 -0
  44. package/dist/elements/legend.d.ts.map +1 -0
  45. package/dist/elements/legend.js +87 -0
  46. package/dist/elements/legend.js.map +1 -0
  47. package/dist/elements/minimap.d.ts +38 -0
  48. package/dist/elements/minimap.d.ts.map +1 -0
  49. package/dist/elements/minimap.js +59 -0
  50. package/dist/elements/minimap.js.map +1 -0
  51. package/dist/elements/root.d.ts +40 -0
  52. package/dist/elements/root.d.ts.map +1 -0
  53. package/dist/elements/root.js +67 -0
  54. package/dist/elements/root.js.map +1 -0
  55. package/dist/elements/search.d.ts +29 -0
  56. package/dist/elements/search.d.ts.map +1 -0
  57. package/dist/elements/search.js +23 -0
  58. package/dist/elements/search.js.map +1 -0
  59. package/dist/elements/stage-context.d.ts +31 -0
  60. package/dist/elements/stage-context.d.ts.map +1 -0
  61. package/dist/elements/stage-context.js +4 -0
  62. package/dist/elements/stage-context.js.map +1 -0
  63. package/dist/elements/stage.d.ts +65 -0
  64. package/dist/elements/stage.d.ts.map +1 -0
  65. package/dist/elements/stage.js +259 -0
  66. package/dist/elements/stage.js.map +1 -0
  67. package/dist/elements/title.d.ts +25 -0
  68. package/dist/elements/title.d.ts.map +1 -0
  69. package/dist/elements/title.js +19 -0
  70. package/dist/elements/title.js.map +1 -0
  71. package/dist/elements/transport.d.ts +29 -0
  72. package/dist/elements/transport.d.ts.map +1 -0
  73. package/dist/elements/transport.js +24 -0
  74. package/dist/elements/transport.js.map +1 -0
  75. package/dist/elements/view-bound.d.ts +39 -0
  76. package/dist/elements/view-bound.d.ts.map +1 -0
  77. package/dist/elements/view-bound.js +88 -0
  78. package/dist/elements/view-bound.js.map +1 -0
  79. package/dist/elements/view-dock.d.ts +28 -0
  80. package/dist/elements/view-dock.d.ts.map +1 -0
  81. package/dist/elements/view-dock.js +28 -0
  82. package/dist/elements/view-dock.js.map +1 -0
  83. package/dist/elements/zoom.d.ts +28 -0
  84. package/dist/elements/zoom.d.ts.map +1 -0
  85. package/dist/elements/zoom.js +22 -0
  86. package/dist/elements/zoom.js.map +1 -0
  87. package/dist/i18n.d.ts +10 -0
  88. package/dist/i18n.d.ts.map +1 -1
  89. package/dist/i18n.js +20 -0
  90. package/dist/i18n.js.map +1 -1
  91. package/dist/icons.d.ts +1 -0
  92. package/dist/icons.d.ts.map +1 -1
  93. package/dist/icons.js +1 -0
  94. package/dist/icons.js.map +1 -1
  95. package/dist/index.d.ts +331 -36
  96. package/dist/index.d.ts.map +1 -1
  97. package/dist/index.js +13 -0
  98. package/dist/index.js.map +1 -1
  99. package/dist/keyboard.d.ts +39 -2
  100. package/dist/keyboard.d.ts.map +1 -1
  101. package/dist/keyboard.js +145 -62
  102. package/dist/keyboard.js.map +1 -1
  103. package/dist/layout-store.d.ts +26 -0
  104. package/dist/layout-store.d.ts.map +1 -0
  105. package/dist/layout-store.js +46 -0
  106. package/dist/layout-store.js.map +1 -0
  107. package/dist/panel-levels.d.ts +18 -0
  108. package/dist/panel-levels.d.ts.map +1 -0
  109. package/dist/panel-levels.js +41 -0
  110. package/dist/panel-levels.js.map +1 -0
  111. package/dist/panels.d.ts +28 -0
  112. package/dist/panels.d.ts.map +1 -0
  113. package/dist/panels.js +73 -0
  114. package/dist/panels.js.map +1 -0
  115. package/dist/pipeline.d.ts.map +1 -1
  116. package/dist/pipeline.js +3 -2
  117. package/dist/pipeline.js.map +1 -1
  118. package/dist/prefs.d.ts +5 -2
  119. package/dist/prefs.d.ts.map +1 -1
  120. package/dist/prefs.js +12 -3
  121. package/dist/prefs.js.map +1 -1
  122. package/dist/react.d.ts +460 -0
  123. package/dist/react.d.ts.map +1 -0
  124. package/dist/react.js +2 -0
  125. package/dist/react.js.map +1 -0
  126. package/dist/root-element.d.ts +122 -0
  127. package/dist/root-element.d.ts.map +1 -0
  128. package/dist/root-element.js +541 -0
  129. package/dist/root-element.js.map +1 -0
  130. package/dist/root.d.ts +54 -0
  131. package/dist/root.d.ts.map +1 -0
  132. package/dist/root.js +288 -0
  133. package/dist/root.js.map +1 -0
  134. package/dist/schedule.d.ts +22 -0
  135. package/dist/schedule.d.ts.map +1 -0
  136. package/dist/schedule.js +41 -0
  137. package/dist/schedule.js.map +1 -0
  138. package/dist/session.d.ts +269 -0
  139. package/dist/session.d.ts.map +1 -0
  140. package/dist/session.js +1237 -0
  141. package/dist/session.js.map +1 -0
  142. package/dist/standalone/kgdiff-viewer-compute.js +1 -1
  143. package/dist/standalone/kgdiff-viewer.js +4 -4
  144. package/dist/styles.d.ts +17 -6
  145. package/dist/styles.d.ts.map +1 -1
  146. package/dist/styles.js +367 -258
  147. package/dist/styles.js.map +1 -1
  148. package/dist/theme.d.ts +32 -0
  149. package/dist/theme.d.ts.map +1 -0
  150. package/dist/theme.js +152 -0
  151. package/dist/theme.js.map +1 -0
  152. package/dist/topics.d.ts +8 -0
  153. package/dist/topics.d.ts.map +1 -0
  154. package/dist/topics.js +18 -0
  155. package/dist/topics.js.map +1 -0
  156. package/dist/ui/change-list.d.ts +18 -0
  157. package/dist/ui/change-list.d.ts.map +1 -0
  158. package/dist/ui/change-list.js +331 -0
  159. package/dist/ui/change-list.js.map +1 -0
  160. package/dist/ui/context.d.ts +34 -7
  161. package/dist/ui/context.d.ts.map +1 -1
  162. package/dist/ui/context.js.map +1 -1
  163. package/dist/ui/filters.d.ts +9 -0
  164. package/dist/ui/filters.d.ts.map +1 -0
  165. package/dist/ui/filters.js +68 -0
  166. package/dist/ui/filters.js.map +1 -0
  167. package/dist/ui/header.d.ts +41 -3
  168. package/dist/ui/header.d.ts.map +1 -1
  169. package/dist/ui/header.js +101 -36
  170. package/dist/ui/header.js.map +1 -1
  171. package/dist/ui/legend.d.ts +15 -0
  172. package/dist/ui/legend.d.ts.map +1 -0
  173. package/dist/ui/legend.js +68 -0
  174. package/dist/ui/legend.js.map +1 -0
  175. package/dist/ui/popovers.d.ts +3 -1
  176. package/dist/ui/popovers.d.ts.map +1 -1
  177. package/dist/ui/popovers.js +62 -23
  178. package/dist/ui/popovers.js.map +1 -1
  179. package/dist/ui/search.d.ts +13 -0
  180. package/dist/ui/search.d.ts.map +1 -0
  181. package/dist/ui/search.js +192 -0
  182. package/dist/ui/search.js.map +1 -0
  183. package/dist/ui/sidebar.d.ts +32 -17
  184. package/dist/ui/sidebar.d.ts.map +1 -1
  185. package/dist/ui/sidebar.js +327 -519
  186. package/dist/ui/sidebar.js.map +1 -1
  187. package/dist/ui/stage.d.ts +56 -1
  188. package/dist/ui/stage.d.ts.map +1 -1
  189. package/dist/ui/stage.js +244 -256
  190. package/dist/ui/stage.js.map +1 -1
  191. package/dist/ui/swatch.js +1 -1
  192. package/dist/ui/swatch.js.map +1 -1
  193. package/dist/ui/transport.d.ts +12 -0
  194. package/dist/ui/transport.d.ts.map +1 -0
  195. package/dist/ui/transport.js +198 -0
  196. package/dist/ui/transport.js.map +1 -0
  197. package/dist/ui/zoom.d.ts +15 -0
  198. package/dist/ui/zoom.d.ts.map +1 -0
  199. package/dist/ui/zoom.js +30 -0
  200. package/dist/ui/zoom.js.map +1 -0
  201. package/dist/view.d.ts +94 -0
  202. package/dist/view.d.ts.map +1 -0
  203. package/dist/view.js +441 -0
  204. package/dist/view.js.map +1 -0
  205. package/package.json +95 -12
  206. package/src/bind.ts +80 -0
  207. package/src/context.ts +106 -0
  208. package/src/controller.ts +52 -1630
  209. package/src/dom.ts +30 -0
  210. package/src/element.ts +386 -619
  211. package/src/elements/actions.ts +94 -0
  212. package/src/elements/bound.ts +247 -0
  213. package/src/elements/change-detail.ts +34 -0
  214. package/src/elements/change-list.ts +51 -0
  215. package/src/elements/filters.ts +34 -0
  216. package/src/elements/legend.ts +103 -0
  217. package/src/elements/minimap.ts +75 -0
  218. package/src/elements/root.ts +86 -0
  219. package/src/elements/search.ts +38 -0
  220. package/src/elements/stage-context.ts +34 -0
  221. package/src/elements/stage.ts +285 -0
  222. package/src/elements/title.ts +34 -0
  223. package/src/elements/transport.ts +39 -0
  224. package/src/elements/view-bound.ts +118 -0
  225. package/src/elements/view-dock.ts +43 -0
  226. package/src/elements/zoom.ts +38 -0
  227. package/src/i18n.ts +20 -0
  228. package/src/icons.ts +1 -0
  229. package/src/index.ts +350 -35
  230. package/src/keyboard.ts +188 -61
  231. package/src/layout-store.ts +71 -0
  232. package/src/panel-levels.ts +53 -0
  233. package/src/panels.ts +81 -0
  234. package/src/pipeline.ts +4 -1
  235. package/src/prefs.ts +12 -4
  236. package/src/react.ts +459 -0
  237. package/src/root-element.ts +624 -0
  238. package/src/root.ts +335 -0
  239. package/src/schedule.ts +43 -0
  240. package/src/session.ts +1375 -0
  241. package/src/styles.ts +396 -263
  242. package/src/theme.ts +170 -0
  243. package/src/topics.ts +37 -0
  244. package/src/ui/change-list.ts +405 -0
  245. package/src/ui/context.ts +36 -7
  246. package/src/ui/filters.ts +79 -0
  247. package/src/ui/header.ts +129 -58
  248. package/src/ui/legend.ts +112 -0
  249. package/src/ui/popovers.ts +68 -25
  250. package/src/ui/search.ts +225 -0
  251. package/src/ui/sidebar.ts +362 -639
  252. package/src/ui/stage.ts +267 -331
  253. package/src/ui/swatch.ts +1 -1
  254. package/src/ui/transport.ts +240 -0
  255. package/src/ui/zoom.ts +45 -0
  256. package/src/view.ts +516 -0
  257. package/vscode.html-custom-data.json +726 -0
@@ -0,0 +1,726 @@
1
+ {
2
+ "version": 1.1,
3
+ "tags": [
4
+ {
5
+ "name": "kgdiff-viewer",
6
+ "description": {
7
+ "kind": "markdown",
8
+ "value": "The drop-in viewer: a root (`KgdiffRootElement`) with the default layout, the canvas with its chrome, the change list, the search, the filters and the detail panel.\n\n`header=\"compact\"` leaves the brand and the compared names out of the canvas, for hosts that show their own (such as the playground): the preset `panels=\"title:hidden\"`. `sidebar=\"closed\"` starts with the sidebar folded (`\\` and the sidebar button open it).\n\nA small looping replay for another page: `mode=\"replay\" chrome=\"none\" loop` (with a height of your choosing, such as 320px).\n\nThe canvas has the slots of `<kgdiff-stage>` (`top-start`, `top-end`, `bottom-start`, `bottom-center`, `bottom-end`; the top ones under the title and the actions while those show): a child with `slot=\"top-end\"` goes over the canvas, kept clear of fits and flights. A chrome element slotted in replaces the built-in region of its kind, the title and the actions included; `<kgdiff-zoom>` and `<kgdiff-minimap>` inside the viewer act on its canvas."
9
+ },
10
+ "attributes": [
11
+ {
12
+ "name": "mode",
13
+ "description": {
14
+ "kind": "markdown",
15
+ "value": "Reflected to the `mode` attribute. Default `overlay`."
16
+ },
17
+ "values": [
18
+ {
19
+ "name": "overlay"
20
+ },
21
+ {
22
+ "name": "swipe"
23
+ },
24
+ {
25
+ "name": "replay"
26
+ }
27
+ ]
28
+ },
29
+ {
30
+ "name": "scope",
31
+ "description": {
32
+ "kind": "markdown",
33
+ "value": "Reflected to the `scope` attribute. Default `all` (`changes` for large graphs). Fixed to `changes` when the layout covers only the changes."
34
+ },
35
+ "values": [
36
+ {
37
+ "name": "all"
38
+ },
39
+ {
40
+ "name": "changes"
41
+ }
42
+ ]
43
+ },
44
+ {
45
+ "name": "theme",
46
+ "description": {
47
+ "kind": "markdown",
48
+ "value": "Reflected to the `theme` attribute. Default `auto`."
49
+ },
50
+ "values": [
51
+ {
52
+ "name": "auto"
53
+ },
54
+ {
55
+ "name": "light"
56
+ },
57
+ {
58
+ "name": "dark"
59
+ }
60
+ ]
61
+ },
62
+ {
63
+ "name": "palette",
64
+ "description": {
65
+ "kind": "markdown",
66
+ "value": "Reflected to the `palette` attribute. Default `default`."
67
+ },
68
+ "values": [
69
+ {
70
+ "name": "default"
71
+ },
72
+ {
73
+ "name": "colorblind"
74
+ }
75
+ ]
76
+ },
77
+ {
78
+ "name": "locale",
79
+ "description": {
80
+ "kind": "markdown",
81
+ "value": "Reflected to the `locale` attribute. Default from `navigator.language`."
82
+ },
83
+ "values": [
84
+ {
85
+ "name": "en"
86
+ },
87
+ {
88
+ "name": "zh-CN"
89
+ }
90
+ ]
91
+ },
92
+ {
93
+ "name": "sync-hash",
94
+ "description": {
95
+ "kind": "markdown",
96
+ "value": "Keep the selection, mode and scope in the page's URL hash (`#kgdiff=hunk:<id>;mode:<mode>;scope:<scope>`) and follow it: deep links."
97
+ },
98
+ "valueSet": "v"
99
+ },
100
+ {
101
+ "name": "loop",
102
+ "description": {
103
+ "kind": "markdown",
104
+ "value": "Reflected to the boolean `loop` attribute. In `replay` mode the replay plays by itself and starts again `loopDelay` ms after it ends. `pause()` stops it until `play()`. Default false."
105
+ },
106
+ "valueSet": "v"
107
+ },
108
+ {
109
+ "name": "loop-delay",
110
+ "description": {
111
+ "kind": "markdown",
112
+ "value": "Reflected to `loop-delay`: ms between the end of a looping replay and its restart. Default 1200."
113
+ }
114
+ },
115
+ {
116
+ "name": "pause-on-hover",
117
+ "description": {
118
+ "kind": "markdown",
119
+ "value": "With `loop`, the replay pauses while the pointer is over the graph and continues when it leaves (a mouse or pen; not touch). Reflected as `pause-on-hover=\"false\"` when off. Default true."
120
+ },
121
+ "valueSet": "v"
122
+ },
123
+ {
124
+ "name": "shortcuts",
125
+ "description": {
126
+ "kind": "markdown",
127
+ "value": "Reflected to the `shortcuts` attribute: where the keyboard shortcuts apply. `scoped` (the default): while focus is inside the root, or in an element bound to it with `for` (those forward their keys). `global`: also when nothing on the page has focus (for full-page viewers such as HTML reports), for the first such root, except the keys pages scroll with (arrows, Home / End, Page Up / Down, Space); the boolean `global-shortcuts` attribute is an alias. `none`: no shortcuts (a focused change list keeps its arrow keys, Home / End and Enter)."
128
+ },
129
+ "values": [
130
+ {
131
+ "name": "scoped"
132
+ },
133
+ {
134
+ "name": "global"
135
+ },
136
+ {
137
+ "name": "none"
138
+ }
139
+ ]
140
+ },
141
+ {
142
+ "name": "keymap",
143
+ "description": {
144
+ "kind": "markdown",
145
+ "value": "**Experimental:** The shortcut names (`ShortcutName`) are new in 0.6. Single keys of the keyboard map bound to another shortcut, or unbound with `null`: `{ x: null, r: 'review' }`. The `keymap` attribute takes the same as text, `\"x:none r:review\"` (`Space` names the space bar). Keys are `KeyboardEvent.key` values; a letter stands for both its cases unless the other case is named too; keys not named keep the default map; entries naming no shortcut are ignored with a warning."
146
+ }
147
+ },
148
+ {
149
+ "name": "sidebar",
150
+ "description": {
151
+ "kind": "markdown",
152
+ "value": "A preset: `closed` starts with the sidebar folded (`\\` and the sidebar button open it), `open` with its four regions open. Reflects the sidebar's state once the user toggles it."
153
+ },
154
+ "values": [
155
+ {
156
+ "name": "open"
157
+ },
158
+ {
159
+ "name": "closed"
160
+ }
161
+ ]
162
+ },
163
+ {
164
+ "name": "header",
165
+ "description": {
166
+ "kind": "markdown",
167
+ "value": "A preset: `compact` leaves the brand and the compared names out of the canvas, for hosts that show their own (`panels=\"title:hidden\"`)."
168
+ },
169
+ "values": [
170
+ {
171
+ "name": "compact"
172
+ }
173
+ ]
174
+ },
175
+ {
176
+ "name": "chrome",
177
+ "description": {
178
+ "kind": "markdown",
179
+ "value": "Reflected to the `chrome` attribute. `none` shows the graph alone: no title, actions, view dock (with the step caption and playback bar), change list, zoom buttons, minimap or legend card; the hover tooltip and a one-line legend stay. Clicks and keyboard shortcuts do nothing, the minimum height drops from 420px to 120px, and the view stays fitted: when the canvas is resized (unless the user panned or zoomed since) and at the start of every loop. Labels are never cut at the edge: one pushed from its spot by a neighbour moves inside or is left out. Default `full`."
180
+ },
181
+ "values": [
182
+ {
183
+ "name": "full"
184
+ },
185
+ {
186
+ "name": "none"
187
+ }
188
+ ]
189
+ },
190
+ {
191
+ "name": "legend",
192
+ "description": {
193
+ "kind": "markdown",
194
+ "value": "Reflected to the `legend` attribute: `full` (the card), `mini` (one line: the families this diff has, then unchanged), `none`. Default `auto`: `full`, or `mini` with `chrome=\"none\"`."
195
+ },
196
+ "values": [
197
+ {
198
+ "name": "auto"
199
+ },
200
+ {
201
+ "name": "full"
202
+ },
203
+ {
204
+ "name": "mini"
205
+ },
206
+ {
207
+ "name": "none"
208
+ }
209
+ ]
210
+ },
211
+ {
212
+ "name": "panels",
213
+ "description": {
214
+ "kind": "markdown",
215
+ "value": "The page's declaration of panel states, reflected to the `panels` attribute: a string (`\"detail:collapsed minimap:hidden\"`) or an object (`{ detail: 'collapsed' }`); reading it gives the object. Regions not named keep their state; entries that name no region or state are ignored with a warning. It wins over what the user chose before (remembered) and a report's `view.panels`; the user can still open and close collapsed regions, and declaring the same again keeps what they did. The presets `sidebar=\"closed\"` (list, detail, search and filters collapsed), `header=\"compact\"` (title hidden) and `chrome=\"none\"` (everything but the canvas and the legend hidden) are panel states too; `panels` wins over them for the regions it names. The states every region has now are in `layout`."
216
+ }
217
+ },
218
+ {
219
+ "name": "persist",
220
+ "description": {
221
+ "kind": "markdown",
222
+ "value": "Reflected to the `persist` attribute. `local` (the default): the layout remembers the user's panel states, sizes, theme, palette and language in `localStorage` (under `persistKey`, shared by the viewers of the origin with the same key). `none`: it remembers nothing."
223
+ },
224
+ "values": [
225
+ {
226
+ "name": "local"
227
+ },
228
+ {
229
+ "name": "none"
230
+ }
231
+ ]
232
+ },
233
+ {
234
+ "name": "persist-key",
235
+ "description": {
236
+ "kind": "markdown",
237
+ "value": "Reflected to the `persist-key` attribute: the `localStorage` key the layout remembers under. Viewers with the same key share what they remember; give each app on a shared origin (a GitHub Pages user site, say) a key of its own. Default `kgdiff:viewer`."
238
+ }
239
+ },
240
+ {
241
+ "name": "global-shortcuts",
242
+ "description": {
243
+ "kind": "markdown",
244
+ "value": "The same as `shortcuts=\"global\"`."
245
+ },
246
+ "valueSet": "v"
247
+ }
248
+ ],
249
+ "references": [
250
+ {
251
+ "name": "Reference",
252
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-viewer"
253
+ }
254
+ ]
255
+ },
256
+ {
257
+ "name": "kgdiff-root",
258
+ "description": {
259
+ "kind": "markdown",
260
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). A root without visuals. It owns the session and provides it to the elements inside it (`<kgdiff-stage>`, `<kgdiff-change-list>`, …) or naming it with `for`, and owns what they share: the keyboard map, the live region announcing navigation, the events and the theme tokens. It has the attributes, properties, methods and events of `<kgdiff-viewer>` except the layout's (`panels`, `sidebar`, `header`, `chrome`, `legend`, `persist`): the page lays the elements out, and nothing is remembered.\n\nIt renders as `display: contents`, so its children are laid out by the page as if it were not there."
261
+ },
262
+ "attributes": [
263
+ {
264
+ "name": "mode",
265
+ "description": {
266
+ "kind": "markdown",
267
+ "value": "Reflected to the `mode` attribute. Default `overlay`."
268
+ },
269
+ "values": [
270
+ {
271
+ "name": "overlay"
272
+ },
273
+ {
274
+ "name": "swipe"
275
+ },
276
+ {
277
+ "name": "replay"
278
+ }
279
+ ]
280
+ },
281
+ {
282
+ "name": "scope",
283
+ "description": {
284
+ "kind": "markdown",
285
+ "value": "Reflected to the `scope` attribute. Default `all` (`changes` for large graphs). Fixed to `changes` when the layout covers only the changes."
286
+ },
287
+ "values": [
288
+ {
289
+ "name": "all"
290
+ },
291
+ {
292
+ "name": "changes"
293
+ }
294
+ ]
295
+ },
296
+ {
297
+ "name": "theme",
298
+ "description": {
299
+ "kind": "markdown",
300
+ "value": "Reflected to the `theme` attribute. Default `auto`."
301
+ },
302
+ "values": [
303
+ {
304
+ "name": "auto"
305
+ },
306
+ {
307
+ "name": "light"
308
+ },
309
+ {
310
+ "name": "dark"
311
+ }
312
+ ]
313
+ },
314
+ {
315
+ "name": "palette",
316
+ "description": {
317
+ "kind": "markdown",
318
+ "value": "Reflected to the `palette` attribute. Default `default`."
319
+ },
320
+ "values": [
321
+ {
322
+ "name": "default"
323
+ },
324
+ {
325
+ "name": "colorblind"
326
+ }
327
+ ]
328
+ },
329
+ {
330
+ "name": "locale",
331
+ "description": {
332
+ "kind": "markdown",
333
+ "value": "Reflected to the `locale` attribute. Default from `navigator.language`."
334
+ },
335
+ "values": [
336
+ {
337
+ "name": "en"
338
+ },
339
+ {
340
+ "name": "zh-CN"
341
+ }
342
+ ]
343
+ },
344
+ {
345
+ "name": "sync-hash",
346
+ "description": {
347
+ "kind": "markdown",
348
+ "value": "Keep the selection, mode and scope in the page's URL hash (`#kgdiff=hunk:<id>;mode:<mode>;scope:<scope>`) and follow it: deep links."
349
+ },
350
+ "valueSet": "v"
351
+ },
352
+ {
353
+ "name": "loop",
354
+ "description": {
355
+ "kind": "markdown",
356
+ "value": "Reflected to the boolean `loop` attribute. In `replay` mode the replay plays by itself and starts again `loopDelay` ms after it ends. `pause()` stops it until `play()`. Default false."
357
+ },
358
+ "valueSet": "v"
359
+ },
360
+ {
361
+ "name": "loop-delay",
362
+ "description": {
363
+ "kind": "markdown",
364
+ "value": "Reflected to `loop-delay`: ms between the end of a looping replay and its restart. Default 1200."
365
+ }
366
+ },
367
+ {
368
+ "name": "pause-on-hover",
369
+ "description": {
370
+ "kind": "markdown",
371
+ "value": "With `loop`, the replay pauses while the pointer is over the graph and continues when it leaves (a mouse or pen; not touch). Reflected as `pause-on-hover=\"false\"` when off. Default true."
372
+ },
373
+ "valueSet": "v"
374
+ },
375
+ {
376
+ "name": "shortcuts",
377
+ "description": {
378
+ "kind": "markdown",
379
+ "value": "Reflected to the `shortcuts` attribute: where the keyboard shortcuts apply. `scoped` (the default): while focus is inside the root, or in an element bound to it with `for` (those forward their keys). `global`: also when nothing on the page has focus (for full-page viewers such as HTML reports), for the first such root, except the keys pages scroll with (arrows, Home / End, Page Up / Down, Space); the boolean `global-shortcuts` attribute is an alias. `none`: no shortcuts (a focused change list keeps its arrow keys, Home / End and Enter)."
380
+ },
381
+ "values": [
382
+ {
383
+ "name": "scoped"
384
+ },
385
+ {
386
+ "name": "global"
387
+ },
388
+ {
389
+ "name": "none"
390
+ }
391
+ ]
392
+ },
393
+ {
394
+ "name": "keymap",
395
+ "description": {
396
+ "kind": "markdown",
397
+ "value": "**Experimental:** The shortcut names (`ShortcutName`) are new in 0.6. Single keys of the keyboard map bound to another shortcut, or unbound with `null`: `{ x: null, r: 'review' }`. The `keymap` attribute takes the same as text, `\"x:none r:review\"` (`Space` names the space bar). Keys are `KeyboardEvent.key` values; a letter stands for both its cases unless the other case is named too; keys not named keep the default map; entries naming no shortcut are ignored with a warning."
398
+ }
399
+ },
400
+ {
401
+ "name": "global-shortcuts",
402
+ "description": {
403
+ "kind": "markdown",
404
+ "value": "The same as `shortcuts=\"global\"`."
405
+ },
406
+ "valueSet": "v"
407
+ }
408
+ ],
409
+ "references": [
410
+ {
411
+ "name": "Reference",
412
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-root"
413
+ }
414
+ ]
415
+ },
416
+ {
417
+ "name": "kgdiff-stage",
418
+ "description": {
419
+ "kind": "markdown",
420
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). The canvas of the root it is bound to: the graph, the hover tooltip, the swipe divider, the replay caption and the canvas chrome (view dock, replay transport, legend, zoom buttons and minimap). Each stage is a view of its own: a root draws every stage bound to it, each with its own camera, sharing the selection, the hover, the filters and the search; `version` pins one to a version.\n\nFive named slots take the page's content over the canvas. The stage positions it (12–16 px from the edges, stacked further from the corner than the chrome there), and every slotted element is an obstacle: fits and flights frame the graph in the free part of the canvas. A chrome element slotted in replaces the built-in region of its kind; `panels` keeps applying to the rest. Content positioned some other way registers itself with `registerObstacle`, on the element or on the stage context (`kgdiff.stage/1`) it provides to its descendants."
421
+ },
422
+ "attributes": [
423
+ {
424
+ "name": "for",
425
+ "description": {
426
+ "kind": "markdown",
427
+ "value": "Reflects the `for` attribute, as on `<label>` and `<output>`: the id of the root to show, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
428
+ }
429
+ },
430
+ {
431
+ "name": "panels",
432
+ "description": {
433
+ "kind": "markdown",
434
+ "value": "The states of the built-in chrome (`dock`, `transport`, `legend`, `zoom`, `minimap`), reflected to the `panels` attribute, in the syntax of `<kgdiff-viewer>`'s `panels`: `\"minimap:hidden zoom:hidden\"` or `{ minimap: 'hidden' }`; reading it gives the object. Other regions are ignored with a warning. Default: all open, the legend collapsed."
435
+ }
436
+ },
437
+ {
438
+ "name": "version",
439
+ "description": {
440
+ "kind": "markdown",
441
+ "value": "Reflected to the `version` attribute: the version this stage draws whatever the root's mode, `before` or `after` (two stages of one root side by side), or null to follow the mode. Another value is ignored with a warning. Each stage has its own camera; the selection, hover, filters and search are the root's, so both bring the same change into view."
442
+ },
443
+ "values": [
444
+ {
445
+ "name": "before"
446
+ },
447
+ {
448
+ "name": "after"
449
+ }
450
+ ]
451
+ }
452
+ ],
453
+ "references": [
454
+ {
455
+ "name": "Reference",
456
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-stage"
457
+ }
458
+ ]
459
+ },
460
+ {
461
+ "name": "kgdiff-change-list",
462
+ "description": {
463
+ "kind": "markdown",
464
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). The \"Changes\" title with the count and review progress, and the changes grouped by phase (a virtualized listbox; `j` / `k` / `x`, Enter, Home / End). A labelled region. While a search is active (the session's query is not blank) its rows step aside. Registers itself as the root's `list` focus target (choosing a search result moves focus here)."
465
+ },
466
+ "attributes": [
467
+ {
468
+ "name": "for",
469
+ "description": {
470
+ "kind": "markdown",
471
+ "value": "Reflects the `for` attribute, as on `<label>` and `<output>`: the id of the root to show, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
472
+ }
473
+ }
474
+ ],
475
+ "references": [
476
+ {
477
+ "name": "Reference",
478
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-change-list"
479
+ }
480
+ ]
481
+ },
482
+ {
483
+ "name": "kgdiff-change-detail",
484
+ "description": {
485
+ "kind": "markdown",
486
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). The selected change, or the selected node: what changed first, then the unchanged rest; prev / next and the reviewed toggle. A labelled region."
487
+ },
488
+ "attributes": [
489
+ {
490
+ "name": "for",
491
+ "description": {
492
+ "kind": "markdown",
493
+ "value": "Reflects the `for` attribute, as on `<label>` and `<output>`: the id of the root to show, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
494
+ }
495
+ }
496
+ ],
497
+ "references": [
498
+ {
499
+ "name": "Reference",
500
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-change-detail"
501
+ }
502
+ ]
503
+ },
504
+ {
505
+ "name": "kgdiff-search",
506
+ "description": {
507
+ "kind": "markdown",
508
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). Node search, a combobox and the results list it owns (its `aria-controls` and `aria-activedescendant` stay inside the element). The results open below the box while the query is not blank; ↑ / ↓ move through them, Enter chooses one (its node and change are selected, and focus moves to the change list), Esc clears. The query lives in the session, so a change list bound to the same root steps aside meanwhile. Registers itself as the root's `search` focus target: `/` focuses the one registered last that is shown."
509
+ },
510
+ "attributes": [
511
+ {
512
+ "name": "for",
513
+ "description": {
514
+ "kind": "markdown",
515
+ "value": "Reflects the `for` attribute, as on `<label>` and `<output>`: the id of the root to show, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
516
+ }
517
+ }
518
+ ],
519
+ "references": [
520
+ {
521
+ "name": "Reference",
522
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-search"
523
+ }
524
+ ]
525
+ },
526
+ {
527
+ "name": "kgdiff-filters",
528
+ "description": {
529
+ "kind": "markdown",
530
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). One chip per kind of change the diff has, with its count and the legend's swatch, toggling the session's family filter, and \"Show all\" while a filter is on."
531
+ },
532
+ "attributes": [
533
+ {
534
+ "name": "for",
535
+ "description": {
536
+ "kind": "markdown",
537
+ "value": "Reflects the `for` attribute, as on `<label>` and `<output>`: the id of the root to show, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
538
+ }
539
+ }
540
+ ],
541
+ "references": [
542
+ {
543
+ "name": "Reference",
544
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-filters"
545
+ }
546
+ ]
547
+ },
548
+ {
549
+ "name": "kgdiff-view-dock",
550
+ "description": {
551
+ "kind": "markdown",
552
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). How the root's diff is viewed. The mode (overlay, swipe, replay; keys `1`–`3`) and \"Changes only\" (key `4`) with its context hops and the nearest \"+N\" expansion. Binds to a root like the other elements (`for`, `htmlFor`, `rootElement`). Slotted into a `<kgdiff-stage>` it replaces the stage's built-in dock; placed anywhere else it is not kept clear of fits and flights unless registered (`stage.registerObstacle`)."
553
+ },
554
+ "attributes": [
555
+ {
556
+ "name": "for",
557
+ "description": {
558
+ "kind": "markdown",
559
+ "value": "Reflects the `for` attribute, as on `<label>` and `<output>`: the id of the root to show, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
560
+ }
561
+ }
562
+ ],
563
+ "references": [
564
+ {
565
+ "name": "Reference",
566
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-view-dock"
567
+ }
568
+ ]
569
+ },
570
+ {
571
+ "name": "kgdiff-transport",
572
+ "description": {
573
+ "kind": "markdown",
574
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). The replay transport of the root's diff. Previous, play / pause, next, the scrubber with one tick per change, the position and the speed; at the end, \"Replay finished · Restart\" above it. Shown in replay mode only. Binds to a root (`for`, `htmlFor`, `rootElement`). Slotted into a `<kgdiff-stage>` (`slot=\"bottom-center\"`, say) it replaces the stage's built-in transport; placed anywhere else it is not kept clear of fits and flights unless registered. Importing this module defines it."
575
+ },
576
+ "attributes": [
577
+ {
578
+ "name": "for",
579
+ "description": {
580
+ "kind": "markdown",
581
+ "value": "Reflects the `for` attribute, as on `<label>` and `<output>`: the id of the root to show, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
582
+ }
583
+ }
584
+ ],
585
+ "references": [
586
+ {
587
+ "name": "Reference",
588
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-transport"
589
+ }
590
+ ]
591
+ },
592
+ {
593
+ "name": "kgdiff-legend",
594
+ "description": {
595
+ "kind": "markdown",
596
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). What the colors mean. `variant=\"full\"` (the default): a card of every family's swatch and name, folded to its head until opened; `open` reflects whether it is (the user's toggle included, as on `<details>`). `variant=\"mini\"`: one line of dots for the families the root's diff has, then the unchanged context. Binds to a root (`for`, `htmlFor`, `rootElement`). Slotted into a `<kgdiff-stage>` it replaces the stage's built-in legend; placed anywhere else it is not kept clear of fits and flights unless registered."
597
+ },
598
+ "attributes": [
599
+ {
600
+ "name": "for",
601
+ "description": {
602
+ "kind": "markdown",
603
+ "value": "Reflects the `for` attribute, as on `<label>` and `<output>`: the id of the root to show, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
604
+ }
605
+ },
606
+ {
607
+ "name": "variant",
608
+ "description": {
609
+ "kind": "markdown",
610
+ "value": "Reflected to `variant`: `full` (default) or `mini`; another value reads `full`."
611
+ },
612
+ "values": [
613
+ {
614
+ "name": "full"
615
+ },
616
+ {
617
+ "name": "mini"
618
+ }
619
+ ]
620
+ },
621
+ {
622
+ "name": "open",
623
+ "description": {
624
+ "kind": "markdown",
625
+ "value": "Reflected to the boolean `open`: whether the card is open (the user's toggle too)."
626
+ },
627
+ "valueSet": "v"
628
+ }
629
+ ],
630
+ "references": [
631
+ {
632
+ "name": "Reference",
633
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-legend"
634
+ }
635
+ ]
636
+ },
637
+ {
638
+ "name": "kgdiff-zoom",
639
+ "description": {
640
+ "kind": "markdown",
641
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). Zoom in, zoom out and fit, for one stage's view (the `+` / `−` / `f` keys act on every stage of the root). Binds to the nearest `<kgdiff-stage>` around it, or to the one `stage=\"<id>\"` names (`stage`, `stageElement`, `rootElement`). Slotted into a stage it replaces the stage's built-in zoom buttons; placed anywhere else it is not kept clear of fits and flights unless registered."
642
+ },
643
+ "attributes": [
644
+ {
645
+ "name": "stage",
646
+ "description": {
647
+ "kind": "markdown",
648
+ "value": "Reflects the `stage` attribute: the id of the stage to act on, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
649
+ }
650
+ }
651
+ ],
652
+ "references": [
653
+ {
654
+ "name": "Reference",
655
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-zoom"
656
+ }
657
+ ]
658
+ },
659
+ {
660
+ "name": "kgdiff-minimap",
661
+ "description": {
662
+ "kind": "markdown",
663
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). An overview of one stage's view, with the part in view outlined. While the whole graph is in view it has nothing to add: it is in the custom state `overview` then (`:state(overview)`, and the read-only `overview` property). A minimap the page places stays shown (`kgdiff-minimap:state(overview) { visibility: hidden }` hides it without moving the layout); one slotted into a stage replaces the stage's own and hides as it did. Binds to the nearest `<kgdiff-stage>` around it, or to the one `stage=\"<id>\"` names (`stage`, `stageElement`, `rootElement`). Slotted into a stage it replaces the stage's built-in minimap; placed anywhere else it is not kept clear of fits and flights unless registered."
664
+ },
665
+ "attributes": [
666
+ {
667
+ "name": "stage",
668
+ "description": {
669
+ "kind": "markdown",
670
+ "value": "Reflects the `stage` attribute: the id of the stage to act on, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
671
+ }
672
+ }
673
+ ],
674
+ "references": [
675
+ {
676
+ "name": "Reference",
677
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-minimap"
678
+ }
679
+ ]
680
+ },
681
+ {
682
+ "name": "kgdiff-title",
683
+ "description": {
684
+ "kind": "markdown",
685
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). The kgdiff mark and the root's compared names and versions. Binds to a root (`for`, `htmlFor`, `rootElement`). Slotted into a `<kgdiff-viewer>` it replaces the title over its canvas."
686
+ },
687
+ "attributes": [
688
+ {
689
+ "name": "for",
690
+ "description": {
691
+ "kind": "markdown",
692
+ "value": "Reflects the `for` attribute, as on `<label>` and `<output>`: the id of the root to show, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
693
+ }
694
+ }
695
+ ],
696
+ "references": [
697
+ {
698
+ "name": "Reference",
699
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-title"
700
+ }
701
+ ]
702
+ },
703
+ {
704
+ "name": "kgdiff-actions",
705
+ "description": {
706
+ "kind": "markdown",
707
+ "value": "**Experimental:** In 0.6; stable from 0.7 (RFC 0001, decision 7). The appearance menu (theme, color palette, language: the root's `theme`, `palette` and `locale`) and the keyboard shortcuts dialog, which `?` opens too. Binds to a root (`for`, `htmlFor`, `rootElement`); bound to a `<kgdiff-viewer>` it has the sidebar toggle too (a composed root has no sidebar). Slotted into a viewer it replaces the actions over its canvas."
708
+ },
709
+ "attributes": [
710
+ {
711
+ "name": "for",
712
+ "description": {
713
+ "kind": "markdown",
714
+ "value": "Reflects the `for` attribute, as on `<label>` and `<output>`: the id of the root to show, or '' (no attribute; setting '' removes it) for the nearest one around the element. Changing it binds again."
715
+ }
716
+ }
717
+ ],
718
+ "references": [
719
+ {
720
+ "name": "Reference",
721
+ "url": "https://github.com/iiwish/kgdiff/blob/main/docs/viewer-elements.md#kgdiff-actions"
722
+ }
723
+ ]
724
+ }
725
+ ]
726
+ }