Remove SimpleCard and VariantSelector components

.github/instructions/testing.instructions.md

@@ -49,8 +49,8 @@ applyTo: "test/*"
 - Available mock products include:
   - `mockProductWithVariants` - Product with multiple variants (Size, Color options)
   - `mockProductWithoutVariants` - Product with no options
-  - `mockSimpleCardProduct` - Basic product for SimpleCard tests
   - `mockProductWithSingleValueOption` - Product with one single-value option
   - `mockProductAllSingleValue` - Product where all options have single values
+  - `createMockShopifyProducts` - Function to create multiple mock products with unique handles and IDs
   - Additional specialized test products as needed
 - When adding new mock products, add them to `src/mock/products.ts` for reusability

README.md

@@ -26,9 +26,7 @@ This package provides the following custom elements:
 | DynamicCard     | `nosto-dynamic-card`     | Dynamic product card templating                 | Shopify only |
 | Image           | `nosto-image`            | Progressive image enhancement with optimization |              |
 | Product         | `nosto-product`          | Product interaction and cart management         |              |
-| SimpleCard      | `nosto-simple-card`      | Simple product card templating                  | Shopify only |
 | SkuOptions      | `nosto-sku-options`      | Product variant and SKU selection interface     |              |
-| VariantSelector | `nosto-variant-selector` | Product variant options as clickable pills      | Shopify only |
 
 ## Documentation
 

src/components/Bundle/Bundle.stories.tsx

@@ -67,9 +67,9 @@ export const Default: Story = {
       <nosto-bundle products={productsWithTitles as JSONProduct[]} summary={args.summary}>
         <div class="bundle-grid">
           {productsWithTitles.map(product => (
-            <nosto-simple-card handle={product.handle}>
-              <nosto-variant-selector handle={product.handle} mode="compact"></nosto-variant-selector>
-            </nosto-simple-card>
+            <div class="product-card" handle={product.handle}>
+              <p>{product.title}</p>
+            </div>
           ))}
         </div>
         <div class="bundle-controls">
@@ -104,10 +104,10 @@ export const CheckboxCard: Story = {
       <nosto-bundle products={productsWithTitles as JSONProduct[]}>
         <div class="bundle-grid checkbox-cards">
           {productsWithTitles.map(product => (
-            <nosto-simple-card handle={product.handle}>
-              <nosto-variant-selector handle={product.handle} mode="compact"></nosto-variant-selector>
+            <div class="product-card" handle={product.handle}>
+              <p>{product.title}</p>
               <input type="checkbox" value={product.handle} checked />
-            </nosto-simple-card>
+            </div>
           ))}
         </div>
         <div class="bundle-summary">

src/components/Bundle/Bundle.ts

@@ -5,7 +5,7 @@ import { fetchProduct } from "@/shopify/graphql/fetchProduct"
 import { ShopifyProduct, VariantChangeDetail } from "@/shopify/graphql/types"
 import { formatPrice } from "@/shopify/formatPrice"
 import { parseId, toVariantGid } from "@/shopify/graphql/utils"
-import { EVENT_NAME_VARIANT_CHANGE } from "../VariantSelector/emitVariantChange"
+import { EVENT_NAME_VARIANT_CHANGE } from "../events"
 import { SelectableProduct } from "./types"
 
 /** Event name for the Bundle rendered event */