I’ve built a custom element that is supposed to work as a
<select> of addresses where each item displayed is a multi-line address. However, because the element does not actually include an html
<input> element, it doesn’t show up as a tab stop and has not focus event.
Is there any way to build a custom element that will act as an input element and have a
blur events as well as the ability to be registered as a tab stop?
My code if it helps at all:
<template> <require from="components/ssi-address.html"></require> <require from="components/address-dropdown.scss"></require> <div style="position:relative;margin-bottom:.4rem" click.delegate="showDrop = !showDrop" > <div style="display:flex;align-items:center;padding:10px;justify-content:space-between"> <ssi-address address.bind="selectedAddress"></ssi-address> <i class="fas fa-chevron-down color-p" style="cursor:pointer"></i> </div> <div if.bind="showDrop && addressList.length" class="drop-list" mouseleave.trigger="showDrop = false"> <ssi-address class="drop-list-item" repeat.for="a of addressList" click.trigger="dropChoose(a)" address.bind="a" ></ssi-address> </div> </div> </template>