@picked/client 0.0.1-dev.1785305085063 → 0.0.1-dev.1785826066660

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (188) hide show
  1. package/dist/.tsbuildinfo +1 -0
  2. package/dist/api-Djuh2gfe.cjs +1 -0
  3. package/dist/api-d0qKmzPH.js +38 -0
  4. package/dist/cjs/form/index.js +1 -1
  5. package/dist/cjs/index.js +2 -2
  6. package/dist/cjs/plugins/dom-observer/index.js +1 -1
  7. package/dist/cjs/plugins/dynamic-experiences/index.js +1 -1
  8. package/dist/cjs/server/index.js +1 -1
  9. package/dist/docs/actions.mdx +38 -18
  10. package/dist/docs/api/authentication.md +75 -48
  11. package/dist/docs/api/authorization-and-scopes.md +63 -47
  12. package/dist/docs/api/error-handling.md +70 -54
  13. package/dist/docs/api/index.md +41 -22
  14. package/dist/docs/api/pagination.md +30 -20
  15. package/dist/docs/api-keys.mdx +11 -6
  16. package/dist/docs/chrome-extension.md +22 -5
  17. package/dist/docs/conditions.mdx +32 -19
  18. package/dist/docs/content/asset-library.mdx +65 -34
  19. package/dist/docs/content/content-entries.mdx +8 -2
  20. package/dist/docs/content/layouts.mdx +45 -29
  21. package/dist/docs/content/pages.mdx +29 -14
  22. package/dist/docs/content/sections.mdx +19 -8
  23. package/dist/docs/delivery-api/experience-content.md +10 -5
  24. package/dist/docs/delivery-api/index.md +19 -12
  25. package/dist/docs/delivery-api/preview-caching-crawling.md +27 -14
  26. package/dist/docs/delivery-api/project-config.md +6 -4
  27. package/dist/docs/experiences.mdx +26 -10
  28. package/dist/docs/features.mdx +93 -22
  29. package/dist/docs/fields.mdx +42 -27
  30. package/dist/docs/flow-builder/building-flows.md +38 -20
  31. package/dist/docs/flow-builder/condition-builder.md +32 -21
  32. package/dist/docs/flow-builder/keyboard-shortcuts.md +18 -18
  33. package/dist/docs/flow-builder/nodes.md +26 -13
  34. package/dist/docs/flow-builder/overview.mdx +28 -15
  35. package/dist/docs/gtm-template.md +35 -26
  36. package/dist/docs/guides/build-a-personalized-page.mdx +36 -18
  37. package/dist/docs/image-optimisation-service.md +33 -17
  38. package/dist/docs/index.md +28 -17
  39. package/dist/docs/mcp.md +47 -39
  40. package/dist/docs/pickedql/data-sources.md +65 -43
  41. package/dist/docs/pickedql/dimensions.md +27 -12
  42. package/dist/docs/pickedql/examples.md +38 -26
  43. package/dist/docs/pickedql/filtering.md +10 -6
  44. package/dist/docs/pickedql/index.md +32 -14
  45. package/dist/docs/pickedql/schema.md +85 -76
  46. package/dist/docs/pickedql/virtual-functions.md +62 -36
  47. package/dist/docs/projects.mdx +14 -7
  48. package/dist/docs/reports.mdx +5 -3
  49. package/dist/docs/sdk/actions.md +33 -17
  50. package/dist/docs/sdk/conditions.md +8 -5
  51. package/dist/docs/sdk/content-security-policy.md +5 -4
  52. package/dist/docs/sdk/experiences.md +29 -11
  53. package/dist/docs/sdk/feature-allocation.md +161 -0
  54. package/dist/docs/sdk/features.md +181 -73
  55. package/dist/docs/sdk/fields.md +66 -42
  56. package/dist/docs/sdk/index.md +25 -10
  57. package/dist/docs/sdk/plugins/create-experience.md +18 -15
  58. package/dist/docs/sdk/plugins/dynamic-experiences.md +43 -17
  59. package/dist/docs/sdk/predicates.md +53 -37
  60. package/dist/docs/sdk/ssr/index.md +25 -8
  61. package/dist/docs/sdk/ssr/rendering-and-hydration.md +37 -16
  62. package/dist/docs/sdk/ssr/serialize.md +38 -20
  63. package/dist/docs/sdk/ssr/slots-and-placements.md +28 -10
  64. package/dist/docs/sdk/steps.md +100 -55
  65. package/dist/docs/steps.mdx +20 -11
  66. package/dist/docs/team-management.md +17 -11
  67. package/dist/docs/vite-plugin.md +26 -19
  68. package/dist/docs/workspace-versioning.mdx +14 -8
  69. package/dist/docs/workspaces.mdx +55 -24
  70. package/dist/{dom-BwmTHeT7.js → dom-BqcToNL0.js} +1 -3
  71. package/dist/{dom-CDrHc_j9.cjs → dom-DlLH3FxV.cjs} +1 -1
  72. package/dist/esm/form/index.js +2 -4
  73. package/dist/esm/index.js +376 -308
  74. package/dist/esm/plugins/dom-observer/index.js +1 -1
  75. package/dist/esm/plugins/dynamic-experiences/index.js +2 -2
  76. package/dist/esm/preview/index.js +1 -1
  77. package/dist/esm/server/index.js +13 -11
  78. package/dist/{experience-instance-DOJShRk5.js → experience-instance-DGk11d8a.js} +3 -3
  79. package/dist/experience-instance-Dej3P1sE.cjs +1 -0
  80. package/dist/{plugin-CFXwbXeM.js → plugin-BVAFWjpT.js} +60 -55
  81. package/dist/plugin-BcCn2llk.cjs +1 -0
  82. package/dist/{preview-channel-DW9J8t4B.js → preview-channel-CSr96XAo.js} +1 -1
  83. package/dist/{protocol-DSqOlW2r.js → protocol-C5KkkiZc.js} +1 -1
  84. package/dist/types/client.d.ts +7 -6
  85. package/dist/types/entities/action/action.d.ts +5 -4
  86. package/dist/types/entities/action/action.d.ts.map +1 -1
  87. package/dist/types/entities/component/component.d.ts +6 -5
  88. package/dist/types/entities/component/component.d.ts.map +1 -1
  89. package/dist/types/entities/condition/condition.d.ts +5 -5
  90. package/dist/types/entities/content/content.d.ts +4 -3
  91. package/dist/types/entities/content/reference.d.ts +101 -0
  92. package/dist/types/entities/content/reference.d.ts.map +1 -0
  93. package/dist/types/entities/experience/experience.d.ts +11 -10
  94. package/dist/types/entities/experience/experience.d.ts.map +1 -1
  95. package/dist/types/entities/experience-instance/experience-instance.d.ts +10 -9
  96. package/dist/types/entities/feature/feature.d.ts +3 -2
  97. package/dist/types/entities/feature/feature.d.ts.map +1 -1
  98. package/dist/types/entities/field/field.d.ts +7 -6
  99. package/dist/types/entities/framework/framework.d.ts +7 -6
  100. package/dist/types/entities/framework/framework.d.ts.map +1 -1
  101. package/dist/types/entities/history/history.d.ts +6 -6
  102. package/dist/types/entities/plugin/plugin.d.ts +3 -2
  103. package/dist/types/entities/plugin/plugin.d.ts.map +1 -1
  104. package/dist/types/entities/predicate/predicate.d.ts +4 -3
  105. package/dist/types/entities/predicate/predicate.d.ts.map +1 -1
  106. package/dist/types/entities/response/response-validation.d.ts +3 -2
  107. package/dist/types/entities/response/response.d.ts +12 -11
  108. package/dist/types/entities/session/session.d.ts +2 -1
  109. package/dist/types/entities/step/step.d.ts +6 -5
  110. package/dist/types/exports.d.ts +4 -1
  111. package/dist/types/exports.d.ts.map +1 -1
  112. package/dist/types/form/build-responses.d.ts +2 -1
  113. package/dist/types/form/create-field-evaluator.d.ts +4 -3
  114. package/dist/types/form/create-field-validation.d.ts +5 -4
  115. package/dist/types/form/create-form.d.ts +7 -6
  116. package/dist/types/form/create-submit-pipeline.d.ts +7 -6
  117. package/dist/types/form/get-step-fields.d.ts +3 -2
  118. package/dist/types/index.d.ts +1 -0
  119. package/dist/types/index.d.ts.map +1 -1
  120. package/dist/types/lifecycle/condition-selection.d.ts +14 -4
  121. package/dist/types/lifecycle/lifecycle.d.ts +4 -3
  122. package/dist/types/lifecycle/rules-logic.d.ts +4 -3
  123. package/dist/types/lifecycle/state-snapshot.d.ts +4 -3
  124. package/dist/types/picked.d.ts +64 -62
  125. package/dist/types/picked.d.ts.map +1 -1
  126. package/dist/types/ping.d.ts +1 -1
  127. package/dist/types/ping.d.ts.map +1 -1
  128. package/dist/types/plugins/create-experience/create-experience.d.ts +9 -8
  129. package/dist/types/plugins/create-experience/create-experience.d.ts.map +1 -1
  130. package/dist/types/plugins/create-experience/plugin.d.ts +3 -2
  131. package/dist/types/plugins/create-experience/plugin.d.ts.map +1 -1
  132. package/dist/types/plugins/create-experience/serialization.d.ts.map +1 -1
  133. package/dist/types/plugins/dom-observer/plugin.d.ts +1 -1
  134. package/dist/types/plugins/dynamic-experiences/hash.d.ts +40 -5
  135. package/dist/types/plugins/dynamic-experiences/hash.d.ts.map +1 -1
  136. package/dist/types/plugins/dynamic-experiences/plugin.d.ts +3 -3
  137. package/dist/types/plugins/dynamic-experiences/plugin.d.ts.map +1 -1
  138. package/dist/types/plugins/dynamic-experiences/types.d.ts +18 -5
  139. package/dist/types/plugins/dynamic-experiences/types.d.ts.map +1 -1
  140. package/dist/types/plugins/experience-browser-storage/plugin.d.ts +1 -1
  141. package/dist/types/plugins/experience-browser-storage/plugin.d.ts.map +1 -1
  142. package/dist/types/plugins/history-browser-storage/plugin.d.ts +1 -1
  143. package/dist/types/plugins/history-browser-storage/plugin.d.ts.map +1 -1
  144. package/dist/types/plugins/responses-browser-storage/plugin.d.ts +1 -1
  145. package/dist/types/plugins/responses-browser-storage/plugin.d.ts.map +1 -1
  146. package/dist/types/plugins/responses-indexeddb/plugin.d.ts +1 -1
  147. package/dist/types/plugins/single-page-app/plugin.d.ts +1 -1
  148. package/dist/types/plugins/single-page-app/plugin.d.ts.map +1 -1
  149. package/dist/types/plugins/web-components/plugin.d.ts +2 -1
  150. package/dist/types/plugins/window-object/plugin.d.ts +2 -2
  151. package/dist/types/preview-channel.d.ts +5 -1
  152. package/dist/types/preview-receiver/index.d.ts +18 -1
  153. package/dist/types/preview-receiver/protocol.d.ts +10 -1
  154. package/dist/types/server/index.d.ts +3 -3
  155. package/dist/types/server/serialize.d.ts +8 -3
  156. package/dist/types/server/serialize.d.ts.map +1 -1
  157. package/dist/types/utils/dom.d.ts +2 -1
  158. package/dist/types/utils/events.d.ts +6 -6
  159. package/dist/types/utils/events.d.ts.map +1 -1
  160. package/dist/types/utils/global-obj.d.ts +1 -1
  161. package/dist/types/utils/global-obj.d.ts.map +1 -1
  162. package/dist/types/utils/id.d.ts.map +1 -1
  163. package/dist/types/utils/logger.d.ts +2 -1
  164. package/dist/types/utils/logger.d.ts.map +1 -1
  165. package/dist/types/utils/node-tree/get-next-node-from-action.d.ts +2 -1
  166. package/dist/types/utils/node-tree/get-next-node-from-condition.d.ts +2 -1
  167. package/dist/types/utils/node-tree/get-next-node.d.ts +1 -1
  168. package/dist/types/utils/node-tree/get-next-node.d.ts.map +1 -1
  169. package/dist/types/utils/node-tree/get-origin-node.d.ts +1 -1
  170. package/dist/types/utils/node-tree/get-origin-node.d.ts.map +1 -1
  171. package/dist/types/utils/node-tree/min-max-steps-to-leaf.d.ts +1 -1
  172. package/dist/types/utils/node-tree/min-max-steps-to-leaf.d.ts.map +1 -1
  173. package/dist/types/utils/node-tree/min-max-steps-to-origin.d.ts +1 -1
  174. package/dist/types/utils/node-tree/min-max-steps-to-origin.d.ts.map +1 -1
  175. package/dist/types/utils/node-tree/next-reachable-step-nodes.d.ts +1 -1
  176. package/dist/types/utils/node-tree/next-reachable-step-nodes.d.ts.map +1 -1
  177. package/dist/types/utils/nodes.d.ts +1 -1
  178. package/dist/types/utils/picked-config.d.ts +2 -1
  179. package/dist/types/utils/rehydrate-scripts.d.ts +6 -0
  180. package/dist/types/utils/rehydrate-scripts.d.ts.map +1 -1
  181. package/dist/types/utils/rules-logic.d.ts +6 -2
  182. package/dist/types/utils/storage.d.ts +1 -1
  183. package/dist/types/utils/storage.d.ts.map +1 -1
  184. package/package.json +22 -23
  185. package/dist/api-CPL40b7A.js +0 -40
  186. package/dist/api-Dz5rgRgQ.cjs +0 -1
  187. package/dist/experience-instance-DurC3pE-.cjs +0 -1
  188. package/dist/plugin-m4qekgtA.cjs +0 -1
