Core Concepts

// Text-heavy search (specs matter more)
const results = await refine.search.text({
  query: 'laptop 16gb ram',
  visualWeight: 0.2  // 80% text, 20% visual
});

// Visual-heavy search (appearance matters more)
const results = await refine.search.text({
  query: 'boho summer dress',
  visualWeight: 0.7  // 30% text, 70% visual
});

const refine = new Refine({
  catalogId: 'cat_us_retail_2024'
});

const context = refine.events.trackItemsServed({
  surface: 'product_page',
  source: 'similar-items',
  itemIds: productIds
});

// Anonymous visitor browsing
const visitorId = refine.getVisitorId(); // Auto-generated

// User logs in
refine.identify('user_12345');

// Now visitor history is linked to user_12345
const recs = await refine.recs.forUser({ configId: 'config_abc' });

const recs = await refine.recs.similarItems({
  anchorId: 'sku_dress_001',  // The product being viewed
  topK: 8
});

const recs = await refine.recs.forVisitor({
  configId: 'homepage_recs',
  topK: 12
});

refine.identify('user_12345');
const recs = await refine.recs.forUser({
  configId: 'you_may_like',
  topK: 12
});

// Products are served
const context = refine.events.trackSearch(query, results.results, options);

// User interacts
context.trackClick(productId, position);    // They clicked
context.trackView(productId, position);     // It became visible
context.trackAddToCart(productId);          // They added to cart