@picked/svelte 0.0.1-dev.1793776638554 → 0.0.1-dev.1793923852884

package/dist/plugins/devtools/DevToolsExperience.svelte

@@ -18,16 +18,14 @@
   import Sidebar from './sidebar/Sidebar.svelte'
   import SidebarFooter from './sidebar/SidebarFooter.svelte'
   import {
-    CUSTOM_TOOLS_OPEN_STORAGE_KEY,
+    ADVANCED_OPEN_STORAGE_KEY,
     CUSTOM_TOOLS_TAB,
-    DEVELOPER_OPEN_STORAGE_KEY,
     TAB_STORAGE_KEY,
     buildNav,
-    developerTabId,
-    isInCustomTools,
-    isInDeveloper,
+    isInAdvanced,
     readStored,
     resolveTab,
+    screenTabId,
     toolTabId,
     writeStored,
   } from './sidebar/nav'
@@ -46,6 +44,7 @@
     TAB_INTROS,
     configSourceLabel,
     derivePosture,
+    applyEdits,
     guideFixes,
     guideSections,
     readSavedPersonas,
@@ -62,26 +61,31 @@
     VariationsPanel,
   } from './review'
   import {
+    openPersonaJourney,
     screenQuestions,
     takePendingLoad,
     walkNotice,
     walkPersona,
+    type PendingLoad,
     type WalkSettings,
   } from './review/personas/load-persona'
+  import {
+    prefillPersona,
+    readActivePersona,
+    takePersonaLink,
+    writeActivePersona,
+    type Prefill,
+  } from './review/personas/persona-session'
   import ProjectScreen from './screens/project/ProjectScreen.svelte'
   import ComponentsListScreen from './screens/components/ComponentsListScreen.svelte'
   import ConfigScreen from './screens/config/ConfigScreen.svelte'
   import ContentListScreen from './screens/content/ContentListScreen.svelte'
   import EventsListScreen from './screens/events/EventsListScreen.svelte'
-  import ExperienceInstancesListScreen from './screens/experience-instances/ExperienceInstancesListScreen.svelte'
-  import ExperiencesListScreen from './screens/experiences/ExperiencesListScreen.svelte'
-  import FeaturesListScreen from './screens/features/FeaturesListScreen.svelte'
   import FieldsListScreen from './screens/fields/FieldsListScreen.svelte'
   import FrameworksListScreen from './screens/frameworks/FrameworksListScreen.svelte'
   import HistoryEntriesListScreen from './screens/history/HistoryEntriesListScreen.svelte'
   import IdentityScreen from './screens/identity/IdentityScreen.svelte'
   import PredicatesListScreen from './screens/predicates/PredicatesListScreen.svelte'
-  import ResponsesListScreen from './screens/responses/ResponsesListScreen.svelte'
   import CustomToolsScreen from './screens/custom-tools/CustomToolsScreen.svelte'
 
   const experience = getExperience()
@@ -118,22 +122,18 @@
   const sessionStorageOf = (): Storage => window.sessionStorage
   const localStorageOf = (): Storage => window.localStorage
 
-  /** The developer screens, keyed by their sidebar id. */
-  const DEVELOPER_COMPONENTS: Record<string, Component> = {
-    [developerTabId('project')]: ProjectScreen,
-    [developerTabId('components')]: ComponentsListScreen,
-    [developerTabId('config')]: ConfigScreen,
-    [developerTabId('content')]: ContentListScreen,
-    [developerTabId('events')]: EventsListScreen,
-    [developerTabId('experience-instances')]: ExperienceInstancesListScreen,
-    [developerTabId('experiences')]: ExperiencesListScreen,
-    [developerTabId('features')]: FeaturesListScreen,
-    [developerTabId('fields')]: FieldsListScreen,
-    [developerTabId('frameworks')]: FrameworksListScreen,
-    [developerTabId('history')]: HistoryEntriesListScreen,
-    [developerTabId('identity')]: IdentityScreen,
-    [developerTabId('predicates')]: PredicatesListScreen,
-    [developerTabId('responses')]: ResponsesListScreen,
+  /** The SDK's own screens, keyed by their sidebar id. */
+  const SCREEN_COMPONENTS: Record<string, Component> = {
+    [screenTabId('project')]: ProjectScreen,
+    [screenTabId('components')]: ComponentsListScreen,
+    [screenTabId('config')]: ConfigScreen,
+    [screenTabId('content')]: ContentListScreen,
+    [screenTabId('events')]: EventsListScreen,
+    [screenTabId('fields')]: FieldsListScreen,
+    [screenTabId('frameworks')]: FrameworksListScreen,
+    [screenTabId('history')]: HistoryEntriesListScreen,
+    [screenTabId('identity')]: IdentityScreen,
+    [screenTabId('predicates')]: PredicatesListScreen,
   }
 
   // ── The session record ───────────────────────────────────────────────────────────────────────
@@ -169,26 +169,24 @@
   )
   const storedTab = readStored(sessionStorageOf, TAB_STORAGE_KEY)
   let tab = $state(storedTab ?? 'guide')
