@picked/svelte 0.0.1-dev.1784003142683 → 0.0.1-dev.1784265353357

package/dist/experience/HtmlRender.svelte

@@ -0,0 +1,52 @@
+<script lang="ts">
+  /**
+   * @file Renders a resolved html-asset field into a shadow root and re-executes its
+   * Picked-tagged scripts. On the server the markup is emitted as a declarative shadow DOM
+   * template, a parser-only feature the browser attaches as a real shadow root while parsing
+   * the response, so content is present from first paint. On the client, the first commit
+   * adopts that parser-attached root and only rehydrates its scripts; a client-only mount or a
+   * later content change attaches and writes the shadow root imperatively instead.
+   */
+  import {
+    isHtmlAssetValue,
+    rehydrateScripts,
+    supportsShadowRoot,
+    supportsWindow,
+  } from '@picked/client'
+
+  interface Props {
+    /** The resolved html-asset field value (for example `content.body`). */
+    html: unknown
+  }
+
+  const { html }: Props = $props()
+
+  const value = $derived(isHtmlAssetValue(html) ? html : null)
+  const markup = $derived(value?.content ?? '')
+  const serverMarkup = $derived(
+    supportsWindow() ? '' : `<template shadowrootmode="open">${markup}</template>`,
+  )
+
+  let host = $state<HTMLDivElement>()
+  let seeded = false
+
+  $effect(() => {
+    if (!supportsShadowRoot() || !host) return
+
+    const existingShadow = host.shadowRoot
+    const isFirstRun = !seeded
+    seeded = true
+
+    if (existingShadow && isFirstRun) {
+      if (markup) void rehydrateScripts(existingShadow)
+      return
+    }
+
+    const shadow = existingShadow ?? host.attachShadow({ mode: 'open' })
+    shadow.innerHTML = markup
+    if (markup) void rehydrateScripts(shadow)
+  })
+</script>
+
+<!-- eslint-disable-next-line svelte/no-at-html-tags -- markup is a trusted, Picked-transformed html-asset field, not arbitrary user input -->
+<div bind:this={host}>{@html serverMarkup}</div>

package/dist/hooks/client.d.ts

@@ -1,25 +1,13 @@
 import { Picked, ExperienceInstance } from '@picked/client';
 /**
- * Retrieves the Picked Client for the Experience Instance.
+ * Retrieves the Picked Client for the Experience Instance
  *
- * @returns The Picked client instance that provides access to experiences, steps, and other Picked functionality.
- * @example
- * const client = getPicked()
+ * @returns The Picked client instance that provides access to experiences, steps, and other Picked functionality
  */
 export declare function getPicked(): Picked;
 /**
- * Retrieves the Experience Store for the current Experience Instance.
+ * Retrieves the Experience Store for the current Experience Instance
  *
- * The returned instance exposes `restart` and `isResumableStore` for SDK-native
- * resume/restart flows: call `instance.restart()` to clear this instance's history and
- * the experience's owned responses, and subscribe to `instance.isResumableStore` (via the
- * `$` prefix) to render a "continue / start over" prompt once the user has progressed past
- * the first step (it stays `false` on the first step, even with a saved answer).
- *
- * @returns The Experience store instance that provides access to experience configuration and state.
- * @example
- * const experience = getExperience()
- * const canResume = experience.isResumableStore
- * // in markup: {#if $canResume}…{/if}
+ * @returns The Experience store instance that provides access to experience configuration and state
  */
 export declare function getExperience(): ExperienceInstance;

package/dist/index.d.ts

@@ -6,3 +6,4 @@ export type { ComponentWithProps } from './component';
 export { LazyImage } from './components';
 export { setPickedContext } from './experience/set-picked-context';
 export { default as ExperienceSlot } from './experience/ExperienceSlot.svelte';
+export { default as HtmlRender } from './experience/HtmlRender.svelte';

package/dist/index.js

@@ -1 +1 @@
-import{adaptSvelteComponent as e,isValidAdaptedComponent as t}from"./component.js";import{LazyImage as n}from"./components/index.js";import{setPickedContext as r}from"./experience/set-picked-context.js";import i from"./experience/ExperienceSlot.svelte";export{i as ExperienceSlot,n as LazyImage,e as adaptSvelteComponent,t as isValidAdaptedComponent,r as setPickedContext};
+import{adaptSvelteComponent as e,isValidAdaptedComponent as t}from"./component.js";import{LazyImage as n}from"./components/index.js";import{setPickedContext as r}from"./experience/set-picked-context.js";import i from"./experience/ExperienceSlot.svelte";import a from"./experience/HtmlRender.svelte";export{i as ExperienceSlot,a as HtmlRender,n as LazyImage,e as adaptSvelteComponent,t as isValidAdaptedComponent,r as setPickedContext};

package/dist/plugins/devtools/screens/history/HistoryEntriesTable.svelte

@@ -1,14 +1,12 @@
 <script lang="ts">
-  /** @file Devtools table that lists history entries for the current Picked client. */
   import type { HistoryEntry } from '@picked/client'
-  import { Card, DataTable, EmptyState, Stack } from '../../ui'
   import HistoryEntryListItem from './HistoryEntryListItem.svelte'
+  import { Card, DataTable, EmptyState, Stack } from '../../ui'
 
   export let historyEntries: HistoryEntry[]
 
   const columns = [
     { key: 'id', header: 'ID' },
-    { key: 'instanceId', header: 'Instance ID' },
     { key: 'experienceId', header: 'Experience ID' },
     { key: 'nodeId', header: 'Node ID' },
     { key: 'nodeType', header: 'Node Type' },

package/dist/plugins/devtools/screens/history/HistoryEntryListItem.svelte

@@ -12,7 +12,6 @@
 
 <tr>
   <td>{historyEntry.id}</td>
-  <td>{historyEntry.instanceId}</td>
   <td>{experienceName}</td>
   <td>{historyEntry.node.id}</td>
   <td>{historyEntry.node.type}</td>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@picked/svelte",
-  "version": "0.0.1-dev.1784003142683",
+  "version": "0.0.1-dev.1784265353357",
   "dependencies": {
     "d3": "^7.9.0"
   },
@@ -106,7 +106,7 @@
   },
   "module": "./dist/index.js",
   "peerDependencies": {
-    "@picked/client": "0.0.1-dev.1784003142683",
+    "@picked/client": "0.0.1-dev.1784265353357",
     "effector": "^23.3.0",
     "svelte": "^5.46.4"
   },