MantineServerLookup#

@palmyralabs/rt-forms-mantine · form/MantineServerLookup.tsx

Overview#

Single- or multi-value lookup backed by a Wire store — debounced query by queryAttribute, stores idAttribute, displays labelAttribute / displayAttribute. Ideal for foreign-key pickers against master-data endpoints.

Props — IServerLookupDefinition & Omit<AutocompleteProps, 'defaultValue'>#

Common field props plus:

Prop Type Purpose
queryOptions { endPoint, queryAttribute, labelAttribute, idAttribute, storeOptions?, delay? } Wire query descriptor
displayAttribute string | string[]? Attribute(s) shown in the dropdown row
multiple boolean? Store an array of ids
renderOption (item) => ReactNode? Custom row renderer

Plus Mantine AutocompleteProps (placeholder, size, maxDropdownHeight, …) except defaultValue.

Ref — IServerLookupField#

interface IServerLookupField {
  focus(): void;
  getValue(): any;
  setValue(v: any): void;
  clear(): void;
}

Example#

<MantineServerLookup
  attribute="manufacturerId"
  label="Manufacturer"
  queryOptions={{
    endPoint: '/mstManufacturer',
    queryAttribute: 'name',
    labelAttribute: 'name',
    idAttribute: 'id',
    delay: 250,
  }}
  displayAttribute={['name', 'contactEmail']}
  placeholder="Start typing…"
/>