@@ -2,23 +2,30 @@
2
2
  layout: docs
3
3
  ---
4
4
 
5
- # Preview, Caching & Crawling
5
+ # Preview, cache, and crawlers
6
6
 
7
- The operational surface shared by both Delivery API endpoints: preview tokens, caching, CORS, and crawling.
7
+ Both Delivery API endpoints share this behaviour: the preview token, the cache, CORS,
8
+ and what a crawler can read.
8
9
 
9
10
  ## Preview tokens
10
11
 
11
- Pass `?preview_token=<token>` to read unpublished content. Both endpoints accept it, and both return `versionId: null` on the preview surface. An invalid token returns `401`.
12
+ Pass `?preview_token=<token>` to read unpublished content. Both endpoints take it,
13
+ and both return `versionId: null` for a preview. An invalid token returns `401`.
12
14
 
13
15
  ```bash
14
16
  curl "https://api.picked.app/api/v1/projects/proj_123?preview_token=<token>"
15
17
  ```
16
18
 
17
- A workspace's preview token is available as the `previewToken` field on the workspace in the [management API](/api), and the dashboard preview action issues one for you. Use the same token for the project config and the experience content requests so both come from the same preview surface.
19
+ The [management API](/api) holds the preview token of a workspace in the
20
+ `previewToken` field. The preview action in the dashboard also makes one for you.
18
21
 
19
- ## Caching
22
+ Use the same token for the project options request and for the experience content
23
+ request. Both then come from the same preview.
20
24
 
21
- Caching depends on the surface and the requesting client. The SDK sends a `Picked-Client: sdk` request header:
25
+ ## Cache
26
+
27
+ The cache rules depend on the surface and on the client that makes the request. The
28
+ SDK sends a `Picked-Client: sdk` request header:
22
29
 
23
30
  | Request | `Cache-Control` |
24
31
  | --- | --- |
@@ -26,11 +33,14 @@ Caching depends on the surface and the requesting client. The SDK sends a `Picke
26
33
  | Published, other clients | `private, no-store` |
27
34
  | Preview | `no-store` |
28
35
 
29
- Cacheable published responses also send `Vary: Picked-Client`, so a shared cache keys on the client header and never serves an SDK-cached body to a non-SDK request.
36
+ A published response that a cache can hold also sends `Vary: Picked-Client`. A shared
37
+ cache therefore keys on the client header. It never gives a body that it cached for
38
+ the SDK to a request from another client.
30
39
 
31
40
  ## CORS
32
41
 
33
- Both endpoints are cross-origin readable. An `OPTIONS` preflight returns `204` with the CORS headers:
42
+ Both endpoints can be read from another origin. An `OPTIONS` preflight returns `204`
43
+ with the CORS headers:
34
44
 
35
45
  | Header | Value |
36
46
  | --- | --- |
@@ -38,22 +48,25 @@ Both endpoints are cross-origin readable. An `OPTIONS` preflight returns `204` w
38
48
  | `Access-Control-Allow-Methods` | `GET, OPTIONS` |
39
49
  | `Access-Control-Allow-Headers` | `Content-Type, Picked-Client, Picked-Version, traceparent, tracestate` |
40
50
 
41
- ## Crawling and SEO
51
+ ## Crawlers and search rank
42
52
 
43
- Both endpoints are crawlable so search engines can read your published content. Preview URLs are disallowed, so drafts never reach the index. The `robots.txt` rules:
53
+ A crawler can read both endpoints, so a search engine can read your published
54
+ content. A preview URL is disallowed, so a draft never reaches the index. These are
55
+ the `robots.txt` rules:
44
56
 
45
57
  ```
46
58
  User-agent: *
47
59
 
48
- # Allow crawling of the public project config and experience content endpoints
60
+ # Let a crawler read the public project options and experience content.
49
61
  Allow: /api/v1/projects
50
62
  Allow: /api/v1/projects/*/experiences/*/content
51
63
 
52
- # Keep preview (draft) responses out of crawlers
64
+ # Keep a preview response, which is a draft, away from a crawler.
53
65
  Disallow: /api/v1/projects/*preview_token=
54
66
 
55
- # Everything else (GraphQL, MCP, internal, ping) stays disallowed
67
+ # Everything else stays disallowed: GraphQL, MCP, internal routes, and the ping.
56
68
  Disallow: /
57
69
  ```
58
70
 
59
- See [Project Config](/delivery-api/project-config) and [Experience Content](/delivery-api/experience-content) for the endpoints themselves.
71
+ See [Project Config](/delivery-api/project-config) and
72
+ [Experience Content](/delivery-api/experience-content) for the endpoints.
@@ -15,7 +15,7 @@ GET /api/v1/projects/:projectId
15
15
  | Parameter | In | Description |
16
16
  | --- | --- | --- |
17
17
  | `projectId` | path | The project to fetch config for. |
18
- | `preview_token` | query | Optional. Returns the preview (unpublished) config when present. |
18
+ | `preview_token` | query | Optional. With it, the endpoint returns the preview options, which are unpublished. |
19
19
 
20
20
  ## Response
21
21
 
@@ -25,11 +25,13 @@ The response carries the project's experiences and steps. Each step includes `la
25
25
  | --- | --- | --- |
26
26
  | `id` | `string` | The project id. |
27
27
  | `versionId` | `string \| null` | The published version id, or `null` on preview. |
28
- | `steps[].layoutContentId` | `string \| null` | The Content Entry backing this step, or `null` when the step has no content. |
28
+ | `steps[].layoutContentId` | `string \| null` | The Content Entry of this step, or `null` when the step has no content. |
29
29
 
30
- ## Published vs preview
30
+ ## Published content and preview content
31
31
 
32
- On the published surface, `versionId` is the published version id. On the preview surface (`?preview_token=...`), `versionId` is `null` because there is no published version. See [Preview, Caching & Crawling](/delivery-api/preview-caching-crawling).
32
+ For published content, `versionId` holds the ID of the published version. For preview
33
+ content, which you read with `?preview_token=...`, `versionId` is `null`, because
34
+ there is no published version. See [Preview, cache, and crawlers](/delivery-api/preview-caching-crawling).
33
35
 
34
36
  ## Example
35
37
 
@@ -6,9 +6,14 @@ import { Screenshot } from '../../components/Screenshot'
6
6
 
7
7
  # Experiences
8
8
 
9
- An experience is a personalized experience delivered to visitors on your site. Each experience maps to a component registered in your application.
9
+ An experience is personalized content that Picked serves to the visitors on your
10
+ site. Each experience points at a component that you register in your application.
10
11
 
11
- Picked has two kinds of experience. A **Flow** is a multi-step, interactive experience rendered in the browser, covered on this page. A **Page** is a standalone, server-rendered experience backed by CMS content, built for SEO-critical landing pages. See [Pages](/content/pages) for that kind.
12
+ An experience is either a **Flow** or a **Page**. A **Flow** is an interactive
13
+ experience of more than one step, and the browser renders it. This page covers the
14
+ flow. A **Page** is a standalone experience that the server renders from CMS content,
15
+ for a landing page where the search rank matters. See [Pages](/content/pages) for
16
+ that kind.
12
17
 
13
18
  <Screenshot
14
19
  route="/{orgSlug}/{projectId}/workspaces/{workspaceId}/experiences"
@@ -20,23 +25,34 @@ Picked has two kinds of experience. A **Flow** is a multi-step, interactive expe
20
25
  1. Open your project.
21
26
  2. Click **Experiences** in the sidebar.
22
27
  3. Click **New Experience**.
23
- 4. Enter a name and a component name. The component name must match a component registered in your application. See [SDK Experiences](/sdk/experiences) for details on registering components.
28
+ 4. Enter a name and a component name. The component name must match a component that
29
+ you register in your application. See [SDK Experiences](/sdk/experiences) for how
30
+ to register a component.
24
31
  5. Click **Create**.
25
32
 
26
- The flow editor opens with an empty canvas. See [Building Flows](/flow-builder/building-flows) to start adding nodes.
33
+ The flow editor opens with an empty canvas. See
34
+ [Build Flows](/flow-builder/building-flows) to add your first node.
27
35
 
28
36
  ## Experience settings
29
37
 
30
- Select no nodes on the canvas (or click the canvas background) to open the experience inspector in the right panel.
38
+ Choose no node on the canvas, or click the canvas background, to open the experience
39
+ inspector in the right panel.
31
40
 
32
- **Name**: The display name shown in the dashboard. Visitors don't see this.
41
+ **Name**: The name that the dashboard shows. Your visitors do not see it.
33
42
 
34
- **Component Name**: The identifier that maps this experience to a registered component in your application.
43
+ **Component Name**: The identifier that points this experience at a component in your
44
+ application.
35
45
 
36
- **Condition**: An optional activation condition. When set, the experience only activates for visitors who match the condition logic. See [Condition Builder](/flow-builder/condition-builder) for details on configuring conditions. Leave blank to activate for all visitors.
46
+ **Condition**: An optional condition. When you set it, the experience starts only for
47
+ a visitor who matches the condition. See
48
+ [Condition Builder](/flow-builder/condition-builder) for how to write one. Keep it
49
+ blank to start the experience for every visitor.
37
50
 
38
- **Initialize Open**: An optional condition that controls whether the experience opens automatically on page load. When blank, the experience loads but stays closed until opened.
51
+ **Initialize Open**: An optional condition that controls whether the experience opens
52
+ by itself when the page loads. When it is blank, the experience loads but stays
53
+ closed until something opens it.
39
54
 
40
55
  ## Experience list
41
56
 
42
- The experiences list shows all experiences in the current project. Click any experience to open it in the flow builder.
57
+ The experiences list shows every experience in the current project. Click an
58
+ experience to open it in the flow builder.
@@ -4,55 +4,126 @@ layout: docs
4
4
 
5
5
  import { Screenshot } from '../../components/Screenshot'
6
6
 
7
- # Features
7
+ # Feature flags
8
8
 
9
- Features let you run A/B tests and feature flags. Control which visitors see which variant of your site without deploying code changes.
9
+ A feature flag lets you run an A/B test and roll a change out in stages. It controls
10
+ which visitors see a change to your site, and you deploy no code.
10
11
 
11
12
  <Screenshot
12
13
  route="/{orgSlug}/{projectId}/workspaces/{workspaceId}/features"
13
- alt="The features list for a workspace on the Picked dashboard"
14
+ alt="The feature flags list for a workspace on the Picked dashboard"
14
15
  />
15
16
 
16
- ## Create a feature
17
+ ## Create a feature flag
17
18
 
18
19
  1. Open your project.
19
- 2. Click **Features** in the sidebar.
20
- 3. Click **New Feature**.
20
+ 2. Click **Feature flags** in the sidebar.
21
+ 3. Click **New feature flag**.
21
22
  4. Enter a name.
22
- 5. Click **Create**.
23
+ 5. Click **Create feature flag**.
23
24
 
24
25
  ## Keys
25
26
 
26
- Each feature has a unique key. Use this key in your application to check which variant a visitor is assigned to. The key is set when you create the feature and cannot be changed later.
27
+ Each feature flag has a unique key. Your application uses this key to check whether
28
+ Picked allocates a visitor to the feature flag. You set the key when you create the
29
+ feature flag, and you cannot change it later.
27
30
 
28
- ## Configure variants
31
+ ## Configure allocation
29
32
 
30
- Each feature has one or more variants. Visitors are assigned to a variant based on the rules you define.
33
+ Set the allocation from the detail page of the feature flag:
31
34
 
32
- Configure variant allocation, targeting rules, and rollout percentages from the feature detail page.
35
+ | Control | What it does |
36
+ | --- | --- |
37
+ | **Enabled** | Whether Picked allocates a visitor to the feature flag. A feature flag that is off allocates nobody, and it records nothing. See [Turn a feature flag off](#turn-a-feature-flag-off). |
38
+ | **Weight** | The percentage of visitors that Picked allocates to the feature flag, from 0 to 100. |
39
+ | **Description** | An internal note about what the feature flag tests. |
33
40
 
34
- ## How visitors are bucketed
41
+ A feature flag has one weight. For each visitor it gives one of two outcomes:
42
+ allocated, or not allocated. A weight of 30 allocates 30% of your visitors. The other
43
+ 70% stay unallocated. A weight of 0 allocates nobody. A weight of 100 allocates
44
+ everybody.
35
45
 
36
- Visitors are assigned to variants using weight-based probabilistic rollout. Each variant has a weight from 0 to 100, representing the percentage of traffic it receives.
46
+ ## How visitors are allocated
37
47
 
38
- For example, with two variants weighted 50/50, roughly half of visitors see each variant. A variant weighted at 0 receives no traffic.
48
+ The allocation is deterministic. Picked gives each visitor a stable value for each
49
+ feature flag. It derives that value from the visitor ID and from the ID of the feature
50
+ flag. It then compares the value against the weight. When the value is below the
51
+ weight, Picked allocates the visitor.
39
52
 
40
- Bucketing is deterministic — the same visitor sees the same variant on repeat visits, unless the feature version changes.
53
+ The same visitor always gets the same result for one feature flag, on every visit,
54
+ while the weight stays the same. The version is not part of that value. It controls
55
+ the cache only. See [Feature flag versions](#feature-flag-versions).
41
56
 
42
- ## Feature versions
57
+ Each feature flag gets its own value, so tests that run at the same time are
58
+ independent. Two feature flags, both at weight 50, split your visitors into four equal
59
+ parts: allocated to both, to one, to the other, or to neither. Three feature flags at
60
+ weight 50 give eight groups of 12.5%.
43
61
 
44
- Each feature has a version number (starting at 1). Incrementing the version resets all visitor assignments, so every visitor is re-evaluated as if they were seeing the feature for the first time.
62
+ :::note
63
+ Inside one feature flag, a larger weight only adds visitors. Everybody at weight 30 is
64
+ still allocated at weight 50, so you can make a release wider and move nobody who is
65
+ in it already. A smaller weight removes visitors from the top of the range.
66
+ :::
67
+
68
+ ## Turn a feature flag off
69
+
70
+ A feature flag that is off allocates nobody, and it records nothing. The difference
71
+ from a weight of 0 matters for your reports. The visitor is **not in the test at
72
+ all**, and the visitor is not in the control group.
73
+
74
+ The SDK does not evaluate a feature flag that is off. It stores no decision in the
75
+ browser of the visitor, and it reports no decision to your analytics. Such a feature
76
+ flag is absent from the feature list on every analytics event.
77
+
78
+ An experience whose condition points at a feature flag that is off behaves as though
79
+ the visitor is not in the test. The condition reads as not allocated, and Picked
80
+ records no assignment.
81
+
82
+ This state is temporary, and it discards no decision that Picked made already. A
83
+ visitor who was allocated before keeps that decision in the browser. When you turn the
84
+ feature flag on again, Picked continues from that decision and does not allocate the
85
+ visitor again.
86
+
87
+ :::note
88
+ Expect a step change in your reports when you turn a feature flag off: fewer feature
89
+ flags for each visitor, and fewer decision events. That is the feature flag that drops
90
+ out, and you lose no data.
91
+ :::
92
+
93
+ A feature flag that is off stays visible in the developer tools, and a
94
+ [URL override](/sdk/features#overrides-in-the-url) still turns one on for QA.
95
+
96
+ ## Feature flag versions
97
+
98
+ Each feature flag has a version number, and it starts at 1. The SDK caches an
99
+ allocation decision in the browser of the visitor under a key, and the version is part
100
+ of that key. The version does nothing else, and it is not an input to the allocation
101
+ value. When you increment the version, the SDK discards those cached decisions. It
102
+ then evaluates every visitor again on the next page load.
45
103
 
46
104
  ### What happens when you increment the version
47
105
 
48
- - **All visitors are re-allocated.** Every visitor currently allocated to this feature will be re-evaluated against the new version. A visitor who was in the control group may end up in a variant, and vice versa.
49
- - **Cached decisions are invalidated.** The SDK caches allocation decisions in browser storage using a key that includes the version. When the version changes, the old cache entry no longer matches, forcing a fresh evaluation on the next page load.
50
- - **This is irreversible.** You cannot decrement a version. Once incremented, the previous allocation assignments are lost.
106
+ - **The SDK invalidates the cached decisions.** The cache key holds the version, so the
107
+ old entry no longer matches and the feature flag counts as undecided.
108
+ - **Picked evaluates each visitor against the current weight.** The allocation is
109
+ deterministic and the version is not one of its inputs, so the same visitor against
110
+ an unchanged weight gives the same result.
111
+ - **You cannot reverse this.** There is no way to decrement a version.
112
+
113
+ :::note
114
+ The new version does not move your visitors between groups. It clears the cached
115
+ decisions and runs the allocation again. With an unchanged weight, everybody lands
116
+ where they were before. Change the weight to move your visitors.
117
+ :::
51
118
 
52
119
  ### When to increment
53
120
 
54
- Increment the version when you have changed the weight or allocation and want all visitors — including those already allocated — to be re-evaluated from scratch.
121
+ Increment the version after you change the weight. Do this when you want Picked to
122
+ evaluate an allocated visitor again against the new weight, and not to use the cached
123
+ decision.
55
124
 
56
125
  ### When not to increment
57
126
 
58
- If you only want changes to affect new visitors (those who haven't been allocated yet), update the weight without incrementing the version. Existing visitors will keep their current assignment.
127
+ To apply a weight change only to a visitor that Picked does not allocate yet, change
128
+ the weight and leave the version as it is. An allocated visitor keeps the current
129
+ allocation.
@@ -6,9 +6,12 @@ import { Screenshot } from '../../components/Screenshot'
6
6
 
7
7
  # Fields
8
8
 
9
- A field is a data input shown to visitors inside a step. Fields collect information like names, email addresses, preferences, or selections.
9
+ A field is a data input that a visitor sees inside a step. A field collects
10
+ information such as a name, an email address, a preference, or a choice.
10
11
 
11
- These are experience Fields, which collect visitor input. They are distinct from the Content Fields that make up a CMS layout's schema, covered in [Page & Step Layouts](/content/layouts).
12
+ This page covers the experience field, which collects visitor input. An experience
13
+ field is not the same as a content field. A content field is part of the schema of a
14
+ CMS layout. See [Page and Step Layouts](/content/layouts) for those.
12
15
 
13
16
  <Screenshot
14
17
  route="/{orgSlug}/{projectId}/workspaces/{workspaceId}/fields"
@@ -20,60 +23,72 @@ These are experience Fields, which collect visitor input. They are distinct from
20
23
  1. Open your project.
21
24
  2. Click **Fields** in the sidebar.
22
25
  3. Click **New Field**.
23
- 4. Enter a name, key, and label.
24
- 5. Select a type.
26
+ 4. Enter a name, a key, and a label.
27
+ 5. Choose a type.
25
28
  6. Click **Create**.
26
29
 
27
30
  ## Field types
28
31
 
29
- Fields support many types. Here are some common examples:
32
+ A field has one of many types. These are the common ones:
30
33
 
31
- `TEXT`: A string input. Use for names, emails, free-form text.
34
+ `TEXT`: A string input. Use it for a name, an email address, or free text.
32
35
 
33
- `NUMBER`: A numeric input. Use for quantities, ratings, ages.
36
+ `NUMBER`: A numeric input. Use it for a quantity, a rating, or an age.
34
37
 
35
- `BOOLEAN`: A true/false toggle. Use for checkboxes, opt-ins, consent.
38
+ `BOOLEAN`: A true or false toggle. Use it for a checkbox or for consent.
36
39
 
37
- `OBJECT`: A structured data input. Use for complex or nested data.
40
+ `OBJECT`: A structured data input. Use it for data that holds other data.
38
41
 
39
- ## Configuration
42
+ ## Options
40
43
 
41
- **Name**: Display name in the dashboard. Not visible to visitors.
44
+ **Name**: The name that the dashboard shows. Your visitors do not see it.
42
45
 
43
- **Key**: Programmatic identifier. Set once, can't change. Not visible to visitors.
46
+ **Key**: The identifier for your application. You set it once and you cannot change
47
+ it. Your visitors do not see it.
44
48
 
45
- **Label**: The label visitors see next to the field.
49
+ **Label**: The label that a visitor sees next to the field.
46
50
 
47
- **Placeholder**: Hint text shown inside the input when empty.
51
+ **Placeholder**: The hint text that the input shows while it is empty.
48
52
 
49
- **Description**: A longer description of the field's purpose. Shown in the dashboard, not to visitors.
53
+ **Description**: A longer description of what the field is for. The dashboard shows
54
+ it. Your visitors do not see it.
50
55
 
51
- **Help Text**: Assistive text shown to visitors below the field.
56
+ **Help Text**: Text below the field that helps your visitors.
52
57
 
53
- **Default Value**: The initial value when the field loads.
58
+ **Default Value**: The value that the field holds when it loads.
54
59
 
55
60
  ## Validation
56
61
 
57
- **Required**: When enabled, visitors must fill in this field before proceeding.
62
+ **Required**: When this is on, a visitor must fill in the field before the flow can
63
+ continue.
58
64
 
59
- **Validation rules**: Define conditions for advanced constraints like minimum/maximum values, patterns, or custom logic. See [Condition Builder](/flow-builder/condition-builder) for details on building validation rules.
65
+ **Validation rules**: Conditions for a constraint such as a smallest value, a largest
66
+ value, or a pattern. See [Condition Builder](/flow-builder/condition-builder) for how
67
+ to build a validation rule.
60
68
 
61
- ## Multiple values
69
+ ## More than one value
62
70
 
63
- Enable **Multiple** to allow visitors to submit more than one value for this field. Useful for multi-select inputs or tag-style fields.
71
+ Turn on **Multiple** to let a visitor send more than one value for the field. This is
72
+ useful for an input that takes several choices, or for a field of tags.
64
73
 
65
- ## Options
74
+ ## Choices
66
75
 
67
- For fields that present a fixed set of choices (like dropdowns or radio buttons), add options. Each option has a value that gets submitted with the response.
76
+ For a field with a fixed set of choices, such as a dropdown or a set of radio
77
+ buttons, add options. Each option has a value, and the response carries that value.
68
78
 
69
- Each option can also have a condition applied. When a condition is set, the option only appears to visitors who match the condition logic. See [Condition Builder](/flow-builder/condition-builder) for details.
79
+ Each option can also carry a condition. When you set one, the option appears only to
80
+ a visitor who matches the condition. See
81
+ [Condition Builder](/flow-builder/condition-builder) for more detail.
70
82
 
71
83
  ## Privacy
72
84
 
73
- **Do Not Track**: When enabled, this field's data is excluded from analytics tracking.
85
+ **Do Not Track**: When this is on, Picked keeps the data of this field out of your
86
+ analytics.
74
87
 
75
- **Do Not Store**: When enabled, this field's data is processed but not persisted. Use for sensitive information like passwords or payment details.
88
+ **Do Not Store**: When this is on, Picked reads the data of this field but does not
89
+ keep it. Use it for sensitive information such as a password or payment detail.
76
90
 
77
91
  ## Reuse fields
78
92
 
79
- Fields are project-level entities. Assign the same field to multiple steps across different experiences. Changes to a field's configuration apply everywhere it's used.
93
+ A field is a project-level entity. Assign the same field to steps in more than one
94
+ experience. A change to the options of a field applies at every place that uses it.
@@ -2,60 +2,78 @@
2
2
  layout: docs
3
3
  ---
4
4
 
5
- # Building flows
5
+ # Build flows
6
6
 
7
- Build flows by dragging blocks onto the canvas, connecting nodes with arrows, and configuring each node in the inspector.
7
+ To build a flow, drag a block onto the canvas. Connect your nodes with arrows. Then
8
+ set the options of each node in the inspector.
8
9
 
9
10
  ## Add nodes
10
11
 
11
- Drag a step, action, or condition from the entity browser onto the canvas. A new node appears where you drop it.
12
+ Drag a step, an action, or a condition from the entity browser onto the canvas. A new
13
+ node appears where you drop it.
12
14
 
13
- You can also drop a block directly onto an existing arrow. The node inserts inline — the original arrow splits into two arrows with the new node in between. A **+** indicator appears when you hover over a valid arrow.
15
+ You can also drop a block directly onto an arrow that is there already. The flow
16
+ builder puts the node into the line. The first arrow splits into two arrows, with the
17
+ new node between them. A **+** indicator appears when you hold the pointer over a
18
+ valid arrow.
14
19
 
15
20
  ## Connect nodes
16
21
 
17
- Click and drag from a node's output handle (right side) to another node's input handle (left side). An arrow appears connecting them.
22
+ Click the output handle of a node, on the right side. Drag to the input handle of
23
+ another node, on the left side. An arrow then joins the two nodes.
18
24
 
19
- The flow follows arrows from left to right, starting at the origin. Every node downstream of the origin is part of the experience flow.
25
+ The flow follows the arrows from left to right, and it starts at the origin. Every
26
+ node after the origin is part of the experience flow.
20
27
 
21
28
  ## Branch with conditions
22
29
 
23
- Connect the origin (or any node) to a condition node. The condition evaluates its logic and routes the flow down one of two paths.
30
+ Connect the origin, or any other node, to a condition node. The condition evaluates
31
+ its rule and sends the flow down one of two paths.
24
32
 
25
- Connect the green (true) handle to the nodes that should run when the condition passes. Connect the red (false) handle to the alternative path. Either path can lead to more steps, actions, or further conditions.
33
+ Connect the green handle, for a true result, to the nodes that must run when the
34
+ condition holds. Connect the red handle, for a false result, to the other path. Each
35
+ path can lead to more steps, more actions, and more conditions.
26
36
 
27
37
  ## Assign fields to steps
28
38
 
29
- Drag a field from the entity browser and drop it onto a step node. The field is now assigned to that step.
39
+ Drag a field from the entity browser onto a step node and drop it. That step then
40
+ holds the field.
30
41
 
31
- You can assign multiple fields to a single step. The step node shows a count of assigned fields. To see which fields are assigned, select the step and check the **Assigned Fields** section in the inspector.
42
+ You can assign more than one field to one step. The step node gives the number of
43
+ assigned fields. To see which fields it holds, choose the step. Then read the
44
+ **Assigned Fields** section in the inspector.
32
45
 
33
- ## Select nodes
46
+ ## Choose nodes
34
47
 
35
- Click a node to select it. Its inspector opens in the right panel.
48
+ Click a node to choose it. Its inspector opens in the right panel.
36
49
 
37
- Drag on empty canvas to marquee-select multiple nodes. Press `Cmd/Ctrl+A` to select all nodes.
50
+ Drag on empty canvas to choose every node inside a rectangle. Press `Cmd/Ctrl+A` to
51
+ choose every node.
38
52
 
39
- When multiple nodes are selected, the inspector shows a count and grouped list. Click any item in the list to navigate to its inspector.
53
+ When you choose more than one node, the inspector gives a count and a list in groups.
54
+ Click an item in that list to open its inspector.
40
55
 
41
56
  ## Move nodes
42
57
 
43
- Drag a selected node to reposition it. Nodes snap to the grid automatically.
58
+ Drag a node to move it. Each node snaps to the grid.
44
59
 
45
- Use arrow keys to nudge selected nodes. Hold `Shift` for larger nudges.
60
+ Use the arrow keys to move a node a small distance. Hold `Shift` to move it further.
46
61
 
47
62
  ## Delete nodes
48
63
 
49
- Select one or more nodes and press `Delete` or `Backspace`. The nodes and their connected arrows are removed.
64
+ Choose one or more nodes. Press `Delete` or `Backspace`. The flow builder removes
65
+ those nodes and every arrow that joins them.
50
66
 
51
67
  ## Duplicate nodes
52
68
 
53
- Select one or more nodes and press `Cmd/Ctrl+D`. Copies appear offset from the originals.
69
+ Choose one or more nodes. Press `Cmd/Ctrl+D`. A copy of each node appears next to the
70
+ first one.
54
71
 
55
72
  ## Undo and redo
56
73
 
57
- Press `Cmd/Ctrl+Z` to undo. Press `Cmd/Ctrl+Shift+Z` to redo. The undo stack tracks node additions, deletions, connections, and position changes.
74
+ Press `Cmd/Ctrl+Z` to undo. Press `Cmd/Ctrl+Shift+Z` to redo. The undo stack records
75
+ each node that you add, each node that you delete, each connection, and each move.
58
76
 
59
77
  ---
60
78
 
61
- [Overview](/flow-builder/overview) · [Nodes](/flow-builder/nodes) · **Building Flows** · [Keyboard Shortcuts](/flow-builder/keyboard-shortcuts) · [Condition Builder](/flow-builder/condition-builder)
79
+ [Overview](/flow-builder/overview) · [Nodes](/flow-builder/nodes) · **Build Flows** · [Keyboard Shortcuts](/flow-builder/keyboard-shortcuts) · [Condition Builder](/flow-builder/condition-builder)
@@ -4,51 +4,62 @@ layout: docs
4
4
 
5
5
  # Condition builder
6
6
 
7
- The condition builder is a visual rule editor used across the dashboard. It lets you define logic without writing code.
7
+ The condition builder is a visual rule editor, and the dashboard uses it in several
8
+ places. With it you define a rule and you write no code.
8
9
 
9
10
  ## Where it appears
10
11
 
11
- The condition builder is used in several places:
12
+ The dashboard uses the condition builder here:
12
13
 
13
- - **Condition nodes** — define branching logic in the [flow builder](/flow-builder/overview)
14
- - **Experience conditions** — control when an experience activates for a visitor
15
- - **Initialize open conditions** — control when an experience opens automatically on page load
16
- - **Field option conditions** — show or hide individual options based on visitor state
14
+ - **Condition nodes** — they set which branch the flow takes in the
15
+ [flow builder](/flow-builder/overview).
16
+ - **Experience conditions** — they control when an experience starts for a visitor.
17
+ - **Initialize open conditions** — they control when an experience opens by itself as
18
+ the page loads.
19
+ - **Field option conditions** — they show or hide one option, and the state of the
20
+ visitor decides which.
17
21
 
18
22
  ## Rule structure
19
23
 
20
- Rules are organized into groups. Each group uses either **AND** (all rules must match) or **OR** (any rule must match).
24
+ The builder holds your rules in groups. Each group uses **AND** or **OR**. With
25
+ **AND**, every rule must match. With **OR**, one rule must match.
21
26
 
22
27
  A single rule has three parts:
23
28
 
24
- 1. **Field** — the data source to evaluate
25
- 2. **Operator** — how to compare (equals, not equals, greater than, contains, etc.)
26
- 3. **Value** — the target value to compare against
29
+ 1. **Field** — the data source to evaluate.
30
+ 2. **Operator** — how to compare. Examples are equals, not equals, greater than, and
31
+ contains.
32
+ 3. **Value** — the value to compare against.
27
33
 
28
- You can nest groups inside other groups to create complex logic. For example, an AND group containing two OR groups.
34
+ You can put a group inside another group to build a larger rule. An example is an AND
35
+ group that holds two OR groups.
29
36
 
30
- ## Available data sources
37
+ ## Data sources
31
38
 
32
- When building rules, you can reference these data sources:
39
+ A rule can point at these data sources:
33
40
 
34
- **Responses** — values visitors have submitted through form fields in the current experience. Each field you create in your project appears here by its name.
41
+ **Responses** — the values that your visitors send through the form fields of the
42
+ current experience. Each field that you create in your project appears here under its
43
+ name.
35
44
 
36
- **Actions** — references to actions that have been triggered during the flow.
45
+ **Actions** — the actions that ran during the flow.
37
46
 
38
- **Features** — the state of feature flags in your project. Use this to branch based on which variant a visitor is assigned to.
47
+ **Feature flags** — the state of each feature flag in your project. Use it to take a
48
+ branch on whether Picked allocates a visitor to a flag.
39
49
 
40
- **Location** — properties of the visitor's current page URL, including pathname, search parameters, hostname, and hash.
50
+ **Location** — the parts of the current page URL of the visitor. These are the
51
+ pathname, the search parameters, the hostname, and the hash.
41
52
 
42
53
  ## Example
43
54
 
44
- To show a step only to visitors on a specific page who opted into marketing:
55
+ To show a step only to a visitor who is on one page and who accepted marketing:
45
56
 
46
57
  1. Create an AND group.
47
58
  2. Add a rule: **Location → pathname** equals `/pricing`.
48
- 3. Add a rule: **Responses → marketing_opt_in** equals `true`.
59
+ 3. Add a rule: **Responses → `marketing_opt_in`** equals `true`.
49
60
 
50
- Both conditions must be true for the rule group to match.
61
+ The rule group matches only when both conditions are true.
51
62
 
52
63
  ---
53
64
 
54
- [Overview](/flow-builder/overview) · [Nodes](/flow-builder/nodes) · [Building Flows](/flow-builder/building-flows) · [Keyboard Shortcuts](/flow-builder/keyboard-shortcuts) · **Condition Builder**
65
+ [Overview](/flow-builder/overview) · [Nodes](/flow-builder/nodes) · [Build Flows](/flow-builder/building-flows) · [Keyboard Shortcuts](/flow-builder/keyboard-shortcuts) · **Condition Builder**