@picked/client 0.0.0-chore-version-and-release-packages.1733366498981-3517ab4

package/dist/index.d.ts

@@ -0,0 +1,260 @@
+import { RulesLogic } from 'json-logic-js';
+
+export declare interface AdaptedBlock<F extends string, C> {
+    id: string;
+    framework: F;
+    mount: Mount<C>;
+    component: C;
+}
+
+declare function addEventListener_2<K extends keyof ClientEventMap>(type: K, listener: (event: ClientEventMap[K]) => void): () => void;
+export { addEventListener_2 as addEventListener }
+
+export declare interface AppEvent extends ClientEvent {
+    readonly app?: {};
+}
+
+declare interface BlockComponentProps {
+    properties: { id: string; settings: any; zones: [] }
+    experience: ExperienceData // todo: is there some other way to pass this value to components? Perhaps via an SDK method
+}
+
+export declare interface ClientEvent {
+    readonly type: keyof ClientEventMap;
+}
+
+export declare interface ClientEventMap {
+    beforeinit: ClientEvent;
+    init: ClientEvent;
+    beforeappload: AppEvent;
+    appload: AppEvent;
+    beforeappopen: AppEvent;
+    appopen: AppEvent;
+    beforeappclose: AppEvent;
+    appclose: AppEvent;
+    beforeexperienceload: ExperienceEvent;
+    experienceload: ExperienceEvent;
+    beforeexperienceopen: ExperienceEvent;
+    experienceopen: ExperienceEvent;
+    beforeexperienceclose: ExperienceEvent;
+    experienceclose: ExperienceEvent;
+    beforederivesessiontags: SessionEvent;
+    derivesessiontags: SessionEvent;
+    beforeupdatehistorystate: HistoryEvent;
+    updatehistorystate: HistoryEvent;
+    beforemodalopen: ModalEvent;
+    modalopen: ModalEvent;
+    beforemodalclose: ModalEvent;
+    modalclose: ModalEvent;
+    beforestepsubmit: StepEvent;
+    stepsubmit: StepEvent;
+    beforestepsubmitsuccess: StepEvent;
+    stepsubmitsuccess: StepEvent;
+    beforestepenter: StepEvent;
+    stepenter: StepEvent;
+    beforestepexit: StepEvent;
+    stepexit: StepEvent;
+    beforeformsubmit: FormEvent;
+    formsubmit: FormEvent;
+    experieceloaderror: ErrorEvent_2<ExperienceEvent>;
+    stepsubmiterror: ErrorEvent_2<StepEvent>;
+    formsubmiterror: ErrorEvent_2<FormEvent>;
+    fieldvalidationerror: ErrorEvent_2<FieldEvent>;
+}
+
+export declare interface ClientEventMap extends EditorEventMap {
+}
+
+export declare const createClient: (options: Readonly<CreateClientOptions>) => void;
+
+export declare interface CreateClientOptions {
+    hooks?: CreateClientOptionsHooks;
+    mount: Mount<any>;
+    blocks: AdaptedBlock<string, any>[];
+}
+
+export declare interface CreateClientOptionsHooks {
+    onAfterInit?: () => void;
+    onBeforeExperienceLoad?: () => void;
+    handleExperienceLoad?: (experienceId: string) => Promise<ExperienceData>;
+    onexperienceload?: () => void;
+}
+
+export declare const destroyClient: () => void;
+
+export declare interface EditorEvent extends ClientEvent {
+    readonly experience?: ExperienceData;
+}
+
+export declare interface EditorEventMap {
+    'editor:update': EditorEvent;
+}
+
+declare type ErrorEvent_2<E extends ClientEvent> = E & {
+    readonly error: Error;
+};
+export { ErrorEvent_2 as ErrorEvent }
+
+declare interface ExperienceConditional {
+    id: string
+    condition: ExperienceConditionalRulesLogic
+
+    [key: string]: unknown
+}
+
+declare type ExperienceConditionalNode = ExperienceNodeBase & {
+    type: 'conditional'
+    conditionalId: string
+}
+
+declare type ExperienceConditionalRulesLogic = RulesLogic<never>
+
+declare interface ExperienceConfiguration {
+    steps: ExperienceStep[]
+    conditionals: ExperienceConditional[]
+    edges: ExperienceEdge[]
+    nodes: ExperienceNode[]
+    fields: ExperienceField[] // todo: rename to "questions" to match analytics
+}
+
+declare interface ExperienceData {
+    id: ExperienceSummary['id']
+    type: ExperienceSummary['type']
+    name: ExperienceSummary['name']
+    targets: ExperienceSummary['targets']
+    decide: ExperienceSummary['decide']
+    steps: ExperienceConfiguration['steps']
+    conditionals: ExperienceConfiguration['conditionals']
+    nodes: ExperienceConfiguration['nodes']
+    fields: ExperienceConfiguration['fields']
+}
+
+declare interface ExperienceEdge {
+    id: string
+    sourceNodeId: string
+    targetNodeId: string
+    sourceHandle?: string
+}
+
+export declare interface ExperienceEvent extends ClientEvent {
+    readonly experience?: ExperienceData;
+    readonly project?: {};
+    readonly organization?: {};
+    readonly app?: {};
+}
+
+declare interface ExperienceField {
+    id: string
+    type: ExperienceFieldTypePrimitive
+    label: string
+    placeholder?: string
+    required?: boolean
+    description?: string
+    helpText?: string
+    defaultValue?: string | number | boolean | (string | number | boolean)[]
+    multiple?: boolean
+
+    // todo: dynamic validation rules (API lookups, etc)
+    validationRules?: ExperienceFieldValidationRulesLogic
+
+    // todo: which of these do we need?
+    options?: ExperienceFieldOption[]
+
+    analytics: {
+        trackCustomerResponse: boolean // should the response to this question be tracked in analytics?
+    }
+}
+
+declare interface ExperienceFieldOption {
+    id: string
+    label: string // we used 'title' in snowplaw tracking - should we consolidate names?
+    value: string | number | boolean | null
+}
+
+declare type ExperienceFieldTypePrimitive = 'text' | 'number' | 'json' | 'boolean' | 'date'
+
+declare type ExperienceFieldValidationRulesLogic = RulesLogic<never>
+
+declare type ExperienceNode = ExperienceConditionalNode | ExperienceStepNode | ExperienceOriginNode
+
+declare interface ExperienceNodeBase {
+    id: string
+    position: ExperienceNodePosition
+}
+
+declare interface ExperienceNodePosition {
+    x: number
+    y: number
+}
+
+declare type ExperienceOriginNode = ExperienceNodeBase & {
+    type: 'origin'
+}
+
+declare interface ExperienceStep {
+    id: string
+    title: string
+    thumbnailUrl?: string
+    type: 'question' | 'lead-capture' | 'error' | 'recommendation' // todo: expand or shrink types?
+    content: any // todo: step editor content
+
+    [key: string]: unknown
+}
+
+declare type ExperienceStepNode = ExperienceNodeBase & {
+    type: 'step'
+    stepId: string
+    thumbnailUrl?: string
+}
+
+declare interface ExperienceSummary {
+    id: string
+    type: 'funnel' | 'widget' | 'hello-bar' | 'landing-page'
+    name: string
+    slug: string
+    targets: string[] // CSS selectors to target containers to render inside
+    decide: RulesLogic<never> // todo: conditionals for showing/hiding the experience (AB/URL/etc) - JSON Logic would be useful here. Better name for this property?
+}
+
+export declare interface FieldEvent extends ClientEvent {
+    readonly field?: {};
+}
+
+export declare interface FormEvent extends ClientEvent {
+    readonly form?: {};
+}
+
+export declare const getBlockById: (id: string) => AdaptedBlock<string, any> | undefined;
+
+export declare interface HistoryEvent extends ClientEvent {
+    readonly history?: {};
+}
+
+export declare function internal_emitEvent<K extends keyof ClientEventMap>(type: K, event: Omit<ClientEventMap[K], 'type'>): void;
+
+export declare interface ModalEvent extends ClientEvent {
+    readonly modal?: {};
+}
+
+declare type Mount<C> = (el: Element, blockProps: BlockComponentProps, component?: C) => () => void;
+
+declare function removeEventListener_2<K extends keyof ClientEventMap>(type: K, listener: (event: ClientEventMap[K]) => void): void;
+export { removeEventListener_2 as removeEventListener }
+
+export declare interface SessionEvent extends ClientEvent {
+    readonly session?: {};
+    readonly experience?: ExperienceData;
+    readonly project?: {};
+    readonly organization?: {};
+    readonly app?: {};
+}
+
+export declare interface StepEvent extends ClientEvent {
+    readonly step?: {};
+    readonly experience?: ExperienceData;
+    readonly project?: {};
+    readonly organization?: {};
+    readonly app?: {};
+}
+
+export { }

