@holdyapp/sdk 1.5.0 → 1.9.0

package/src/web.ts

@@ -14,9 +14,10 @@
 import { HoldyCore } from './core'
 import { installAutoCapture, type NavigationKind } from './auto-capture'
 import { installFrictionCapture, type FrictionCapture, type FrictionCaptureOptions } from './friction'
-import { buildWebContext } from './web-context'
+import { installSkeletonCapture, type SkeletonCapture } from './skeleton'
+import { buildWebContext, clearSessionId } from './web-context'
 import { installProductChanges, type ProductChangesHandle } from './changes'
-import type { HoldyOptions, Properties } from './types'
+import type { HoldyOptions, Properties, TrackOverrides } from './types'
 
 const ANON_STORAGE_KEY = 'holdy_anon_id'
 
@@ -40,12 +41,20 @@ export interface HoldyWebOptions extends HoldyOptions {
    * identificada (`group()` ou `accountKey`) nada é aplicado.
    */
   productChanges?: boolean
+  /**
+   * Mandar o esqueleto da página · default true. Uma vez por (rota, estrutura)
+   * por aba: `$page_skeleton` com os elementos interativos (tag, role,
+   * data-testid, name, aria-label, tipo, posição relativa). Sem texto livre,
+   * sem valor de input, sem pixel.
+   */
+  skeleton?: boolean
 }
 
 export class HoldyWeb extends HoldyCore {
   private teardownAutoCapture: (() => void) | null = null
   private friction: FrictionCapture | null = null
   private changes: ProductChangesHandle | null = null
+  private skeleton: SkeletonCapture | null = null
 
   constructor(opts: HoldyWebOptions) {
     super('sdk_web', opts)
@@ -67,12 +76,20 @@ export class HoldyWeb extends HoldyCore {
       })
     }
 
+    if (opts.skeleton !== false) {
+      this.skeleton = installSkeletonCapture({
+        onSkeleton: (skeleton) => this.track('$page_skeleton', { ...skeleton }),
+      })
+    }
+
     if (opts.autoCapture !== false) {
       this.teardownAutoCapture = installAutoCapture({
         onNavigate: (kind: NavigationKind) => {
           this.page(undefined, { navigation: kind })
-          this.friction?.onNavigate(typeof location !== 'undefined' ? location.pathname : '/')
+          const path = typeof location !== 'undefined' ? location.pathname : '/'
+          this.friction?.onNavigate(path)
           this.changes?.onNavigate()
+          this.skeleton?.onNavigate(path)
         },
       })
     }
@@ -108,6 +125,11 @@ export class HoldyWeb extends HoldyCore {
     this.changes?.onNavigate()
   }
 
+  override track(name: string, properties?: Properties, overrides?: TrackOverrides): void {
+    super.track(name, properties, overrides)
+    if (!name.startsWith('$')) this.changes?.onEvent(name)
+  }
+
   reset(): void {
     this.userId = null
     this.accountKey = null
@@ -116,6 +138,7 @@ export class HoldyWeb extends HoldyCore {
     } catch {
       // storage indisponível (SSR/privacy mode) — ok
     }
+    clearSessionId()
     this.anonymousId = resolveAnonymousId()
     this.changes?.onNavigate()
   }
@@ -128,6 +151,8 @@ export class HoldyWeb extends HoldyCore {
     this.friction = null
     this.changes?.teardown()
     this.changes = null
+    this.skeleton?.teardown()
+    this.skeleton = null
     await super.shutdown()
   }