Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

getaddress-autocomplete

Package Overview
Dependencies
Maintainers
1
Versions
27
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

getaddress-autocomplete - npm Package Compare versions

Comparing version 1.3.5 to 1.3.6

lib/Container.d.ts

21

lib/Autocomplete.d.ts

@@ -5,3 +5,2 @@ import AttributeValues from "./AttributeValues";

export default class Autocomplete {
readonly input: HTMLInputElement;
readonly client: Client;

@@ -12,12 +11,10 @@ readonly output_fields: OutputFields;

private blurTimer;
private container;
private list;
private selectedIndex;
private showAllClicked;
private documentClick;
constructor(input: HTMLInputElement, client: Client, output_fields: OutputFields, attributeValues: AttributeValues);
private readonly input;
private readonly list;
private readonly container;
constructor(inputElement: HTMLInputElement, client: Client, output_fields: OutputFields, attributeValues: AttributeValues);
destroy(): void;
private destroyList;
private destroyContainer;
private destroyInput;
private onInputFocus;

@@ -28,3 +25,5 @@ private onInputPaste;

private onContainerFocusOut;
build(): void;
private build;
private onListClick;
private onListMouseEnter;
private debug;

@@ -49,8 +48,2 @@ keyDownHandler: (event: KeyboardEvent) => void;

populateList: (show_all?: boolean) => Promise<void>;
private addContainerFocusedClassNames;
private removeContainerFocusedClassNames;
private addInputShowClassNames;
private removeInputShowClassNames;
private removeListShowAllClassNames;
private addListShowAllClassNames;
clearList: () => void;

@@ -57,0 +50,0 @@ getListItem: (index: number, suggestion: Suggestion, length: number) => HTMLElement;

@@ -12,16 +12,16 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {

import { Options } from "./Options";
import Input from "./Input";
import List from "./List";
import Container from "./Container";
export default class Autocomplete {
constructor(input, client, output_fields, attributeValues) {
this.input = input;
constructor(inputElement, client, output_fields, attributeValues) {
this.client = client;
this.output_fields = output_fields;
this.attributeValues = attributeValues;
this.container = undefined;
this.list = undefined;
this.selectedIndex = -1;
this.showAllClicked = false;
this.onInputFocus = (event) => {
this.addContainerFocusedClassNames();
this.container.addFocusedClassNames();
if (this.attributeValues.options.select_on_focus) {
this.input.select();
this.input.element.select();
}

@@ -44,2 +44,19 @@ this.selectedIndex = -1;

};
this.onListClick = (event) => {
if (event.target !== this.list.element) {
const suggestions = Array.from(this.list.element.children);
if (suggestions.length) {
var element = event.target;
while (element instanceof HTMLElement && element.tagName !== "LI") {
element = element.parentElement;
}
const suggestionIndex = suggestions.indexOf(element);
this.handleSuggestionSelected(event, suggestionIndex);
}
}
};
this.onListMouseEnter = (event) => {
const suggestions = this.list.element.children;
this.removeSuggestionFocusedClassName(suggestions);
};
this.debug = (data) => {

@@ -82,3 +99,3 @@ if (this.attributeValues.options.debug) {

this.handlePageUpKey = (event) => {
if (this.list !== undefined && !this.list.hidden) {
if (!this.list.element.hidden) {
event.preventDefault();

@@ -89,9 +106,9 @@ this.setSuggestionFocus(event, 0);

this.handlePageDownKey = (event) => {
if (this.list !== undefined && !this.list.hidden) {
if (!this.list.element.hidden) {
event.preventDefault();
this.setSuggestionFocus(event, this.list.children.length - 1);
this.setSuggestionFocus(event, this.list.element.children.length - 1);
}
};
this.handleHomeKey = (event) => {
if (this.list !== undefined && !this.list.hidden && event.target !== this.input) {
if (!this.list.element.hidden && event.target !== this.input.element) {
event.preventDefault();

@@ -108,4 +125,3 @@ this.setSuggestionFocus(event, 0);

activeElem &&
this.container !== undefined &&
this.container.contains(activeElem)) {
this.container.element.contains(activeElem)) {
return;

@@ -115,3 +131,3 @@ }

this.clearList();
this.removeContainerFocusedClassNames();
this.container.removeFocusedClassNames();
}

@@ -122,4 +138,4 @@ this.showAllClicked = false;

this.handleEndKey = (event) => {
if (this.list !== undefined && !this.list.hidden) {
const suggestions = this.list.children;
if (!this.list.element.hidden) {
const suggestions = this.list.element.children;
if (suggestions.length) {

@@ -132,3 +148,3 @@ event.preventDefault();

this.handleEnterKey = (event) => {
if (this.list !== undefined && !this.list.hidden) {
if (!this.list.element.hidden) {
event.preventDefault();

@@ -144,3 +160,3 @@ if (this.selectedIndex > -1) {

if (this.selectedIndex > -1 && this.list !== undefined) {
const suggestions = this.list.children;
const suggestions = this.list.element.children;
const suggestion = suggestions[this.selectedIndex];

@@ -150,3 +166,3 @@ if (suggestion.innerText === this.attributeValues.options.show_all_for_postcode_text) {

this.populateList(true);
this.input.focus();
this.input.element.focus();
}

@@ -167,6 +183,6 @@ else if (!this.attributeValues.options.enable_get) {

this.bind(success.address);
AddressSelectedEvent.dispatch(this.input, id, success.address);
AddressSelectedEvent.dispatch(this.input.element, id, success.address);
if (this.attributeValues.options.input_focus_on_select) {
this.input.focus();
this.input.setSelectionRange(this.input.value.length, this.input.value.length + 1);
this.input.element.focus();
this.input.setSelectionRange();
}

@@ -176,3 +192,3 @@ }

const failed = addressResult.toFailed();
AddressSelectedFailedEvent.dispatch(this.input, id, failed.status, failed.message);
AddressSelectedFailedEvent.dispatch(this.input.element, id, failed.status, failed.message);
}

@@ -232,3 +248,3 @@ }

this.filterTimer = setTimeout(() => {
if (this.attributeValues.options.minimum_characters && this.input.value.length >= this.attributeValues.options.minimum_characters) {
if (this.attributeValues.options.minimum_characters && this.input.hasMinimumCharacters()) {
this.populateList();

@@ -241,3 +257,3 @@ }

}
else if (this.attributeValues.options.minimum_characters && this.list !== undefined && !this.list.hidden && this.input.value.length < this.attributeValues.options.minimum_characters) {
else if (this.attributeValues.options.minimum_characters && !this.list.element.hidden && !this.input.hasMinimumCharacters()) {
this.clearList();

@@ -250,4 +266,4 @@ }

const target = event.target;
if (target == this.input) {
if (this.attributeValues.options.minimum_characters && this.input.value.length < this.attributeValues.options.minimum_characters) {
if (target == this.input.element) {
if (this.attributeValues.options.minimum_characters && !this.input.hasMinimumCharacters()) {
this.clearList();

@@ -259,5 +275,5 @@ }

}
else if (this.container !== undefined && this.container.contains(target)) {
this.input.focus();
this.input.setSelectionRange(this.input.value.length, this.input.value.length + 1);
else if (this.container.element.contains(target)) {
this.input.element.focus();
this.input.setSelectionRange();
}

@@ -269,3 +285,3 @@ }

event.preventDefault();
if (this.list !== undefined && !this.list.hidden) {
if (!this.list.element.hidden) {
if (this.selectedIndex < 0) {

@@ -280,25 +296,23 @@ this.setSuggestionFocus(event, 0);

this.setSuggestionFocus = (event, index) => {
if (this.list !== undefined) {
const suggestions = this.list.children;
this.removeSuggestionFocusedClassName(suggestions);
if (index < 0 || !suggestions.length) {
this.selectedIndex = -1;
if (event && event.target !== this.input) {
this.input.focus();
}
return;
const suggestions = this.list.element.children;
this.removeSuggestionFocusedClassName(suggestions);
if (index < 0 || !suggestions.length) {
this.selectedIndex = -1;
if (event && event.target !== this.input.element) {
this.input.element.focus();
}
if (index >= suggestions.length) {
this.selectedIndex = suggestions.length - 1;
this.setSuggestionFocus(event, this.selectedIndex);
return;
}
const focusedSuggestion = suggestions[index];
if (focusedSuggestion) {
this.selectedIndex = index;
this.addSuggestionFocusedClassName(focusedSuggestion);
focusedSuggestion.focus();
return;
}
return;
}
if (index >= suggestions.length) {
this.selectedIndex = suggestions.length - 1;
this.setSuggestionFocus(event, this.selectedIndex);
return;
}
const focusedSuggestion = suggestions[index];
if (focusedSuggestion) {
this.selectedIndex = index;
this.addSuggestionFocusedClassName(focusedSuggestion);
focusedSuggestion.focus();
return;
}
this.selectedIndex = -1;

@@ -325,10 +339,9 @@ };

}
const query = (_b = this.input.value) === null || _b === void 0 ? void 0 : _b.trim();
const query = (_b = this.input.element.value) === null || _b === void 0 ? void 0 : _b.trim();
const result = yield this.client.autocomplete(query, autocompleteOptions);
if (result.isSuccess && this.list !== undefined) {
if (this.attributeValues.options.auto_calc_list_height && this.list !== undefined) {
this.list.style.removeProperty('max-height');
if (result.isSuccess) {
if (this.attributeValues.options.auto_calc_list_height) {
this.list.element.style.removeProperty('max-height');
}
//const computedListHeight = this.list.offsetHeight;
const listChildCount = this.list.children.length;
const listChildCount = this.list.element.children.length;
const success = result.toSuccess();

@@ -346,7 +359,7 @@ const newItems = [];

&& (success.suggestions.length) === autocompleteOptions.top) {
const li = this.getShowAllListItem(this.list.children.length, totalLength);
const li = this.getShowAllListItem(this.list.element.children.length, totalLength);
newItems.push(li);
}
this.list.replaceChildren(...newItems);
const toFocus = this.list.children[0];
this.list.element.replaceChildren(...newItems);
const toFocus = this.list.element.children[0];
if (toFocus) {

@@ -356,14 +369,14 @@ this.selectedIndex = 0;

}
this.addInputShowClassNames();
this.list.hidden = false;
this.input.setAttribute('aria-expanded', 'true');
this.list.setAttribute('aria-hidden', 'false');
this.input.addInputShowClassNames();
this.list.element.hidden = false;
this.input.element.setAttribute('aria-expanded', 'true');
this.list.element.setAttribute('aria-hidden', 'false');
if (show_all) {
this.addListShowAllClassNames();
this.list.addShowAllClassNames();
}
if (show_all &&
this.attributeValues.options.auto_calc_list_height
&& this.list.offsetHeight > 0
&& listChildCount < this.list.children.length) {
this.list.style.maxHeight = `${this.list.offsetHeight}px`;
&& this.list.element.offsetHeight > 0
&& listChildCount < this.list.element.children.length) {
this.list.element.style.maxHeight = `${this.list.element.offsetHeight}px`;
}

@@ -375,75 +388,14 @@ document.addEventListener('click', this.documentClick);

}
SuggestionsEvent.dispatch(this.input, query, success.suggestions);
SuggestionsEvent.dispatch(this.input.element, query, success.suggestions);
}
else {
const failed = result.toFailed();
SuggestionsFailedEvent.dispatch(this.input, query, failed.status, failed.message);
SuggestionsFailedEvent.dispatch(this.input.element, query, failed.status, failed.message);
}
});
this.addContainerFocusedClassNames = () => {
if (this.container !== undefined) {
this.container.classList.add(this.attributeValues.containerFocusedClassName);
if (this.attributeValues.containerFocusedAdditionalClassNames) {
for (const name of this.attributeValues.containerFocusedAdditionalClassNames) {
this.container.classList.add(name);
}
}
}
};
this.removeContainerFocusedClassNames = () => {
if (this.container !== undefined) {
this.container.classList.remove(this.attributeValues.containerFocusedClassName);
if (this.attributeValues.containerFocusedAdditionalClassNames) {
for (const name of this.attributeValues.containerFocusedAdditionalClassNames) {
this.container.classList.remove(name);
}
}
}
};
this.addInputShowClassNames = () => {
this.input.classList.add(this.attributeValues.inputShowClassName);
if (this.attributeValues.inputShowAdditionalClassNames) {
for (const name of this.attributeValues.inputShowAdditionalClassNames) {
this.input.classList.add(name);
}
}
};
this.removeInputShowClassNames = () => {
this.input.classList.remove(this.attributeValues.inputShowClassName);
if (this.attributeValues.inputShowAdditionalClassNames) {
for (const name of this.attributeValues.inputShowAdditionalClassNames) {
this.input.classList.remove(name);
}
}
};
this.removeListShowAllClassNames = () => {
if (this.list !== undefined) {
this.list.classList.remove(this.attributeValues.listShowAllClassName);
if (this.attributeValues.listShowAllAdditionalClassNames) {
for (const name of this.attributeValues.listShowAllAdditionalClassNames) {
this.list.classList.remove(name);
}
}
}
};
this.addListShowAllClassNames = () => {
if (this.list !== undefined) {
this.list.classList.add(this.attributeValues.listShowAllClassName);
if (this.attributeValues.listShowAllAdditionalClassNames) {
for (const name of this.attributeValues.listShowAllAdditionalClassNames) {
this.list.classList.add(name);
}
}
}
};
this.clearList = () => {
if (this.list !== undefined) {
this.list.replaceChildren(...[]);
this.list.hidden = true;
this.list.setAttribute('aria-hidden', 'true');
}
this.input.setAttribute('aria-expanded', 'false');
this.list.clear();
this.input.element.setAttribute('aria-expanded', 'false');
this.selectedIndex = -1;
this.removeInputShowClassNames();
this.removeListShowAllClassNames();
this.input.removeInputShowClassNames();
document.removeEventListener('click', this.documentClick);

@@ -463,3 +415,3 @@ };

if (this.attributeValues.options.highlight_suggestion) {
let regexvalue = this.input.value.trim().replace(/ /g, ',* +');
let regexvalue = this.input.element.value.trim().replace(/ /g, ',* +');
const regexp = new RegExp(`\\b(${regexvalue})`, "gi");

@@ -506,104 +458,23 @@ address = address.replace(regexp, `${this.attributeValues.options.highlight_suggestion_start_tag}$1${this.attributeValues.options.highlight_suggestion_end_tag}`);

};
this.input = new Input(inputElement, attributeValues, this.onInputFocus, this.onInputPaste);
this.list = new List(attributeValues, this.onListMouseEnter, this.onListClick);
this.container = new Container(attributeValues, this.onContainerKeyDown, this.onContainerKeyUp, this.onContainerFocusOut);
this.build();
}
destroy() {
this.destroyContainer();
this.destroyInput();
this.destroyList();
this.container.destroy();
this.input.destroy();
this.list.destroy();
}
destroyList() {
if (this.list !== undefined) {
this.list.remove();
}
}
destroyContainer() {
if (this.container !== undefined) {
this.container.removeEventListener('keydown', this.onContainerKeyDown);
this.container.removeEventListener('keyup', this.onContainerKeyUp);
this.container.removeEventListener('focusout', this.onContainerFocusOut);
const children = Array.from(this.container.childNodes);
this.container.replaceWith(...children);
}
}
destroyInput() {
this.input.classList.remove(this.attributeValues.inputClassName);
if (this.attributeValues.inputAdditionalClassNames) {
for (const name of this.attributeValues.inputAdditionalClassNames) {
this.input.classList.remove(name);
}
}
this.removeInputShowClassNames();
this.input.removeAttribute('aria-expanded');
this.input.removeAttribute('autocomplete');
this.input.removeAttribute('aria-autocomplete');
this.input.removeAttribute('role');
this.input.removeAttribute('aria-owns');
this.input.removeEventListener('focus', this.onInputFocus);
this.input.removeEventListener('paste', this.onInputPaste);
}
build() {
var _a;
this.documentClick = this.handleComponentBlur.bind(this);
this.input.classList.add(this.attributeValues.inputClassName);
if (this.attributeValues.inputAdditionalClassNames) {
for (const name of this.attributeValues.inputAdditionalClassNames) {
this.input.classList.add(name);
}
if (this.input.element.parentNode != null) {
this.input.element.parentNode.insertBefore(this.container.element, this.input.element);
}
this.input.setAttribute('aria-expanded', 'false');
this.input.setAttribute('autocomplete', 'off');
this.input.setAttribute('aria-autocomplete', 'list');
this.input.setAttribute('role', 'combobox');
this.input.setAttribute('aria-owns', `${this.attributeValues.listId}`);
this.container = document.createElement('DIV');
this.container.id = this.attributeValues.containerId;
this.container.className = this.attributeValues.containerClassName;
if (this.attributeValues.containerAdditionalClassNames) {
for (const name of this.attributeValues.containerAdditionalClassNames) {
this.container.classList.add(name);
}
}
if (((_a = this.input) === null || _a === void 0 ? void 0 : _a.parentNode) != null) {
this.input.parentNode.insertBefore(this.container, this.input);
this.input.addEventListener('focus', this.onInputFocus);
this.input.addEventListener('paste', this.onInputPaste);
}
this.container.addEventListener('focusout', this.onContainerFocusOut);
this.container.appendChild(this.input);
this.list = document.createElement('UL');
this.list.id = this.attributeValues.listId;
this.list.hidden = true;
this.list.className = this.attributeValues.listClassName;
if (this.attributeValues.listAdditionalClassNames) {
for (const name of this.attributeValues.listAdditionalClassNames) {
this.list.classList.add(name);
}
}
this.list.setAttribute('role', 'listbox');
this.list.setAttribute('aria-hidden', 'true');
this.list.addEventListener('mouseenter', (event) => {
if (this.list !== undefined) {
const suggestions = this.list.children;
this.removeSuggestionFocusedClassName(suggestions);
}
});
this.list.addEventListener('click', (event) => {
if (this.list !== undefined && event.target !== this.list) {
const suggestions = Array.from(this.list.children);
if (suggestions.length) {
var element = event.target;
while (element instanceof HTMLElement && element.tagName !== "LI") {
element = element.parentElement;
}
const suggestionIndex = suggestions.indexOf(element);
this.handleSuggestionSelected(event, suggestionIndex);
}
}
});
this.container.addEventListener('keydown', this.onContainerKeyDown);
this.container.addEventListener('keyup', this.onContainerKeyUp);
this.container.appendChild(this.list);
this.container.element.appendChild(this.input.element);
this.container.element.appendChild(this.list.element);
}
handleUpKey(event) {
event.preventDefault();
if (this.list !== undefined && !this.list.hidden) {
if (!this.list.element.hidden) {
this.setSuggestionFocus(event, this.selectedIndex - 1);

@@ -610,0 +481,0 @@ }

@@ -59,3 +59,2 @@ import Autocomplete from "./Autocomplete";

const autocomplete = new Autocomplete(textbox, client, outputFields, attributeValues);
autocomplete.build();
if (index === 0) {

@@ -62,0 +61,0 @@ const style = new Style(attributeValues);

{
"name": "getaddress-autocomplete",
"version": "1.3.5",
"version": "1.3.6",
"description": "GetAddress.io - Autocomplete plug-in",

@@ -5,0 +5,0 @@ "main": "./lib/Index",

@@ -94,3 +94,3 @@ Javascript - Autocomplete.

list_width:undefined, /* if true, set the list width */
suggestion_count:6, /* number of retreived suggestions (max 20) */
suggestion_count:6, /* number of retreived suggestions */
auto_calc_list_height:true, /* if true, calculates the list's height */

@@ -97,0 +97,0 @@ suggestion_template:undefined, /* the suggestion template (see Autocomplete API)*/

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc