@scorpiosl4/ngx-google-auto-complete
Version:
Angular google auto complete (wrapper for [ngx-google-places-autocomplete](https://github.com/skynet2/ngx-google-places-autocomplete)).
164 lines (154 loc) • 8.75 kB
JavaScript
import * as i0 from '@angular/core';
import { EventEmitter, Component, ViewChild, Output, Input, NgModule } from '@angular/core';
import * as i1 from '@angular/forms';
import { FormsModule } from '@angular/forms';
import * as i2 from 'ngx-google-places-autocomplete';
import { GooglePlaceModule } from 'ngx-google-places-autocomplete';
class GoogleAutoCompleteComponent {
constructor() {
this._attributeData = [];
this._cssClass = '';
this.onPlaceSelect = new EventEmitter();
this.onInputInitialized = new EventEmitter();
this.textboxValue = '';
this.autoCompleteType = 'ADDRESS';
this.placeHolder = 'Enter a location';
this.options = {
types: ['(cities)'],
};
}
set attributes(data) {
this._attributeData = data;
this.setAttributes(data);
}
set cssClass(cls) {
this._cssClass = cls;
}
get cssClass() {
return this._cssClass;
}
ngAfterViewInit() {
this.setAttributes(this._attributeData);
this.afterInputInitialized();
}
afterInputInitialized() {
if (this.Inputbox) {
this.onInputInitialized.emit(this.Inputbox);
}
}
setAttributes(data) {
if (this.Inputbox && this.Inputbox.nativeElement) {
const element = this.Inputbox.nativeElement;
for (const d of data) {
element.setAttribute(d.name, d.value);
}
}
}
get settings() {
return this.options;
}
onAddressChange(event) {
switch (this.autoCompleteType) {
case 'ADDRESS':
case 'COMPLETE_ADDRESS':
this.textboxValue = '';
const countryAndCity = event.address_components.filter((address) => {
return address.types.includes('country') || address.types.includes('locality');
});
countryAndCity.forEach((cn) => {
if (this.textboxValue === '') {
this.textboxValue += cn.long_name;
}
else {
this.textboxValue += ', ' + cn.long_name;
}
cn.geometry = event.geometry;
});
if (this.autoCompleteType === 'ADDRESS') {
this.onPlaceSelect.emit(countryAndCity);
}
else {
this.onPlaceSelect.emit(event);
}
break;
case 'BUSINESS':
this.textboxValue = event.name;
this.onPlaceSelect.emit(event);
break;
default:
break;
}
}
}
GoogleAutoCompleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: GoogleAutoCompleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
GoogleAutoCompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: GoogleAutoCompleteComponent, selector: "ngx-google-auto-complete", inputs: { textboxValue: "textboxValue", autoCompleteType: "autoCompleteType", placeHolder: "placeHolder", options: "options", attributes: "attributes", cssClass: "cssClass" }, outputs: { onPlaceSelect: "onPlaceSelect", onInputInitialized: "onInputInitialized" }, viewQueries: [{ propertyName: "Inputbox", first: true, predicate: ["Inputbox"], descendants: true }, { propertyName: "placesRef", first: true, predicate: ["placesRef"], descendants: true }], ngImport: i0, template: "<input #Inputbox [class]=\"cssClass ? cssClass : 'form-control'\" [placeholder]=\"placeHolder\" [(ngModel)]=\"textboxValue\" fullWidth ngx-google-places-autocomplete [options]=\"settings\" #placesRef=\"ngx-places\" (onAddressChange)=\"onAddressChange($event)\"/>\n", styles: ["::ng-deep .pac-container{z-index:99999}::ng-deep .pac-logo:after{display:none}::ng-deep .pac-item{padding:7px 4px;font-weight:700}::ng-deep .pac-item ::ng-deep .pac-icon{visibility:hidden}.form-control{display:block;width:100%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#212529;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;-webkit-appearance:none;appearance:none;border-radius:.25rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.GooglePlaceDirective, selector: "[ngx-google-places-autocomplete]", inputs: ["options"], outputs: ["onAddressChange"], exportAs: ["ngx-places"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: GoogleAutoCompleteComponent, decorators: [{
type: Component,
args: [{ selector: 'ngx-google-auto-complete', template: "<input #Inputbox [class]=\"cssClass ? cssClass : 'form-control'\" [placeholder]=\"placeHolder\" [(ngModel)]=\"textboxValue\" fullWidth ngx-google-places-autocomplete [options]=\"settings\" #placesRef=\"ngx-places\" (onAddressChange)=\"onAddressChange($event)\"/>\n", styles: ["::ng-deep .pac-container{z-index:99999}::ng-deep .pac-logo:after{display:none}::ng-deep .pac-item{padding:7px 4px;font-weight:700}::ng-deep .pac-item ::ng-deep .pac-icon{visibility:hidden}.form-control{display:block;width:100%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#212529;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;-webkit-appearance:none;appearance:none;border-radius:.25rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}\n"] }]
}], propDecorators: { Inputbox: [{
type: ViewChild,
args: ['Inputbox']
}], placesRef: [{
type: ViewChild,
args: ['placesRef']
}], onPlaceSelect: [{
type: Output
}], onInputInitialized: [{
type: Output
}], textboxValue: [{
type: Input
}], autoCompleteType: [{
type: Input
}], placeHolder: [{
type: Input
}], options: [{
type: Input
}], attributes: [{
type: Input
}], cssClass: [{
type: Input
}] } });
class GoogleAutoCompleteModule {
}
GoogleAutoCompleteModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: GoogleAutoCompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
GoogleAutoCompleteModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: GoogleAutoCompleteModule, declarations: [GoogleAutoCompleteComponent], imports: [FormsModule,
GooglePlaceModule], exports: [GoogleAutoCompleteComponent] });
GoogleAutoCompleteModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: GoogleAutoCompleteModule, imports: [FormsModule,
GooglePlaceModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: GoogleAutoCompleteModule, decorators: [{
type: NgModule,
args: [{
declarations: [GoogleAutoCompleteComponent],
imports: [
FormsModule,
GooglePlaceModule,
],
exports: [GoogleAutoCompleteComponent]
}]
}] });
class Address {
}
class PhotoRequest {
}
class ComponentRestrictions {
constructor(obj) {
if (!obj)
return;
Object.assign(this, obj);
}
}
class Options {
constructor(opt) {
if (!opt)
return;
Object.assign(this, opt);
}
}
/*
* Public API Surface of google-auto-complete
*/
/**
* Generated bundle index. Do not edit.
*/
export { Address, ComponentRestrictions, GoogleAutoCompleteComponent, GoogleAutoCompleteModule, Options, PhotoRequest };
//# sourceMappingURL=scorpiosl4-ngx-google-auto-complete.mjs.map