fonteva-design-guide
Version:
## Dev, Build and Test
66 lines (64 loc) • 3.13 kB
HTML
<template>
<div id="locationField" class="slds-grid slds-wrap">
<iframe
if:true={showIframe}
src={addressiFrameUrl}
width="0"
height="0"
scrolling="no"
class="slds-hidden"
title="Interactive Address Map"
></iframe>
<div class="slds-size_1-of-1">
<div class="slds-form-element__control slds-input-has-icon slds-input-has-icon_right">
<c-pfm-input type="search" label={label} onvaluechange={handleInput} backend={backend}> </c-pfm-input>
<div class="slds-m-top_medium" id="listbox" role="listbox">
<ul class={getListboxClass} role="presentation">
<template for:each={searchResults} for:item="result">
<li key={result.id} role="presentation" class="slds-listbox__item">
<span
class="slds-media slds-listbox__option slds-listbox__option_entity slds-listbox__option_has-meta"
role="option"
onclick={handleResultClick}
data-recordid={result.id}
>
<span class="slds-media__figure">
<lightning-icon
icon-name="utility:checkin"
size="x-small"
alternative-text="Result item icon"
></lightning-icon>
</span>
<span class="slds-media__body slds-m-top_xx-small">
<span class="slds-listbox__option-text slds-listbox__option-text_entity"
>{result.value}</span
>
</span>
</span>
</li>
</template>
</ul>
</div>
</div>
</div>
<lightning-input-address
address-label=""
street-label={localLabels.streetLabel}
city-label={localLabels.cityLabel}
country-label={localLabels.countryLabel}
province-label={localLabels.provinceLabel}
postal-code-label={localLabels.postalCodeLabel}
country-options={getCountryOptions}
province-options={getProvinceOptions}
street={localVal.street}
city={localVal.city}
country={localVal.country}
province={localVal.province}
postal-code={localVal.postalCode}
required={required}
variant="label-hidden"
onchange={handleAddressChange}
>
</lightning-input-address>
</div>
</template>