package/dist/index.js

@@ -0,0 +1,75 @@
+const f = (e) => ({
+  ...e
+});
+function E() {
+  return document;
+}
+const i = (e, ...n) => {
+  console.log(`[@picked/client] ${e}`, ...n);
+}, o = {};
+function $(e, n) {
+  return i(`Add listener: ${e}`), o[e] || (o[e] = []), o[e].push(n), () => x(e, n);
+}
+function x(e, n) {
+  i(`Remove listener: ${e}`), o[e] && (o[e] = o[e].filter((t) => t !== n));
+}
+function c(e, n) {
+  i(`Emit event: ${e}`), o[e] && o[e].forEach((t) => t({ type: e, ...n }));
+}
+const m = (e) => e.decide === !0, p = async (e) => {
+  const n = ["todo"];
+  await Promise.allSettled(
+    n.map(async (t) => {
+      const r = await v(e);
+      m(r) && h(e, r);
+    })
+  );
+}, g = () => {
+  for (; a.length > 0; ) {
+    const e = a.pop();
+    e == null || e();
+  }
+}, a = [], h = (e, n) => {
+  n.targets.forEach((r) => {
+    E().querySelectorAll(r).forEach((u) => {
+      const d = e.mount(u, {
+        properties: { id: "123", settings: {}, zones: [] },
+        experience: n
+      });
+      a.push(d);
+    });
+  });
+};
+async function v(e) {
+  var t, r;
+  c("beforeexperienceload", {});
+  const n = await ((r = (t = e.hooks) == null ? void 0 : t.handleExperienceLoad) == null ? void 0 : r.call(t, "experience-id"));
+  if (c("experienceload", {}), !n) {
+    const s = new Error("Error loading experience");
+    throw c("experieceloaderror", {
+      error: s
+    }), s;
+  }
+  return n;
+}
+const l = {}, b = (e) => (i(`Get block by ID: ${e}`, l), l[e]), w = (e = []) => {
+  i(`Register ${e.length} blocks`), e.forEach((n) => {
+    l[n.id] = n;
+  });
+}, A = (e) => {
+  if (!e)
+    throw new Error("options is required");
+  c("beforeinit", {});
+  const n = f(e);
+  w(n.blocks), p(n), c("init", {});
+}, B = () => {
+  g();
+};
+export {
+  $ as addEventListener,
+  A as createClient,
+  B as destroyClient,
+  b as getBlockById,
+  c as internal_emitEvent,
+  x as removeEventListener
+};

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "@picked/client",
+  "version": "0.0.0-chore-version-and-release-packages.1733366498981-3517ab4",
+  "devDependencies": {
+    "@repo/eslint-config": "workspace:*",
+    "@repo/types": "workspace:*",
+    "@repo/typescript-config": "workspace:*",
+    "tslib": "^2.8.1",
+    "vite": "^5.4.10",
+    "vite-plugin-dts": "^4.3.0"
+  },
+  "files": [
+    "dist"
+  ],
+  "main": "dist",
+  "private": false,
+  "scripts": {
+    "build": "vite build",
+    "dev": "vite build --watch",
+    "lint": "eslint .",
+    "lint:format": "eslint . --fix",
+    "lint:report": "eslint . -o './.reports/eslint.json' -f json || true",
+    "type-check": "tsc -p . --noEmit"
+  },
+  "type": "module"
+}