Add the item selector modal and embeddable browse components

[mdon]

Two deliverables in one architecture: the client-facing item selector modal (the catalogue's MediaSelectorModal analogue, with per-item quantities) and the embeddable browse components it is assembled from.

The picker

<.live_component
  :if={@show_item_selector}
  module={PhoenixKitCatalogue.Web.Components.ItemSelectorModal}
  id="order-item-selector"
  scope={%{catalogue_uuids: [@catalogue.uuid]}}
  selected={@lines_by_uuid}
/>

A logged-in client browses inside a modal — always-visible search (250ms debounce), category chips, a photo-forward card grid (square medium-variant images, lazy, skeletons; no-photo items get a deliberate SKU tile, not a broken image). Tapping a card selects at qty 1 (or the item's default_value — the paint case), a stepper appears under the photo (never covering it), and a footer tray shows "N items · total" with an expandable review list. Confirm hands the host:

handle_info({:items_selected, %{id: id, mode: mode, picks: picks}}, socket)
handle_info({:item_selector_closed, %{id: id}}, socket)

Each pick: uuid, qty (always Decimal), unit, plus a display snapshot (name, sku, price, line_total, signed photo_url) so the host renders its summary without a re-query — documented as display-only, re-price server-side. Works from any host LiveView including a parent app; mode: :single and immediate are supported.

Scope is enforced, not suggested

scope takes the search_items/2 vocabulary (catalogue_uuids / category_uuids / only / statuses). Every fetch re-derives from it; a category event outside it is rejected; selection accepts only uuids the component itself rendered. Preselects are hydrated scope-exempt (the tray must render what the host handed in) but out-of-scope rows — :only exclusions included — are shown flagged and excluded from the confirm picks. Both clamps were sabotaged to confirm their tests fail without them.

Quantities are hostile input too: Decimal-parsed with the ru/et decimal comma accepted, exponent forms rejected, min/max/precision re-clamped server-side, invalid commits recreate the input with the committed value (morphdom won't clear typed garbage on an unchanged attr — a per-row revision in the id forces it).

The embeddable components

The same stack, exposed for hosts:

• Catalogue.BrowseState — pure reducer (scope/search/category/offset paging, generation counter, uuid-dedup ingest). No process, no queries.
• Web.Components.Browse — item_card, item_grid, category_chips, qty_stepper, grid_skeleton, present_items/2 (translations + signed photo URL resolved once per fetch, never in render). All take target.
• Web.Components.CatalogueBrowse — the drop-in browse surface (search + chips + grid, no selection) for embedding a catalogue view on any logged-in page; reports {:catalogue_browse, %{event: :item_clicked, item: …}}.

Design notes and the deferred list (paste-a-list bulk add, category counts, ProductCard detail view, IntersectionObserver sentinel) are in dev_docs/design/2026-08-22-item-selector-and-browse-components.md.

Process

Designed via a 3-model brainstorm + adversarial plan review, built, then a second adversarial review of the finished code — which found real things that were fixed and pinned by tests (:only missing from hydration availability, exponent quantities, string-keyed scope silently widening, crafted payloads crashing the LV, unbounded search strings).

Checks

• 1781 tests, 0 failures (46 new: reducer {command, scope-shape} product, component render contracts, both LCs driven through a test-only host LV asserting the real message contract, adversarial cases).
• mix precommit green — credo --strict clean, dialyzer at its pre-existing ignore set.
• et/ru complete: every new string catalogued + translated; the code-vs-.pot sweep also caught one pre-existing string absent from every catalogue ("Shown on category landing pages.") — now catalogued.
• Deployed to max-dev; app healthy (7 pages, 0 failing, 0 error lines).