FileMaster

Edit File: sc-address.js

import{h}from"@stencil/core";import{__}from"@wordpress/i18n";import{countryChoices,getCountryDetails}from"../../../functions/address";import{reportChildrenValidity}from"../../../functions/form-data";const DEFAULT_COUNTRY_FIELDS=[{name:"country",priority:30,label:__("Country","surecart")},{name:"name",priority:40,label:__("Name or Company Name","surecart")},{name:"line_1",priority:50,label:__("Address","surecart")},{name:"line_2",priority:60,label:__("Line 2","surecart")},{name:"city",priority:70,label:__("City","surecart")},{name:"state",priority:80,label:__("State / County","surecart")},{name:"postal_code",priority:90,label:__("Postal Code","surecart")}];export class ScAddress{constructor(){this.address={country:null,city:null,line_1:null,line_2:null,postal_code:null,state:null},this.names={name:"shipping_name",country:"shipping_country",city:"shipping_city",line_1:"shipping_line_1",line_2:"shipping_line_2",postal_code:"shipping_postal_code",state:"shipping_state"},this.loading=!1,this.disabled=void 0,this.label=void 0,this.showName=void 0,this.showLine2=void 0,this.required=!1,this.requireName=!1,this.showCity=!0,this.showPostal=!0,this.countryDetails=null,this.countryChoices=void 0}async handleAddressChange(){var e,t;(null===(e=this.address)||void 0===e?void 0:e.country)&&(this.countryDetails&&(null===(t=this.countryDetails)||void 0===t?void 0:t.code)===this.address.country||(this.countryDetails=await getCountryDetails(this.address.country)),this.scChangeAddress.emit(this.address),this.scInputAddress.emit(this.address))}handleNameChange(){this.requireName&&(this.showName=!0)}decodeHtmlEntities(e){var t;return(null===(t=(new DOMParser).parseFromString(e,"text/html"))||void 0===t?void 0:t.body.textContent)||e}updateAddress(e){this.address={...this.address,...e}}handleAddressInput(e){this.scInputAddress.emit({...this.address,...e})}clearAddress(){var e;this.address={name:null===(e=this.address)||void 0===e?void 0:e.name,country:null,city:null,line_1:null,line_2:null,postal_code:null,state:null}}componentWillLoad(){this.initCountryChoices(),this.handleAddressChange(),this.handleNameChange()}async initCountryChoices(){var e,t;this.countryChoices=await countryChoices();const s=(null===(t=null===(e=this.countryChoices)||void 0===e?void 0:e.find((e=>{var t;return e.value===(null===(t=this.address)||void 0===t?void 0:t.country)})))||void 0===t?void 0:t.value)||null;this.updateAddress({country:s})}async reportValidity(){return reportChildrenValidity(this.el)}sortedFields(){var e,t,s,l;return this.countryDetails&&(null===(e=null==this?void 0:this.address)||void 0===e?void 0:e.country)?(null===(l=null===(s=null===(t=null==this?void 0:this.countryDetails)||void 0===t?void 0:t.address_formats)||void 0===s?void 0:s.edit)||void 0===l?void 0:l.match(/{{([^}]+)}}/g).map((e=>e.slice(2,-2))).map((e=>{var t,s,l;return{name:e,label:(null===(s=null===(t=null==this?void 0:this.countryDetails)||void 0===t?void 0:t.address_labels)||void 0===s?void 0:s[e])||(null===(l=null==DEFAULT_COUNTRY_FIELDS?void 0:DEFAULT_COUNTRY_FIELDS.find((t=>(null==t?void 0:t.name)===e)))||void 0===l?void 0:l.label)}})))||[]:DEFAULT_COUNTRY_FIELDS}regions(){var e,t,s,l,i;let r=(null===(t=null===(e=null==this?void 0:this.countryDetails)||void 0===e?void 0:e.states)||void 0===t?void 0:t.map((e=>({value:null==e?void 0:e.code,label:null==e?void 0:e.name}))))||[];return(null===(l=null===(s=null===window||void 0===window?void 0:window.wp)||void 0===s?void 0:s.hooks)||void 0===l?void 0:l.applyFilters)&&(r=window.wp.hooks.applyFilters("surecart_address_regions",r,null===(i=null==this?void 0:this.address)||void 0===i?void 0:i.country)),r}getRoundedProps(e,t){const s=0===e,l=e===t-1;return{squaredTop:l,squaredBottom:s,squared:!l&&!s}}render(){var e,t;const s=null===(t=null!==(e=this.sortedFields())&&void 0!==e?e:[])||void 0===t?void 0:t.filter((e=>{var t,s,l,i;switch(e.name){case"name":return this.showName;case"line_2":return this.showLine2||!!(null===(s=null===(t=null==this?void 0:this.address)||void 0===t?void 0:t.line_2)||void 0===s?void 0:s.length);case"city":return this.showCity;case"state":return!!(null===(l=null==this?void 0:this.regions())||void 0===l?void 0:l.length)&&!!(null===(i=null==this?void 0:this.address)||void 0===i?void 0:i.country);case"postal_code":return this.showPostal;default:return!0}}));return h("div",{class:"sc-address",part:"base"},h("sc-form-control",{label:this.label,exportparts:"label, help-text, form-control",class:"sc-address__control",required:this.required},s.map(((e,t)=>{var l,i,r,a,o,n,d,u,c,p,v,b,m,g,y,_,f;const x=this.getRoundedProps(t,s.length);switch(e.name){case"country":return h("sc-select",{exportparts:"base:select__base, input, form-control, label, help-text, trigger, panel, caret, search__base, search__input, search__form-control, menu__base, spinner__base, empty",part:"name__input",value:null===(l=this.address)||void 0===l?void 0:l.country,onScChange:e=>{var t;e.target.value!==(null===(t=this.address)||void 0===t?void 0:t.country)&&(this.clearAddress(),this.updateAddress({country:e.target.value}))},choices:this.countryChoices,autocomplete:"country-name",placeholder:e.label,name:null===(i=this.names)||void 0===i?void 0:i.country,search:!0,unselect:!1,disabled:this.disabled,required:this.required,"aria-label":e.label,...x});case"name":return h("sc-input",{exportparts:"base:input__base, input, form-control, label, help-text",value:null===(r=null==this?void 0:this.address)||void 0===r?void 0:r.name,onScChange:e=>this.updateAddress({name:e.target.value||null}),onScInput:e=>this.handleAddressInput({name:e.target.value||null}),autocomplete:"street-address",placeholder:e.label,name:null===(a=this.names)||void 0===a?void 0:a.name,disabled:this.disabled,required:this.requireName,"aria-label":e.label,...x});case"line_1":return h("sc-input",{exportparts:"base:input__base, input, form-control, label, help-text",value:null===(o=null==this?void 0:this.address)||void 0===o?void 0:o.line_1,onScChange:e=>this.updateAddress({line_1:e.target.value||null}),onScInput:e=>this.handleAddressInput({line_1:e.target.value||null}),autocomplete:"street-address",placeholder:e.label,name:null===(n=this.names)||void 0===n?void 0:n.line_1,disabled:this.disabled,required:this.required,"aria-label":e.label,...x});case"line_2":return h("sc-input",{exportparts:"base:input__base, input, form-control, label, help-text",value:null===(d=null==this?void 0:this.address)||void 0===d?void 0:d.line_2,onScChange:e=>this.updateAddress({line_2:e.target.value||null}),onScInput:e=>this.handleAddressInput({line_2:e.target.value||null}),autocomplete:"street-address",placeholder:e.label,name:null===(u=this.names)||void 0===u?void 0:u.line_2,disabled:this.disabled,"aria-label":e.label,...x});case"city":return h("sc-input",{exportparts:"base:input__base, input, form-control, label, help-text",placeholder:e.label,name:null===(c=this.names)||void 0===c?void 0:c.city,value:null===(p=null==this?void 0:this.address)||void 0===p?void 0:p.city,onScChange:e=>this.updateAddress({city:e.target.value||null}),onScInput:e=>this.handleAddressInput({city:e.target.value||null}),required:this.required,disabled:this.disabled,"aria-label":e.label,...x});case"state":return h("sc-select",{exportparts:"base:select__base, input, form-control, label, help-text, trigger, panel, caret, search__base, search__input, search__form-control, menu__base, spinner__base, empty",placeholder:e.label,name:null===(v=this.names)||void 0===v?void 0:v.state,autocomplete:"address-level1",value:null===(b=null==this?void 0:this.address)||void 0===b?void 0:b.state,onScChange:e=>{var t;return this.updateAddress({state:e.target.value||(null===(t=e.detail)||void 0===t?void 0:t.value)||null})},choices:this.regions(),required:this.required,disabled:this.disabled,search:!0,"aria-label":e.label,...x});case"postal_code":return h("sc-input",{exportparts:"base:input__base, input, form-control, label, help-text",placeholder:e.label,name:null===(m=this.names)||void 0===m?void 0:m.postal_code,onScChange:e=>this.updateAddress({postal_code:e.target.value||null}),onScInput:e=>this.handleAddressInput({postal_code:e.target.value||null}),autocomplete:"postal-code",required:this.required,value:null===(g=null==this?void 0:this.address)||void 0===g?void 0:g.postal_code,disabled:this.disabled,maxlength:"US"===(null===(y=this.address)||void 0===y?void 0:y.country)?5:void 0,pattern:(null===(_=this.countryDetails)||void 0===_?void 0:_.postal_code_regex)||void 0,customValidity:(null===(f=this.countryDetails)||void 0===f?void 0:f.postal_code_regex)?__("Please enter a valid postal code","surecart"):void 0,"aria-label":e.label,...x});default:return null}}))),this.loading&&h("sc-block-ui",{exportparts:"base:block-ui, content:block-ui__content"}))}static get is(){return"sc-address"}static get encapsulation(){return"shadow"}static get originalStyleUrls(){return{$:["sc-address.scss"]}}static get styleUrls(){return{$:["sc-address.css"]}}static get properties(){return{address:{type:"unknown",mutable:!0,complexType:{original:"Partial<Address>",resolved:"{ name?: string; line_1?: string; line_2?: string; city?: string; state?: string; postal_code?: string; country?: string; constructor?: Function; toString?: () => string; toLocaleString?: () => string; valueOf?: () => Object; hasOwnProperty?: (v: PropertyKey) => boolean; isPrototypeOf?: (v: Object) => boolean; propertyIsEnumerable?: (v: PropertyKey) => boolean; }",references:{Partial:{location:"global",id:"global::Partial"},Address:{location:"import",path:"../../../types",id:"src/types.ts::Address"}}},required:!1,optional:!1,docs:{tags:[],text:"The address."},defaultValue:"{\n    country: null,\n    city: null,\n    line_1: null,\n    line_2: null,\n    postal_code: null,\n    state: null,\n  }"},names:{type:"unknown",mutable:!1,complexType:{original:"Partial<Address>",resolved:"{ name?: string; line_1?: string; line_2?: string; city?: string; state?: string; postal_code?: string; country?: string; constructor?: Function; toString?: () => string; toLocaleString?: () => string; valueOf?: () => Object; hasOwnProperty?: (v: PropertyKey) => boolean; isPrototypeOf?: (v: Object) => boolean; propertyIsEnumerable?: (v: PropertyKey) => boolean; }",references:{Partial:{location:"global",id:"global::Partial"},Address:{location:"import",path:"../../../types",id:"src/types.ts::Address"}}},required:!1,optional:!1,docs:{tags:[],text:""},defaultValue:"{\n    name: 'shipping_name',\n    country: 'shipping_country',\n    city: 'shipping_city',\n    line_1: 'shipping_line_1',\n    line_2: 'shipping_line_2',\n    postal_code: 'shipping_postal_code',\n    state: 'shipping_state',\n  }"},loading:{type:"boolean",mutable:!1,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:"Is this loading?"},attribute:"loading",reflect:!1,defaultValue:"false"},disabled:{type:"boolean",mutable:!1,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:"Is this disabled?"},attribute:"disabled",reflect:!1},label:{type:"string",mutable:!1,complexType:{original:"string",resolved:"string",references:{}},required:!1,optional:!1,docs:{tags:[],text:"The label for the field."},attribute:"label",reflect:!1},showName:{type:"boolean",mutable:!0,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:"Should we show name field?"},attribute:"show-name",reflect:!0},showLine2:{type:"boolean",mutable:!1,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:"Should we show name field?"},attribute:"show-line-2",reflect:!1},required:{type:"boolean",mutable:!1,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:"Is this required?"},attribute:"required",reflect:!0,defaultValue:"false"},requireName:{type:"boolean",mutable:!1,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:"Is the name required"},attribute:"require-name",reflect:!0,defaultValue:"false"}}}static get states(){return{showCity:{},showPostal:{},countryDetails:{},countryChoices:{}}}static get events(){return[{method:"scChangeAddress",name:"scChangeAddress",bubbles:!0,cancelable:!0,composed:!0,docs:{tags:[],text:"Address change event."},complexType:{original:"Partial<Address>",resolved:"{ name?: string; line_1?: string; line_2?: string; city?: string; state?: string; postal_code?: string; country?: string; constructor?: Function; toString?: () => string; toLocaleString?: () => string; valueOf?: () => Object; hasOwnProperty?: (v: PropertyKey) => boolean; isPrototypeOf?: (v: Object) => boolean; propertyIsEnumerable?: (v: PropertyKey) => boolean; }",references:{Partial:{location:"global",id:"global::Partial"},Address:{location:"import",path:"../../../types",id:"src/types.ts::Address"}}}},{method:"scInputAddress",name:"scInputAddress",bubbles:!0,cancelable:!0,composed:!0,docs:{tags:[],text:"Address change event."},complexType:{original:"Partial<Address>",resolved:"{ name?: string; line_1?: string; line_2?: string; city?: string; state?: string; postal_code?: string; country?: string; constructor?: Function; toString?: () => string; toLocaleString?: () => string; valueOf?: () => Object; hasOwnProperty?: (v: PropertyKey) => boolean; isPrototypeOf?: (v: Object) => boolean; propertyIsEnumerable?: (v: PropertyKey) => boolean; }",references:{Partial:{location:"global",id:"global::Partial"},Address:{location:"import",path:"../../../types",id:"src/types.ts::Address"}}}}]}static get methods(){return{initCountryChoices:{complexType:{signature:"() => Promise<void>",parameters:[],references:{Promise:{location:"global",id:"global::Promise"}},return:"Promise<void>"},docs:{text:"",tags:[]}},reportValidity:{complexType:{signature:"() => Promise<boolean>",parameters:[],references:{Promise:{location:"global",id:"global::Promise"}},return:"Promise<boolean>"},docs:{text:"",tags:[]}}}}static get elementRef(){return"el"}static get watchers(){return[{propName:"address",methodName:"handleAddressChange"},{propName:"requireName",methodName:"handleNameChange"}]}}

Back