fixed

app/assemblies/page.tsx

@@ -19,15 +19,45 @@ export default async function AssembliesPage({
       <section className="two-up">
         <article className="panel">
           <h2 className="section-title">Bill of Materials</h2>
-          <p className="section-copy">Define which stocked parts are consumed to build each assembly.</p>
+          <p className="section-copy">Define which stocked parts are consumed to build each assembly. Start typing to filter large inventories quickly.</p>
           <form action={addKitComponent} className="form-grid">
             <div className="form-row">
-              <label htmlFor="assemblySku">Assembly SKU</label>
+              <label htmlFor="assemblySku">Assembly</label>
-              <select className="select" id="assemblySku" name="assemblySku" disabled={assemblies.length === 0}>{assemblies.map((assembly) => <option key={assembly.id} value={assembly.sku}>{assembly.sku} - {assembly.name}</option>)}</select>
+              <input
+                className="input"
+                id="assemblySku"
+                name="assemblySku"
+                list="assembly-skus"
+                placeholder="Type assembly SKU or name"
+                disabled={assemblies.length === 0}
+                required
+              />
+              <datalist id="assembly-skus">
+                {assemblies.map((assembly) => (
+                  <option key={assembly.id} value={assembly.sku}>
+                    {assembly.name}
+                  </option>
+                ))}
+              </datalist>
             </div>
             <div className="form-row">
-              <label htmlFor="componentSku">Component SKU</label>
+              <label htmlFor="componentSku">Component</label>
-              <select className="select" id="componentSku" name="componentSku" disabled={components.length === 0}>{components.map((component) => <option key={component.id} value={component.sku}>{component.sku} - {component.name}</option>)}</select>
+              <input
+                className="input"
+                id="componentSku"
+                name="componentSku"
+                list="component-skus"
+                placeholder="Type component SKU or name"
+                disabled={components.length === 0}
+                required
+              />
+              <datalist id="component-skus">
+                {components.map((component) => (
+                  <option key={component.id} value={component.sku}>
+                    {component.name}
+                  </option>
+                ))}
+              </datalist>
             </div>
             <div className="form-row"><label htmlFor="component-qty">Quantity Per Assembly</label><input className="input" id="component-qty" name="quantity" type="number" min="0.01" step="0.01" defaultValue="1" /></div>
             <button className="button" type="submit" disabled={assemblies.length === 0 || components.length === 0}>Save Component</button>
@@ -38,8 +68,23 @@ export default async function AssembliesPage({
           <p className="section-copy">Consume component stock and create finished kit inventory in one transaction flow. This only works after the assembly has a BOM and enough component stock exists.</p>
           <form action={buildAssembly} className="form-grid">
             <div className="form-row">
-              <label htmlFor="build-assembly">Assembly SKU</label>
+              <label htmlFor="build-assembly">Assembly</label>
-              <select className="select" id="build-assembly" name="assemblySku" disabled={assemblies.length === 0}>{assemblies.map((assembly) => <option key={assembly.id} value={assembly.sku}>{assembly.sku} - {assembly.name}</option>)}</select>
+              <input
+                className="input"
+                id="build-assembly"
+                name="assemblySku"
+                list="build-assembly-skus"
+                placeholder="Type assembly SKU or name"
+                disabled={assemblies.length === 0}
+                required
+              />
+              <datalist id="build-assembly-skus">
+                {assemblies.map((assembly) => (
+                  <option key={assembly.id} value={assembly.sku}>
+                    {assembly.name}
+                  </option>
+                ))}
+              </datalist>
             </div>
             <div className="form-row"><label htmlFor="build-qty">Build Quantity</label><input className="input" id="build-qty" name="quantity" type="number" min="1" step="1" defaultValue="1" /></div>
             <button className="button secondary" type="submit" disabled={assemblies.length === 0}>Build Now</button>

app/parts/page.tsx

@@ -4,6 +4,7 @@ import { getParts } from "@/lib/repository";
 
 export default function PartsPage() {
   const parts = getParts();
+  const activeItems = parts.filter((part) => part.kind === "part" || part.kind === "assembly");
 
   return (
     <div className="grid">
@@ -31,9 +32,19 @@ export default function PartsPage() {
         </article>
         <article className="panel">
           <h2 className="section-title">Inventory Adjustment</h2>
-          <p className="section-copy">Apply opening balances, cycle-count corrections, or manual stock adjustments.</p>
+          <p className="section-copy">Apply opening balances, cycle-count corrections, or manual stock adjustments. Start typing a SKU or item name to filter the inventory list.</p>
           <form action={recordAdjustment} className="form-grid">
-            <div className="form-row"><label htmlFor="adjust-sku">SKU</label><input className="input" id="adjust-sku" name="sku" required /></div>
+            <div className="form-row">
+              <label htmlFor="adjust-sku">Inventory Item</label>
+              <input className="input" id="adjust-sku" name="sku" list="inventory-adjustment-items" placeholder="Type SKU or item name" required />
+              <datalist id="inventory-adjustment-items">
+                {activeItems.map((item) => (
+                  <option key={item.id} value={item.sku}>
+                    {item.name}
+                  </option>
+                ))}
+              </datalist>
+            </div>
             <div className="form-row"><label htmlFor="quantityDelta">Quantity Delta</label><input className="input" id="quantityDelta" name="quantityDelta" type="number" step="0.01" required /></div>
             <div className="form-row"><label htmlFor="adjust-unit-cost">Unit Cost</label><input className="input" id="adjust-unit-cost" name="unitCost" type="number" min="0" step="0.01" defaultValue="0" /></div>
             <div className="form-row"><label htmlFor="notes">Notes</label><textarea className="textarea" id="notes" name="notes" /></div>