-  let developerOpen = $state(readStored(sessionStorageOf, DEVELOPER_OPEN_STORAGE_KEY) === 'true')
-  let customOpen = $state(readStored(sessionStorageOf, CUSTOM_TOOLS_OPEN_STORAGE_KEY) !== 'false')
+  let advancedOpen = $state(readStored(sessionStorageOf, ADVANCED_OPEN_STORAGE_KEY) === 'true')
   let drawerOpen = $state(false)
 
   // A tab can disappear under the viewer (Feature flags once the feature list is empty), and a
-  // stored developer screen opens its group.
+  // stored Advanced screen opens its group.
   $effect(() => {
     const resolved = resolveTab(tab, nav)
     if (resolved !== tab) tab = resolved
-    if (isInDeveloper(tab, nav) && !developerOpen) developerOpen = true
-    if (isInCustomTools(tab, nav) && !customOpen) customOpen = true
+    if (isInAdvanced(tab, nav) && !advancedOpen) advancedOpen = true
   })
 
   const selectedItem = $derived(
-    [...nav.primary, ...nav.custom, ...nav.developer, ...nav.footer].find((item) => item.id === tab),
+    [...nav.primary, ...nav.advanced, ...nav.footer].find((item) => item.id === tab),
   )
   const selectedTool = $derived(
     [...tools, ...customTools, ...footer].find((tool) => toolTabId(tool.id) === tab),
   )
-  const developerScreen = $derived(DEVELOPER_COMPONENTS[tab])
+  const sdkScreen = $derived(SCREEN_COMPONENTS[tab])
 
   /**
    * Narrows a tab id to one of the review tabs.
@@ -214,23 +212,13 @@
   }
 
   /**
-   * Opens or folds the Custom Tools group, and remembers it.
+   * Opens or folds the Advanced group, and remembers it.
    *
-   * @example toggleCustom()
+   * @example toggleAdvanced()
    */
-  function toggleCustom(): void {
-    customOpen = !customOpen
-    writeStored(sessionStorageOf, CUSTOM_TOOLS_OPEN_STORAGE_KEY, String(customOpen))
-  }
-
-  /**
-   * Opens or folds the Developer group, and remembers it.
-   *
-   * @example toggleDeveloper()
-   */
-  function toggleDeveloper(): void {
-    developerOpen = !developerOpen
-    writeStored(sessionStorageOf, DEVELOPER_OPEN_STORAGE_KEY, String(developerOpen))
+  function toggleAdvanced(): void {
+    advancedOpen = !advancedOpen
+    writeStored(sessionStorageOf, ADVANCED_OPEN_STORAGE_KEY, String(advancedOpen))
   }
 
   // ── How to use ───────────────────────────────────────────────────────────────────────────────
@@ -262,7 +250,7 @@
       sections: guideSections(available, { lead, tools: toolSections }),
       fixes: guideFixes(available, options.guide.fixes),
       tabLabels: Object.fromEntries(
-        [...nav.primary, ...nav.custom, ...nav.footer].map((item) => [item.id, item.label]),
+        [...nav.primary, ...nav.footer].map((item) => [item.id, item.label]),
       ),
     }
   })
@@ -285,14 +273,22 @@
     writeAutoHide(localStorageOf, value)
   }
 
-  // ── A persona load, carried across its reload ────────────────────────────────────────────────
-  // Load reloads the page clean, so the walk runs here, as the devtools mount on the new page. The
-  // panel stays shut while it walks, so the reviewer watches the journey move, and opens on the
-  // Personas tab when the walk stops short.
+  // ── A persona session, carried across reloads ──────────────────────────────────────────────
+  // Walk through and Jump to step reload the page clean, so the session starts here, as the
+  // devtools mount on the new page, and again on every later page of the tab until Stop. Each
+  // start runs the persona's setup and pre-fills every step with its responses. A jump walks to
+  // its step first, with the panel shut so the reviewer watches the journey move, and opens on the
+  // Personas tab when the walk stops short. A shared link starts a walk-through on the page it
+  // opens.
   let personaWalkNotice = $state<{
     status: 'info' | 'success' | 'warning' | 'error'
     text: string
   } | null>(null)
