Skip to main content

Pages

Sources

Docs: Ponder Primer and Panes Web App: Open a Composed Parable, select Pieces, and choose a Page from the unified tree. Home is a Page and stays visible beside the other Pages, even before other Pages exist. A Page is a major destination in a Composed Parable. It gives people a stable place to read, explore, or complete work, and it is composed entirely of Panes. A Page has React code, a Perception that lists the Panes it renders, Policies, and a Palette. The Perception and Policies are part of the Page and are versioned with it; the Palette is created with the Page and deleted with it. A Page is composition only: it holds no data and no SQL of its own. Anything with data belongs in a Pane. A Page places the Pane that owns a Plot, and that Pane renders the Plot’s rows. Page code that reads a declared Pane’s Plot, such as panes.roster.plots.rosterPeople(), gets the note page-plot-read in its Warnings & Errors. Every Parable has a Home Page. Additional Pages can sit beneath another Page to form clear navigation without turning every small region into a destination. Every Page except Home has a parent Page. A save that creates a Page with no parent puts it under Home, after Home’s other child Pages. A save that moves an existing Page to no parent is refused. The Pages tree shows Home and the Page hierarchy. Direct links keep their stable Page identities. A Pane moves the reader to another Page with pages.open('<handle>') and back with pages.back(), from its generated module (What a Pane’s code can reach). Opening a Page adds a browser history entry and records where the reader came from in the address (pageFrom), so browser Back returns there too, and pages.current().from lets the opened Page name the way back (“Back to Time Spend”). Without a recorded origin, pages.back() goes to the parent Page, then Home. The move keeps the Page’s frame running and animates to the new Page once it has drawn. In Ponder’s chat, the Page tabs beside the prompt list every Page that renders something, in tree order, and follow the address when a Pane or browser Back moves it. Above the content, the breadcrumb shows the path to the selected Piece, followed by a separate description band. The context selectors share the available width and wrap onto another row when their labels need more room.

Build a Page

1

Name the destination

Use a short label that tells a reader what they will accomplish there.
2

Describe its job

Explain the outcome in one sentence before adding controls or implementation detail. Adding a Page opens a dialog that asks for its name and this description, and every Page needs one: a save that leaves a Page without a description is refused.
3

Declare its Panes

Add each Pane the Page renders to its Perception. The Page’s code may import only the Panes it declares and the runtime layout modules. Any other import, such as a chart or control library, is refused at save with a message that names it; put that content in a Pane.
4

Preview the complete route

Check navigation, empty states, keyboard use, theme, and the supported viewport sizes. A Page that declares no Pane yet shows an “add a Pane” placeholder and can still be saved.
5

Review the Patch

A Page that still declares no Pane, or declares a Pane that no longer exists, is reported as a finding when the change is published.

Preview

