kireji 0.9.0 → 0.11.0

package/README.md

@@ -1,7 +1,7 @@
 # Kireji - *Web Framework*
 > **<sub>Part of the Kireji Project</sub>**<br><sup><i>omnia ex una linea</i></sup>
 
-The **Kireji Web Framework** is a reactive full-stack web framework that can build and serve web apps and multi-origin web app ecosystems. It stores its runtime state in its routing system, achieving the information-theoretic lower bound of data compression. This enables comprehensive deep linking, session bookmarking without user accounts or local storage, peer-to-peer data sharing without uploads or accounts, and cross-origin communication without cookies or CORS.
+The **Kireji Web Framework** is a reactive full-stack web framework that can build and serve web apps and multi-origin web ecosystems. It stores its runtime state in its routing system, achieving the information-theoretic lower bound of data compression. This enables comprehensive deep linking, session bookmarking without user accounts or local storage, peer-to-peer data sharing without uploads or accounts, and cross-origin communication without cookies or CORS.
 ## The Kireji Project
 The Kireji Project poses a question: **What if we could treat every web page as a point in a unified, mathematically mapped space?**
 
@@ -9,11 +9,11 @@ The Kireji Project poses a question: **What if we could treat every web page as
 | ---- | -------
 | [MPHF](https://github.com/kireji-app/mphf#readme) | [Coordinate System<br><sup>A bijective coordinate system for hashing structured data</sup>](https://github.com/kireji-app/mphf#readme)
 | **Kireji** | **Web Framework - ★ You are here<br><sup>A reactive web framework with MPHF routing</sup>**
-| [Demo](https://github.com/kireji-app/demo#readme) | [App Ecosystem<br><sup>An example app ecosystem demonstrating the project](https://github.com/kireji-app/demo#readme)</sup>
+| [Demo](https://github.com/kireji-app/demo#readme) | [Ecosystem<br><sup>An example ecosystem demonstrating the project](https://github.com/kireji-app/demo#readme)</sup>
 
 ## Usage
 
-> <sub>Note: This framework is currently in alpha. Expect breaking changes with each version. Check out the [Demo App Ecosystem](https://github.com/kireji-app/demo#readme) to see a live project that uses this framework. Check back later to see if the framework has advanced into beta.</sub>
+> <sub>Note: This framework is currently in alpha. Expect breaking changes with each version. Check out the [Demo Ecosystem](https://github.com/kireji-app/demo#readme) to see a live project that uses this framework. Check back later to see if the framework has advanced into beta.</sub>
 
 ```bash
 # In an empty git repo.

package/package.json

@@ -1,6 +1,6 @@
 {
  "name": "kireji",
- "version": "0.9.0",
+ "version": "0.11.0",
  "description": "A web framework for stateful, entropy-perfect, multi-origin web applications. Currently in alpha. Expect breaking changes for version 0. Use with caution!",
  "files": [
   "src/",

package/src/app/kireji/description

@@ -1,4 +1,4 @@
-This application allows you to view all of the parts that define the Kireji Web Framework and the Demo App Ecosystem. It includes a sidebar pane and a property viewer pane.
+This application allows you to view all of the parts that define the Kireji Web Framework and the Demo Ecosystem. It includes a sidebar pane and a property viewer pane.
 
 By clicking on a part in the sidebar, you can view the properties of that part and its contribution - if any - to the minimal perfect hash function that provides the ecosystem's optimal state compression.
 

package/src/app/kireji/editor/sections/type.d.ts

@@ -3,6 +3,7 @@ declare interface IKirejiAppEditorSections
 
  // Subparts.
  readonly about: IKirejiAppEditorSection
+ readonly issues: IKirejiAppEditorSection
  readonly state: IKirejiAppEditorSection
  readonly stateSpace: IKirejiAppEditorSection
  readonly properties: IKirejiAppEditorSection

package/src/app/kireji/editor/tab-group/routeID-distribute.js

@@ -1,5 +1,8 @@
 tabGroup.updateRouteID(ROUTE_ID)
 
+if (SKIP_RUNTIME_STATE_DISTRIBUTION)
+ return
+
 // Extract the number of open tabs.
 const numberOfTabsOpen = (() => {
  let estimate = tabGroup.tabBitDepths[ROUTE_ID.toString(2).length]

package/src/app/kireji/issue-tracker/filters/apply.js

@@ -0,0 +1,29 @@
+const {
+ order: { by, descending },
+ priority,
+ status
+} = kirejiIssueFilters.model
+
+const key = by === "date" ? "key" : by
+
+return ISSUES
+ .filter(issue => status[issue.status] && priority[issue.priority.toLowerCase()])
+ .sort(({ [key]: a }, { [key]: b }) => {
+
+  // Logic: Handle the 'key' (timestamp) as a number
+  if (by === 'date') {
+   a = parseInt(a, 10)
+   b = parseInt(b, 10)
+  } else if (by === "title") {
+   a = a.toLowerCase()
+   b = b.toLowerCase()
+  }
+
+  if (a < b)
+   return descending ? 1 : -1
+
+  if (a > b)
+   return descending ? -1 : 1
+
+  return 0
+ })

package/src/app/kireji/issue-tracker/filters/boolean/part.json

@@ -0,0 +1,10 @@
+{
+ "abstract": true,
+ "extends": "boolean",
+ "methods": {
+  "point": [
+   "POINTER_EVENT",
+   "TARGET_ELEMENT"
+  ]
+ }
+}

package/src/app/kireji/issue-tracker/filters/boolean/point.js

@@ -0,0 +1,7 @@
+pointer.handle({
+ click() {
+  boolean.toggle()
+ },
+ POINTER_EVENT,
+ TARGET_ELEMENT
+})

package/src/app/kireji/issue-tracker/filters/boolean/view-update.js

@@ -0,0 +1 @@
+Q(`#issue-tracker_kireji_app .toggle-control.${boolean.key}`).setAttribute("data-state", boolean.model ? "enabled" : "disabled")

package/src/app/kireji/issue-tracker/filters/constants.js

@@ -0,0 +1,2 @@
+const kirejiIssueFilters = this
+const kirejiIssueTracker = kirejiIssueFilters[".."]

package/src/app/kireji/issue-tracker/filters/dropdown/constants.js

@@ -0,0 +1,2 @@
+const kirejiIssueFiltersDropdown = this
+const kirejiIssueFilters = kirejiIssueFiltersDropdown[".."]

package/src/app/kireji/issue-tracker/filters/dropdown/none/part.json

@@ -0,0 +1 @@
+{}

package/src/app/kireji/issue-tracker/filters/dropdown/part.html_.js

@@ -0,0 +1,15 @@
+const key = kirejiIssueFiltersDropdown.model
+
+switch (key) {
+ case "none":
+  return ""
+
+ case "priority":
+ case "status":
+  return `<div id=issue-filter-dropdown class="issue-filter-dropdown-${key}">` + kirejiIssueFilters[key].map(boolean => (
+   `<span ${boolean.pointAttr()} id="color-control" tabIndex=0 data-state="${boolean.model ? "enabled" : "disabled"}" class="toggle-control ${boolean.key}">` + (
+    `<span class="label">${key === "status" ? boolean.key : boolean.key.toUpperCase()}:</span><flex-spacer></flex-spacer>` +
+    `<span class="base"><span class="handle"></span></span>`
+   ) + "</span>"
+  )).join("") + "</div>"
+}

package/src/app/kireji/issue-tracker/filters/dropdown/part.json

@@ -0,0 +1,3 @@
+{
+ "extends": "match"
+}

package/src/app/kireji/issue-tracker/filters/dropdown/priority/part.json

@@ -0,0 +1 @@
+{}

package/src/app/kireji/issue-tracker/filters/dropdown/status/part.json

@@ -0,0 +1 @@
+{}

package/src/app/kireji/issue-tracker/filters/dropdown/type.d.ts

@@ -0,0 +1,12 @@
+declare interface IKirejiIssueFiltersDropdown
+ extends IMatch<IKirejiIssueFilters, IPartAny>,
+ IWebComponent {
+
+ // Subparts
+ readonly none: IPart<IKirejiIssueFiltersDropdown, null>
+ readonly order: IPart<IKirejiIssueFiltersDropdown, null>
+ readonly priority: IPart<IKirejiIssueFiltersDropdown, null>
+ readonly status: IPart<IKirejiIssueFiltersDropdown, null>
+}
+
+declare const kirejiIssueFiltersDropdown: IKirejiIssueFiltersDropdown

package/src/app/kireji/issue-tracker/filters/dropdown/view-update.js

@@ -0,0 +1,10 @@
+Q("#issue-filter-dropdown")?.remove()
+
+if (kirejiIssueFiltersDropdown.model === "none")
+ return
+
+Q(".issue-row.header").appendChild((() => {
+ const offscreen = document.createElement("div")
+ offscreen.innerHTML = kirejiIssueFiltersDropdown["part.html"]
+ return offscreen.querySelector("#issue-filter-dropdown")
+})())

package/src/app/kireji/issue-tracker/filters/order/by/date/part.json

@@ -0,0 +1 @@
+{}

package/src/app/kireji/issue-tracker/filters/order/by/part.json

@@ -0,0 +1,9 @@
+{
+ "extends": "match",
+ "order": [
+  "title",
+  "priority",
+  "status",
+  "date"
+ ]
+}

package/src/app/kireji/issue-tracker/filters/order/by/priority/part.json

@@ -0,0 +1 @@
+{}

package/src/app/kireji/issue-tracker/filters/order/by/status/part.json

@@ -0,0 +1 @@
+{}

package/src/app/kireji/issue-tracker/filters/order/by/title/part.json

@@ -0,0 +1 @@
+{}

package/src/app/kireji/issue-tracker/filters/order/by/type.d.ts

@@ -0,0 +1,11 @@
+declare interface IKirejiIssueFiltersOrderBy
+ extends IMatch<IKirejiIssueFilters, IPartAny> {
+
+ // Subparts
+ readonly date: IPart<IKirejiIssueFiltersOrderBy, null>
+ readonly priority: IPart<IKirejiIssueFiltersOrderBy, null>
+ readonly status: IPart<IKirejiIssueFiltersOrderBy, null>
+ readonly title: IPart<IKirejiIssueFiltersOrderBy, null>
+}
+
+declare const kirejiIssueFiltersOrderBy: IKirejiIssueFiltersOrderBy

package/src/app/kireji/issue-tracker/filters/order/by/view-update.js

@@ -0,0 +1,2 @@
+Q(".issue-row.header>[data-order]").removeAttribute("data-order")
+Q(`.issue-row.header>.issue-${match.arm.key}`).setAttribute("data-order", "")

package/src/app/kireji/issue-tracker/filters/order/descending/part.json

@@ -0,0 +1,3 @@
+{
+ "extends": "boolean"
+}

package/src/app/kireji/issue-tracker/filters/order/descending/view-update.js

@@ -0,0 +1,6 @@
+const orders = ["descending", "ascending"]
+
+if (boolean.model)
+ orders.reverse()
+
+Q(".issue-row.header").classList.replace(...orders)

package/src/app/kireji/issue-tracker/filters/order/part.json

@@ -0,0 +1,3 @@
+{
+ "extends": "mix"
+}

package/src/app/kireji/issue-tracker/filters/order/type.d.ts

@@ -0,0 +1,10 @@
+declare interface IKirejiIssueFiltersOrder
+ extends IMix<IKirejiIssueFilters, IPartAny>,
+ IWebComponent {
+
+ // Subparts
+ readonly by: IKirejiIssueFiltersOrderBy
+ readonly descending: IBoolean<IKirejiIssueFiltersOrder>
+}
+
+declare const kirejiIssueFiltersOrder: IKirejiIssueFiltersOrder

package/src/app/kireji/issue-tracker/filters/part.css

@@ -0,0 +1,149 @@
+#issue-tracker_kireji_app .header svg {
+ display: block;
+ fill: none;
+ stroke: var(--fg);
+ stroke-width: 2;
+ height: var(--spacing);
+ stroke-linecap: round;
+ stroke-linejoin: round;
+ padding: 0 calc(var(--spacing) / 4);
+}
+
+body.modern #issue-tracker_kireji_app .header>span {
+ padding-left: calc(var(--spacing) * 1.5);
+}
+
+body.vintage #issue-tracker_kireji_app .header svg {
+ padding: 4px;
+ box-shadow: var(--deep-outset);
+ height: calc(8px + var(--spacing));
+ /* Modified version of `--deep-inset`. */
+ box-shadow:
+  inset -1px -1px black,
+  inset 0 1px var(--bg-light-er),
+  inset -2px -2px var(--bg-dark),
+  inset 1px 2px var(--bg-light-est);
+}
+
+body.vintage #issue-tracker_kireji_app .header>:is(.issue-status, .issue-priority) {
+ box-shadow:
+  inset 0 -1px black,
+  inset 1px 1px var(--bg-light-er),
+  inset -1px -2px var(--bg-dark),
+  inset 2px 2px var(--bg-light-est);
+}
+
+body.modern #issue-tracker_kireji_app .header {
+ --border-color: var(--bg);
+ border-bottom: 1px solid var(--border-color);
+}
+
+body.modern.dark #issue-tracker_kireji_app .header {
+ --border-color: var(--bg-un-mode);
+}
+
+body.vintage #issue-tracker_kireji_app .header {
+ margin-right: var(--scrollbar-width);
+}
+
+body.vintage #issue-tracker_kireji_app .header>* {
+ box-shadow: var(--deep-outset);
+}
+
+body.vintage #issue-tracker_kireji_app .header>[data-order]::before {
+ margin-right: 2px;
+}
+
+#issue-tracker_kireji_app .header>[data-order]::before {
+ content: "▼";
+}
+
+#issue-tracker_kireji_app .header.ascending>[data-order]::before {
+ content: "▲";
+}
+
+body.modern #issue-tracker_kireji_app .header>span:not([data-order]) {
+ content: "";
+}
+
+body.modern #issue-tracker_kireji_app .header>span::before {
+ position: absolute;
+ left: 0;
+ width: calc(1.5 * var(--spacing));
+ text-align: center;
+}
+
+body.vintage #issue-tracker_kireji_app .header:has(.issue-filter-dropdown-status)>.issue-filter-status,
+body.vintage #issue-tracker_kireji_app .header:has(.issue-filter-dropdown-priority)>.issue-filter-priority,
+body.vintage #issue-tracker_kireji_app .header>.down {
+ box-shadow: inset 0 0 0 1px var(--bg-dark-er);
+ background: var(--bg-checker), white;
+ padding: 5px 3px 3px 5px;
+}
+
+body.vintage #issue-tracker_kireji_app .header>.down {
+ background: transparent;
+}
+
+#issue-tracker_kireji_app #issue-filter-dropdown {
+ position: absolute;
+ top: 100%;
+}
+
+body.vintage #issue-tracker_kireji_app .issue-filter-dropdown-status {
+ right: calc(7 * var(--spacing));
+}
+
+body.vintage #issue-tracker_kireji_app .issue-filter-dropdown-priority {
+ right: 160px;
+}
+
+body.modern #issue-tracker_kireji_app .issue-filter-dropdown-status {
+ right: calc(7 * var(--spacing));
+}
+
+body.modern #issue-tracker_kireji_app .issue-filter-dropdown-priority {
+ right: calc(13 * var(--spacing));
+}
+
+#issue-tracker_kireji_app #issue-filter-dropdown {
+ background-color: var(--bg);
+ z-index: 1000;
+}
+
+body.vintage.dark #issue-tracker_kireji_app #issue-filter-dropdown {
+ background-color: var(--bg-dark);
+}
+
+body.modern #issue-tracker_kireji_app #issue-filter-dropdown {
+ padding: var(--spacing);
+ border-radius: calc(var(--spacing) / 2)
+}
+
+#issue-tracker_kireji_app:has(#issue-filter-dropdown) .issue-table {
+ pointer-events: none;
+}
+
+body.vintage #issue-tracker_kireji_app .header:after {
+ position: absolute;
+ right: calc(var(--scrollbar-width) * -1);
+ top: 0;
+ bottom: 0;
+ width: var(--scrollbar-width);
+ box-shadow: var(--deep-outset);
+ pointer-events: none;
+ content: "";
+}
+
+body.vintage #issue-tracker_kireji_app .header>:is(.issue-priority, .issue-status) {
+ width: calc(var(--column-width) - var(--spacing) - 8px);
+}
+
+body.modern #issue-tracker_kireji_app .header>:is(.issue-priority, .issue-status) {
+ width: calc(var(--column-width) - calc(1.5 * var(--spacing)));
+ text-align: center;
+}
+
+body.modern #issue-tracker_kireji_app .header>span:not(.issue-title) {
+ box-shadow: inset 0.5px 0 0 var(--border-color), -0.5px 0 0 var(--border-color);
+}