+  /** The site's personas, once the option has loaded them. */
+  let sitePersonaList = $state.raw<Persona[]>([])
+  /** The persona this tab walks through as. */
+  let activePersona = $state.raw<Persona | null>(null)
+  let prefill: Prefill | null = null
 
   const walkSettings: WalkSettings = {
     exclude: options.hiddenExperienceKeys,
@@ -304,30 +300,108 @@
   }
 
   /**
-   * The persona a reload was for, among the site's and this browser's.
+   * A persona by id, among the site's as this browser edited them and this browser's own.
+   *
+   * @param {string} id - The persona's id.
+   * @param {readonly Persona[]} site - The site's personas.
+   * @returns {Persona | undefined} The persona, or `undefined` when none has the id.
+   * @example findPersona('mover', sitePersonaList)
+   */
+  function findPersona(id: string, site: readonly Persona[]): Persona | undefined {
+    const listed = applyEdits(site, readSavedPersonas(localStorageOf, client.projectId))
+    return [...listed.site, ...listed.own].find((persona) => persona.id === id)
+  }
+
+  /**
+   * Walks a jump to its step, then says how it went, opening the panel when it stopped short.
+   *
+   * @param {Persona} persona - The persona.
+   * @param {PendingLoad} pending - The jump.
+   * @returns {Promise<void>} Settles once the walk ends.
+   * @example await jump(persona, pending)
+   */
+  async function jump(persona: Persona, pending: PendingLoad): Promise<void> {
+    const stepName = pending.stop?.stepName ?? pending.stop?.stepKey ?? ''
+    personaWalkNotice = { status: 'info', text: `Jumping to “${stepName}” as ${persona.name}…` }
+    const outcome = await walkPersona(
+      client,
+      { ...persona, landing: pending.stop, passed: pending.passed },
+      walkSettings,
+    )
+    const notice = walkNotice(persona, outcome)
+    personaWalkNotice = notice
+    if (notice.status === 'success') return
+    selectTab('personas')
+    experience.open()
+  }
+
+  /**
+   * Starts or resumes this tab's persona session: a reload's start, a shared link, or the session
+   * a reload carried on.
    *
-   * @returns {Persona | undefined} The persona, or `undefined` when no load is waiting.
-   * @example pendingPersona()
+   * @returns {Promise<void>} Settles once the persona is set up and any jump has walked.
+   * @example await startPersonaSession()
    */