A Parable’s preview is a picture of the Parable. It sits at the top of the Parable’s card in the sidebar, above its mark, name and description, and it belongs to the Parable’s identity with them. Under the description, the card shows the values on the Parable’s page, which belong to the identity too (valueProposition). Pointing at the Parable opens the card. A Parable has two kinds of preview, and each Workspace shows one kind.
  • The screenshot is the first screen of one Page, drawn by the app on a sample company’s generated data, never on a Workspace’s own data. Every Workspace that can see the Parable sees its preview, so it shows no real person, customer or number. There are two images, one in light and one in dark. The card shows the one for the reader’s theme.
  • The camera lays the Page out in a 960 × 600 desktop window and keeps the whole first screen, with no crop. The card widens to show it about 456 pixels wide at its own aspect ratio, so it shows the layout, the main numbers and the charts of the Page. Small text is not meant to be read there.
  • The illustration is a drawn SVG that shows what the Parable does: one SVG document, 1280 × 608, that draws in light and dark, saved as previewSvg. The server keeps only an illustration drawn with basic shapes, paths, groups, patterns and styles, at most 32 KB.
  • A Workspace’s preview style picks the kind its cards show. It is the Early Access release “Parable Preview Illustrations”: off shows screenshots, on shows illustrations. When a Parable has no preview of that kind, the card shows the other kind. Admin pages show the screenshot when there is one. On a Workspace host, a Parable’s animated pictures from Ponder Details come before both kinds.
  • Ponder makes both kinds at Ponder Strong, by step 7 of the Pages Power. The tool Make a Parable’s preview stores the two images and answers their ids. Ponder then draws the illustration and saves both with the Parable’s identity, as previewLightSha256, previewDarkSha256 and previewSvg, through Rename a Parable or change how it is labelled. A save of one kind does not change the other. In Personal mode the edit saves at once. In Publishing mode the edit takes proposalId, the id of your open Changes, and lands in them. A Parable Pro can set it on any Parable.
  • A Parable that the sample company does not run cannot have a screenshot yet. Its card shows its illustration.
  • A refused preview is a 400 with the code PREVIEW_INVALID (PA-AU-053). Its message names the rule, and details.rule holds the rule alone: an image id with no stored image, an image of the other theme, one id without the other, or an illustration rule. When Ponder sends the preview, the call fails with PONDER_TOOL_PREVIEW_INVALID, and the recovery text names the rule.
  • The Directory tools that Ponder reads (list_parable_directory, read_directory_entry and find_parable_directory_entry) do not return the preview. On a Workspace host, the sidebar reads the names of the previews with the Directory through GET /api/parable/directory/with-previews on the Workspace API, which is not an MCP tool. That list has no page limit: it answers every entry the reader may see, because the sidebar lists and searches the answer as the whole Directory. It carries only the kind of preview that the card shows, and it carries names, not previews: the SHA-256 of each animated picture’s program (pictureSha256s), the two image ids of a screenshot, or the SHA-256 of an illustration (previewSvgSha256). On an Admin page, the sidebar reads the same names and each Parable’s description from the Admin Parable list (GET /api/parable/product-parables on web-admin-api). That list shows only the Parables that the reader may see.
  • The card loads its preview when it opens. A screenshot loads from /api/parable-previews/<image id>. An illustration loads from /api/parable-previews/illustrations/<list>/<Parable id>?theme=<light|dark>&v=<SHA-256> on the web app, which sets the reader’s theme on the SVG and serves it as an image with a strict Content Security Policy, so the file runs no script and loads nothing. <list> is the list the card came from, and that list’s API checks the read. workspace asks the Workspace API (GET /api/parable/directory/by-parable/{parableId}/preview-illustration), which answers only for a Parable that the reader’s Directory lists. admin asks web-admin-api (GET /api/parable/product-parables/{id}/preview-illustration), which needs the reader’s seat on the Parable’s origin line, as the Admin list does. Any other reader gets a 404 or a 403. So the app shell’s load carries no SVG.
  • An animated picture is a Canvas program. The card picks one of the names once per page load, the pick the Ponder Details window shows, and loads its program from /api/parable-previews/pictures/<Parable id>/<SHA-256> on the web app. That route asks the Workspace API (GET /api/parable/directory/by-parable/{parableId}/preview-pictures/{sha256}), which answers only for a Parable that the reader’s Directory lists, and only for a name that the card plays now. The route answers that ParablePreviewPictureView as it is, and the browser keeps it for a year under its name. The card reads it with the generated reader. The program runs only in the sandboxed program frame, with an opaque origin and no network. The card of a Workspace copy plays the pictures of its source, because every line of a Parable reads its one product row.
  • A Parable in Publishing mode publishes only when it has a description. It does not need a preview. Publish refuses a Parable without a description, with a 409 and the code IDENTITY_REQUIRED (PA-AU-079), and details.missing names the description. A Personal Parable, and a Parable that another Workspace delivered, do not need one. The save of a setting that a Version from before Typed Panes declares Versioned<> publishes a Version without one, because the person saved a setting and did not publish the Parable.
  • A Parable that is not Personal gets a card picture by itself. At its first Propose, or at a Publish while it has no picture, Ponder Details makes an image set at Speedy: a scene and a story, with logos off. The scene goes on the card. A person’s favorite image replaces it at once, without a Publish.
  • Prepare writes no finding about the preview. It writes a finding about the description: on a Parable in Publishing mode with no description, Prepare stores a blocking finding with Publish’s own sentence, so the person reads the refusal before they press Publish. That finding keeps the code missing_preview, which PARABLE-9160 gave the identity finding. A finding with that code from an older Prepare can still name a missing preview.

