feat: extract inventory copy workflow step

apps/web/src/components/molecules/InventoryCopyStep.scss

@@ -0,0 +1,9 @@
+.inventory-copy-step {
+  align-content: start;
+}
+
+.inventory-copy-step__intro {
+  margin: var(--space-2) 0 0;
+  color: var(--color-text-muted);
+  font-size: var(--text-sm);
+}

apps/web/src/components/molecules/InventoryCopyStep.stories.js

@@ -0,0 +1,12 @@
+import InventoryCopyStep from './InventoryCopyStep.vue';
+
+export default { title: 'Molecules/InventoryCopyStep', component: InventoryCopyStep };
+
+const products = [{ id: 'product-1', name: 'Charizard ex #199/165' }];
+const conditions = [
+  { id: 'condition-1', name: 'Near Mint', code: 'NM' },
+  { id: 'condition-2', name: 'Lightly Played', code: 'LP' },
+];
+
+export const Empty = { args: { productId: '', conditionId: '', products, conditions } };
+export const Selected = { args: { productId: 'product-1', conditionId: 'condition-1', products, conditions } };

apps/web/src/components/molecules/InventoryCopyStep.vue

@@ -0,0 +1,54 @@
+<script setup>
+defineProps({
+  productId: { type: String, required: true },
+  conditionId: { type: String, required: true },
+  products: { type: Array, required: true },
+  conditions: { type: Array, required: true },
+  isSaving: { type: Boolean, default: false },
+});
+
+defineEmits(['update:productId', 'update:conditionId', 'submit']);
+</script>
+
+<template>
+  <form id="workflow-inventory" class="showcase-panel inventory-copy-step" @submit.prevent="$emit('submit')">
+    <div>
+      <p class="catalog-kicker">Step 3</p>
+      <h2>Add a Physical Copy</h2>
+      <p class="inventory-copy-step__intro">Track each owned copy separately so condition, images, pricing, and sale history stay precise.</p>
+    </div>
+    <label class="fixture-label" for="inventory-product">Product</label>
+    <select
+      id="inventory-product"
+      :value="productId"
+      class="fixture-input"
+      required
+      @change="$emit('update:productId', $event.target.value)"
+    >
+      <option value="" disabled>Select a product</option>
+      <option v-for="product in products" :key="product.id" :value="product.id">
+        {{ product.name }}
+      </option>
+    </select>
+    <label class="fixture-label" for="inventory-condition">Condition</label>
+    <select
+      id="inventory-condition"
+      :value="conditionId"
+      class="fixture-input"
+      required
+      @change="$emit('update:conditionId', $event.target.value)"
+    >
+      <option value="" disabled>Select a condition</option>
+      <option v-for="condition in conditions" :key="condition.id" :value="condition.id">
+        {{ condition.name }} ({{ condition.code }})
+      </option>
+    </select>
+    <button class="button button--primary" type="submit" :disabled="isSaving">
+      Create physical copy
+    </button>
+  </form>
+</template>
+
+<style scoped lang="scss">
+@use './InventoryCopyStep.scss';
+</style>

apps/web/src/pages/AdminHomePage.vue

@@ -7,6 +7,7 @@ import AdminListingStatus from "@/components/molecules/AdminListingStatus.vue";
 import InventoryWorkflowStepper from "@/components/molecules/InventoryWorkflowStepper.vue";
 import ProductIdentityStep from "@/components/molecules/ProductIdentityStep.vue";
 import ProviderMappingStep from "@/components/molecules/ProviderMappingStep.vue";
+import InventoryCopyStep from "@/components/molecules/InventoryCopyStep.vue";
 import {
   createAdminInventory,
   createAdminProduct,
@@ -702,48 +703,16 @@ onMounted(load);
         @product-change="loadProviderMappings($event)"
         @submit="createProviderMapping"
       />
-      <form id="workflow-inventory" class="showcase-panel" @submit.prevent="createInventory">
+      <InventoryCopyStep
-        <h2>Add inventory copy</h2>
+        :product-id="inventoryProductId"
-        <label class="fixture-label" for="inventory-product">Product</label>
+        :condition-id="conditionId"
-        <select
+        :products="products"
-          id="inventory-product"
+        :conditions="conditions"
-          v-model="inventoryProductId"
+        :is-saving="isSaving"
-          class="fixture-input"
+        @update:product-id="inventoryProductId = $event"
-          required
+        @update:condition-id="conditionId = $event"
-        >
+        @submit="createInventory"
-          <option value="" disabled>Select a product</option>
+      />
-          <option
-            v-for="product in products"
-            :key="product.id"
-            :value="product.id"
-          >
-            {{ product.name }}
-          </option>
-        </select>
-        <label class="fixture-label" for="inventory-condition">Condition</label>
-        <select
-          id="inventory-condition"
-          v-model="conditionId"
-          class="fixture-input"
-          required
-        >
-          <option value="" disabled>Select a condition</option>
-          <option
-            v-for="condition in conditions"
-            :key="condition.id"
-            :value="condition.id"
-          >
-            {{ condition.name }} ({{ condition.code }})
-          </option>
-        </select>
-        <button
-          class="button button--primary"
-          type="submit"
-          :disabled="isSaving"
-        >
-          Create copy
-        </button>
-      </form>
       <form id="workflow-listing" class="showcase-panel" @submit.prevent="createListing">
         <h2>Create listing draft</h2>
         <label class="fixture-label" for="listing-inventory"

docs/IMPLEMENTATION-STATUS.md

@@ -169,6 +169,7 @@ Remaining roadmap areas are approved external provider credentials/adapters, bro
 - The admin workspace now includes a responsive guided inventory workflow stepper linking Product, Sources, Copy, Images, Pricing, and List stages, with progress derived from loaded admin state.
 - Product identification is now an extracted `ProductIdentityStep` molecule with empty/filled Storybook states, while preserving the existing create-product API workflow.
 - Source mapping is now an extracted `ProviderMappingStep` molecule with Product/Provider/PRODUCT-vs-SEARCH mapping states, while preserving existing mapping loading and save behavior.
+- Physical inventory creation is now an extracted `InventoryCopyStep` molecule with Product and condition selection states, while preserving the existing seller-scoped create-copy API workflow.
 - Public catalog sorting now supports latest manual/calculated market value low-to-high and high-to-low, with null values placed last.
 - Public catalog filters now collapse behind an accessible mobile disclosure, show an active-filter count, and provide a reset action while preserving URL synchronization.