-  function pendingPersona(): Persona | undefined {
-    const id = takePendingLoad(sessionStorageOf())
-    if (id === null || !posture.canEditAnswers) return undefined
-    const saved = readSavedPersonas(localStorageOf, client.projectId)
-    return [...options.personas, ...saved].find((persona) => persona.id === id)
-  }
-
-  const walking = pendingPersona()
-  if (walking !== undefined) {
-    personaWalkNotice = { status: 'info', text: `Loading ${walking.name}…` }
-    void walkPersona(client, walking, walkSettings).then((outcome) => {
-      const notice = walkNotice(walking, outcome)
-      personaWalkNotice = notice
-      if (notice.status === 'success') return
-      selectTab('personas')
-      experience.open()
+  async function startPersonaSession(): Promise<void> {
+    const storage = sessionStorageOf()
+    const pending = takePendingLoad(storage)
+    const linked = takePersonaLink(window.location, (url) => {
+      window.history.replaceState(window.history.state, '', url)
     })
+    const site = await options.personas()
+    sitePersonaList = site
+    const id = pending?.id ?? linked ?? readActivePersona(storage)
+    if (id === null || !posture.canEditAnswers) return
+    const persona = findPersona(id, site)
+    if (persona === undefined || (pending === null && linked !== null && persona.source !== 'site')) {
+      writeActivePersona(storage, null)
+      return
+    }
+
+    writeActivePersona(storage, persona.id)
+    activePersona = persona
+    try {
+      await persona.setup?.(client)
+    } catch (error) {
+      const detail = error instanceof Error ? ` ${error.message}` : ''
+      personaWalkNotice = { status: 'error', text: `${persona.name}’s setup failed.${detail}` }
+    }
+
+    prefill = prefillPersona(
+      client,
+      { ...persona.responses, ...options.personaWalk.responses },
+      session.askedStore,
+    )
+    if (pending?.stop != null) await jump(persona, pending)
+    else if (pending !== null || linked !== null) {
+      await openPersonaJourney(client, persona, walkSettings)
+    }
   }
 
+  /**
+   * Ends this tab's persona session: every field gets its own default back.
+   *
+   * @example stopPersonaSession()
+   */
+  function stopPersonaSession(): void {
+    prefill?.stop()
+    prefill = null
+    writeActivePersona(sessionStorageOf(), null)
+    if (activePersona !== null) {
+      personaWalkNotice = {
+        status: 'success',
+        text: `Stopped walking through as ${activePersona.name}. Fields already filled in keep their values.`,
+      }
+    }
+
+    activePersona = null
+  }
+
+  void startPersonaSession()
+  $effect(() => () => {
+    prefill?.stop()
+  })
+
   // ── Dialog behaviour ─────────────────────────────────────────────────────────────────────────
   /** The open panel; Svelte sets it back to `null` when the panel unmounts. */
   let panel: HTMLDivElement | null = $state(null)
@@ -456,11 +530,9 @@
           <Sidebar
             {nav}
             selected={tab}
-            {developerOpen}
-            {customOpen}
+            {advancedOpen}
             onSelect={selectTab}
-            onToggleDeveloper={toggleDeveloper}
-            onToggleCustom={toggleCustom}
+            onToggleAdvanced={toggleAdvanced}
           />
           <SidebarFooter
             tools={nav.footer}
@@ -472,9 +544,9 @@
         </div>
 
         <section class="pane" aria-label={selectedItem?.label} data-testid="devtools-pane">
-          {#if developerScreen}
-            {@const Screen = developerScreen}
-            <div class="developer-body">
+          {#if sdkScreen}
+            {@const Screen = sdkScreen}
+            <div class="screen-body">
               <Screen />
             </div>
           {:else if tab === CUSTOM_TOOLS_TAB}
@@ -533,13 +605,15 @@
                   {client}
                   {posture}
                   journey={$journey}
-                  personas={options.personas}
+                  personas={sitePersonaList}
                   asked={$asked}
                   route={$route}
                   hiddenKeys={options.hiddenExperienceKeys}
                   codeOwned={options.codeOwnedFields}
                   personaWalk={options.personaWalk}
                   tools={personaTools}
+                  {activePersona}
+                  onStop={stopPersonaSession}
                   walkNotice={personaWalkNotice}
                   onWalkNoticeDismiss={() => (personaWalkNotice = null)}
                 />
@@ -557,6 +631,7 @@
     position={options.launcher.position}
     {autoHide}
     {preview}
+    walkingAs={activePersona?.name ?? null}
     onOpen={() => experience.open()}
   />
 {/if}
@@ -824,7 +899,7 @@
     display: grid;
   }
 
-  .developer-body {
+  .screen-body {
     flex: 1 1 auto;
     display: grid;
     min-height: 0;

package/dist/plugins/devtools/customTools.d.ts

@@ -28,7 +28,7 @@ export interface CustomTool {
      * `'review'` lists the tool as a tab of its own, beside the review tabs. `'personas'` shows it
      * as a section of the Personas & Scenarios tab, under its label. `'footer'` shows it as an icon
      * at the foot of the sidebar, beside the auto-hide switch, with its label as a tooltip.
-     * `'developer'` lists it as a row of its own in the sidebar's Custom Tools group.
+     * `'developer'` lists it as a top-level row of its own, after the review-placed tools.
      *
      * @default 'developer'
      */
@@ -82,7 +82,7 @@ export declare function personasTools(tools: readonly CustomTool[]): CustomTool[
  */
 export declare function footerTools(tools: readonly CustomTool[]): CustomTool[];
 /**
- * The tools listed in the sidebar's Custom Tools group.
+ * The tools listed as top-level rows after the review-placed tools.
  *
  * @param {readonly CustomTool[]} tools - The registered tools.
  * @returns {CustomTool[]} The unplaced tools and those placed `'developer'`, in registration order.

package/dist/plugins/devtools/derive/answer-display/answer-display.d.ts

@@ -53,6 +53,20 @@ export declare function questionOf(field: AnswerField): string;
  * kindOf({ key: 'quote', type: 'object', multiple: false }) // 'system'
  */
 export declare function kindOf(field: AnswerField): AnswerKind;
+/** How a question is drawn for a reviewer to answer, as a site draws it from the same config. */
+export type InputStyle = 'tiles' | 'pills' | 'checkboxes' | 'yes-no' | 'number' | 'text' | 'system';
+/**
+ * How a question is drawn, from its field's config alone: a single choice of up to eight options
+ * as tiles and of more as pills, a multiple choice as checkboxes, a yes-or-no question as two
+ * tiles, and anything else as its own input.
+ *
+ * @param {AnswerField} field - The field.
+ * @param {number} offered - How many of its options the step offers.
+ * @returns {InputStyle} The style to draw it in.
+ * @example
+ * inputStyleOf(coverLevel, 3) // 'tiles'
+ */
+export declare function inputStyleOf(field: AnswerField, offered: number): InputStyle;
 /**
  * Renders an answer for display. An object value is summarised rather than dumped; the panel
  * offers Copy for the reviewer who wants the payload.

package/dist/plugins/devtools/derive/answer-display/answer-display.js

@@ -1 +1 @@
-import{deslug as e}from"../plain-language/plain-language.js";var t=`No response yet`,n=`Set on its step`;function r(t){let n=t.name?.trim();return n!==void 0&&n.length>0?n:e(t.key)}function i(e){let t=e.label?.trim();return t!==void 0&&t.length>0?t:r(e)}function a(e){return e.type===`object`?`system`:e.options!==null&&e.options!==void 0&&e.options.length>0?`options`:e.type===`boolean`?`boolean`:e.type===`number`?`number`:`text`}function o(e,n){let r=n.options?.find(t=>t.value===e);return r===void 0?e===!0?`Yes`:e===!1?`No`:e===null?t:typeof e==`string`?e:typeof e==`number`?String(e):JSON.stringify(e):r.label}function s(e,t){return e==null||e===``?null:Array.isArray(e)?e.length===0?null:e.map(e=>o(e,t)).join(`, `):a(t)===`system`?n:o(e,t)}function c(e,t){let n=a(t),o=s(e,t);return{title:i(t),noun:r(t),kind:n,display:o,answered:o!==null,editable:n!==`system`}}function l(e,t,n=new Set){let r=new Set;for(let e of t)for(let t of e)t.type===`step`&&t.stepId!==void 0&&r.add(t.stepId);let i=new Set;for(let t of e)if(r.has(t.id))for(let e of t.fieldKeys)n.has(e)||i.add(e);return i}function u(e){return e===void 0?``:JSON.stringify(e,null,2)}export{l as askedFieldKeys,c as describeAnswer,a as kindOf,r as nounOf,i as questionOf,s as renderAnswer,u as systemPayload};
+import{deslug as e}from"../plain-language/plain-language.js";var t=`No response yet`,n=`Set on its step`;function r(t){let n=t.name?.trim();return n!==void 0&&n.length>0?n:e(t.key)}function i(e){let t=e.label?.trim();return t!==void 0&&t.length>0?t:r(e)}function a(e){return e.type===`object`?`system`:e.options!==null&&e.options!==void 0&&e.options.length>0?`options`:e.type===`boolean`?`boolean`:e.type===`number`?`number`:`text`}var o=8;function s(e,t){let n=a(e);return n===`options`?e.multiple?`checkboxes`:t<=o?`tiles`:`pills`:n===`boolean`?`yes-no`:n}function c(e,n){let r=n.options?.find(t=>t.value===e);return r===void 0?e===!0?`Yes`:e===!1?`No`:e===null?t:typeof e==`string`?e:typeof e==`number`?String(e):JSON.stringify(e):r.label}function l(e,t){return e==null||e===``?null:Array.isArray(e)?e.length===0?null:e.map(e=>c(e,t)).join(`, `):a(t)===`system`?n:c(e,t)}function u(e,t){let n=a(t),o=l(e,t);return{title:i(t),noun:r(t),kind:n,display:o,answered:o!==null,editable:n!==`system`}}function d(e,t,n=new Set){let r=new Set;for(let e of t)for(let t of e)t.type===`step`&&t.stepId!==void 0&&r.add(t.stepId);let i=new Set;for(let t of e)if(r.has(t.id))for(let e of t.fieldKeys)n.has(e)||i.add(e);return i}function f(e){return e===void 0?``:JSON.stringify(e,null,2)}export{d as askedFieldKeys,u as describeAnswer,s as inputStyleOf,a as kindOf,r as nounOf,i as questionOf,l as renderAnswer,f as systemPayload};

package/dist/plugins/devtools/derive/answer-display/index.d.ts

@@ -1,3 +1,3 @@
 /** @file Public entrypoint for how an answer is shown to a reviewer and whether it is editable. */
-export { askedFieldKeys, describeAnswer, kindOf, nounOf, questionOf, renderAnswer, systemPayload, } from './answer-display';
-export type { AnswerField, AnswerKind, AnswerView, AskedNode, AskedStep } from './answer-display';
+export { askedFieldKeys, describeAnswer, inputStyleOf, kindOf, nounOf, questionOf, renderAnswer, systemPayload, } from './answer-display';
+export type { AnswerField, AnswerKind, AnswerView, AskedNode, AskedStep, InputStyle, } from './answer-display';

package/dist/plugins/devtools/derive/answer-display/index.js

@@ -1 +1 @@
-export{askedFieldKeys,describeAnswer,kindOf,nounOf,questionOf,renderAnswer,systemPayload}from"./answer-display.js";
+export{askedFieldKeys,describeAnswer,inputStyleOf,kindOf,nounOf,questionOf,renderAnswer,systemPayload}from"./answer-display.js";

package/dist/plugins/devtools/derive/guide-sections/guide-sections.js

@@ -1 +1 @@
-var e=[{id:`session`,title:`See where you are`,steps:[],notes:[`To see the step you are on and every response so far, open **This session**.`],tab:`session`},{id:`answers`,title:`Change a response`,steps:[`Open **Responses**.`,`Find the field. Use **With a response**, **No response** or **All** to narrow the list.`,`Click **Change**, or **Add** if it has no response yet.`,`Pick or type the new response, then click **Save**.`],notes:[`To remove one response, click **Clear** beside it.`,`To start the whole experience again, click **Start over**, then **Clear everything**.`,`If a field says **Change it on its step**, go back to that step and change it there.`],tab:`answers`},{id:`journey`,title:`Go back to an earlier step`,steps:[`Open **Flow**.`,`Find a step on your route. Your route is blue, and your step says **You are here**.`,`Click the step, then click **Go back to this step**.`],notes:[`You can only go back to steps you have already visited.`,`To change how the flow is drawn, pick **Map**, **Timeline** or **Outline** at the top.`],tab:`journey`},{id:`personas`,title:`Try the experience as a visitor`,steps:[`Open **Personas & Scenarios**.`,`Click **Load** beside the visitor you want. The experience opens where they would be.`],notes:[`To keep where you are for later, click **Create**, give it a name, then click **Save**.`,`What you save stays in this browser only.`],tab:`personas`},{id:`variations`,title:`View a feature flag variant`,steps:[`Open **Feature flags**.`,`Find the feature flag and pick the variant you want.`,`Click **Show me this variant**. The page reloads showing it.`,`To share exactly what you saw, click **Copy link** and send it.`],notes:[`To go back to normal for that feature flag, click **Leave this one alone**.`],tab:`variations`}],t=[{tab:`journey`,entry:{problem:`I can't click a step in the Flow tab`,fix:`Go back only to steps you have visited.`}}];function n(e,t){return e!==`variations`||t.variations}function r(t,r){return[...r?.lead??[],...e.filter(e=>n(e.tab,t)),...r?.tools??[]]}function i(e,r){return[...t.filter(t=>n(t.tab,e)).map(e=>e.entry),...r??[]]}function a(e){let t=e.split(`**`);return t.length%2==0?[{text:e,bold:!1}]:t.map((e,t)=>({text:e,bold:t%2==1})).filter(e=>e.text.length>0)}export{a as emphasis,i as guideFixes,r as guideSections};
+var e=[{id:`session`,title:`See where you are`,steps:[],notes:[`To see the step you are on and every response so far, open **This session**.`],tab:`session`},{id:`answers`,title:`Change a response`,steps:[`Open **Responses**.`,`Find the field. Use **With a response**, **No response** or **All** to narrow the list.`,`Click **Change**, or **Add** if it has no response yet.`,`Pick or type the new response, then click **Save**.`],notes:[`To remove one response, click **Clear** beside it.`,`To start the whole experience again, click **Start over**, then **Clear everything**.`,`If a field says **Change it on its step**, go back to that step and change it there.`],tab:`answers`},{id:`journey`,title:`Go back to an earlier step`,steps:[`Open **Experiences**.`,`Find a step on your route. Your route is blue, and your step says **You are here**.`,`Click the step, then click **Go back to this step**.`],notes:[`You can only go back to steps you have already visited.`,`To change how the flow is drawn, pick **Map**, **Timeline** or **Outline** at the top.`,`To see where an experience shows and when it starts, pick **Details**.`,`To open an experience that is not on the page, pick it, then click **Launch experience**.`],tab:`journey`},{id:`personas`,title:`Try the experience as a visitor`,steps:[`Open **Personas & Scenarios**.`,`Click **Walk through** beside the visitor you want. The page starts again.`,`Go through the experience. Each step shows their responses. Click **Continue**, or change a response first.`,`When you are done, click **Stop** at the top of the tab.`],notes:[`To start further in, click **Jump to step**, then pick the step.`,`To change a persona, click **Edit**. Your change stays in this browser only.`,`To keep where you are for later, click **Create**, give it a name, then click **Save**.`,`To send a site persona to someone else, click its copy icon and share the link.`],tab:`personas`},{id:`variations`,title:`View a feature flag variant`,steps:[`Open **Feature flags**.`,`Find the feature flag and pick the variant you want.`,`Click **Show me this variant**. The page reloads showing it.`,`To share exactly what you saw, click **Copy link** and send it.`],notes:[`To go back to normal for that feature flag, click **Leave this one alone**.`],tab:`variations`}],t=[{tab:`journey`,entry:{problem:`I can't click a step in the Experiences tab`,fix:`Go back only to steps you have visited.`}}];function n(e,t){return e!==`variations`||t.variations}function r(t,r){return[...r?.lead??[],...e.filter(e=>n(e.tab,t)),...r?.tools??[]]}function i(e,r){return[...t.filter(t=>n(t.tab,e)).map(e=>e.entry),...r??[]]}function a(e){let t=e.split(`**`);return t.length%2==0?[{text:e,bold:!1}]:t.map((e,t)=>({text:e,bold:t%2==1})).filter(e=>e.text.length>0)}export{a as emphasis,i as guideFixes,r as guideSections};

package/dist/plugins/devtools/derive/index.d.ts

@@ -2,8 +2,8 @@
  * @file Public entrypoint for the review tools' pure derivations. Every panel stays thin by pushing
  * its thinking here, where it is tested off plain objects with no client, no DOM and no store.
  */
-export { askedFieldKeys, describeAnswer, kindOf, nounOf, questionOf, renderAnswer, systemPayload, } from './answer-display';
-export type { AnswerField, AnswerKind, AnswerView, AskedNode, AskedStep } from './answer-display';
+export { askedFieldKeys, describeAnswer, inputStyleOf, kindOf, nounOf, questionOf, renderAnswer, systemPayload, } from './answer-display';
+export type { AnswerField, AnswerKind, AnswerView, AskedNode, AskedStep, InputStyle, } from './answer-display';
 export { isBlank, nextHistory, submittedAnswers } from './answer-history';
 export type { HistoryAnswer, HistoryEntry, HistoryEvent } from './answer-history';
 export { emphasis, guideFixes, guideSections } from './guide-sections';
@@ -16,12 +16,12 @@ export { COLOURS, LANE_WIDTH, ROW_HEIGHT, buildTimeline } from './journey-timeli
 export type { TimelineEdge, TimelineLayout, TimelineNext, TimelineNode } from './journey-timeline';
 export { BREADTH, DEPTH, buildTree } from './journey-tree';
 export type { FlowEnd, TreeInput, TreeJump, TreeLayout, TreeLink, TreeNode, TreeNodeKind, } from './journey-tree';
-export { DEVELOPER_LABEL, NODE_LABELS, TAB_INTROS, TAB_LABELS, configSourceLabel, deslug, screenName, } from './plain-language';
+export { NODE_LABELS, TAB_INTROS, ADVANCED_LABEL, TAB_LABELS, configSourceLabel, deslug, screenName, } from './plain-language';
 export type { ReviewTabId } from './plain-language';
 export { builderGraph, responseKeysOf, walkDraft } from './persona-builder';
 export type { BuilderCondition, BuilderEdge, BuilderField, BuilderInput, BuilderJourney, BuilderNode, BuilderRow, BuilderStep, BuilderWalk, GraphSource, } from './persona-builder';
-export { PERSONA_STORAGE_PREFIX, buildPersona, customerAnswers, describeLanding, entryUrlOf, passedScreens, personaStorageKey, readAnswers, readEntryUrl, readSavedPersonas, sitePersonas, writeSavedPersonas, } from './personas';
-export type { BuildPersonaResult, Persona, PersonaCapture, PersonaDefinition, PersonaDraft, PersonaLanding, PersonaLoader, PersonaScreen, PersonaSource, PersonaStorageGetter, } from './personas';
+export { PERSONA_STORAGE_PREFIX, applyEdits, buildPersona, customerAnswers, describeLanding, entryUrlOf, groupPersonas, matchesSearch, passedScreens, personaStorageKey, readAnswers, readEntryUrl, readLanding, readPassed, readSavedPersonas, sitePersonas, startOf, writeSavedPersonas, } from './personas';
+export type { BuildPersonaResult, EditedPersonas, Persona, PersonaCapture, PersonaDefinition, PersonaDraft, PersonaGroup, PersonaLanding, PersonaScreen, PersonaSetup, PersonaSource, PersonaStorageGetter, } from './personas';
 export { UNDESCRIBABLE, describeRule, varKeyOf } from './plain-logic';
 export type { FieldLookup, FieldSummary } from './plain-logic';
 export { derivePosture } from './safety-posture';

package/dist/plugins/devtools/derive/index.js

@@ -1 +1 @@
-import{isBlank as e,nextHistory as t,submittedAnswers as n}from"./answer-history/answer-history.js";import{DEVELOPER_LABEL as r,NODE_LABELS as i,TAB_INTROS as a,TAB_LABELS as o,configSourceLabel as s,deslug as c,screenName as l}from"./plain-language/plain-language.js";import{PERSONA_STORAGE_PREFIX as u,buildPersona as d,customerAnswers as f,describeLanding as p,entryUrlOf as m,passedScreens as h,personaStorageKey as g,readAnswers as _,readEntryUrl as v,readSavedPersonas as y,sitePersonas as b,writeSavedPersonas as x}from"./personas/personas.js";import{askedFieldKeys as S,describeAnswer as C,kindOf as w,nounOf as T,questionOf as E,renderAnswer as D,systemPayload as O}from"./answer-display/answer-display.js";import{emphasis as k,guideFixes as A,guideSections as j}from"./guide-sections/guide-sections.js";import{UNDESCRIBABLE as M,describeRule as N,varKeyOf as P}from"./plain-logic/plain-logic.js";import{buildOutline as F}from"./journey-outline/journey-outline.js";import{nextOpenOrder as I,pickJourney as L}from"./journey-pick/journey-pick.js";import{BREADTH as R,DEPTH as z,buildTree as B}from"./journey-tree/journey-tree.js";import"./journey-tree/index.js";import{COLOURS as V,LANE_WIDTH as H,ROW_HEIGHT as U,buildTimeline as W}from"./journey-timeline/journey-timeline.js";import"./journey-timeline/index.js";import{builderGraph as G,responseKeysOf as K,walkDraft as q}from"./persona-builder/persona-builder.js";import{derivePosture as J}from"./safety-posture/safety-posture.js";import{nextTrails as Y}from"./visited-steps/visited-steps.js";import{nextRoute as X}from"./walk-route/walk-route.js";export{R as BREADTH,V as COLOURS,z as DEPTH,r as DEVELOPER_LABEL,H as LANE_WIDTH,i as NODE_LABELS,u as PERSONA_STORAGE_PREFIX,U as ROW_HEIGHT,a as TAB_INTROS,o as TAB_LABELS,M as UNDESCRIBABLE,S as askedFieldKeys,F as buildOutline,d as buildPersona,W as buildTimeline,B as buildTree,G as builderGraph,s as configSourceLabel,f as customerAnswers,J as derivePosture,C as describeAnswer,p as describeLanding,N as describeRule,c as deslug,k as emphasis,m as entryUrlOf,A as guideFixes,j as guideSections,e as isBlank,w as kindOf,t as nextHistory,I as nextOpenOrder,X as nextRoute,Y as nextTrails,T as nounOf,h as passedScreens,g as personaStorageKey,L as pickJourney,E as questionOf,_ as readAnswers,v as readEntryUrl,y as readSavedPersonas,D as renderAnswer,K as responseKeysOf,l as screenName,b as sitePersonas,n as submittedAnswers,O as systemPayload,P as varKeyOf,q as walkDraft,x as writeSavedPersonas};
+import{isBlank as e,nextHistory as t,submittedAnswers as n}from"./answer-history/answer-history.js";import{ADVANCED_LABEL as r,NODE_LABELS as i,TAB_INTROS as a,TAB_LABELS as o,configSourceLabel as s,deslug as c,screenName as l}from"./plain-language/plain-language.js";import{PERSONA_STORAGE_PREFIX as u,applyEdits as d,buildPersona as f,customerAnswers as p,describeLanding as m,entryUrlOf as h,groupPersonas as g,matchesSearch as _,passedScreens as v,personaStorageKey as y,readAnswers as b,readEntryUrl as x,readLanding as S,readPassed as C,readSavedPersonas as w,sitePersonas as T,startOf as E,writeSavedPersonas as D}from"./personas/personas.js";import{askedFieldKeys as O,describeAnswer as k,inputStyleOf as A,kindOf as j,nounOf as M,questionOf as N,renderAnswer as P,systemPayload as F}from"./answer-display/answer-display.js";import{emphasis as I,guideFixes as L,guideSections as R}from"./guide-sections/guide-sections.js";import{UNDESCRIBABLE as z,describeRule as B,varKeyOf as V}from"./plain-logic/plain-logic.js";import{buildOutline as H}from"./journey-outline/journey-outline.js";import{nextOpenOrder as U,pickJourney as W}from"./journey-pick/journey-pick.js";import{BREADTH as G,DEPTH as K,buildTree as q}from"./journey-tree/journey-tree.js";import"./journey-tree/index.js";import{COLOURS as J,LANE_WIDTH as Y,ROW_HEIGHT as X,buildTimeline as Z}from"./journey-timeline/journey-timeline.js";import"./journey-timeline/index.js";import{builderGraph as Q,responseKeysOf as $,walkDraft as ee}from"./persona-builder/persona-builder.js";import{derivePosture as te}from"./safety-posture/safety-posture.js";import{nextTrails as ne}from"./visited-steps/visited-steps.js";import{nextRoute as re}from"./walk-route/walk-route.js";export{r as ADVANCED_LABEL,G as BREADTH,J as COLOURS,K as DEPTH,Y as LANE_WIDTH,i as NODE_LABELS,u as PERSONA_STORAGE_PREFIX,X as ROW_HEIGHT,a as TAB_INTROS,o as TAB_LABELS,z as UNDESCRIBABLE,d as applyEdits,O as askedFieldKeys,H as buildOutline,f as buildPersona,Z as buildTimeline,q as buildTree,Q as builderGraph,s as configSourceLabel,p as customerAnswers,te as derivePosture,k as describeAnswer,m as describeLanding,B as describeRule,c as deslug,I as emphasis,h as entryUrlOf,g as groupPersonas,L as guideFixes,R as guideSections,A as inputStyleOf,e as isBlank,j as kindOf,_ as matchesSearch,t as nextHistory,U as nextOpenOrder,re as nextRoute,ne as nextTrails,M as nounOf,v as passedScreens,y as personaStorageKey,W as pickJourney,N as questionOf,b as readAnswers,x as readEntryUrl,S as readLanding,C as readPassed,w as readSavedPersonas,P as renderAnswer,$ as responseKeysOf,l as screenName,T as sitePersonas,E as startOf,n as submittedAnswers,F as systemPayload,V as varKeyOf,ee as walkDraft,D as writeSavedPersonas};

package/dist/plugins/devtools/derive/personas/index.d.ts

@@ -1,3 +1,3 @@
 /** @file Public entrypoint for personas: building, saving, reading and describing them. */
-export { PERSONA_STORAGE_PREFIX, buildPersona, customerAnswers, describeLanding, entryUrlOf, passedScreens, personaStorageKey, readAnswers, readEntryUrl, readSavedPersonas, sitePersonas, writeSavedPersonas, } from './personas';
-export type { BuildPersonaResult, Persona, PersonaCapture, PersonaDefinition, PersonaDraft, PersonaLanding, PersonaLoader, PersonaScreen, PersonaSource, PersonaStorageGetter, } from './personas';
+export { PERSONA_STORAGE_PREFIX, applyEdits, buildPersona, customerAnswers, describeLanding, entryUrlOf, groupPersonas, matchesSearch, passedScreens, personaStorageKey, readAnswers, readEntryUrl, readLanding, readPassed, readSavedPersonas, sitePersonas, startOf, writeSavedPersonas, } from './personas';
+export type { BuildPersonaResult, EditedPersonas, Persona, PersonaCapture, PersonaDefinition, PersonaDraft, PersonaGroup, PersonaLanding, PersonaScreen, PersonaSetup, PersonaSource, PersonaStorageGetter, } from './personas';

package/dist/plugins/devtools/derive/personas/index.js

@@ -1 +1 @@
-export{PERSONA_STORAGE_PREFIX,buildPersona,customerAnswers,describeLanding,entryUrlOf,passedScreens,personaStorageKey,readAnswers,readEntryUrl,readSavedPersonas,sitePersonas,writeSavedPersonas}from"./personas.js";
+export{PERSONA_STORAGE_PREFIX,applyEdits,buildPersona,customerAnswers,describeLanding,entryUrlOf,groupPersonas,matchesSearch,passedScreens,personaStorageKey,readAnswers,readEntryUrl,readLanding,readPassed,readSavedPersonas,sitePersonas,startOf,writeSavedPersonas}from"./personas.js";