# Scan Items

A barcode and search input for adding items to the current order. Type or scan an item identifier (UPC, SKU, item ID) and the matching item is added to Order Lines. Supports continuous scanning, audio feedback, and a virtualised search dropdown for large catalogs.

For serialised, lot-controlled, or bin-tracked items, the block opens the appropriate Order Lines modal flow rather than adding directly.

## Available in

* Order Form modules
* Public Page modules

## When to use

* Cashier registers with barcode scanners.
* Warehouse pick / pack workflows where speed matters.
* Order entry pages where users know item identifiers and want to skip catalog browsing.

## Settings

| Setting                      | Description                                                                                     |
| ---------------------------- | ----------------------------------------------------------------------------------------------- |
| **Scan Items Configuration** | Opens the configuration modal — scannable fields, audio feedback, placeholder, success message. |

The configuration modal supports:

* **Scannable Fields** — which fields to match against. Default: `[upc, sku, itemid]`.
* **Enable Scan Sounds** — play a confirmation/error sound on each scan. Default: Yes.
* **Placeholder** — input placeholder text. Default: *Scan or enter item SKU/UPC...*.
* **Show Success Message** — display a transient confirmation after a successful scan. Default: Yes.
* **Display Fields** — optional list of fields shown in the search dropdown.

## How it works

1. On mount, loads the workflow's catalog items, pre-computes a search index, and auto-focuses the input so scanning can begin immediately without clicking.
2. The user types or scans an identifier.
3. **Exact match** runs first against `internalId` (typical for barcode reads).
4. **Partial match** runs next against the configured Scannable Fields — the input is debounced 300ms and the dropdown appears after 2+ characters.
5. The dropdown is virtualised (Tanstack Virtualizer) so even very large catalogs render quickly.
6. On selection or Enter:
   * **Serialised / lot / numbered / bin items** — emits a `scanItemsEvent` to open the Order Lines modal flow for serial/lot capture.
   * **Standard items** — adds the item to Order Lines immediately.
7. A `scanItems-itemScanned` JavaScript hook fires on every successful scan.
8. Audio feedback plays on success or error (when enabled).
9. After a successful add, the input clears and re-focuses for continuous scanning.
10. If the page is scrolled down when the scan fires, the view snaps back to the top of the order form — keeping the cashier focused on the beginning of the order.

{% hint style="info" %}
For high-throughput scanning, leave **Enable Scan Sounds = Yes** — the audio cue confirms the scan registered without the cashier having to look at the screen.
{% endhint %}

## Examples

**Standard cashier register.** Scan Items at top of the Order Lines area. Cashier scans each item; the order builds row by row.

**Warehouse picking.** Scan Items with Display Fields = `[itemid, displayname, location]`. Picker scans, sees the item and bin, confirms the pick.

**Post-scan validation.** Scan Items paired with a JavaScript block on the `scanItems-itemScanned` hook to validate the item against custom rules (e.g. weight check, age verification).

## Related

<table data-view="cards"><thead><tr><th></th><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><strong>Order Lines</strong></td><td>Where scanned items land.</td><td><a href="/pages/0XacQvdUpwJMX7gVJCf4">/pages/0XacQvdUpwJMX7gVJCf4</a></td></tr><tr><td><strong>CSV Import</strong></td><td>The bulk-import alternative for adding many items at once.</td><td><a href="/pages/3J3BhOMsnonrsRzcbDVt">/pages/3J3BhOMsnonrsRzcbDVt</a></td></tr><tr><td><strong>JavaScript</strong></td><td>Hook into the scan event for custom validation or side effects.</td><td><a href="/pages/DEHisLtYVyC4YEOvJrO0">/pages/DEHisLtYVyC4YEOvJrO0</a></td></tr></tbody></table>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.in8sync.com/client-admin-guide/active-workflows/getting-started/transaction-components/scan-items.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
