Theme

Core concepts

Understanding our SKU

HLC SKUs follow a structured format that encodes product dimensions and variants. Use the ProductDimensionGroup field to parse and understand SKU components.


SKU Structure

HLC uses dimension groups to categorize product variants. Each group defines which attributes are encoded in the SKU:

Product Dimension GroupDimensionsExample
300Configuration020056-05 → Configuration = 05
400Size960865-01 → Size = 01
500Color861266-166 → Color = 166
600Configuration + Size920701-01-U → Configuration = 01, Size = U
700Configuration + Color890292-01-001 → Configuration = 01, Color = 001
800Size + Color861070-L-001 → Size = L, Color = 001

This standardized approach enables dynamic product filtering without vendor-specific logic.


Parsing SKUs

TypeScript Implementation

interface SkuParseResult {
  configuration?: string
  size?: string
  color?: string
  raw?: string
}

function parseSku(sku: string, productDimensionGroup: number): SkuParseResult {
  const parts = sku.split('-')

  const dimensionMap: Record<number, SkuParseResult> = {
    300: { configuration: parts[1] },
    400: { size: parts[1] },
    500: { color: parts[1] },
    600: { configuration: parts[1], size: parts[2] },
    700: { configuration: parts[1], color: parts[2] },
    800: { size: parts[1], color: parts[2] },
  }

  return dimensionMap[productDimensionGroup] ?? { raw: sku }
}

// Usage example
const product = {
  sku: '861070-L-001',
  productDimensionGroup: 800,
}

const parsed = parseSku(product.sku, product.productDimensionGroup)
console.log(parsed) // { size: 'L', color: '001' }

JavaScript Implementation

/**
 * Parses an HLC SKU based on its product dimension group
 * @param {string} sku - The product SKU to parse
 * @param {number} productDimensionGroup - The dimension group identifier
 * @returns {Object} Parsed SKU components
 */
function parseSku(sku, productDimensionGroup) {
  const parts = sku.split('-')

  const dimensionMap = {
    300: { configuration: parts[1] },
    400: { size: parts[1] },
    500: { color: parts[1] },
    600: { configuration: parts[1], size: parts[2] },
    700: { configuration: parts[1], color: parts[2] },
    800: { size: parts[1], color: parts[2] },
  }

  return dimensionMap[productDimensionGroup] ?? { raw: sku }
}

Practical Application

Build dynamic product variant selectors:

const products = await fetch('https://api.hlc.bike/us/v4.1/Catalog/Products', {
  headers: {
    Authorization: `ApiKey ${process.env.HLC_API_KEY}`,
    language: 'en',
  },
}).then((res) => res.json())

// Group variants by parsed dimensions
const variants = products.map((product) => ({
  ...product,
  dimensions: parseSku(product.sku, product.productDimensionGroup),
}))

// Extract available sizes for filtering
const availableSizes = [
  ...new Set(variants.map((v) => v.dimensions.size).filter(Boolean)),
]

console.log('Available sizes:', availableSizes)
Previous
Security