chore: add shared components and update docs

- Add vendor selector component for admin pages
- Add input macros for form handling
- Add truck icon for shipping UI
- Update vendor operations expansion plan
- Update mkdocs configuration
- Update dependencies

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

app/templates/shared/macros/inputs.html

@@ -231,3 +231,54 @@
     </button>
 </div>
 {% endmacro %}
+
+
+{#
+  Vendor Selector (Tom Select)
+  ============================
+  An async searchable vendor selector using Tom Select.
+  Searches vendors by name and code with autocomplete.
+
+  Prerequisites:
+    - Tom Select CSS/JS must be loaded (included in admin/base.html)
+    - vendor-selector.js must be loaded
+
+  Parameters:
+    - ref_name: Alpine.js x-ref name for the select element (default: 'vendorSelect')
+    - id: HTML id attribute (default: 'vendor-select')
+    - placeholder: Placeholder text (default: 'Search vendor by name or code...')
+    - width: CSS width class (default: 'w-80')
+    - on_init: JS callback name when Tom Select is initialized (optional)
+
+  Usage:
+    {% from 'shared/macros/inputs.html' import vendor_selector %}
+
+    {{ vendor_selector(
+        ref_name='vendorSelect',
+        placeholder='Select a vendor...',
+        width='w-96'
+    ) }}
+
+    // In your Alpine.js component init():
+    this.$nextTick(() => {
+        initVendorSelector(this.$refs.vendorSelect, {
+            onSelect: (vendor) => this.onVendorSelected(vendor),
+            onClear: () => this.onVendorCleared()
+        });
+    });
+#}
+{% macro vendor_selector(
+    ref_name='vendorSelect',
+    id='vendor-select',
+    placeholder='Search vendor by name or code...',
+    width='w-80'
+) %}
+<div class="{{ width }}">
+    <select
+        id="{{ id }}"
+        x-ref="{{ ref_name }}"
+        placeholder="{{ placeholder }}"
+        aria-label="Vendor selector"
+    ></select>
+</div>
+{% endmacro %}