@12ui/design 0.2.80 → 0.2.82

package/dist/mcp-slate-ui-styles.js

@@ -1,146 +1,143 @@
 /**
- * The workspace view's stylesheet: base and inline card (the fullscreen stage
- * is in mcp-slate-ui-styles-stage.ts, the dialogs in
- * mcp-slate-ui-styles-dialog.ts). Host variables win; the fallbacks keep the
- * view usable when a host passes none. System fonts only, no external
- * requests.
+ * The workspace view's stylesheet: tokens, base and the shell (the prompt card and the tab row), shared by the inline
+ * card and the fullscreen workspace (the stage is in mcp-slate-ui-styles-stage.ts, the Designs tab and its large view in
+ * mcp-slate-ui-styles-designs.ts).
  *
- * The layout is fluid by construction: the view never asks the host for a
- * width. Every flex/grid parent sets `min-width: 0` so no child can push the
- * frame wider than its pane, and the thumbnails wrap onto as many rows as
- * they need: nothing scrolls sideways.
+ * Every colour, border, radius and font comes from the MCP Apps standard variables the host sends
+ * (`hostContext.styles.variables`, which Codex sends whole, resolved for its current theme and the person's accent),
+ * with a neutral light and dark fallback each, keyed on `color-scheme` through `light-dark()`: the theme is
+ * `[data-theme]` (set by the host's shell and by `hostContext.theme`), else `window.openai.theme` (the bridge sets the
+ * same attribute), else `prefers-color-scheme` (a plain browser: the `12ui workspace open` page). The accent is the host's
+ * ring colour (selection rings), a solid accent fills the check badges, and the primary button is ink, as Codex draws
+ * its own. No brand colour is written here; system fonts only, no external requests.
  *
- * A design's thumbnail has the design's own aspect ratio (`--ar`, set by the script on each tile from its picture, or
- * for an option still without one from what its round draws). The strip and each round of the selection are grids of
- * equal columns; a column is no narrower than a size token times the square root of the row's ratio (`--shape`, also
- * set by the script), so tiles of any ratio have about the same area, and the columns share out what is left. The
- * tokens, one place each: --thumb-card (the card's strip, 124 px under a 480 px card and 170 px from it, so a 3:2
- * design is at least 152 or 208 px wide, a 2:3 one 101 or 139, a square one 124 or 170; at least double the picture
- * a 144 px square tile used to show from 480 px) and --thumb-rail (the workspace's selection, 170 px, 124 px under a
- * 640 px window). The container queries read the card's own width
- * (`main`). Every thumbnail picture (designs, inspiration, the Based on picture and the reference chips) is
- * `object-fit: contain`, so the whole design shows and nothing is cropped or stretched.
+ * The layout is fluid by construction: the view never asks the host for a width. Every flex/grid parent sets
+ * `min-width: 0` so no child can push the frame wider than its pane, and nothing scrolls sideways.
  */
 export const SLATE_UI_STYLES = String.raw `
-  /* Host variables win; these fallbacks keep the view usable when a host passes none. System fonts only. */
   :root {
     color-scheme: light dark;
-    --f-bg: light-dark(#ffffff, #1c1c1c);
-    --f-bg2: light-dark(#f4f4f2, #2a2a2a);
-    --f-bg3: light-dark(#e8e8e4, #3a3a3a);
-    --f-text: light-dark(#1a1a1a, #f2f2f2);
-    --f-text2: light-dark(#5f5f5b, #a8a8a3);
-    --f-border: light-dark(#d9d9d3, #444440);
-    --f-inverse: light-dark(#1a1a1a, #f2f2f2);
-    --f-inverse-text: light-dark(#ffffff, #1a1a1a);
-    --f-ring: light-dark(#2f6fed, #7aa2ff);
-    --f-danger: light-dark(#b3261e, #ff8a80);
-    --f-ok: light-dark(#1d6b3a, #6fd08c);
+    /* Neutral fallbacks, used only when the host omits a variable; close to Codex's own, so the first paint never jumps. */
+    --f-bg: light-dark(#ffffff, #181818);
+    --f-bg2: light-dark(#ffffff, #363636);
+    --f-bg3: light-dark(#f6f6f6, #141414);
+    --f-text: light-dark(#1a1c1f, #ffffff);
+    --f-text2: light-dark(rgb(26 28 31 / .5), rgb(255 255 255 / .5));
+    --f-border: light-dark(rgb(26 28 31 / .12), rgb(255 255 255 / .16));
+    --f-border2: light-dark(rgb(26 28 31 / .08), rgb(255 255 255 / .08));
+    --f-inverse: light-dark(#1a1c1f, #ffffff);
+    --f-inverse-text: light-dark(#ffffff, #0d0d0d);
+    --f-accent: light-dark(#2f6fed, #7aa2ff);
+    --f-accent-tint: light-dark(#e5f2ff, #0d273f);
+    --f-danger: light-dark(#e02e2a, #ff6764);
+    --f-ok: light-dark(#00a240, #40c977);
+    /* The host's variables first, the neutral fallback second. */
     --bg: var(--color-background-primary, var(--f-bg));
     --bg2: var(--color-background-secondary, var(--f-bg2));
     --bg3: var(--color-background-tertiary, var(--f-bg3));
     --text: var(--color-text-primary, var(--f-text));
     --text2: var(--color-text-secondary, var(--f-text2));
     --border: var(--color-border-primary, var(--f-border));
+    --border2: var(--color-border-secondary, var(--f-border2));
     --inverse: var(--color-background-inverse, var(--f-inverse));
     --inverse-text: var(--color-text-inverse, var(--f-inverse-text));
-    --ring: var(--color-ring-primary, var(--f-ring));
     --danger: var(--color-text-danger, var(--f-danger));
     --ok: var(--color-text-success, var(--f-ok));
-    --radius: var(--border-radius-md, 8px);
-    --font: var(--font-sans, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
-    --thumb-rail: 170px;
+    /* The accent is the host's ring colour (the person's own accent in Codex); a solid accent fills a badge. */
+    --ring: var(--color-ring-primary, var(--f-accent));
+    --accent-solid: var(--color-text-info, var(--f-accent));
+    --accent-tint: var(--color-background-info, var(--f-accent-tint));
+    /* Fills derived from the host's ink and ground, so they read in either theme whatever the host sends
+       (--color-background-secondary is translucent and equals the page in Codex's light theme). */
+    --fill: color-mix(in srgb, var(--text) 5%, var(--bg));
+    --fill-hover: color-mix(in srgb, var(--text) 9%, var(--bg));
+    --radius: var(--border-radius-md, 10px);
+    --radius-lg: var(--border-radius-lg, 12.5px);
+    --radius-xl: var(--border-radius-xl, 15px);
+    --font: var(--font-sans, -apple-system, "system-ui", "Segoe UI", sans-serif);
+    --fs-sm: var(--font-text-sm-size, 12px);
+    --fs-md: var(--font-text-md-size, 14px);
+    --fs-lg: var(--font-text-lg-size, 16px);
+    --elev-sm: var(--shadow-sm, 0 1px 2px -1px rgb(0 0 0 / .08));
+    --elev: var(--shadow-md, 0 2px 4px -1px rgb(0 0 0 / .08));
+    --elev-lg: var(--shadow-lg, 0 4px 8px -2px rgb(0 0 0 / .1));
   }
-  @media (max-width: 639px) { :root { --thumb-rail: 124px; } }
-  #card { --thumb-card: 124px; }
-  @container (min-width: 480px) { #card { --thumb-card: 170px; } }
+  /* The host's shell sets data-theme before this script runs, and hostContext.theme keeps it current. */
   :root[data-theme="light"] { color-scheme: light; }
   :root[data-theme="dark"] { color-scheme: dark; }
   * { box-sizing: border-box; }
   html, body { margin: 0; }
-  /* Fluid by construction: the app never asks the host for a width. The layout width is whatever the host gives
-     the view (fixed width or flexible maxWidth alike), so a host can never grow the frame past its pane. */
   body {
     background: var(--bg);
     color: var(--text);
-    font: 14px/1.45 var(--font);
+    font: var(--fs-md)/1.45 var(--font);
     padding: 16px;
     min-width: 0;
   }
   main { max-width: 960px; margin: 0 auto; min-width: 0; container-type: inline-size; }
   .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
   h1 { font-size: 15px; font-weight: 600; margin: 0; }
-  .meta { color: var(--text2); font-size: 12px; }
-  .topbar { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; min-width: 0; }
-  .tabs { display: flex; gap: 4px; min-width: 0; }
-  .tab { padding: 6px 12px; border-radius: 999px; border-color: transparent; background: transparent; color: var(--text2); font-weight: 500; }
-  .tab[aria-selected="true"] { background: var(--bg2); color: var(--text); border-color: var(--border); }
-  .iconbtn { display: inline-grid; place-items: center; flex: none; width: 34px; height: 34px; padding: 0; }
-  /* The large image. Its box has the image's own aspect ratio and a capped height, so the card never jumps when the
-     picture lands and the badge and hairline sit on the picture itself. The card caps the height at 60 percent of
-     its own width (a container unit, so the frame's height never feeds back into it); the workspace uses the window. */
-  .hero { position: relative; width: min(100%, calc(var(--cap, 60cqw) * var(--ar, 1.5))); aspect-ratio: var(--ar, 1.5); margin: 0 auto; min-width: 0; border-radius: var(--radius); background: var(--bg3); overflow: hidden; }
-  #card .hero { --cap: 60cqw; }
-  .hero.note { width: 100%; aspect-ratio: auto; background: var(--bg2); }
-  .heroimg { display: block; width: 100%; height: 100%; object-fit: fill; user-select: none; -webkit-user-drag: none; }
-  .heroimg.empty { background: var(--bg3); }
-  /* An image with no source yet paints nothing. Chromium draws a 1 px silver placeholder frame inside an <img> that has
-     no source, square-cornered, and the rounded tile around it then cuts that frame off at its corners: the clipped
-     corners of the thumbnails that were still loading or drawing. The tile's own surface stands in until the picture
-     arrives, and an option with no picture at all (drawing, failed, stopped) has no <img>. */
-  .thumbbtn .thumb:not([src]), .opt .thumb:not([src]), .heroimg:not([src]) { visibility: hidden; }
-  .heronote { padding: 32px 16px; color: var(--text2); text-align: center; overflow-wrap: anywhere; }
-  .hero .badge, .thumbbtn .code, .opt .code { position: absolute; left: 8px; bottom: 8px; padding: 0 8px; border-radius: 999px; background: var(--inverse); color: var(--inverse-text); font-size: 12px; font-weight: 600; line-height: 20px; }
-  .hero .hair { position: absolute; left: 0; right: 0; bottom: 0; }
-  /* Select sits under the large image at the right, in line with the right edge of the thumbnails below; an error about
-     a click (Select could not be recorded, the host refused the message) shows beside it and takes no room otherwise. */
-  .pickrow { display: flex; align-items: center; gap: 12px; margin-top: 10px; min-width: 0; }
-  .pickrow > button { flex: none; margin-left: auto; }
-  .cardalert { flex: 1 1 0; min-width: 0; margin: 0; font-size: 12px; color: var(--danger); overflow-wrap: anywhere; }
-  /* Every option of the strip in view, on as many rows as it takes, and the Generate more tile last; nothing scrolls. */
-  .strip { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, calc(var(--thumb-card) * var(--shape, 1))), 1fr)); gap: 8px; align-items: start; margin-top: 12px; min-width: 0; }
-  .thumbbtn, .opt, .refbtn { position: relative; padding: 0; border: 0; border-radius: 6px; background: var(--bg2); overflow: hidden; }
-  /* A design's tile is as wide as its column and as tall as its picture's ratio makes it. */
-  .thumbbtn, .opt { display: block; width: 100%; aspect-ratio: var(--ar, 1.5); align-self: start; }
-  /* The tile has the picture's ratio, so the picture fills it; contain keeps the whole design if the two ever differ. */
-  .thumb { display: block; width: 100%; height: 100%; background: var(--bg3); object-fit: contain; object-position: center; }
-  .thumbbtn .code, .opt .code { left: 6px; bottom: 6px; padding: 0 7px; font-size: 11px; line-height: 18px; }
-  .thumbbtn.selected, .opt.selected { box-shadow: 0 0 0 2px var(--text); }
-  /* An option with no picture says why on its own tile, above its code: failed (the reason, recessed tile), or stopped
-     before it was drawn (what the work said). A drawing option shimmers instead. */
-  .tilenote { position: absolute; left: 8px; right: 8px; top: 6px; bottom: 30px; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 500; line-height: 1.35; text-align: center; color: var(--text2); }
+
+  /* The prompt card: the one input of the screen, an expanding field with its button inside the card's right edge. */
+  .briefwrap { display: flex; align-items: center; gap: 10px; min-width: 0; margin-bottom: 14px; padding: 8px 8px 8px 16px; border: 1px solid var(--border); border-radius: var(--radius-xl); background: var(--bg); box-shadow: var(--elev-sm); }
+  .briefwrap:focus-within { border-color: var(--ring); }
+  textarea.brief {
+    display: block; flex: 1 1 auto; width: 100%; min-width: 0; margin: 0; padding: 6px 0; resize: none; overflow-y: hidden;
+    font: inherit; font-size: var(--fs-lg); line-height: 1.45; color: var(--text); background: transparent; border: 0;
+    max-height: calc(7 * 1.45em + 12px);
+  }
+  /* Folded to two lines until it has focus: the last line fades out. */
+  textarea.brief.folded { -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 1.3em), transparent); mask-image: linear-gradient(to bottom, #000 calc(100% - 1.3em), transparent); cursor: text; }
+  textarea.brief::placeholder { color: var(--text2); }
+  textarea.brief:focus-visible { outline: none; }
+  button.promptgo { flex: none; align-self: flex-end; padding: 8px 18px; border-radius: 999px; }
+  #stage > .briefwrap { margin-bottom: 0; }
+
+  /* The tab row: slim underlined tabs, and at its right the quiet count and the full-screen control. */
+  .topbar, .stagehead { display: flex; align-items: center; gap: 12px; min-width: 0; border-bottom: 1px solid var(--border2); }
+  .topbar { margin-bottom: 16px; }
+  .tabs { display: flex; gap: 24px; min-width: 0; align-self: stretch; }
+  button.tab { margin-bottom: -1px; padding: 10px 0 9px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: var(--text2); font-weight: 500; white-space: nowrap; }
+  button.tab:hover:not(:disabled) { background: transparent; color: var(--text); }
+  button.tab[aria-selected="true"] { color: var(--text); border-bottom-color: var(--text); }
+  button.tab:focus-visible { outline-offset: -2px; }
+  .selcount { margin-left: auto; font-size: var(--fs-sm); color: var(--text2); font-variant-numeric: tabular-nums; white-space: nowrap; }
+  .selcount:empty { display: none; }
+  .topbar > .iconbtn, .stagehead > .iconbtn { margin-left: auto; }
+  .selcount:not(:empty) + .iconbtn { margin-left: 0; }
+  button.iconbtn { display: inline-grid; place-items: center; flex: none; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--text2); }
+  button.iconbtn:hover:not(:disabled) { background: var(--fill); color: var(--text); }
+  @container (max-width: 440px) { .selcount { display: none; } .tabs { gap: 18px; } }
+  @media (max-width: 480px) { .selcount { display: none; } .tabs { gap: 18px; } }
+
+  .cardalert { flex: 1 1 0; min-width: 0; margin: 0; font-size: var(--fs-sm); color: var(--danger); overflow-wrap: anywhere; }
+  .cardalert:empty { display: none; }
+  /* A picture with no source yet paints nothing (Chromium draws a silver placeholder frame the rounded tile would cut). */
+  .thumb:not([src]) { visibility: hidden; }
+  .thumb { display: block; width: 100%; height: 100%; background: var(--fill); object-fit: contain; object-position: center; }
+  .tilenote { position: absolute; left: 8px; right: 8px; top: 6px; bottom: 6px; display: flex; align-items: center; justify-content: center; font-size: var(--fs-sm); font-weight: 500; line-height: 1.35; text-align: center; color: var(--text2); }
   .tilenote > span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; overflow-wrap: anywhere; }
-  .thumbbtn.failed, .opt.failed { background: var(--bg); box-shadow: inset 0 0 0 1px var(--border); }
-  .thumbbtn.failed.selected, .opt.failed.selected { box-shadow: inset 0 0 0 1px var(--border), 0 0 0 2px var(--text); }
-  .failed .tilenote { color: var(--danger); }
-  .failed .code { opacity: .6; }
-  .shimmer { background: linear-gradient(100deg, var(--bg2) 30%, var(--bg3) 50%, var(--bg2) 70%); background-size: 200% 100%; animation: shimmer 1.4s linear infinite; }
+  .shimmer { background: linear-gradient(100deg, var(--fill) 30%, var(--fill-hover) 50%, var(--fill) 70%); background-size: 200% 100%; animation: shimmer 1.4s linear infinite; }
   @keyframes shimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } }
-  .field { margin-top: 0; }
-  label.lbl, span.lbl { display: block; font-size: 12px; color: var(--text2); margin-bottom: 4px; }
-  input[type="text"], input[type="number"], select {
+  input[type="text"] {
     width: 100%; padding: 8px 10px; font: inherit; color: var(--text); background: var(--bg);
     border: 1px solid var(--border); border-radius: var(--radius);
   }
-  input[type="text"]:focus-visible, input[type="number"]:focus-visible, select:focus-visible { outline: 2px solid var(--ring); outline-offset: 1px; }
+  input[type="text"]:focus-visible { outline: 2px solid var(--ring); outline-offset: 1px; }
   .spacer { flex: 1 1 0; min-width: 0; }
   button {
     font: inherit; font-weight: 600; padding: 8px 16px; border-radius: var(--radius);
-    border: 1px solid var(--border); background: var(--bg2); color: var(--text); cursor: pointer;
+    border: 1px solid var(--border); background: var(--bg); color: var(--text); cursor: pointer;
   }
-  button.thumbbtn, button.opt, button.refbtn { padding: 0; border: 0; }
+  button:hover:not(:disabled) { background: var(--fill); }
   button.primary { background: var(--inverse); color: var(--inverse-text); border-color: var(--inverse); }
+  button.primary:hover:not(:disabled) { background: var(--inverse); opacity: .86; }
   button:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }
   button:disabled { opacity: .45; cursor: default; }
-  .note { margin: 10px 0 0; font-size: 12px; color: var(--text2); }
-  .hair { display: block; height: 2px; background: var(--bg3); overflow: hidden; position: relative; min-width: 0; }
-  .hair.indeterminate::after { content: ""; position: absolute; inset: 0 auto 0 -30%; width: 30%; background: var(--text); animation: slide 1.4s ease-in-out infinite; }
-  @keyframes slide { from { left: -30%; } to { left: 100%; } }
-  @media (prefers-reduced-motion: reduce) {
-    .hair.indeterminate::after { animation: none; width: 100%; left: 0; opacity: .3; }
-    .shimmer { animation: none; }
-  }
-  .status { min-height: 18px; margin: 8px 0 0; font-size: 12px; overflow-wrap: anywhere; }
+  .note { margin: 10px 0 0; font-size: var(--fs-sm); color: var(--text2); }
+  @media (prefers-reduced-motion: reduce) { .shimmer { animation: none; } }
+  .status { min-height: 18px; margin: 8px 0 0; font-size: var(--fs-sm); overflow-wrap: anywhere; }
+  .status:empty { display: none; }
   .status.ok { color: var(--ok); }
   .status.err, .err { color: var(--danger); }
   #fatal { padding: 16px; color: var(--danger); }

package/dist/mcp-slate-ui-styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"mcp-slate-ui-styles.js","sourceRoot":"","sources":["../src/mcp-slate-ui-styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4HxC,CAAC"}
+{"version":3,"file":"mcp-slate-ui-styles.js","sourceRoot":"","sources":["../src/mcp-slate-ui-styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgIxC,CAAC"}

package/dist/mcp-slate-ui.d.ts

@@ -1,20 +1,20 @@
 import { type SlateUiTarget } from './mcp-slate-ui-script.js';
 /**
- * The workspace view for one target, as one self-contained HTML document: no external script,
- * stylesheet, font, or URL, so it renders under the strictest host sandbox.
+ * The workspace view for one target, as one self-contained HTML document: no external script, stylesheet or font, so
+ * it renders under the strictest host sandbox. Reference pictures with a public rendition load from the rendition
+ * origin the resource declares; everything else arrives through the app's tools.
  *
- * The static markup is the inline card and nothing else: the tabs, one large
- * image, Select under it (with the place an error about a click shows), the
- * strip of options on as many rows as it takes, and an icon-only control that
- * opens the workspace. The card has no status line: drawing shows on the
- * thumbnails themselves, and an option that failed says why on its own tile.
- * The fullscreen stage and its dialogs are built by the script into `#stage`
- * only when the host puts the view in fullscreen.
+ * The static markup is the inline card: the prompt card (the screen's one input, an expanding field the person can edit,
+ * with its Search button inside), then the tabs Inspiration, References and Designs with the quiet selected count and the
+ * icon-only control that opens the workspace, then one pane per tab and
+ * the host of the large view (used in the card only when the host has no fullscreen). The Designs pane is built by
+ * mcp-slate-ui-script-designs.ts; the Inspiration and References panes by their scripts. The fullscreen stage is
+ * built by the script into `#stage` only when the host puts the view in fullscreen.
  *
  * The markup's words are English, so the first paint is never blank, and each carries its catalogue key
- * (`data-l10n`, `data-l10n-aria`, `data-l10n-label`), so the script re-words it in the person's language before the
- * view shows. The document has no `lang` of its own: a host may set one before the screen is written into its
- * document (Codex does), and the script reads it, then sets the language it speaks.
+ * (`data-l10n`, `data-l10n-aria`, `data-l10n-label`, `data-l10n-placeholder`), so the script re-words it in the
+ * person's language before the view shows. The document has no `lang` of its own: a host may set one before the
+ * screen is written into its document (Codex does), and the script reads it, then sets the language it speaks.
  */
 export declare const buildSlateUiHtml: ({ target }: {
     target: SlateUiTarget;

package/dist/mcp-slate-ui.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mcp-slate-ui.d.ts","sourceRoot":"","sources":["../src/mcp-slate-ui.ts"],"names":[],"mappings":"AACA,OAAO,EAAsB,KAAK,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAMlF;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,gBAAgB,GAAI,YAAY;IAAE,MAAM,EAAE,aAAa,CAAA;CAAE,KAAG,MAwCxE,CAAC;AAEF,yDAAyD;AACzD,eAAO,MAAM,aAAa,QAAwC,CAAC"}
+{"version":3,"file":"mcp-slate-ui.d.ts","sourceRoot":"","sources":["../src/mcp-slate-ui.ts"],"names":[],"mappings":"AACA,OAAO,EAAsB,KAAK,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAOlF;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,gBAAgB,GAAI,YAAY;IAAE,MAAM,EAAE,aAAa,CAAA;CAAE,KAAG,MAwCxE,CAAC;AAEF,yDAAyD;AACzD,eAAO,MAAM,aAAa,QAAwC,CAAC"}

package/dist/mcp-slate-ui.js

@@ -1,25 +1,26 @@
 import { SLATE_UI_COPY as COPY } from './mcp-slate-ui-copy.js';
 import { buildSlateUiScript } from './mcp-slate-ui-script.js';
 import { SLATE_UI_STYLES } from './mcp-slate-ui-styles.js';
-import { SLATE_UI_DIALOG_STYLES, SLATE_UI_MORE_STYLES } from './mcp-slate-ui-styles-dialog.js';
+import { SLATE_UI_INSPIRATION_STYLES } from './mcp-slate-ui-styles-inspiration.js';
 import { SLATE_UI_PAUSE_STYLES } from './mcp-slate-ui-styles-pause.js';
 import { SLATE_UI_STAGE_STYLES } from './mcp-slate-ui-styles-stage.js';
+import { SLATE_UI_DESIGNS_STYLES } from './mcp-slate-ui-styles-designs.js';
 /**
- * The workspace view for one target, as one self-contained HTML document: no external script,
- * stylesheet, font, or URL, so it renders under the strictest host sandbox.
+ * The workspace view for one target, as one self-contained HTML document: no external script, stylesheet or font, so
+ * it renders under the strictest host sandbox. Reference pictures with a public rendition load from the rendition
+ * origin the resource declares; everything else arrives through the app's tools.
  *
- * The static markup is the inline card and nothing else: the tabs, one large
- * image, Select under it (with the place an error about a click shows), the
- * strip of options on as many rows as it takes, and an icon-only control that
- * opens the workspace. The card has no status line: drawing shows on the
- * thumbnails themselves, and an option that failed says why on its own tile.
- * The fullscreen stage and its dialogs are built by the script into `#stage`
- * only when the host puts the view in fullscreen.
+ * The static markup is the inline card: the prompt card (the screen's one input, an expanding field the person can edit,
+ * with its Search button inside), then the tabs Inspiration, References and Designs with the quiet selected count and the
+ * icon-only control that opens the workspace, then one pane per tab and
+ * the host of the large view (used in the card only when the host has no fullscreen). The Designs pane is built by
+ * mcp-slate-ui-script-designs.ts; the Inspiration and References panes by their scripts. The fullscreen stage is
+ * built by the script into `#stage` only when the host puts the view in fullscreen.
  *
  * The markup's words are English, so the first paint is never blank, and each carries its catalogue key
- * (`data-l10n`, `data-l10n-aria`, `data-l10n-label`), so the script re-words it in the person's language before the
- * view shows. The document has no `lang` of its own: a host may set one before the screen is written into its
- * document (Codex does), and the script reads it, then sets the language it speaks.
+ * (`data-l10n`, `data-l10n-aria`, `data-l10n-label`, `data-l10n-placeholder`), so the script re-words it in the
+ * person's language before the view shows. The document has no `lang` of its own: a host may set one before the
+ * screen is written into its document (Codex does), and the script reads it, then sets the language it speaks.
  */
 export const buildSlateUiHtml = ({ target }) => `<!doctype html>
 <html>
@@ -27,7 +28,7 @@ export const buildSlateUiHtml = ({ target }) => `<!doctype html>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">${target === 'local' ? '' : `\n<meta name="slate-target" content="${target}">`}
 <title>${COPY.title}</title>
-<style>${SLATE_UI_STYLES}${SLATE_UI_STAGE_STYLES}${SLATE_UI_DIALOG_STYLES}${SLATE_UI_MORE_STYLES}${SLATE_UI_PAUSE_STYLES}</style>
+<style>${SLATE_UI_STYLES}${SLATE_UI_STAGE_STYLES}${SLATE_UI_DESIGNS_STYLES}${SLATE_UI_INSPIRATION_STYLES}${SLATE_UI_PAUSE_STYLES}</style>
 </head>
 <body>
 <div id="fatal" class="hidden" role="alert"></div>
@@ -35,26 +36,26 @@ export const buildSlateUiHtml = ({ target }) => `<!doctype html>
   <h1 class="sr" data-l10n="title">${COPY.title}</h1>
   <p class="note hidden" id="empty" data-l10n="empty">${COPY.empty}</p>
   <div id="card">
+    <div class="briefwrap"><textarea id="brief" class="brief" rows="1" spellcheck="false" aria-label="${COPY.briefLabel}" placeholder="${COPY.briefPlaceholder}" data-l10n-aria="briefLabel" data-l10n-placeholder="briefPlaceholder"></textarea><button id="briefgo" type="button" class="primary promptgo" data-l10n="search">${COPY.search}</button></div>
     <div class="topbar">
       <div class="tabs" role="tablist" aria-label="${COPY.title}" data-l10n-aria="title">
-        <button type="button" role="tab" class="tab" data-tab="designs" aria-selected="true" data-l10n="tabDesigns">${COPY.tabDesigns}</button>
         <button type="button" role="tab" class="tab" data-tab="inspiration" aria-selected="false" data-l10n="tabInspiration">${COPY.tabInspiration}</button>
+        <button type="button" role="tab" class="tab" data-tab="references" aria-selected="false" data-l10n="tabReferences">${COPY.tabReferences}</button>
+        <button type="button" role="tab" class="tab" data-tab="designs" aria-selected="true" data-l10n="tabDesigns">${COPY.tabDesigns}</button>
       </div>
+      <span class="selcount" data-selcount aria-live="polite"></span>
       <button id="expand" type="button" class="iconbtn" aria-label="${COPY.openWorkspace}" title="${COPY.openWorkspace}" data-l10n-label="openWorkspace" disabled>
         <svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 9V4h5M20 9V4h-5M4 15v5h5M20 15v5h-5"/></svg>
       </button>
     </div>
+    <div id="pane-inspiration" class="hidden"></div>
+    <div id="pane-references" class="hidden"></div>
     <div id="pane-designs">
       <div id="pausebar" class="pausebar hidden"></div>
-      <div id="hero" class="hero"></div>
-      <div class="pickrow">
-        <p class="cardalert" id="cardalert" role="alert"></p>
-        <button id="select" type="button" class="primary" data-l10n="select" disabled>${COPY.select}</button>
-      </div>
-      <div class="strip" id="strip" role="group" aria-label="${COPY.optionsGroup}" data-l10n-aria="optionsGroup"></div>
-      <div id="more"></div>
+      <p class="cardalert" id="cardalert" role="alert"></p>
+      <div id="designs" class="designs"></div>
     </div>
-    <div id="pane-inspiration" class="hidden"></div>
+    <div id="viewer" class="hidden"></div>
   </div>
 </main>
 <div id="stage" class="hidden"></div>

package/dist/mcp-slate-ui.js.map

@@ -1 +1 @@
-{"version":3,"file":"mcp-slate-ui.js","sourceRoot":"","sources":["../src/mcp-slate-ui.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,IAAI,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC/D,OAAO,EAAE,kBAAkB,EAAsB,MAAM,0BAA0B,CAAC;AAClF,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC3D,OAAO,EAAE,sBAAsB,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AAC/F,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAEvE;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,MAAM,EAA6B,EAAU,EAAE,CAAC;;;;sEAIb,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,wCAAwC,MAAM,IAAI;SACzI,IAAI,CAAC,KAAK;SACV,eAAe,GAAG,qBAAqB,GAAG,sBAAsB,GAAG,oBAAoB,GAAG,qBAAqB;;;;;qCAKnF,IAAI,CAAC,KAAK;wDACS,IAAI,CAAC,KAAK;;;qDAGb,IAAI,CAAC,KAAK;sHACuD,IAAI,CAAC,UAAU;+HACN,IAAI,CAAC,cAAc;;sEAE5E,IAAI,CAAC,aAAa,YAAY,IAAI,CAAC,aAAa;;;;;;;;;wFAS9B,IAAI,CAAC,MAAM;;+DAEpC,IAAI,CAAC,YAAY;;;;;;;UAOtE,kBAAkB,CAAC,MAAM,CAAC;;;CAGnC,CAAC;AAEF,yDAAyD;AACzD,MAAM,CAAC,MAAM,aAAa,GAAG,gBAAgB,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,CAAC"}
+{"version":3,"file":"mcp-slate-ui.js","sourceRoot":"","sources":["../src/mcp-slate-ui.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,IAAI,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC/D,OAAO,EAAE,kBAAkB,EAAsB,MAAM,0BAA0B,CAAC;AAClF,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC3D,OAAO,EAAE,2BAA2B,EAAE,MAAM,sCAAsC,CAAC;AACnF,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,EAAE,uBAAuB,EAAE,MAAM,kCAAkC,CAAC;AAE3E;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,MAAM,EAA6B,EAAU,EAAE,CAAC;;;;sEAIb,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,wCAAwC,MAAM,IAAI;SACzI,IAAI,CAAC,KAAK;SACV,eAAe,GAAG,qBAAqB,GAAG,uBAAuB,GAAG,2BAA2B,GAAG,qBAAqB;;;;;qCAK3F,IAAI,CAAC,KAAK;wDACS,IAAI,CAAC,KAAK;;wGAEsC,IAAI,CAAC,UAAU,kBAAkB,IAAI,CAAC,gBAAgB,oKAAoK,IAAI,CAAC,MAAM;;qDAExR,IAAI,CAAC,KAAK;+HACgE,IAAI,CAAC,cAAc;6HACrB,IAAI,CAAC,aAAa;sHACzB,IAAI,CAAC,UAAU;;;sEAG/D,IAAI,CAAC,aAAa,YAAY,IAAI,CAAC,aAAa;;;;;;;;;;;;;;;UAe5G,kBAAkB,CAAC,MAAM,CAAC;;;CAGnC,CAAC;AAEF,yDAAyD;AACzD,MAAM,CAAC,MAAM,aAAa,GAAG,gBAAgB,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,CAAC"}

package/dist/mcp-workflow-tools.js

@@ -34,11 +34,11 @@ export const MCP_WORKFLOW_TOOL_DEFINITIONS = [
     },
     {
         name: 'design.workflow.execute',
-        description: 'Route a prepared operation. Image, image-edit and convert work runs only through the 12ui CLI\'s own providers (the 12ui API, or the OpenAI API for images, each with explicit allowPaid), never a host session. Text and code may go to a declared session (a handoff to complete with host tools, then register), a local CLI, or an explicitly authorized paid provider. Ambiguous dispatched work is not retried on another provider.',
+        description: 'Route a prepared operation. Image, image-edit and convert work runs only through the 12ui CLI\'s own providers (the 12ui API on the 12ui sign-in, or the OpenAI API for images when the user opts in with allowPaid), never a host session. Text and code may go to a declared session (a handoff to complete with host tools, then register), a local CLI, the 12ui API, or the OpenAI API under allowPaid. Ambiguous dispatched work is not retried on another provider.',
         inputSchema: object({
             workspace, operationId: string,
             providers: { type: 'array', minItems: 1, uniqueItems: true, items: { enum: [...PROVIDERS] }, description: 'Provider preference order. A session is eligible only for explicitly declared capabilities.' },
-            allowPaid: { type: 'array', uniqueItems: true, items: { enum: ['openai', '12ui'] }, description: 'Explicit permission for providers funded by API keys or 12ui credits. Key presence is not permission.' },
+            allowPaid: { type: 'array', uniqueItems: true, items: { enum: ['openai', '12ui'] }, description: 'The user\'s opt-in to spend on their own OpenAI API key ("openai"). Key presence is not that opt-in. 12ui credit use needs no permission; a "12ui" entry changes nothing.' },
             sessionCapabilities: capabilityList,
             trustCodexConfig,
         }, ['workspace', 'operationId']),

package/dist/mcp-workflow-tools.js.map

@@ -1 +1 @@
-{"version":3,"file":"mcp-workflow-tools.js","sourceRoot":"","sources":["../src/mcp-workflow-tools.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"mcp-workflow-tools.js","sourceRoot":"","sources":["../src/mcp-workflow-tools.ts"],"names":[],"mappings":"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"}

package/dist/review-files-server.d.ts

@@ -0,0 +1,8 @@
+import type { ReviewModel } from './review-types.js';
+export type ReviewFilesServer = {
+    port: number;
+    close: () => Promise<void>;
+};
+/** Serves `/files/<run>/<path>` for the runs `model()` currently lists, read-only, on its own loopback port. */
+export declare const startReviewFilesServer: (model: () => ReviewModel) => Promise<ReviewFilesServer>;
+//# sourceMappingURL=review-files-server.d.ts.map

package/dist/review-files-server.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"review-files-server.d.ts","sourceRoot":"","sources":["../src/review-files-server.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAkFrD,MAAM,MAAM,iBAAiB,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;CAAE,CAAC;AAE7E,gHAAgH;AAChH,eAAO,MAAM,sBAAsB,GAAU,OAAO,MAAM,WAAW,KAAG,OAAO,CAAC,iBAAiB,CA6ChG,CAAC"}

package/dist/review-files-server.js

@@ -0,0 +1,133 @@
+import { createReadStream } from 'node:fs';
+import { realpath, stat } from 'node:fs/promises';
+import http from 'node:http';
+import path from 'node:path';
+import { assertReviewFileAccess } from './review-server-guard.js';
+/**
+ * THE RUN FILES' OWN ORIGIN. `12ui review` serves a run's files (its HTML, scripts, fonts, images) from a second
+ * loopback port, not the review page's: a run's HTML opened from the page, or framed in it, is then a normal page at
+ * an origin that holds no session token and takes no request that changes anything (`assertReviewFileAccess`). It
+ * runs as it would anywhere (module scripts, fetches of its own files, local `@font-face`, storage), and the browser's
+ * same-origin policy keeps it from reading the review page, whose server refuses its requests by Origin
+ * (`assertReviewAccess`).
+ */
+const CONTENT_TYPES = {
+    '.avif': 'image/avif',
+    '.css': 'text/css; charset=utf-8',
+    '.gif': 'image/gif',
+    '.htm': 'text/html; charset=utf-8',
+    '.html': 'text/html; charset=utf-8',
+    '.ico': 'image/x-icon',
+    '.jpeg': 'image/jpeg',
+    '.jpg': 'image/jpeg',
+    '.js': 'text/javascript; charset=utf-8',
+    '.json': 'application/json; charset=utf-8',
+    '.map': 'application/json; charset=utf-8',
+    '.mjs': 'text/javascript; charset=utf-8',
+    '.otf': 'font/otf',
+    '.png': 'image/png',
+    '.svg': 'image/svg+xml',
+    '.ttf': 'font/ttf',
+    '.txt': 'text/plain; charset=utf-8',
+    '.wasm': 'application/wasm',
+    '.webmanifest': 'application/manifest+json',
+    '.webp': 'image/webp',
+    '.woff': 'font/woff',
+    '.woff2': 'font/woff2',
+};
+const serveRunFile = async (args) => {
+    const segments = args.pathname.split('/').slice(2).map((segment) => decodeURIComponent(segment));
+    const runId = segments.shift();
+    const run = args.model.runs.find((candidate) => candidate.id === runId);
+    if (!run || segments.length === 0 || segments.some((segment) => (!segment
+        || segment === '.'
+        || segment === '..'
+        || segment.startsWith('.')
+        || segment.includes('/')
+        || segment.includes('\\')))) {
+        args.response.writeHead(404).end('not found');
+        return;
+    }
+    const root = await realpath(run.root).catch(() => null);
+    const candidate = path.resolve(run.root, ...segments);
+    const file = await realpath(candidate).catch(() => null);
+    if (!root || !file || (file !== root && !file.startsWith(`${root}${path.sep}`))) {
+        args.response.writeHead(403).end('forbidden');
+        return;
+    }
+    if (path.relative(root, file).split(path.sep).some((segment) => segment.startsWith('.'))) {
+        args.response.writeHead(404).end('not found');
+        return;
+    }
+    const details = await stat(file).catch(() => null);
+    if (!details?.isFile()) {
+        args.response.writeHead(404).end('not found');
+        return;
+    }
+    args.response.writeHead(200, {
+        'content-type': CONTENT_TYPES[path.extname(file).toLowerCase()] ?? 'application/octet-stream',
+        'content-length': details.size,
+        'cache-control': 'no-store',
+        'x-content-type-options': 'nosniff',
+    });
+    if (args.method === 'HEAD')
+        args.response.end();
+    else
+        createReadStream(file).pipe(args.response);
+};
+/** Serves `/files/<run>/<path>` for the runs `model()` currently lists, read-only, on its own loopback port. */
+export const startReviewFilesServer = async (model) => {
+    let port = 0;
+    const server = http.createServer(async (request, response) => {
+        const method = request.method ?? 'GET';
+        try {
+            assertReviewFileAccess(request, { port });
+        }
+        catch (error) {
+            const refused = error;
+            response.writeHead(refused.status, { 'content-type': 'text/plain; charset=utf-8', allow: 'GET, HEAD' }).end(refused.message);
+            return;
+        }
+        let pathname;
+        try {
+            pathname = new URL(request.url ?? '/', 'http://127.0.0.1').pathname;
+        }
+        catch {
+            response.writeHead(400).end('bad request');
+            return;
+        }
+        if (!pathname.startsWith('/files/')) {
+            response.writeHead(404).end('not found');
+            return;
+        }
+        try {
+            await serveRunFile({ model: model(), pathname, method, response });
+        }
+        catch {
+            if (!response.headersSent)
+                response.writeHead(400).end('bad request');
+            else
+                response.destroy();
+        }
+    });
+    await new Promise((resolve, reject) => {
+        server.once('error', reject);
+        server.listen(0, '127.0.0.1', () => resolve());
+    });
+    const address = server.address();
+    if (!address || typeof address === 'string') {
+        await new Promise((resolve) => server.close(() => resolve()));
+        throw new Error('Review file server did not bind a local TCP port');
+    }
+    port = address.port;
+    return {
+        port,
+        close: () => new Promise((resolve, reject) => {
+            server.close((error) => { if (error)
+                reject(error);
+            else
+                resolve(); });
+        }),
+    };
+};
+//# sourceMappingURL=review-files-server.js.map