@lincyaw/dsh 0.0.0-stage → 0.2.0-rc.0

package/src/client/frame.css

@@ -0,0 +1,505 @@
+html,
+body,
+#root {
+  height: 100%;
+}
+
+.pmw-frame {
+  position: relative;
+  display: grid;
+  grid-template-rows: auto minmax(0, 1fr) auto;
+  grid-template-areas:
+    'appbar'
+    'panels'
+    'bottom';
+  grid-template-columns: minmax(0, 1fr);
+  height: 100%;
+  overflow: hidden;
+  background: var(--pm-color-chrome);
+  color: var(--pm-color-ink);
+}
+
+.pmw-frame__skip {
+  position: absolute;
+  z-index: 30;
+  top: var(--pm-space-1);
+  left: var(--pm-space-1);
+  padding: var(--pm-space-2) var(--pm-space-3);
+  border-radius: var(--pm-radius-control);
+  background: var(--pm-color-surface);
+  color: var(--pm-color-accent);
+  transform: translateY(-200%);
+}
+
+.pmw-frame__skip:focus {
+  transform: none;
+}
+
+/* The app bar across the top: the brand, where the author is, and the commands of the whole workbench. */
+
+.pmw-appbar {
+  grid-area: appbar;
+  display: flex;
+  align-items: center;
+  gap: var(--pm-space-px);
+  min-width: 0;
+  height: var(--pm-appbar-height);
+  padding: 0 var(--pm-space-2) 0 var(--pm-space-3);
+  border-bottom: var(--pm-size-hairline) solid var(--pm-color-line);
+  background: var(--pm-color-chrome);
+  font-size: var(--pm-text-sm);
+}
+
+.pmw-appbar__brand {
+  display: inline-flex;
+  flex: none;
+  align-items: center;
+  gap: var(--pm-space-2);
+  margin-right: var(--pm-space-3);
+  font-size: var(--pm-text-md);
+}
+
+.pmw-appbar__places {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.pmw-appbar__places > li {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+}
+
+.pmw-appbar__places > li + li::before {
+  flex: none;
+  margin: 0 var(--pm-space-px);
+  color: var(--pm-color-line-strong);
+  content: '/';
+}
+
+.pmw-appbar__place,
+.pmw-appbar__button {
+  box-sizing: border-box;
+  position: relative;
+  display: inline-flex;
+  flex: none;
+  align-items: center;
+  gap: var(--pm-space-1);
+  height: var(--pm-size-tool);
+  min-width: var(--pm-size-tool);
+  margin: 0;
+  padding: 0 var(--pm-space-2);
+  border: var(--pm-size-hairline) solid transparent;
+  border-radius: var(--pm-radius-tool);
+  background: none;
+  color: var(--pm-color-muted);
+  font: inherit;
+  white-space: nowrap;
+  cursor: pointer;
+}
+
+.pmw-appbar__place {
+  flex: 0 1 auto;
+}
+
+.pmw-appbar__label {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.pmw-appbar__place[aria-current] {
+  color: var(--pm-color-ink);
+  font-weight: 600;
+}
+
+span.pmw-appbar__place {
+  cursor: default;
+}
+
+.pmw-appbar__place:is(button):hover,
+.pmw-appbar__button:hover {
+  background: var(--pm-color-hover);
+  color: var(--pm-color-ink);
+}
+
+.pmw-appbar__button[aria-pressed='true'] {
+  border-color: var(--pm-color-accent-line);
+  background: var(--pm-color-selected);
+  color: var(--pm-color-accent);
+}
+
+.pmw-appbar__place:focus-visible,
+.pmw-appbar__button:focus-visible {
+  outline: var(--pm-size-stroke) solid var(--pm-color-accent);
+  outline-offset: var(--pm-size-hairline);
+}
+
+.pmw-appbar__divider {
+  flex: none;
+  width: var(--pm-size-hairline);
+  height: var(--pm-size-divider);
+  margin: 0 var(--pm-space-1);
+  background: var(--pm-color-line);
+}
+
+.pmw-appbar__approvals {
+  display: inline-flex;
+  flex: none;
+  margin-right: var(--pm-space-1);
+}
+
+.pmw-appbar__approvals:empty {
+  display: none;
+}
+
+.pmw-appbar__more {
+  display: inline-flex;
+  color: var(--pm-color-muted);
+}
+
+.pmw-appbar .pm-ui-icon {
+  width: var(--pm-size-icon);
+  height: var(--pm-size-icon);
+}
+
+.pmw-appbar__brand > .pmw-logo {
+  width: var(--pm-size-logo);
+  height: var(--pm-size-logo);
+}
+
+.pmw-appbar__more > .pm-ui-icon-button {
+  width: var(--pm-size-tool);
+  height: var(--pm-size-tool);
+  border-radius: var(--pm-radius-tool);
+}
+
+.pmw-appbar__busy {
+  position: absolute;
+  top: var(--pm-space-1);
+  right: var(--pm-space-1);
+  width: var(--pm-size-dot);
+  height: var(--pm-size-dot);
+  border-radius: 50%;
+  background: var(--pm-color-accent);
+  animation: pmw-pulse var(--pm-duration-pulse) ease-in-out infinite;
+}
+
+@keyframes pmw-pulse {
+  50% { opacity: 0.3; }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .pmw-appbar__busy { animation: none; }
+}
+
+.pmw-frame__sidebar {
+  grid-area: side;
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
+  background: var(--pm-color-chrome);
+}
+
+.pmw-frame__sidebar:not([data-shown]) {
+  display: none;
+}
+
+.pmw-frame__centre {
+  grid-area: centre;
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
+  background: var(--pm-color-bg);
+}
+
+.pmw-frame__centre[hidden] {
+  display: none;
+}
+
+.pmw-frame__centre > .pmw-home {
+  height: 100%;
+}
+
+.pmw-frame__panel {
+  height: 100%;
+  overflow: auto;
+}
+
+.pmw-frame__rightbar {
+  position: relative;
+  grid-area: rightbar;
+  min-width: 0;
+  overflow: visible;
+}
+
+.pmw-frame__conversation {
+  grid-area: conversation;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
+  background: var(--pm-color-chrome);
+}
+
+.pmw-frame__conversation > * {
+  flex: 1;
+  min-height: 0;
+}
+
+.pmw-frame__conversation[hidden] { display: none; }
+.pmw-chat-actions { display: flex; align-items: center; gap: var(--pm-space-1); }
+.pmw-chat-actions__title { margin-right: var(--pm-space-2); color: var(--pm-color-muted); font-size: var(--pm-text-xs); font-weight: 600; letter-spacing: var(--pm-tracking-label); white-space: nowrap; }
+.pmw-history { display: flex; flex-direction: column; height: 100%; min-height: 0; color: var(--pm-color-ink); }
+.pmw-history__header { display: flex; align-items: center; justify-content: space-between; gap: var(--pm-space-2); padding: var(--pm-space-2) var(--pm-space-3); border-bottom: var(--pm-size-hairline) solid var(--pm-color-line); }
+.pmw-history__header h2 { margin: 0; font-size: var(--pm-text-sm); font-weight: 600; }
+.pmw-history__browser { flex: 1; min-height: 0; overflow: hidden; }
+
+.pmw-frame__bottom {
+  grid-area: bottom;
+  min-width: 0;
+}
+
+.pmw-frame__bottom:empty {
+  display: none;
+}
+
+.pmw-frame__overlay {
+  position: absolute;
+  z-index: 20;
+  inset: 0;
+  pointer-events: none;
+}
+
+.pmw-frame__overlay > * {
+  pointer-events: auto;
+}
+
+.pmw-frame__panels { grid-area: panels; min-width: 0; min-height: 0; }
+.pmw-frame__side-panel { display: grid; }
+.pmw-frame__side-panel > * { grid-area: 1 / 1; }
+.pmw-frame__sidebar, .pmw-frame__centre, .pmw-frame__conversation, .pmw-frame__rightbar { height: 100%; }
+/* A hairline between columns, with a wider area to grab. */
+.pmw-frame__handle { position: relative; width: var(--pm-size-hairline); z-index: 11; background: var(--pm-color-line); }
+.pmw-frame__handle::after { position: absolute; inset: 0 calc(-1 * var(--pm-space-1)); content: ''; }
+.pmw-frame__handle:hover, .pmw-frame__handle:focus-visible, .pmw-frame__handle[data-separator='active'] { background: var(--pm-color-accent); box-shadow: 0 0 0 var(--pm-size-hairline) var(--pm-color-accent); }
+
+.pmw-frame[data-narrow] .pmw-appbar__brand > .pmw-brand-name,
+.pmw-frame[data-narrow] .pmw-appbar__label,
+.pmw-frame[data-narrow] .pmw-appbar__places > li + li::before {
+  display: none;
+}
+
+.pmw-frame[data-narrow] .pmw-appbar__brand {
+  margin-right: var(--pm-space-1);
+}
+
+.pmw-frame[data-narrow] .pmw-appbar__place[aria-current] {
+  background: var(--pm-color-selected);
+  color: var(--pm-color-accent);
+}
+
+.pmw-frame[data-narrow] .pmw-appbar__place,
+.pmw-frame[data-narrow] .pmw-appbar__button {
+  min-width: var(--pm-size-touch);
+  height: var(--pm-size-touch);
+  justify-content: center;
+}
+
+.pmw-frame[data-narrow] .pmw-appbar {
+  height: var(--pm-appbar-height-touch);
+}
+
+.pmw-frame[data-narrow] .pmw-frame__sidebar,
+.pmw-frame[data-narrow] .pmw-frame__conversation,
+.pmw-frame[data-narrow] .pmw-frame__rightbar {
+  grid-area: centre;
+  border: 0;
+}
+
+.pmw-frame[data-narrow] .pmw-frame__conversation:not([data-shown]) {
+  display: none;
+}
+
+.pmw-frame[data-narrow] .pmw-frame__rightbar {
+  pointer-events: none;
+}
+
+.pmw-frame[data-narrow] .pmw-frame__rightbar > * {
+  pointer-events: auto;
+}
+
+.pmw-logo {
+  flex: none;
+  display: block;
+}
+
+.pmw-brand-name {
+  font-family: var(--pm-font-sans);
+  font-weight: 600;
+  letter-spacing: 0.01em;
+}
+
+.pmw-welcome__card {
+  display: flex;
+  flex-direction: column;
+  gap: var(--pm-space-3);
+  max-width: 30rem;
+  padding: var(--pm-space-6);
+}
+
+.pmw-welcome__title {
+  margin: 0;
+  font-family: var(--pm-font-serif);
+  font-size: var(--pm-text-title);
+}
+
+.pmw-welcome__card p {
+  margin: 0;
+  line-height: var(--pm-leading-ui);
+}
+
+.pmw-welcome__actions {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-end;
+  gap: var(--pm-space-2);
+}
+
+[data-plugin-group='extensions'] {
+  display: none !important;
+}
+
+.pmw-fallback {
+  height: 100%;
+  overflow: auto;
+  background: var(--pm-color-bg);
+}
+
+.pmw-fallback__doc {
+  height: 100%;
+}
+
+.pmw-fallback__doc[hidden] { display: none; }
+
+.pmw-fallback__tab {
+  height: 100%;
+  overflow: hidden;
+}
+
+.pmw-frame[data-narrow] .pmw-frame__panels { display: block !important; }
+/* react-resizable-panels writes `height: auto` on each panel; on a narrow screen each one fills the page. */
+.pmw-frame[data-narrow] .pmw-frame__panels > [data-panel] { width: 100%; height: 100% !important; }
+.pmw-frame__panels > [hidden] { display: none !important; }
+.pmw-frame[data-narrow] .pmw-frame__sidebar[data-shown] { height: 100%; }
+
+.pmw-frame__rightbar-overlay { position: absolute; top: 0; bottom: 0; height: auto; z-index: 13; pointer-events: none; }
+.pmw-frame__rightbar-track { height: 100%; width: 100%; }
+.pmw-frame__rightbar-overlay [data-sidebar-right-session]:has([data-pmw-source-route]) { opacity: 0; }
+.pmw-frame__rightbar-overlay [data-sidebar-right-session]:not([data-sidebar-right-open]) [data-dockkit-host='dock'] { transition: none; }
+.pmw-frame__document { height: 100%; min-width: 0; min-height: 0; }
+.pmw-frame__document[hidden] { display: none; }
+
+/*
+ * Presmium opens one workspace: the conversation does not offer to choose another or another agent preset, and the
+ * chat history lists the sessions without the workspace row above them. Matched by slot names and row keys, not by
+ * Harness's generated class names.
+ */
+[data-slot='conversation.hero.agentPreset'],
+:has(> [data-slot='conversation.hero.agentPreset']) > button,
+[data-slot='sidebar.workspaces'] [data-row-key^='workspace:'],
+[data-slot='sidebar.workspaces'] :has(> [data-slot^='sidebar.workspaces.directory']) {
+  display: none !important;
+}
+
+/* Runtime diagnostics use shared controls; the shell owns their placement only. */
+.pmw-runtime-feedback { flex: none; padding: var(--pm-space-2) var(--pm-space-3); }
+.pmw-runtime-feedback details { max-block-size: 40dvh; overflow: auto; overflow-wrap: anywhere; }
+.pmw-runtime-feedback__actions { display: flex; flex-wrap: wrap; gap: var(--pm-space-2); margin-block-start: var(--pm-space-2); }
+.pmw-runtime-feedback p { margin: 0; }
+.pmw-runtime-feedback ul { margin-block: var(--pm-space-2); padding-inline-start: var(--pm-space-4); }
+.pmw-runtime-fallback { display: grid; align-content: center; min-height: 100dvh; padding: var(--pm-space-4); }
+
+/* The AI assistant without a usable model: the notice in the composer's place, and a failed turn in the author's terms. */
+.pmw-assistant-setup {
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr);
+  gap: var(--pm-space-2) var(--pm-space-3);
+  margin: 0 var(--pm-space-4) var(--pm-space-4);
+  padding: var(--pm-space-4);
+  border: var(--pm-size-hairline) solid var(--pm-color-line);
+  border-radius: var(--pm-radius-card);
+  background: var(--pm-color-surface);
+  color: var(--pm-color-ink);
+  box-shadow: var(--pm-shadow);
+}
+
+.pmw-assistant-setup__icon {
+  display: inline-flex;
+  color: var(--pm-color-accent);
+}
+
+.pmw-assistant-setup__copy,
+.pmw-turn-failure__copy {
+  display: flex;
+  flex-direction: column;
+  gap: var(--pm-space-1);
+  min-width: 0;
+}
+
+.pmw-assistant-setup__copy p,
+.pmw-turn-failure__copy p {
+  margin: 0;
+  line-height: var(--pm-leading-ui);
+}
+
+.pmw-assistant-setup__title,
+.pmw-turn-failure__title {
+  font-weight: var(--pm-weight-semibold);
+}
+
+.pmw-assistant-setup__actions {
+  display: flex;
+  grid-column: 1 / -1;
+  justify-content: flex-end;
+}
+
+.pmw-turn-failure {
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr);
+  gap: var(--pm-space-2);
+  padding: var(--pm-space-3);
+  border-radius: var(--pm-radius-control);
+  background: var(--pm-color-warn-soft);
+  color: var(--pm-color-ink);
+  font-size: var(--pm-text-sm);
+}
+
+.pmw-turn-failure__mark {
+  display: inline-flex;
+  color: var(--pm-color-warn);
+}
+
+.pmw-turn-failure__actions {
+  display: flex;
+  margin-top: var(--pm-space-1);
+}
+
+.pmw-turn-failure__details {
+  color: var(--pm-color-muted);
+  font-size: var(--pm-text-xs);
+}
+
+.pmw-turn-failure__details summary {
+  cursor: pointer;
+}
+
+.pmw-turn-failure__details p {
+  margin-top: var(--pm-space-1);
+  overflow-wrap: anywhere;
+}