Formats

Every Page has a format. You choose it when you create the Page, and it does not change after that. A Product Page is the Page this document describes: it arranges Panes, and Home is always one. The other formats are Pages too. They keep routes, the tree, Changes, Versions, Policies, Palettes and Pane references, and each one adds authored content. The Add menu lists the formats under Pages and offers only the formats the selected Page may hold. On a deck it offers Slide. Nobody adds a Participants Page: Parable makes one with each Probe, in the same save, and refuses to delete or move it while its Probe stays. The server refuses any other placement and names the rule. To change a format, create a new Page and move the content to it. Formats are not an app builder. Each one is a data model the server checks, parts Parable draws, and a limit on what Ponder writes. A Page cannot store data its format does not model, add routes, or reach the network. A new formatted Page starts with its format’s empty content, and there is no starting content to pick from. Its layout draws an empty state with Ask Ponder, which puts the start of a request in Ponder’s composer for you to finish. The one exception is the Probe: a new Probe starts as the Example Probe, “Feedback on this Parable”, under an Example banner (see Probes). Who writes the layout depends on the format:
  • Prose, Playbook, Proceedings and Participants draw a layout that Parable ships. The Page’s code is one line that names it, such as export { PlaybookPage as default } from 'parable/pages';, and the server refuses any other code for these formats. When Parable improves a layout, every Page of the format draws the new one.
  • Presentation and Probe layouts are written by Ponder, inside a frame from parable/pages: each slide inside Slide, and a Probe inside ProbeForm (see Sandbox design system).
What the author writes is stored beside the code as the Page’s content, and its images as the Page’s assets. Both version with the Page and publish through Changes like any other edit. Content may show a live Pane only when the Page’s Perception declares that Pane. Links may use only http, https or mailto. An image you paste, drop or choose is scaled to at most 1600 px wide and stored as WebP, or JPEG in a browser that cannot write WebP. One image may be at most 256 KB, and the images of one Page at most 4 MB. The app refuses a file over 20 MB or 40 megapixels, an image taller than 16,383 px once scaled, and an image that still does not fit, and it says why. If a Page’s content does not read as content of its format, the canvas shows an error in place of the Page and writes nothing over it. Download Parable writes a formatted Page’s content and images as content.json and assets.json beside its index.tsx. An import restores them with the Page’s format, and it refuses an archive that changes the format of a Page that already exists.

What changes where

  • The shape of every format is fixed on the canvas: the layout, a deck’s slides, a Playbook’s steps, a meeting’s write-up, a Probe’s questions. It changes when you prompt Ponder. There is no visual shape editor yet.
  • Prose and Proceedings are the formats you type in place. You may type where you may edit the Page here and now: in an editable set of Changes, with the Page’s own edit grant. A Prose Page is one document. Its first line is its title, in the Title style. The style menu sets any line to Title, Subtitle, Heading 1 to 3, or Normal text. The toolbar is a bar across the top of the Page while you may edit it, as in a document editor, and its Insert menu adds tables, dividers, quotes, code blocks, callouts and declared Panes. Type / at the start of an empty line to insert the same blocks where the cursor is, and type a word to filter them. At 1200 px wide and more, an outline of the title and headings sits beside the document, marks the heading you read, and ends with the word count and reading time. Print draws the document alone.
  • A Probe is answered in place, in every mode except View as. Each person’s answers are kept for them (see Probes).
  • On a Proceedings Page you edit the title, the overview and the notes in place, and check off an action item or edit its words and its owner. Every action item has its circle. The notes have their own heading. Each line of the transcript is a button that will play the recording from that time; a meeting has no recording yet, so it does nothing today. The source shows as its tool’s logo, such as Zoom’s.
  • Playbook and Presentation words change through Ponder.
