@angular-material-extensions/google-maps-autocomplete
Version:
Autocomplete input component and directive for google-maps built with angular and material design
1 lines • 23.4 kB
JSON
{"__symbolic":"module","version":4,"exports":[{"from":"./lib/mat-google-maps-autocomplete.component"},{"from":"./lib/mat-search-google-maps-autocomplete/mat-search-google-maps-autocomplete.component"}],"metadata":{"MatGoogleMapsAutocompleteDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":10,"character":1},"arguments":[{"selector":"[matGoogleMapsAutocomplete]","exportAs":"matGoogleMapsAutocomplete","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":15,"character":15},"useExisting":{"__symbolic":"reference","name":"MatGoogleMapsAutocompleteDirective"},"multi":true}]}]}],"members":{"address":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"country":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"placeIdOnly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"strictBounds":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"types":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}}]}],"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"autoCompleteOptions":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":44,"character":3}}]}],"onAutocompleteSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":47,"character":3}}]}],"onGermanAddressMapped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":50,"character":3}}]}],"onLocationSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":53,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":69,"character":15},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"PLATFORM_ID","line":69,"character":22}]}],null,null,null],"parameters":[{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":70,"character":30},{"__symbolic":"reference","module":"@agm/core","name":"MapsAPILoader","line":71,"character":36},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":72,"character":30}]}],"ngOnInit":[{"__symbolic":"method"}],"initGoogleMapsAutocomplete":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}]}},"MatValidateAddressDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":6,"character":1},"arguments":[{"selector":"[mat-address-validate][formControlName],[MatValidateAddress][formControl],[MatValidateAddress][ngModel]","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALIDATORS","line":9,"character":14},"useExisting":{"__symbolic":"reference","name":"MatValidateAddressDirective"},"multi":true}]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"validate":[{"__symbolic":"method"}],"subscribe":[{"__symbolic":"method"}],"unsubscribe":[{"__symbolic":"method"}]}},"MatGoogleMapsAutocompleteModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":13,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":16,"character":6},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":17,"character":6},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":18,"character":6},{"__symbolic":"reference","module":"@angular/flex-layout","name":"FlexLayoutModule","line":19,"character":6},{"__symbolic":"reference","module":"@angular/material/input","name":"MatInputModule","line":20,"character":6},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":21,"character":6}],"exports":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"MatGoogleMapsAutocompleteDirective"},{"__symbolic":"reference","name":"MatValidateAddressDirective"},{"__symbolic":"reference","name":"ɵb"}],"declarations":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"MatGoogleMapsAutocompleteDirective"},{"__symbolic":"reference","name":"MatValidateAddressDirective"},{"__symbolic":"reference","name":"ɵb"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":16,"character":1},"arguments":[{"selector":"mat-google-maps-autocomplete","exportAs":"matGoogleMapsAutocomplete","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":23,"character":15},"useExisting":{"__symbolic":"reference","name":"ɵa"},"multi":true}],"template":"<mat-form-field class=\"full-width\" [appearance]=\"appearance\">\n <mat-label>{{addressLabelText}}</mat-label>\n <input matInput\n [(ngModel)]=\"address\"\n (change)=\"onQuery($event)\"\n placeholder=\"{{placeholderText}}\"\n class=\"form-control\"\n #search\n MatValidateAddress\n required>\n <mat-error *ngIf=\"addressSearchControl.hasError('required')\">\n {{requiredErrorText}}\n </mat-error>\n <mat-error *ngIf=\"addressSearchControl.hasError('validateAddress')\">\n {{invalidErrorText}}\n </mat-error>\n</mat-form-field>\n","styles":[".full-width{width:100%}"]}]}],"members":{"searchElementRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":31,"character":3},"arguments":["search"]}]}],"addressLabelText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"placeholderText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"requiredErrorText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"invalidErrorText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"appearance":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":46,"character":3}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":3}}]}],"address":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":52,"character":3}}]}],"country":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":3}}]}],"placeIdOnly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":58,"character":3}}]}],"strictBounds":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":3}}]}],"types":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":3}}]}],"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":68,"character":3}}]}],"autoCompleteOptions":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":71,"character":3}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":74,"character":3}}]}],"onAutocompleteSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":77,"character":3}}]}],"onGermanAddressMapped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":80,"character":3}}]}],"onLocationSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":83,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@agm/core","name":"MapsAPILoader","line":98,"character":37},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":99,"character":30}]}],"ngOnInit":[{"__symbolic":"method"}],"initGoogleMapsAutocomplete":[{"__symbolic":"method"}],"onQuery":[{"__symbolic":"method"}],"resetAddress":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"mat-search-google-maps-autocomplete","animations":{"__symbolic":"reference","name":"ɵc"},"providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":15,"character":15},"useExisting":{"__symbolic":"reference","name":"ɵb"},"multi":true}],"template":"<div fxLayout=\"column\">\n <div *ngIf=\"!disableSearch\" fxFlex=\"100\">\n <!--search address-->\n <mat-form-field fxFlex=\"auto\" [appearance]=\"appearance\" [@animate]=\"{ value: '*', params: { y: '100%' } }\">\n <mat-label>{{searchAddressLabel}}</mat-label>\n <input\n (onAutocompleteSelected)=\"syncAutoComplete($event)\"\n [country]=\"country\"\n [placeIdOnly]=\"placeIdOnly\"\n [strictBounds]=\"strictBounds\"\n [types]=\"types\"\n [type]=\"type\"\n matGoogleMapsAutocomplete\n matInput\n required\n />\n <mat-icon color=\"primary\" matSuffix>search</mat-icon>\n <!-- <mat-error>{{ 'msa.contactData.currentAddress.error' | translate }}</mat-error>-->\n </mat-form-field>\n </div>\n\n <form [formGroup]=\"addressFormGroup\" fxFlex fxLayoutGap=\"10px\">\n <div fxLayout=\"row\" fxLayoutGap=\"10px\">\n <mat-form-field fxFlex=\"80\"\n [appearance]=\"appearance\"\n [@animate]=\"{ value: '*', params: { y: '100%' } }\">\n <mat-label>{{streetNameLabel}}</mat-label>\n <input\n [readonly]=\"readonly\"\n formControlName=\"streetName\"\n matInput\n required\n />\n <!-- <mat-icon color=\"primary\" matSuffix>add_location</mat-icon>-->\n <!-- <mat-error>{{ 'msa.contactData.currentAddress.error' | translate }}</mat-error>-->\n </mat-form-field>\n <mat-form-field fxFlex=\"20\" [appearance]=\"appearance\" [@animate]=\"{ value: '*', params: { y: '100%' } }\">\n <mat-label>{{streetNumberLabel}}</mat-label>\n <input\n [readonly]=\"readonly\"\n formControlName=\"streetNumber\"\n matInput\n required\n />\n <!-- <mat-icon color=\"primary\" matSuffix>add_location</mat-icon>-->\n <!-- <mat-error>{{ 'msa.contactData.currentAddress.error' | translate }}</mat-error>-->\n </mat-form-field>\n </div>\n <div fxLayout=\"row\" fxLayoutGap=\"10px\">\n <mat-form-field fxFlex=\"20\" [appearance]=\"appearance\" [@animate]=\"{ value: '*', params: { y: '100%' } }\">\n <mat-label>{{postalCodeLabel}}</mat-label>\n <input\n [readonly]=\"readonly\"\n formControlName=\"postalCode\"\n matInput\n required\n />\n <!-- <mat-icon color=\"primary\" matSuffix>add_location</mat-icon>-->\n <!-- <mat-error>{{ 'msa.contactData.currentAddress.error' | translate }}</mat-error>-->\n </mat-form-field>\n <mat-form-field *ngIf=\"showVicinity\" fxFlex=\"auto\"\n [appearance]=\"appearance\"\n [@animate]=\"{ value: '*', params: { y: '100%' } }\">\n <mat-label>{{vicinityLabel}}</mat-label>\n <input\n [readonly]=\"readonly\"\n matInput\n formControlName=\"vicinity\"\n />\n </mat-form-field>\n <div formGroupName=\"locality\" fxFlex=\"auto\">\n <mat-form-field fxFlex=\"auto\" [appearance]=\"appearance\" [@animate]=\"{ value: '*', params: { y: '100%' } }\">\n <mat-label>{{localityLabel}}</mat-label>\n <input\n [readonly]=\"readonly\"\n formControlName=\"long\"\n matInput\n required\n />\n <mat-icon color=\"primary\" matSuffix>add_location</mat-icon>\n <!-- <mat-error>{{ 'msa.contactData.currentAddress.error' | translate }}</mat-error>-->\n </mat-form-field>\n </div>\n </div>\n </form>\n</div>\n","styles":[""]}]}],"members":{"appearance":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"searchAddressLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"streetNameLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"streetNumberLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"postalCodeLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}}]}],"localityLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"vicinityLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"showVicinity":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3}}]}],"country":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":3}}]}],"placeIdOnly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":50,"character":3}}]}],"strictBounds":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":53,"character":3}}]}],"types":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":3}}]}],"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":3}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"disableSearch":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":66,"character":3}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":3}}]}],"onGermanAddressMapped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":72,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":83,"character":35}]}],"ngOnInit":[{"__symbolic":"method"}],"createAddressFormGroup":[{"__symbolic":"method"}],"syncAutoComplete":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}]}},"ɵc":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger","line":24,"character":2},"arguments":["animate",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":24,"character":22},"arguments":["void => *",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"useAnimation","line":24,"character":47},"arguments":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animation","line":2,"character":24},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":4,"character":4},"arguments":[{"opacity":"{{opacity}}","transform":"scale({{scale}}) translate3d({{x}}, {{y}}, {{z}})"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":8,"character":4},"arguments":["{{duration}} {{delay}} cubic-bezier(0.0, 0.0, 0.2, 1)",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":8,"character":69},"arguments":["*"]}]}],{"params":{"duration":"200ms","delay":"0ms","opacity":"0","scale":"1","x":"0","y":"0","z":"0"}}]}]}]]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger","line":26,"character":2},"arguments":["animateStagger",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":27,"character":4},"arguments":["50",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":27,"character":16},"arguments":["*"]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":28,"character":4},"arguments":["100",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":28,"character":17},"arguments":["*"]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":29,"character":4},"arguments":["200",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":29,"character":17},"arguments":["*"]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":31,"character":4},"arguments":["void => 50",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":31,"character":29},"arguments":["@*",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":31,"character":42},"arguments":["50ms",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animateChild","line":31,"character":59}}]]}],{"optional":true}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":32,"character":4},"arguments":["void => 100",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":32,"character":30},"arguments":["@*",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":32,"character":43},"arguments":["100ms",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animateChild","line":32,"character":61}}]]}],{"optional":true}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":33,"character":4},"arguments":["void => 200",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":33,"character":30},"arguments":["@*",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":33,"character":43},"arguments":["200ms",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animateChild","line":33,"character":61}}]]}],{"optional":true}]}]}]]}]},"origins":{"MatGoogleMapsAutocompleteDirective":"./lib/directives/mat-google-maps-autocomplete.directive","MatValidateAddressDirective":"./lib/directives/address-validator/mat-address-validator.directive","MatGoogleMapsAutocompleteModule":"./lib/mat-google-maps-autocomplete.module","ɵa":"./lib/component/mat-google-maps-autocomplete.component","ɵb":"./lib/component/mat-search-google-maps-autocomplete/mat-search-google-maps-autocomplete.component","ɵc":"./lib/animations"},"importAs":"@angular-material-extensions/google-maps-autocomplete"}