package/src/client/index.tsx

@@ -0,0 +1,157 @@
+import { connectAuthoringClient, localeOf, Workbench, workspaceClient } from '@lincyaw/workbench'
+import type { Locale } from '@lincyaw/workbench'
+import { workspaceSubscriptions } from './workspace-events.ts'
+import { registerAuthorSettings } from './author-settings.ts'
+import { registerSpeechSettings } from './speech-settings.tsx'
+import { openSpeechSettings } from './settings-opener.ts'
+import { registerBrand } from './brand.tsx'
+import { registerMascot } from './mascot.tsx'
+import { CLIENT_ID, isBootEntryLoaded, ROOT_CHILDREN, UI_LAYOUT, UI_SIDEBAR } from './contract.ts'
+import { syncDocumentContext } from './document-context.ts'
+import { FALLBACK_PANEL, registerFallbackLayout } from './fallback.tsx'
+import { createLayoutStore, LayoutController } from './layout.ts'
+import { connectLaunchTarget } from './launch-target.ts'
+import { CLIENT_MESSAGES } from './messages.ts'
+import { registerNavigationShell } from './navigation-shell.tsx'
+import { createObservable } from './observable.ts'
+import { isSamePath } from './paths.ts'
+import { registerAgentRequests } from './agent-requests.ts'
+import { registerAssistantSetup } from './assistant-setup.tsx'
+import { rootLayoutFor } from './RootLayout.tsx'
+import { beginRootReload, restoreRootReturnPoint, saveRootReturnPoint } from './root-reload.ts'
+import { registerSourceLinks } from './source-links.tsx'
+import { registerWorkbenchKeys } from './workbench-keys.ts'
+import { runtimeDiagnostics } from './runtime-diagnostics.tsx'
+import { DSH_THEME_TOKENS, syncDarkClass, ThemePresenter } from './theme.ts'
+
+declare const __PRESMIUM_CSS__: string
+
+if (typeof document !== 'undefined' && !document.querySelector(`style[data-plugin-css="${CLIENT_ID}"]`)) {
+  const style = document.createElement('style')
+  style.dataset.plugin = CLIENT_ID
+  style.dataset.pluginCss = CLIENT_ID
+  style.textContent = __PRESMIUM_CSS__
+  document.head.append(style)
+}
+
+export const inject = ['slots', 'theme', 'locale', 'shortcuts']
+
+// The studio's one language source: the language chosen in Settings, else the browser's.
+function workbenchLocale(active: string | undefined): Locale {
+  return localeOf(active) ?? localeOf(navigator.language) ?? 'en'
+}
+
+export function apply(ctx: DshClientContext): void {
+  const nativeLayout = isBootEntryLoaded(UI_LAYOUT)
+  const reload = nativeLayout ? { reloading: false } : beginRootReload()
+  if (reload.reloading) return
+  const uiWorkspace = new Promise<DshClientContext['uiWorkspace']>(resolve => ctx.inject(['uiWorkspace'], inner => resolve(inner.uiWorkspace)))
+  const dshWorkspaces = createObservable<ReturnType<DshClientContext['workspaces']['list']['getSnapshot']>>({ items: [] })
+  // Register the root before the renderer boots; remote-backed workspace data follows later.
+  ctx.inject(['workspaces'], inner => inner.effect(() => {
+    const update = () => dshWorkspaces.set(inner.workspaces.list.getSnapshot())
+    update()
+    return inner.workspaces.list.subscribe(update)
+  }, 'presmium: workspace list'))
+  const workbench = new Workbench({ client: workspaceClient('api/presmium/', workspaceSubscriptions(ctx)), locale: workbenchLocale(ctx.locale.getLocale().active) })
+  workbench.client.openSpeechSettings = openSpeechSettings
+  ctx.effect(() => connectAuthoringClient(workbench), 'presmium: authoring client control')
+  ctx.effect(() => runtimeDiagnostics(workbench).start(), 'presmium: runtime diagnostics')
+  let showEditor = (layout: DshClientContext['layout']) => layout.selectPanel(FALLBACK_PANEL)
+  registerSourceLinks(ctx, workbench, layout => showEditor(layout))
+  ctx.effect(() => () => {
+    workbench.dispose()
+    if (!nativeLayout) saveRootReturnPoint(workbench)
+  }, 'presmium: workbench')
+  syncDocumentContext(ctx, workbench)
+  registerWorkbenchKeys(ctx, workbench)
+  registerAgentRequests(ctx, workbench, registerAssistantSetup(ctx, workbench))
+  ctx.effect(() => ctx.locale.subscribe(() => workbench.setLocale(workbenchLocale(ctx.locale.getLocale().active))), 'presmium: language')
+  ctx.effect(() => ctx.theme.overrideTokens(CLIENT_ID, DSH_THEME_TOKENS), 'presmium: 书卷 tokens')
+  ctx.effect(() => {
+    const sync = (snapshot: DshThemeSnapshot) => workbench.setDark(syncDarkClass(snapshot))
+    sync(ctx.theme.getTheme())
+    return ctx.on('theme/change', sync)
+  }, 'presmium: light and dark')
+
+  if (nativeLayout) {
+    registerFallbackLayout(ctx, workbench)
+  } else {
+    ctx.effect(() => {
+      const presenter = new ThemePresenter()
+      presenter.apply(ctx.theme.getTheme())
+      const off = ctx.on('theme/change', (snapshot: DshThemeSnapshot) => presenter.apply(snapshot))
+      return () => {
+        off()
+        presenter.dispose()
+      }
+    }, 'presmium: theme presenter')
+    ctx.effect(() => {
+      const handle = createLayoutStore()
+      const instance = handle.create()
+      const globalPanels = createObservable<readonly DshSlotEntry[]>([])
+      registerNavigationShell(ctx, workbench, instance, globalPanels, async () => {
+        const { root } = await workbench.client.readWorkbenchInfo()
+        const workspace = dshWorkspaces.getSnapshot().items.find(item => root && isSamePath(item.path, root))
+        if (workspace) (await uiWorkspace).startSession(workspace.workspaceId)
+      })
+      const store = { ...handle, create: () => instance }
+      const mainKeys = () => ctx.slots.entries('main').flatMap(entry => (entry.options.key === undefined ? [] : [entry.options.key]))
+      const layout = new LayoutController(instance.actions, id => mainKeys().includes(id), {
+        getSnapshot: () => instance.getSnapshot().panelInfo,
+        subscribe: listener => instance.subscribe(listener),
+      })
+      showEditor = () => layout.showDocument()
+      const openSettings = () => {
+        const triggers = document.querySelectorAll<HTMLElement>('[data-pmw-slot="sidebar"] button[aria-haspopup="dialog"]')
+        triggers[triggers.length - 1]?.click()
+      }
+      const disposePanelInfo = ctx.slots.provideRoot({ hooks: { panelInfo: layout.panelInfo } })
+      const disposeRoot = ctx.slots.register({ name: 'root', locale: 'common', children: {
+        ...ROOT_CHILDREN,
+        ...(isBootEntryLoaded(UI_SIDEBAR) ? {} : { 'sidebar.panellist': { kind: 'list', scope: 'root' } as const }),
+      }, store }, rootLayoutFor({
+        workbench,
+        openSettings,
+        openDshWorkspace: id => uiWorkspace.then(service => service.openWorkspace(id, () => layout.preserveNextConversation())),
+        dshWorkspaces,
+        globalPanels,
+      }))
+      const disposeService = ctx.reflect.provide('layout', layout)
+      const binding = { code: 'KeyB', modifiers: ['primary', 'alt'] }
+      const disposeShortcut = ctx.shortcuts.register({
+        id: 'sidebar.left.toggle',
+        label: () => CLIENT_MESSAGES[workbench.state.locale].toggleSide,
+        aliases: ['sidebar', 'toggle left sidebar'],
+        defaults: {
+          'desktop:macos': { code: 'KeyB', modifiers: ['primary'] },
+          'desktop:windows': { code: 'KeyB', modifiers: ['primary'] },
+          'desktop:linux': { code: 'KeyB', modifiers: ['primary'] },
+          'web:macos': binding,
+          'web:windows': binding,
+        },
+        regions: ['page', 'editable'],
+        modals: [],
+        resolve: () => ({ status: 'handled', run: () => layout.toggleSidebar() }),
+      })
+      const retain = () => instance.actions.retainMainPanels(mainKeys())
+      const disposePanels = ctx.slots.subscribe('main', retain)
+      retain()
+      return () => {
+        disposeShortcut()
+        layout.dispose()
+        disposePanels()
+        disposeService()
+        disposeRoot()
+        disposePanelInfo()
+      }
+    }, 'presmium: the root layout and ctx.layout')
+  }
+  registerBrand(ctx, workbench)
+  registerMascot(ctx, workbench)
+  registerAuthorSettings(ctx)
+  registerSpeechSettings(ctx, workbench)
+  ctx.inject(['layout'], inner => inner.effect(() => connectLaunchTarget(workbench,
+    () => nativeLayout ? () => {} : restoreRootReturnPoint(workbench, reload.point),
+    () => showEditor(inner.layout)), 'presmium: launch target and root return point'))
+}