A formatted Page looks the same in every participation mode. The canvas has no band of its own: the breadcrumb names the Page, and the Page’s acts sit at the end of that row. On a Presentation that is Present, which shows the deck full screen (see Presentations). A slide draws as a 16:9 card on the canvas, scaled to fit. A formatted Page also draws in Ponder’s Page area, above the conversation. In Publishing, a formatted Page’s drawer holds the same editors as a Product Page. In Pinging and Peeking it has no drawer: the Page is there to be read.

Probes

A Probe has a definition and a layout. The definition is what the Probe asks and how: sections of questions, required answers, checks on each answer, conditions that show or hide a question, rules that move the person or end the Probe, and endings. Its model covers what Google Forms, Typeform and SurveyMonkey ask, as one answer shape for every question type, so a question can change its look without losing the answers. The layout is how the Probe looks. Ponder writes both, and the layout draws every answer through the design system’s Probe components, so a Probe can look like anything and still store the same answers. Each person’s response is theirs: a record of the Probe for that person, saved as a draft while they answer and checked again by the server when they press Submit. A required question on the person’s path must have an answer, and an answer that does not fit its question is refused with the reason. An answer to a question the person never saw is not kept. Parable draws three things above every Probe, outside its layout:
  • the Example banner on an Example Probe, with Ask Ponder to change it for people who publish. An example cannot open and keeps no answers. The first change to its questions makes it a Probe of its own.
  • before the first answer, who can read the answers: the levels and Roles the Probe’s view.responses Policy names. By default that is Publishing and Primary.
  • why the Probe takes no answers now: not open yet, paused, closed, or full.
The Participants Page under each Probe shows the counts (invited, started, submitted, and completion: the invited people who submitted), each invited person’s status, and, for people the Probe’s view.responses Policy admits, every answer in a Responses table. People who may manage the Probe open, pause and close it there, invite people who have a seat, remind everyone who has not submitted, and revoke an invitation. An invitation and a reminder are recorded on the roster; Parable does not send them yet. They also set how the Probe runs, in How it runs. Each change saves at once:
  • Who answers: everyone with a seat on the Parable, or only invited people.
  • Responses per person: one, or any number.
  • Change a submitted response: not allowed, or while the Probe is open.
  • People can withdraw their response.
  • Anonymous: the roster shows no status for one person, and the Responses table names nobody and stays empty until three people have answered. A Probe cannot go back from anonymous once someone has answered. A Probe that asks who the person is cannot be anonymous: a question marked identifying, a box for an email address or a phone number, or a name, address or contact preset.
  • Closes: a time when the Probe closes, and Close after this many responses.

Keep the hierarchy useful

Use a child Page when the content deserves its own route and title. Use a Pane when it belongs inside the current Page. Use a Package when several related Panes should move and be reviewed together. If a Page appears in the tree but cannot render, keep the current Patch, read the visible preview error, and repair the Page or one of the Panes it declares. Do not delete and recreate it merely to clear an error; that would create a new identity and can break links to the existing Page. While editing, the document drawer’s tabs are Programming (the React source, with the Perception beside it), Palette, Policies, Preferences, Plots (the Plots of the Panes it declares, to read; a Page owns none), Panes (the Panes it declares, as one tree, each once with Open), and Performance (how the Page drew for you while you record; see Panes). The drawer starts closed, and then stays as you leave it: moving to another Page or Pane keeps it open or closed and on the same tab, or on the first tab when that Piece has no such tab. Preview failures leave its header and editors available. Drag the drawer’s top border to resize it, and use Auto or the device buttons in the panel footer to size the preview.