package/src/app/kireji/issue-tracker/filters/part.html_.js

@@ -1,6 +1,13 @@
+const filterIcon = key => `<svg ${kirejiIssueFilters.pointAttr()} viewBox="0 0 24 24" class="issue-filter-${key}"><polygon points="22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3"></polygon></svg>`
+const { by, descending } = kirejiIssueFilters.order.model
+const dropdown = kirejiIssueFilters.dropdown.model
+
 return (
- "<section class=issue-filters>" + (
-  "<h2>Filters</h2>" +
-  "<p>Filter controls will go here</p>"
+ `<section class="issue-row header ${descending ? "descending" : "ascending"}">` + (
+  `<span ${kirejiIssueFilters.pointAttr()} class="issue-title"${by === "title" ? " data-order" : ""}>Issue</span>` +
+  `<span ${kirejiIssueFilters.pointAttr()} class="issue-priority"${by === "priority" ? " data-order" : ""} title="Priority">!</span>${filterIcon("priority")}` +
+  `<span ${kirejiIssueFilters.pointAttr()} class="issue-status"${by === "status" ? " data-order" : ""}>Status</span>${filterIcon("status")}` +
+  `<span ${kirejiIssueFilters.pointAttr()} class="issue-date"${by === "date" ? " data-order" : ""}>Created</span>` +
+  kirejiIssueFilters.dropdown["part.html"]
  ) + "</section>"
 )

package/src/app/kireji/issue-tracker/filters/part.json

@@ -1,3 +1,12 @@
 {
- "extends": "mix"
+ "extends": "mix",
+ "methods": {
+  "apply": [
+   "ISSUES"
+  ],
+  "point": [
+   "POINTER_EVENT",
+   "TARGET_ELEMENT"
+  ]
+ }
 }

package/src/app/kireji/issue-tracker/filters/point.js

@@ -0,0 +1,27 @@
+pointer.handle({
+ click() {
+  if (TARGET_ELEMENT.hasAttribute("data-order")) {
+   kirejiIssueFilters.order.descending.toggle()
+   return
+  }
+
+  const className = TARGET_ELEMENT.classList.values().find(className => className.startsWith("issue-"))
+
+  if (!className)
+   throw "Unexpected item passed to issue filter's pointer handler."
+
+  const key = className.split("-").pop()
+
+  if (className.includes("filter")) {
+   if (kirejiIssueFilters.dropdown.model === key)
+    kirejiIssueFilters.dropdown.setModel("none")
+   else
+    kirejiIssueFilters.dropdown.setModel(key)
+  } else {
+   kirejiIssueFilters.order.descending.clear()
+   kirejiIssueFilters.order.by.setModel(key)
+  }
+ },
+ TARGET_ELEMENT,
+ POINTER_EVENT
+})

package/src/app/kireji/issue-tracker/filters/priority/a/part.json

@@ -0,0 +1,3 @@
+{
+ "extends": "boolean..."
+}

package/src/app/kireji/issue-tracker/filters/priority/b/part.json

@@ -0,0 +1,3 @@
+{
+ "extends": "boolean..."
+}

package/src/app/kireji/issue-tracker/filters/priority/c/part.json

@@ -0,0 +1,3 @@
+{
+ "extends": "boolean..."
+}

package/src/app/kireji/issue-tracker/filters/priority/part.json

@@ -0,0 +1,3 @@
+{
+ "extends": "mix"
+}

package/src/app/kireji/issue-tracker/filters/priority/type.d.ts

@@ -0,0 +1,11 @@
+declare interface IKirejiIssueFiltersPriority
+ extends IMix<IKirejiIssueFilters, IBoolean<IKirejiIssueFiltersPriority>>,
+ IWebComponent {
+
+ // Subparts
+ readonly a: IBoolean<IKirejiIssueFiltersPriority>
+ readonly b: IBoolean<IKirejiIssueFiltersPriority>
+ readonly c: IBoolean<IKirejiIssueFiltersPriority>
+}
+
+declare const kirejiIssueFiltersPriority: IKirejiIssueFiltersPriority

package/src/app/kireji/issue-tracker/filters/status/doing/part.json

@@ -0,0 +1,3 @@
+{
+ "extends": "boolean..."
+}

package/src/app/kireji/issue-tracker/filters/status/done/part.json

@@ -0,0 +1,3 @@
+{
+ "extends": "boolean..."
+}

package/src/app/kireji/issue-tracker/filters/status/part.json

@@ -0,0 +1,8 @@
+{
+ "extends": "mix",
+ "order": [
+  "to-do",
+  "doing",
+  "done"
+ ]
+}

package/src/app/kireji/issue-tracker/filters/status/to-do/part.json

@@ -0,0 +1,3 @@
+{
+ "extends": "boolean..."
+}

package/src/app/kireji/issue-tracker/filters/status/type.d.ts

@@ -0,0 +1,11 @@
+declare interface IKirejiIssueFiltersStatus
+ extends IMix<IKirejiIssueFilters, IPartAny>,
+ IWebComponent {
+
+ // Subparts
+ readonly a: IBoolean<IKirejiIssueFiltersPriority>
+ readonly b: IBoolean<IKirejiIssueFiltersPriority>
+ readonly c: IBoolean<IKirejiIssueFiltersPriority>
+}
+
+declare const kirejiIssueFiltersStatus: IKirejiIssueFiltersStatus

package/src/app/kireji/issue-tracker/filters/type.d.ts

@@ -1,6 +1,17 @@
 declare interface IKirejiIssueFilters
- extends IMix<IKirejiIssueTrackerApp, IPartAny> {
+ extends IMix<IKirejiIssueTrackerApp, IPartAny>,
+ IWebComponent {
 
+ // Subparts
+ readonly dropdown: IKirejiIssueFiltersDropdown
+ readonly order: IKirejiIssueFiltersOrder
+ readonly priority: IKirejiIssueFiltersPriority
+ readonly status: IKirejiIssueFiltersStatus
+
+ // Serialized Properties.
+ readonly apply(ISSUES: IKirejiIssues): IKirejiIssue[]
 }
 
-declare const kirejiIssueFilters: IKirejiIssueFilters
+declare const kirejiIssueFilters: IKirejiIssueFilters
+/** The incoming argument for the kireji issue filter `apply()` method. */
+declare const ISSUES: IKirejiIssues

package/src/app/kireji/issue-tracker/filters/view-hydrate.js

@@ -0,0 +1,15 @@
+client.promise.then(() => {
+
+ document.addEventListener('pointerdown', pointerEvent => {
+  const key = kirejiIssueFilters.dropdown.model
+  if (key !== "none" && !inRect(pointerEvent, Q("#issue-filter-dropdown").getBoundingClientRect())) {
+
+   if (inRect(pointerEvent, Q("#issue-tracker_kireji_app .issue-table").getBoundingClientRect()) || inRect(pointerEvent, Q(`#issue-tracker_kireji_app .header>.issue-filter-${key}`).getBoundingClientRect())) {
+    pointerEvent.stopPropagation()
+    pointerEvent.preventDefault()
+   }
+
+   kirejiIssueFilters.dropdown.setModel("none")
+  }
+ }, { capture: true })
+})

package/src/app/kireji/issue-tracker/filters/view-update.js

@@ -0,0 +1 @@
+Q(".issue-table>scroller->scroll-content").innerHTML = kirejiIssueTracker["issues.html"]

package/src/app/kireji/issue-tracker/issues.html_.js

@@ -0,0 +1 @@
+return kirejiIssueFilters.apply(kirejiIssueSections.issues).map(issue => issue["card.html"]).join("\n  ")

package/src/app/kireji/issue-tracker/part.css_.js

@@ -1 +1 @@
-return kirejiIssueTracker.scroller["part.css"] + kirejiIssueTracker["static.css"]
+return kirejiIssueTracker.scroller["part.css"] + kirejiIssueFilters["part.css"] + kirejiIssueTracker["static.css"]

package/src/app/kireji/issue-tracker/part.html_.js

@@ -1,5 +1,4 @@
 return kirejiIssueFilters["part.html"] + (
- // TODO: use filters here
- "<section class=issue-table>" + kirejiIssueTracker.scroller.wrap(kirejiIssueSections.issues.map(issue => issue["card.html"]).join("\n  ")) + "</section>" +
+ "<section class=issue-table>" + kirejiIssueTracker.scroller.wrap(kirejiIssueTracker["issues.html"]) + "</section>" +
  `<section id=kireji-issue-modal>${kirejiIssueSections.arm["part.html"] ?? ""}</section>`
 )

package/src/app/kireji/issue-tracker/pathname-translate-canonical.js

@@ -11,9 +11,6 @@ if (!("kireji" in model.app))
 if (!("issue-tracker" in model.app.kireji))
  model.app.kireji["issue-tracker"] = {}
 
-// todo: add scroller
-// model.app.kireji["issue-tracker"].scroller = 0
-
 if (PATHNAME === "/") {
 
  if (HASH !== "#top")

package/src/app/kireji/issue-tracker/sections/issues/1776193480/title

@@ -1 +1 @@
-Add Issue Tracker App
+Create Issue Tracker App

package/src/app/kireji/issue-tracker/sections/issues/1776205544/links_.js

@@ -0,0 +1 @@
+return [kirejiIssues[1776208669]]

package/src/app/kireji/issue-tracker/sections/issues/1776208669/links_.js

@@ -0,0 +1 @@
+return [kirejiIssues[1776205544]]

package/src/app/kireji/issue-tracker/sections/issues/1776208910/description

@@ -1 +1,7 @@
-Add alt attributes for all images. Allow deep zoom for low-vision users. Headings shouldn't skip levels (for example, an h4 appearing after an h1 with no h2 or h3 in-between).
+Add alt attributes for all images. Allow deep zoom for low-vision users. Headings shouldn't skip levels (for example, an h4 appearing after an h1 with no h2 or h3 in-between).
+
+Do a full pass on all apps examining their tab behavior. Consider assigning tabindex=0 to all and only the first primary element of each region that the user should be able to tab between. For example, having only the first item of a list of icons be tabbable. Then, perhaps try "moving" that tabindex attribute to other items in the same set when other keyboard keys are used (such as arrow keys).
+
+Can the keyboard be used to control each app? What is it like to work with apps without a pointing device?
+
+What do apps sound like when spoken aloud by a screen reader?

package/src/app/kireji/issue-tracker/sections/issues/1776209115/links_.js

@@ -0,0 +1,3 @@
+return [
+ kirejiIssues[1776263309],
+]

package/src/app/kireji/issue-tracker/sections/issues/1776211364/description

@@ -1 +1 @@
-After the implementation of dynamic instancing, but before cross-origin PWA, implement restored windows on desktop.parts. Consider having other hosts in the demo app ecosystem forward back to desktop.parts. Restored windows have their own subpermutation over the pinned (task bar) apps permutation. Note: an open app is actually just an app which is pinned to the task bar, but only those pinned apps can be viewed. These pinned tasks should be able to be reordered by dragging and dropping. Title bars should have a restore button. The desktop application should become an abstract which can be extended to create a desktop at any address so that framework users can implement all of their apps in a single domain if they want. Consider a "maximized on open" setting (or, conversely, a default window state) so that apps which are not currently pinned are opened into the given configuration as they are pinned. Forwarding all domains to the desktop (while pinning the apps that were just visited, especially if pinned maximized) would eliminate cross-origin full-screen and PWA problems. Consider if full-screened apps should have taskbar and titlebar visible. The presentation of sites on first visit should be considered - users won't know that it is an overall desktop they are visiting or this could distract them from the specific domain's intended content. Canonical links and SEO per-domain must still be handled correctly. Consider if an unopened task can be dragged from the menu and/or desktop in order to open it (pin and view it). Restored windows should be movable and resizable.
+After the implementation of dynamic instancing, but before cross-origin PWA, implement restored windows on desktop.parts. Consider having other hosts in the Demo Ecosystem forward back to desktop.parts. Restored windows have their own subpermutation over the pinned (task bar) apps permutation. Note: an open app is actually just an app which is pinned to the task bar, but only those pinned apps can be viewed. These pinned tasks should be able to be reordered by dragging and dropping. Title bars should have a restore button. The desktop application should become an abstract which can be extended to create a desktop at any address so that framework users can implement all of their apps in a single domain if they want. Consider a "maximized on open" setting (or, conversely, a default window state) so that apps which are not currently pinned are opened into the given configuration as they are pinned. Forwarding all domains to the desktop (while pinning the apps that were just visited, especially if pinned maximized) would eliminate cross-origin full-screen and PWA problems. Consider if full-screened apps should have taskbar and titlebar visible. The presentation of sites on first visit should be considered - users won't know that it is an overall desktop they are visiting or this could distract them from the specific domain's intended content. Canonical links and SEO per-domain must still be handled correctly. Consider if an unopened task can be dragged from the menu and/or desktop in order to open it (pin and view it). Restored windows should be movable and resizable.