@thg-altitude/schemaorg 1.0.37 → 1.0.38

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thg-altitude/schemaorg",
-  "version": "1.0.37",
+  "version": "1.0.38",
   "description": "",
   "main": "index.js",
   "scripts": {

package/src/components/EnhancedProduct.astro

@@ -29,7 +29,10 @@ const {
   suggestedGender,
   beauty_targetAge,
   gender,
-  weight
+  weight,
+  colorVariantPages,  // Array of {url, sku, color} for sibling color pages
+  currentColor,       // The color of the current page (used to filter variants)
+  baseProductGroupID, // Optional: explicit base product group ID without color suffix
 } = Astro.props;
 
 // Use the enhanced mapping function to extract data from the full product data
@@ -126,20 +129,64 @@ function convertToISO8601(dateString) {
 }
 
 function generateProductSchema() {
-  const hasMultipleVariants = variants && variants.length > 1;
+  // Helper: extract the color value from a variant's choices
+  function getVariantColor(variant) {
+    if (!variant?.choices) return null;
+    const colorChoice = variant.choices.find(c =>
+      c.optionKey === 'Color' || c.optionKey === 'Colour' || c.optionKey === 'color' ||
+      c.optionKey === 'colour' || c.optionKey === 'Shade' || c.optionKey === 'shade' ||
+      c.colour
+    );
+    if (colorChoice) {
+      return colorChoice.title || colorChoice.key || colorChoice.colour || null;
+    }
+    return null;
+  }
+
+  // Filter variants to only include those matching the current page's color
+  // The currentColor prop must be explicitly passed by the calling code
+  // e.g. currentColor="Blush" to filter to only Blush variants
+  // If not provided, all variants are included (backwards compatible)
+  let filteredVariants = variants;
+  let excludedVariants = []; // Variants filtered out (other colors) - used for URL-only references
+  if (currentColor && variants && variants.length > 0) {
+    const filtered = variants.filter(v => {
+      const variantColor = getVariantColor(v);
+      if (!variantColor) return true; // Include variants without color info
+      return variantColor.toLowerCase() === currentColor.toLowerCase();
+    });
+    // Collect excluded variants (other colors) for URL-only hasVariant entries
+    excludedVariants = variants.filter(v => {
+      const variantColor = getVariantColor(v);
+      if (!variantColor) return false; // Don't include variants without color info
+      return variantColor.toLowerCase() !== currentColor.toLowerCase();
+    });
+    // Fallback: if filtering removed everything, use all variants
+    if (filtered.length > 0) {
+      filteredVariants = filtered;
+    }
+  }
+
+  const hasMultipleVariants = filteredVariants && filteredVariants.length > 1;
   let variantsArray = [];
 
-  if (variants && variants.length > 0 && currency) {
+  if (filteredVariants && filteredVariants.length > 0 && currency) {
     if (hasMultipleVariants) {
       // Create individual Product objects for each variant
-      variantsArray = variants
+      variantsArray = filteredVariants
         .filter((variant) => variant?.sku && variant?.price?.price?.amount)
         .map((variant) => {
-          // Build variant name with attributes from choices in logical order
-          let variantName = name;
+          // Build variant name from base name (without color suffix) + variant's color + size
+          // e.g. "MP Women's Tempo Twist Front Sports Bra" + "Blush" + "XL"
+          // = "MP Women's Tempo Twist Front Sports Bra Blush XL"
+          const hasColorData = filteredVariants.some(v => getVariantColor(v));
+          const baseName = hasColorData && name
+            ? name.replace(/\s*-\s*[^-]+$/, '')
+            : name;
+          let variantName = baseName;
           const attributes = [];
           
-          // Extract properties in preferred order: Amount + Weight + Flavor + Size + Color + Material
+          // Extract properties in preferred order: Amount + Weight + Flavor + Color + Size + Material
           if (variant.choices && variant.choices.length > 0) {
             // Amount (only if explicitly marked as Amount, not weight-related)
             const amountChoice = variant.choices.find(c =>
@@ -165,6 +212,10 @@ function generateProductSchema() {
             );
             if (flavorChoice && flavorChoice.title) attributes.push(flavorChoice.title);
             
+            // Color - add from variant's actual color data
+            const variantColor = getVariantColor(variant);
+            if (variantColor) attributes.push(variantColor);
+            
             // Size (excluding weight-related sizes and already processed weight)
             const sizeChoice = variant.choices.find(c =>
               c.optionKey === 'Size' &&
@@ -176,20 +227,13 @@ function generateProductSchema() {
             );
             if (sizeChoice && sizeChoice.title) attributes.push(sizeChoice.title);
             
-            // Color
-            const colorChoice = variant.choices.find(c => c.optionKey === 'Color' || c.optionKey === 'Colour' || c.colour);
-            if (colorChoice) {
-              if (colorChoice.title) attributes.push(colorChoice.title);
-              else if (colorChoice.colour) attributes.push(colorChoice.colour);
-            }
-            
             // Material
             const materialChoice = variant.choices.find(c => c.optionKey === 'Material');
             if (materialChoice && materialChoice.title) attributes.push(materialChoice.title);
           }
           
           if (attributes.length > 0) {
-            variantName = `${name} ${attributes.join(' ')}`;
+            variantName = `${baseName} ${attributes.join(' ')}`;
           }
           
           return {
@@ -347,14 +391,18 @@ function generateProductSchema() {
         });
     } else {
       // Single variant - create offers array as before
-      offersArray = variants
+      offersArray = filteredVariants
         .filter((variant) => variant?.sku && variant?.price?.price?.amount)
         .map((variant) => {
-          // Build variant name with attributes from choices in logical order
-          let variantName = name;
+          // Build variant name from base name + variant's color + size
+          const hasColorData = filteredVariants.some(v => getVariantColor(v));
+          const baseName = hasColorData && name
+            ? name.replace(/\s*-\s*[^-]+$/, '')
+            : name;
+          let variantName = baseName;
           const attributes = [];
           
-          // Extract properties in preferred order: Amount + Weight + Flavor + Size + Color + Material
+          // Extract properties in preferred order: Amount + Weight + Flavor + Color + Size + Material
           if (variant.choices && variant.choices.length > 0) {
             // Amount (only if explicitly marked as Amount, not weight-related)
             const amountChoice = variant.choices.find(c =>
@@ -380,6 +428,10 @@ function generateProductSchema() {
             );
             if (flavorChoice && flavorChoice.title) attributes.push(flavorChoice.title);
             
+            // Color - add from variant's actual color data
+            const variantColor = getVariantColor(variant);
+            if (variantColor) attributes.push(variantColor);
+            
             // Size (excluding weight-related sizes and already processed weight)
             const sizeChoice = variant.choices.find(c =>
               c.optionKey === 'Size' &&
@@ -391,20 +443,13 @@ function generateProductSchema() {
             );
             if (sizeChoice && sizeChoice.title) attributes.push(sizeChoice.title);
             
-            // Color
-            const colorChoice = variant.choices.find(c => c.optionKey === 'Color' || c.optionKey === 'Colour' || c.colour);
-            if (colorChoice) {
-              if (colorChoice.title) attributes.push(colorChoice.title);
-              else if (colorChoice.colour) attributes.push(colorChoice.colour);
-            }
-            
             // Material
             const materialChoice = variant.choices.find(c => c.optionKey === 'Material');
             if (materialChoice && materialChoice.title) attributes.push(materialChoice.title);
           }
           
           if (attributes.length > 0) {
-            variantName = `${name} ${attributes.join(' ')}`;
+            variantName = `${baseName} ${attributes.join(' ')}`;
           }
           
           return {
@@ -457,33 +502,70 @@ function generateProductSchema() {
   const reviewsArray = generateReviewsSchema();
 
   if (name && sku) {
-    const hasMultipleVariants = variants && variants.length > 1;
+    const hasMultipleVariants = filteredVariants && filteredVariants.length > 1;
+    
+    // Compute the base product group ID by stripping color suffix from SKU
+    // e.g. "16919878-fudge" -> "16919878", "16919878-rose-red" -> "16919878"
+    // If baseProductGroupID prop is provided, use that instead
+    const computedProductGroupID = baseProductGroupID || sku.toString().replace(/-[a-zA-Z].*$/, '');
     
     if (hasMultipleVariants) {
-      // Determine what properties vary between variants
+      // Build URL-only entries for other color variants (from excluded variants or colorVariantPages)
+      let otherColorUrlEntries = [];
+      if (colorVariantPages && colorVariantPages.length > 0) {
+        // Use explicitly provided color variant page URLs
+        otherColorUrlEntries = colorVariantPages
+          .filter(p => p?.url && (!currentColor || !p.color || p.color.toLowerCase() !== currentColor.toLowerCase()))
+          .map(p => ({
+            "url": p.url.startsWith('http') ? p.url : `${url}${p.url}`
+          }));
+      } else if (excludedVariants.length > 0) {
+        // Auto-generate URL-only entries from filtered-out variants (other colors)
+        // Use /p/{sku} format which redirects to the correct color page
+        // Deduplicate by color to get one URL per color (using first variant of each color)
+        const seenColors = new Set();
+        otherColorUrlEntries = excludedVariants
+          .filter(v => {
+            if (!v?.sku) return false;
+            const color = getVariantColor(v);
+            if (color && seenColors.has(color.toLowerCase())) return false;
+            if (color) seenColors.add(color.toLowerCase());
+            return true;
+          })
+          .map(v => ({
+            "url": `${url}/p/${v.sku}`
+          }));
+      }
+
+      // Determine what properties vary between the filtered variants (this page's color only)
       const variesBy = [];
       
-      // Check what attributes exist across variants based on choices using correct schema.org properties
-      if (variants.some(v => v.choices && v.choices.some(c => c.optionKey === 'Weight' || (c.title && (c.title.includes('kg') || c.title.includes('lb') || /\d+\s*g\b/.test(c.title)))))) {
+      // Check what attributes exist across filtered variants using correct schema.org properties
+      if (filteredVariants.some(v => v.choices && v.choices.some(c => c.optionKey === 'Weight' || (c.title && (c.title.includes('kg') || c.title.includes('lb') || /\d+\s*g\b/.test(c.title)))))) {
         variesBy.push("https://schema.org/weight");
       }
-      if (variants.some(v => v.choices && v.choices.some(c => c.optionKey === 'Size' && c.title && !c.title.includes('kg') && !c.title.includes('g') && !c.title.includes('lb')))) {
+      if (filteredVariants.some(v => v.choices && v.choices.some(c => c.optionKey === 'Size' && c.title && !c.title.includes('kg') && !c.title.includes('g') && !c.title.includes('lb')))) {
         variesBy.push("https://schema.org/size");
       }
-      if (variants.some(v => v.choices && v.choices.some(c => c.optionKey === 'Color' || c.optionKey === 'Colour' || c.colour))) {
+      // Add color to variesBy if we have other color variants (from colorVariantPages or excluded variants)
+      if (colorVariantPages && colorVariantPages.length > 0) {
+        variesBy.push("https://schema.org/color");
+      } else if (excludedVariants.length > 0) {
+        variesBy.push("https://schema.org/color");
+      } else if (filteredVariants.some(v => v.choices && v.choices.some(c => c.optionKey === 'Color' || c.optionKey === 'Colour' || c.colour))) {
         variesBy.push("https://schema.org/color");
       }
-      if (variants.some(v => v.choices && v.choices.some(c => c.optionKey === 'Material'))) {
+      if (filteredVariants.some(v => v.choices && v.choices.some(c => c.optionKey === 'Material'))) {
         variesBy.push("https://schema.org/material");
       }
       // For non-standard properties like flavour, use additionalProperty
-      if (variants.some(v => v.choices && v.choices.some(c => c.optionKey === 'Flavour' || c.optionKey === 'Flavor' || c.optionKey === 'Taste'))) {
+      if (filteredVariants.some(v => v.choices && v.choices.some(c => c.optionKey === 'Flavour' || c.optionKey === 'Flavor' || c.optionKey === 'Taste'))) {
         if (!variesBy.includes("https://schema.org/additionalProperty")) {
           variesBy.push("https://schema.org/additionalProperty");
         }
       }
       // Check for Shade/Colour variations (Look Fantastic style) - now uses color property
-      if (variants.some(v => v.choices && v.choices.some(c =>
+      if (filteredVariants.some(v => v.choices && v.choices.some(c =>
           c.optionKey === 'Shade' || c.optionKey === 'shade' ||
           c.optionKey === 'Colour' || c.optionKey === 'colour' ||
           c.optionKey === 'Color' || c.optionKey === 'color'))) {
@@ -492,12 +574,17 @@ function generateProductSchema() {
         }
       }
 
+      // Strip color suffix from ProductGroup name (e.g. "Sports Bra - Blush" -> "Sports Bra")
+      // Only strip when variants have color data, indicating the name suffix is a color
+      const hasColorVariants = filteredVariants.some(v => getVariantColor(v));
+      const productGroupName = hasColorVariants && name
+        ? name.replace(/\s*-\s*[^-]+$/, '')
+        : name;
+
       const productGroupSchema = {
         "@type": "ProductGroup",
-        "@id": pageUrl,
-        url: pageUrl,
-        name: name,
-        productGroupID: sku.toString(),
+        name: productGroupName,
+        productGroupID: computedProductGroupID,
         ...(gtin13 && { gtin13: gtin13.toString() }),
         ...(description && { description }),
         ...(imageUrl && { image: imageUrl }),
@@ -508,7 +595,12 @@ function generateProductSchema() {
           },
         }),
         ...(variesBy.length > 0 && { variesBy }),
-        hasVariant: variantsArray,
+        hasVariant: [
+          ...variantsArray,
+          // Add URL-only references to other color variants as hasVariant entries
+          // Uses colorVariantPages if provided, otherwise auto-generates from excluded variants
+          ...otherColorUrlEntries
+        ],
         ...(reviewsCount > 0 &&
           reviewsAverage && {
             aggregateRating: {
@@ -555,7 +647,7 @@ function generateProductSchema() {
           }
           
           // Add flavour as additionalProperty for ProductGroup level
-          const flavourValues = variants?.map(v =>
+          const flavourValues = filteredVariants?.map(v =>
             v.choices?.find(c => c.optionKey === 'Flavour' || c.optionKey === 'Flavor' || c.optionKey === 'Taste')?.title
           ).filter(Boolean);
           
@@ -578,8 +670,6 @@ function generateProductSchema() {
       // Single product schema as before
       const productSchema = {
         "@type": "Product",
-        "@id": pageUrl,
-        url: pageUrl,
         sku: sku.toString(),
         name: name,
         ...(gtin13 && { gtin13: gtin13.toString() }),

package/src/components/Product.astro

@@ -26,8 +26,59 @@ let url = import.meta.env.DEV
   : `${Astro.request.headers.get(
     'X-forwarded-Proto'
   )}://${Astro.request.headers.get('X-forwarded-Host')?.split(', ')[0]}`
+// New props for multi-page color variant support
+const colorVariantPages = Astro.props.colorVariantPages;  // Array of {url, sku, color} for sibling color pages
+const currentColor = Astro.props.currentColor;             // The color of the current page
+const baseProductGroupID = Astro.props.baseProductGroupID; // Optional: explicit base product group ID
+
+// Helper: extract the color value from a variant
+function getVariantColor(variant) {
+  if (!variant) return null;
+  // Check direct color property
+  if (variant.color) return variant.color;
+  // Check choices array
+  if (variant.choices && Array.isArray(variant.choices)) {
+    const colorChoice = variant.choices.find(c =>
+      c.optionKey === 'Color' || c.optionKey === 'Colour' || c.optionKey === 'color' ||
+      c.optionKey === 'colour' || c.optionKey === 'Shade' || c.optionKey === 'shade'
+    );
+    if (colorChoice) {
+      return colorChoice.title || colorChoice.key || colorChoice.colour || null;
+    }
+  }
+  return null;
+}
+
+// Filter variants to only include those matching the current page's color
+// The currentColor prop must be explicitly passed by the calling code
+// e.g. currentColor="Blush" to filter to only Blush variants
+// If not provided, all variants are included (backwards compatible)
+let filteredVariants = Astro.props.variants;
+let excludedVariants = []; // Variants filtered out (other colors) - used for URL-only references
+if (currentColor && Array.isArray(Astro.props.variants) && Astro.props.variants.length > 0) {
+  const filtered = Astro.props.variants.filter(v => {
+    const variantColor = getVariantColor(v);
+    if (!variantColor) return true; // Include variants without color info
+    return variantColor.toLowerCase() === currentColor.toLowerCase();
+  });
+  // Collect excluded variants (other colors) for URL-only hasVariant entries
+  excludedVariants = Astro.props.variants.filter(v => {
+    const variantColor = getVariantColor(v);
+    if (!variantColor) return false; // Don't include variants without color info
+    return variantColor.toLowerCase() !== currentColor.toLowerCase();
+  });
+  // Fallback: if filtering removed everything, use all variants
+  if (filtered.length > 0) {
+    filteredVariants = filtered;
+  }
+}
+
+// Compute the base product group ID by stripping color suffix from SKU
+// e.g. "16919878-fudge" -> "16919878", "16919878-rose-red" -> "16919878"
+const computedProductGroupID = baseProductGroupID || (Astro.props.sku ? Astro.props.sku.toString().replace(/-[a-zA-Z].*$/, '') : '');
+
 // Check if we have multiple variants to determine if we need ProductGroup
-const hasMultipleVariants = Astro.props.variants && Astro.props.variants.length > 1;
+const hasMultipleVariants = filteredVariants && filteredVariants.length > 1;
 
 let reviewsArray: {}[] = []
 Astro.props.reviews?.forEach((review)=>{
@@ -68,12 +119,18 @@ let offersArray = []
 let schema;
 
 if (hasMultipleVariants) {
-  // Create individual Product objects for each variant
-  if (Array.isArray(Astro.props.variants)) {
-    Astro.props.variants.forEach((variant) => {
+  // Create individual Product objects for each variant (filtered to current color only)
+  if (Array.isArray(filteredVariants)) {
+    // Strip color from base name for variant name construction
+    const hasColorData = filteredVariants.some(v => getVariantColor(v));
+    const baseName = hasColorData && Astro.props.name
+      ? Astro.props.name.replace(/\s*-\s*[^-]+$/, '')
+      : (Astro.props.name || "");
+
+    filteredVariants.forEach((variant) => {
       if (variant && typeof variant === 'object' && variant.sku) {
-        // Build variant name with attributes in logical order: Name + Weight + Flavor + Size + Color + Material
-        let variantName = Astro.props.name || "";
+        // Build variant name from base name + variant's color + size
+        let variantName = baseName;
         const attributes = [];
 
         // Check for amount/quantity first
@@ -91,13 +148,16 @@ if (hasMultipleVariants) {
           if (variantSpecificName) attributes.push(variantSpecificName);
         }
         
+        // Add color from variant's actual data
+        const variantColor = getVariantColor(variant);
+        if (variantColor) attributes.push(variantColor);
+        
         // Add other attributes
         if (variant.size && !variant.size.includes('kg') && !variant.size.includes('g')) attributes.push(variant.size);
-        if (variant.color) attributes.push(variant.color);
         if (variant.material) attributes.push(variant.material);
         
-        if (attributes.length > 0 && Astro.props.name) {
-          variantName = `${Astro.props.name} ${attributes.join(' ')}`;
+        if (attributes.length > 0 && baseName) {
+          variantName = `${baseName} ${attributes.join(' ')}`;
         }
 
         const variantObj = {
@@ -199,29 +259,41 @@ if (hasMultipleVariants) {
     });
   }
 
-  // Determine what properties vary between variants
+  // Determine what properties vary between filtered variants
   const propertyChecks = [
     { prop: 'weight', url: 'https://schema.org/weight' },
     { prop: 'size', url: 'https://schema.org/size' },
-    { prop: 'color', url: 'https://schema.org/color' },
     { prop: 'material', url: 'https://schema.org/material' },
   ];
 
-  // Check what attributes exist across variants - ensure variants is an array
+  // Check what attributes exist across filtered variants
   // For non-standard properties like amount and flavour, we use additionalProperty
   const variesBy = propertyChecks
-    .filter(({ prop }) => Astro.props.variants?.some(v => v?.[prop]))
+    .filter(({ prop }) => filteredVariants?.some(v => v?.[prop]))
     .map(({ url }) => url);
 
+  // Add color to variesBy if we have other color variants (from colorVariantPages or excluded variants)
+  if (colorVariantPages && colorVariantPages.length > 0) {
+    if (!variesBy.includes("https://schema.org/color")) {
+      variesBy.push("https://schema.org/color");
+    }
+  } else if (excludedVariants.length > 0) {
+    if (!variesBy.includes("https://schema.org/color")) {
+      variesBy.push("https://schema.org/color");
+    }
+  } else if (filteredVariants?.some(v => v?.color)) {
+    variesBy.push("https://schema.org/color");
+  }
+
   // Check for flavor with multiple possible property names - treat as additionalProperty
-  if (Astro.props.variants?.some(v => v && (v.flavor || v.flavour || v.taste))) {
+  if (filteredVariants?.some(v => v && (v.flavor || v.flavour || v.taste))) {
     if (!variesBy.includes("https://schema.org/additionalProperty")) {
       variesBy.push("https://schema.org/additionalProperty");
     }
   }
 
   // Check for shade/colour in variant.choices (Look Fantastic structure) - now uses color property
-  if (Astro.props.variants?.some(v => v && v.choices && Array.isArray(v.choices) &&
+  if (filteredVariants?.some(v => v && v.choices && Array.isArray(v.choices) &&
       v.choices.some(c => c.optionKey === 'Shade' || c.optionKey === 'shade' ||
                         c.optionKey === 'Colour' || c.optionKey === 'colour' ||
                         c.optionKey === 'Color' || c.optionKey === 'color'))) {
@@ -230,21 +302,51 @@ if (hasMultipleVariants) {
     }
   }
 
+  // Build URL-only entries for other color variants (from excluded variants or colorVariantPages)
+  let otherColorUrlEntries = [];
+  if (colorVariantPages && colorVariantPages.length > 0) {
+    // Use explicitly provided color variant page URLs
+    otherColorUrlEntries = colorVariantPages
+      .filter(p => p?.url && (!currentColor || !p.color || p.color.toLowerCase() !== currentColor.toLowerCase()))
+      .map(p => ({
+        "url": p.url.startsWith('http') ? p.url : `${url}${p.url}`
+      }));
+  } else if (excludedVariants.length > 0) {
+    // Auto-generate URL-only entries from filtered-out variants (other colors)
+    // Use /p/{sku} format which redirects to the correct color page
+    // Deduplicate by color to get one URL per color (using first variant of each color)
+    const seenColors = new Set();
+    otherColorUrlEntries = excludedVariants
+      .filter(v => {
+        if (!v?.sku) return false;
+        const color = getVariantColor(v);
+        if (color && seenColors.has(color.toLowerCase())) return false;
+        if (color) seenColors.add(color.toLowerCase());
+        return true;
+      })
+      .map(v => ({
+        "url": `${url}/p/${v.sku}`
+      }));
+  }
+
   schema = {
     "@type": "ProductGroup",
     "@context": "https://schema.org",
-    "@id": Astro.props.sku ? Astro.props.sku.toString() : "",
-    "url": `${url}${Astro.props.url || ""}`,
-    "productGroupID": Astro.props.sku ? Astro.props.sku.toString() : "",
-    "hasVariant": variantsArray
+    "productGroupID": computedProductGroupID,
+    "hasVariant": [
+      ...variantsArray,
+      // Add URL-only references to other color variants as hasVariant entries
+      // Uses colorVariantPages if provided, otherwise auto-generates from excluded variants
+      ...otherColorUrlEntries
+    ]
   };
 
   if (variesBy.length > 0) schema.variesBy = variesBy;
 
 } else {
   // Single variant - create offers array as before
-  if (Array.isArray(Astro.props.variants)) {
-    Astro.props.variants.forEach((variant) => {
+  if (Array.isArray(filteredVariants)) {
+    filteredVariants.forEach((variant) => {
       if (variant && typeof variant === 'object' && variant.sku) {
         const offerObj = {
           "@type": "Offer",
@@ -266,14 +368,22 @@ if (hasMultipleVariants) {
   schema = {
     "@type": "Product",
     "@context": "https://schema.org",
-    "@id": Astro.props.sku ? Astro.props.sku.toString() : "",
     "sku": Astro.props.sku ? Astro.props.sku.toString() : "",
     "offers": offersArray
   };
 }
 
 // Extract duplicate code
-if (Astro.props.name) schema.name = Astro.props.name;
+if (Astro.props.name) {
+  // Strip color suffix from ProductGroup name (e.g. "Sports Bra - Blush" -> "Sports Bra")
+  // Only strip when it's a ProductGroup and variants have color data
+  const hasColorVariants = hasMultipleVariants && filteredVariants?.some(v => getVariantColor(v));
+  if (hasColorVariants) {
+    schema.name = Astro.props.name.replace(/\s*-\s*[^-]+$/, '');
+  } else {
+    schema.name = Astro.props.name;
+  }
+}
 if (Astro.props.description) schema.description = Astro.props.description;
 if (Astro.props.image) {
   schema.image = import.meta.env.IMAGE_PROXY_URL