(cacheKey.getCacheObjectType(), cacheKey.getCacheKey());\n return moduleStates;\n}\n\nexport function updateModuleStates(value: IModuleStates, ctx: IActionContext): void {\n const cacheKey = new ModuleStatesCacheKey();\n ctx.update(cacheKey, value);\n}\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\n\nimport { IModule } from '@msdyn365-commerce/core';\nimport isMatch from 'lodash/isMatch';\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\nimport { getModuleStates, updateModuleStates } from './module-state';\nimport { IModuleState, IModuleStateManager, IModuleStateProps, IModuleStates } from './module-state.data';\n\nexport interface IProps extends IModule, IModuleStateProps {\n enableControl?: boolean;\n}\n\nconst withModuleState = (WrappedComponent: React.ComponentType
): React.ComponentType
=> {\n /**\n *\n * ModuleState component\n * @extends {React.Component
}\n */\n @observer\n class ModuleState extends React.Component
{\n constructor(props: P) {\n super(props);\n this.initializeState();\n }\n\n public render(): JSX.Element | null {\n const { id } = this.props;\n return ;\n }\n\n private initializeState = (): void => {\n const { id, typeName, context } = this.props;\n const states = getModuleStates(context.actionContext);\n if (!states) {\n this.props.telemetry.error('withModuleState initializeState() - states not found');\n return;\n }\n\n if (states[id]) {\n // state has been initialized\n return;\n }\n\n updateModuleStates(\n {\n ...states,\n [id]: {\n id,\n typeName,\n hasInitialized: false,\n hasError: false,\n isRequired: true,\n isCancellable: true,\n isSubmitContainer: false,\n status: undefined,\n childIds: []\n }\n },\n context.actionContext\n );\n };\n\n /**\n * GetModuleStateManager\n * Get module state manager by id\n */\n private getModuleStateManager = (id: string): IModuleStateManager => {\n const moduleState = this.get()[id];\n return {\n ...moduleState,\n hasInitialized: this.validate(id, { hasInitialized: true }, true), // All has initialized is initialized\n hasError: this.validate(id, { hasError: true }), // Partial has error is error\n isReady: this.validate(id, { status: 'ready' }, true, true), // All ready is ready (exclued disabled and skipped)\n isUpdating: this.validate(id, { status: 'updating' }), // Partial updating is updating\n isPending: this.validate(id, { status: 'pending' }), // Partial pending is pending\n isSkipped: this.validate(id, { status: 'skipped' }, true, true), // All skipped is skipped (exclued disabled)\n isDisabled: this.validate(id, { status: 'disabled' }, true), // All disabled is disabled\n isCancelAllowed: this.validate(id, { isCancellable: true }, true, true), // Partial not allowed is not allowed\n shouldSubmitContainer: this.validate(id, { isSubmitContainer: true }), // Partial submit is submit.\n hasExternalSubmitGroup: this.hasExternalSubmitGroup(),\n hasModuleState: this.hasModuleState(id),\n setIsRequired: (value: boolean): void => this.update(id, { isRequired: value }),\n setIsCancellable: (value: boolean): void => this.update(id, { isCancellable: value }),\n setIsSubmitContainer: (value: boolean): void => this.update(id, { isSubmitContainer: value }),\n setHasError: (value: boolean): void => this.update(id, { hasError: value }),\n onReady: (): void => this.update(id, { status: 'ready' }),\n onUpdating: (): void => this.update(id, { status: 'updating' }),\n onPending: (): void => this.update(id, { status: 'pending' }),\n onSkip: (): void => this.update(id, { status: 'skipped' }),\n onDisable: (): void => this.update(id, { status: 'disabled' }),\n getModule: (moduleId: string): IModuleStateManager => this.getModuleStateManager(moduleId),\n getModuleByTypeName: (typeName: string): IModuleStateManager => this.getModuleStateManagerByTypeName(typeName),\n init: (options?: Partial): void => {\n if (moduleState.hasInitialized) {\n // state has been initialized\n return;\n }\n this.update(id, {\n hasInitialized: true,\n ...options\n });\n }\n };\n };\n\n /**\n * GetModuleStateManagerByTypeName\n * Get module state manager by type name\n */\n private getModuleStateManagerByTypeName = (typeName: string): IModuleStateManager => {\n const moduleStates = getModuleStates(this.props.context.actionContext);\n const moduleState = Object.values(moduleStates).find(_moduleState => _moduleState.typeName === typeName);\n return this.getModuleStateManager((moduleState && moduleState.id) || '');\n };\n\n /**\n * Get\n * Get all module states\n */\n private get = (): IModuleStates => {\n return getModuleStates(this.props.context.actionContext);\n };\n\n /**\n * Update\n * Update module state\n */\n private update = (id: string, value: Partial): void => {\n // console.log('withModuleState - update', id, value);\n const modules = this.get();\n if (!modules[id]) {\n this.props.telemetry.error(`withModuleState update() - Module state with id ${id} is not found.`);\n return;\n }\n modules[id] = {\n ...modules[id],\n ...value\n };\n };\n\n private _validateLeaf = (id: string, source: Partial): boolean => {\n const modules = this.get();\n const module = modules[id];\n if (!module) {\n return false;\n }\n return isMatch(module, source);\n };\n\n private _validateContainer = (\n id: string,\n source: Partial,\n allMatched?: boolean,\n skipSkippableItem?: boolean\n ): boolean => {\n const modules = this.get();\n const module = modules[id];\n if (!module) {\n // module doesn't has module state\n return !!allMatched;\n }\n\n if (skipSkippableItem && (module.status === 'disabled' || module.status === 'skipped')) {\n // Skip disabled or skipped modules\n return !!allMatched;\n }\n\n // It is leaf module\n if (!module.childIds || !module.childIds.length) {\n return this._validateLeaf(id, source);\n }\n\n // It is container module\n const method = allMatched ? 'every' : 'some';\n return module.childIds[method](childId => this._validateContainer(childId, source, allMatched, skipSkippableItem));\n };\n\n /**\n * Validate\n * Validate current module and all its child module match the provided condition\n */\n private validate = (id: string, source: Partial, allMatched?: boolean, skipSkippableItem?: boolean): boolean => {\n const modules = this.get();\n const module = modules[id];\n if (!module) {\n return false;\n }\n\n // It is leaf module\n if (!module.childIds || !module.childIds.length) {\n return this._validateLeaf(id, source);\n }\n\n // It is container module\n return this._validateContainer(id, source, allMatched, skipSkippableItem);\n };\n\n /**\n * hasExternalSubmitGroup\n * Module will use external submit group\n */\n private hasExternalSubmitGroup = (): boolean => {\n return !!this.props.enableControl;\n };\n\n /**\n * hasModuleState\n * Module is using module state manager\n */\n private hasModuleState = (id: string): boolean => {\n const modules = this.get();\n const module = modules[id];\n return !!module;\n };\n }\n\n return ModuleState;\n};\n\nexport default withModuleState;","\r\n/**\r\n * Enum describing the names of the various Address Input fields\r\n */\r\nexport enum AddressFields {\r\n Name = 'Name',\r\n Street = 'Street',\r\n City = 'City',\r\n State = 'State',\r\n ZipCode = 'ZipCode',\r\n Phone = 'Phone',\r\n Country = 'ThreeLetterISORegionName'\r\n}","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { IAddressAddItem, IAddressAddUpdateProps } from '../../common/components/address-add';\nimport { IAddressList, IAddressListItem, IAddressListProps } from '../../common/components/address-list';\nimport { IAddressShowItem, IAddressShowProps } from '../../common/components/address-show';\nimport { IAccountManagementAddressViewProps } from './account-management-address';\n\nconst AddressShow: React.FC = ({\n AddressDetail,\n items\n}) => {\n\n return (\n \n {items && items.map((item: IAddressShowItem) => {\n return (\n <>\n {item.description}\n \n );\n })}\n \n );\n};\n\nconst AddressList: React.FC = ({\n List,\n isShowList,\n heading,\n items\n}) => {\n\n if (!isShowList) {\n return null;\n }\n\n return (\n \n {heading}\n {items && items.map((item: IAddressListItem) => {\n const { Item, key, error, showItems, isShowPrimaryButton, primaryButton, editButton, removeButton } = item;\n const { Error, isShowError, title, message } = error;\n return (\n \n {isShowError && \n {title}\n {message}\n }\n {isShowPrimaryButton && primaryButton}\n {editButton}\n {removeButton}\n );\n })}\n \n );\n};\n\nconst AddressLists: React.FC = ({\n ListAddress,\n heading,\n isShowEmptyListMessage,\n emptyListMessage,\n addButton,\n primaryAddressList,\n otherAddressList\n}) => {\n\n return (\n \n {heading}\n {isShowEmptyListMessage && emptyListMessage}\n {addButton}\n \n \n \n );\n};\n\nconst AddressAddUpdate: React.FC = ({\n AddressForm,\n heading,\n items,\n hasError,\n error,\n isShowSaveButton,\n saveButton,\n isShowCancelButton,\n cancelButton,\n}) => {\n\n return (\n \n {heading}\n {items && items.map((item: IAddressAddItem) => {\n const { AddressItem, key, label, alert, input } = item;\n return (\n {label}\n {alert}\n {input}\n );\n })}\n {hasError && \n {error.title}\n {error.message}\n }\n {isShowSaveButton && saveButton}\n {isShowCancelButton && cancelButton}\n \n );\n};\n\nconst AccountManagementAddressView: React.FC = props => {\n const { AccountAddressManagement, viewState, showAddressList, showAddOrUpdateAddress } = props;\n\n return (\n \n {viewState.isShowAddresList && }\n {viewState.isShowAddOrUpdateAddress && }\n \n );\n};\n\nexport default AccountManagementAddressView;\n","export enum AddressItemDisplayType {\n Input = 'Input',\n Dropdown = 'Dropdown',\n Checkbox = 'Checkbox'\n}\n\nexport enum AddressValidationRuleType {\n Required = 'Required',\n Format = 'Format'\n}\n\nexport enum AddressItemType {\n Name = 1001,\n Phone = 1002,\n IsPrimary = 1003,\n AddressTypeValue = 1004,\n ZipCode = 1,\n City = 2,\n County = 3,\n State = 4,\n ThreeLetterISORegionName = 5,\n Street = 6,\n District = 7,\n StreetNumber = 8,\n BuildingCompliment = 9,\n Postbox = 10,\n House_RU = 21,\n Flat_RU = 22,\n CountryOKSMCode_RU = 23\n}\n\nexport interface IAddressItem {\n name: string;\n type: AddressItemType;\n label: string;\n maxLength: number;\n displayType: AddressItemDisplayType;\n validationRules?: IAddressValidationRule[];\n isNewLine: boolean;\n}\n\nexport interface IAddressValidationRule {\n type: AddressValidationRuleType;\n regEx: string;\n message: string;\n}\n\nexport interface IAddressDropdownsData {\n [index: string]: { key?: string | number; value?: string }[];\n}","/*---------------------------------------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport * as React from 'react';\r\n\r\nexport interface IAdressErrorTitle {\r\n title: string;\r\n}\r\n\r\nconst AdressErrorTitle: React.FC = ({ title }) => (\r\n \r\n {title}\r\n
\r\n);\r\n\r\nexport default AdressErrorTitle;\r\n","/*---------------------------------------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport classname from 'classnames';\r\nimport * as React from 'react';\r\n\r\nexport interface IAddressDetailItem {\r\n isNewLine: boolean;\r\n isShowLabel: boolean;\r\n labelText: string;\r\n name: string;\r\n value: string;\r\n}\r\n\r\nconst AddressDetailItem: React.FC = ({\r\n isNewLine,\r\n isShowLabel,\r\n labelText,\r\n name,\r\n value\r\n}) => {\r\n const className = `msc-address-detail__item msc-address-detail__item-${name.toLowerCase()}`;\r\n const isEmpty = !(value && value.length > 0);\r\n const mainClass = isShowLabel ? `msc-address-detail__item msc-address-detail__item-address-detail_${labelText}` : classname(className, { 'msc-address-detail__item-empty': isEmpty, 'msc-address-detail__item-newline': isNewLine });\r\n value = (name.toLowerCase() === 'phone') ? _formatPhoneNumber(value) : value;\r\n return (\r\n \r\n {\r\n isShowLabel && <>\r\n {labelText}\r\n \r\n \r\n }\r\n {value}\r\n \r\n );\r\n};\r\n\r\nfunction _formatPhoneNumber(phoneNumberString: string): string {\r\n const cleaned = phoneNumberString.replace(/\\D/g, '');\r\n const match = cleaned.match(/^(1|)?(\\d{3})(\\d{3})(\\d{4})$/);\r\n if (match) {\r\n const intlCode = (match[1] ? '+1-' : '');\r\n return [intlCode, match[2], '-', match[3], '-', match[4]].join('');\r\n }\r\n return '';\r\n}\r\n\r\nexport default AddressDetailItem;\r\n","/*---------------------------------------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport * as React from 'react';\r\n\r\nimport { INodeProps } from '@msdyn365-commerce-modules/utilities';\r\nimport { Address } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\r\n\r\nimport { AddressItemType, IAddressItem } from '../../common/address-format.data';\r\nimport AddressDetailItemComponent from './address-detail-item';\r\n\r\nexport interface IAddressShowItem {\r\n key: string;\r\n description: React.ReactNode;\r\n}\r\n\r\nexport interface IAddressShowProps {\r\n AddressDetail: INodeProps;\r\n items: IAddressShowItem[];\r\n}\r\n\r\nexport interface IAddressShowInputProps {\r\n addressFormat: IAddressItem[];\r\n address: Address;\r\n}\r\n\r\nexport const AddressShow = (props: IAddressShowInputProps): IAddressShowProps => {\r\n const { addressFormat, address } = props;\r\n\r\n return {\r\n AddressDetail: { className: 'msc-address-detail' },\r\n items: addressFormat.map((item) => {\r\n return {\r\n key: item.name,\r\n description: \r\n };\r\n })\r\n };\r\n};","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport * as React from 'react';\n\nimport { INodeProps, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport { Address, AddressPurpose } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\n\nimport { AddressFormat } from '../../common/address-format';\nimport { IAddressResource } from '../../common/address-module.data';\nimport AddressButtonComponent from './address-button';\nimport AddressInputComponent from './address-input';\nimport { AddressShow, IAddressShowProps } from './address-show';\n\nexport interface IAddressSelectInputProps {\n hasExternalSubmitGroup?: boolean;\n addressFormat: AddressFormat;\n addresses: Address[];\n addressPurposes: AddressPurpose[];\n resources: IAddressResource;\n selectedAddress: Address;\n telemetryContent?: ITelemetryContent;\n onAddressOptionChange(event: React.ChangeEvent): void;\n onAddAddress(): void;\n onSave(): void;\n onCancel(): void;\n}\n\nexport interface IAddressSelectItem {\n key: number;\n SelectItem: INodeProps;\n input: React.ReactNode;\n showItems: IAddressShowProps;\n}\n\nexport interface IAddressSelectProps {\n SelectAddress: INodeProps;\n addButton: React.ReactNode;\n items: IAddressSelectItem[];\n isShowSaveButton: boolean;\n saveButton: React.ReactNode;\n isShowCancelButton: boolean;\n cancelButton: React.ReactNode;\n}\n\nconst getInput = (index: number, address: Address, props: IAddressSelectInputProps): React.ReactNode => {\n const { addresses, onAddressOptionChange, selectedAddress } = props;\n\n const ichecked = address.RecordId === selectedAddress.RecordId;\n const additionalAttributes = {\n checked: ichecked,\n 'aria-checked': ichecked,\n 'aria-setsize': addresses.length,\n 'aria-posinset': index + 1\n };\n\n return (\n \n );\n};\n\nconst getAddressSelectItems = (props: IAddressSelectInputProps): IAddressSelectItem[] => {\n const { addresses, addressFormat, addressPurposes } = props;\n\n return addresses.map((address, index) => {\n return {\n key: address.RecordId || 0,\n SelectItem: { className: 'msc-address-select__item' },\n input: getInput(index, address, props),\n showItems: AddressShow({ addressFormat: addressFormat.getAddressFormat(address.ThreeLetterISORegionName || ''), address: address, addressPurposes: addressPurposes})\n };\n });\n};\n\nexport const AddressSelect = (props: IAddressSelectInputProps): IAddressSelectProps => {\n const { resources, onCancel, onSave, onAddAddress, hasExternalSubmitGroup } = props;\n\n return {\n SelectAddress: { className: 'msc-address-select' },\n addButton: (\n \n ),\n isShowSaveButton: !hasExternalSubmitGroup,\n saveButton: (\n \n ),\n isShowCancelButton: !hasExternalSubmitGroup,\n cancelButton: (\n \n ),\n items: getAddressSelectItems(props)\n };\n};","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\n\nimport classnames from 'classnames';\nimport { action, computed, observable, reaction, set } from 'mobx';\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\n\nimport { IModuleStateProps, withModuleState } from '@msdyn365-commerce-modules/checkout-utilities';\nimport {\n getTelemetryObject, IModuleProps, ITelemetryContent\n} from '@msdyn365-commerce-modules/utilities';\nimport {\n Address, AddressPurpose, CountryRegionInfo, StateProvinceInfo\n} from '@msdyn365-commerce/retail-proxy';\n\nimport { AutoSuggest } from '../../common/address-autosuggest';\nimport { IAutoSuggestOptions } from '../../common/address-autosuggest.data';\nimport { AddressCommon } from '../../common/address-common';\nimport { AddressFormat } from '../../common/address-format';\nimport { AddressItemType } from '../../common/address-format.data';\nimport { AddressMetaData } from '../../common/address-meta-data';\nimport {\n AddressOperation, AddressType, IAddressResource, IAddressResponse\n} from '../../common/address-module.data';\nimport { AddressAddUpdate, IAddressAddUpdateProps } from '../../common/components/address-add';\nimport { AddressSelect, IAddressSelectProps } from '../../common/components/address-select';\nimport { AddressShow, IAddressShowProps } from '../../common/components/address-show';\nimport { ICheckoutShippingAddressData } from './checkout-shipping-address.data';\nimport { ICheckoutShippingAddressProps } from './checkout-shipping-address.props.autogenerated';\n\nexport interface ICheckoutAddressProps extends ICheckoutShippingAddressProps, IModuleStateProps { }\n\nexport interface ICheckoutShippingAddressViewState {\n isShowAddress: boolean;\n isShowAddresList: boolean;\n isShowAddOrUpdateAddress: boolean;\n}\n\nexport interface ICheckoutShippingAddressViewProps extends ICheckoutAddressProps {\n className: string;\n currentOperation: AddressOperation;\n selectedAddress?: Address;\n addUpdateAddress: Address;\n addressListSelectedAddress: Address;\n countryRegionId: string;\n stateProvinceInfo?: StateProvinceInfo[];\n customerAddresses: Address[];\n validationError: object;\n addressActionResponse?: IAddressResponse;\n viewState: ICheckoutShippingAddressViewState;\n CheckoutShippingAddress: IModuleProps;\n isUpdating: boolean;\n hasError: boolean;\n showAddress: IAddressShowProps;\n showAddressSelect: IAddressSelectProps;\n showAddOrUpdateAddress: IAddressAddUpdateProps;\n}\n\n/**\n *\n * Address component\n * @extends {React.Component>}\n */\n// @ts-ignore\n@withModuleState\n@observer\nclass CheckoutShippingAddress extends React.Component {\n @observable private currentOperation: AddressOperation;\n @observable private selectedAddress?: Address;\n @observable private addUpdateAddress: Address;\n @observable private countryRegionId: string = 'USA';\n @observable private stateProvinceInfo?: StateProvinceInfo[];\n @observable private customerAddresses: Address[];\n @observable private validationError: object;\n @observable private addressActionResponse?: IAddressResponse;\n @observable private isUpdating?: boolean;\n @observable private hasError?: boolean;\n @observable private addressListSelectedAddress: Address = {};\n\n private addressCommon: AddressCommon;\n private addressFormat: AddressFormat;\n private countryRegions: CountryRegionInfo[];\n private addressPurposes: AddressPurpose[];\n private resources: IAddressResource;\n private defaultAddressType: number = 6; // Default to Home\n private telemetryContent?: ITelemetryContent;\n private autoSuggest?: AutoSuggest;\n private multiplePickupStoreSwitchName: string = 'Dynamics.AX.Application.RetailMultiplePickupDeliveryModeFeature';\n private retailMultiplePickUpOptionEnabled?: boolean = false;\n\n constructor(props: ICheckoutAddressProps) {\n super(props);\n const { context, data, resources, telemetry } = this.props;\n\n this.addUpdateAddress = {};\n this.resources = resources;\n this.currentOperation = AddressOperation.List;\n this.countryRegions = data.countryRegions.result || [];\n this.addressPurposes = data.addressPurposes.result || [];\n this.customerAddresses = data.address.result || [];\n this.stateProvinceInfo = data.countryStates.result || [];\n this.addressCommon = new AddressCommon(context, resources, telemetry);\n this.addressFormat = new AddressFormat(this.countryRegions, new AddressMetaData({ ...resources }, this._getAddressFormatExcludeList()), this.addressPurposes);\n this.validationError = {};\n this.retailMultiplePickUpOptionEnabled = data?.featureState?.result?.\n find(feature => feature.Name === this.multiplePickupStoreSwitchName)?.IsEnabled;\n this.telemetryContent = getTelemetryObject(this.props.context.request.telemetryPageName!, this.props.friendlyName, this.props.telemetry);\n }\n\n public async componentDidMount(): Promise {\n const {\n context: {\n telemetry,\n actionContext: {\n requestContext: {\n channel\n }\n }\n },\n config: {\n autoSuggestionEnabled,\n autoSuggestOptions\n }\n } = this.props;\n\n this.props.data.checkout.then(() => {\n this._setDefaultCountryRegionId();\n this._initModuleState();\n });\n\n reaction(\n () => this.countryRegionId,\n () => this._getStateProvinces()\n );\n\n reaction(\n () => this.currentOperation,\n () => {\n this._getStateProvinces();\n }\n );\n\n if (autoSuggestionEnabled) {\n\n if (channel && !channel.BingMapsApiKey) {\n telemetry.error('BingMapsApiKey is missing.');\n return;\n }\n\n if (channel && !channel.BingMapsEnabled) {\n telemetry.error('Map is disabled from HQ.');\n return;\n }\n\n const options: IAutoSuggestOptions = { ...autoSuggestOptions };\n this.autoSuggest = new AutoSuggest(telemetry, options, channel?.BingMapsApiKey, channel?.ChannelCountryRegionISOCode, channel?.DefaultLanguageId);\n\n // Customer doesn't have any address. Then add view will be loaded directly. Code for the same to handle that\n if(this.props.data.storeSelectorStateManager.result && (this.currentOperation === AddressOperation.Add || this.currentOperation === AddressOperation.Update)) {\n await this.autoSuggest?._loadMapAPI(await this.props.data.storeSelectorStateManager);\n }\n\n reaction(\n () => this.props.data.storeSelectorStateManager.result?.loadMapApi && (this.currentOperation === AddressOperation.Add || this.currentOperation === AddressOperation.Update),\n async () => {\n await this.autoSuggest?._loadMapAPI(await this.props.data.storeSelectorStateManager);\n }\n );\n\n reaction(\n () => this.props.data.storeSelectorStateManager.result?.isMapApiLoaded,\n async () => {\n await this._attachMapAutoSuggest();\n }\n );\n }\n }\n\n public async componentDidUpdate(): Promise {\n if (this.currentOperation === AddressOperation.Add || this.currentOperation === AddressOperation.Update) {\n if (this.props.data.storeSelectorStateManager.result?.isMapApiLoaded) {\n await this._attachMapAutoSuggest();\n }\n } else {\n this.autoSuggest?.disposeAutoSuggest();\n }\n }\n\n public render(): JSX.Element | null {\n if (!this._canShip()) {\n return null;\n }\n\n const { renderView, config } = this.props;\n\n const viewProps = {\n ...this.props,\n currentOperation: this.currentOperation,\n selectedAddress: this.selectedAddress,\n addUpdateAddress: this.addUpdateAddress,\n addressListSelectedAddress: this.addressListSelectedAddress,\n countryRegionId: this.countryRegionId,\n stateProvinceInfo: this.stateProvinceInfo,\n customerAddresses: this.customerAddresses,\n validationError: this.validationError,\n addressActionResponse: this.addressActionResponse,\n isUpdating: this.isUpdating,\n hasError: this.hasError,\n className: config.className,\n viewState: {\n isShowAddress: this.currentOperation === AddressOperation.Show && this.selectedAddress,\n isShowAddresList: this.currentOperation === AddressOperation.List && this.customerAddresses.length > 0,\n isShowAddOrUpdateAddress:\n this.currentOperation === AddressOperation.Add || this.currentOperation === AddressOperation.Update\n },\n CheckoutShippingAddress: {\n moduleProps: this.props,\n className: classnames('ms-checkout-shipping-address', config.className)\n },\n showAddress: this._renderShowAddress(),\n showAddressSelect: this._renderSelectAddress(),\n showAddOrUpdateAddress: this._renderAddOrUpdateAddress()\n };\n\n return renderView(viewProps) as React.ReactElement;\n }\n\n private _renderAddOrUpdateAddress = (): IAddressAddUpdateProps => {\n const addressFormat = this.currentOperation === AddressOperation.Add && this.addressCommon.isAuthenticatedFlow() ? this.addressFormat : this.addressFormat;\n return AddressAddUpdate({\n isUpdating: this.isUpdating,\n resources: this.resources,\n addressType: AddressType.Shipping,\n addressFormat: addressFormat.getAddressFormat(this.addUpdateAddress.ThreeLetterISORegionName || this.countryRegionId),\n defaultCountryRegionId: this.countryRegionId,\n defaultAddressType: this.defaultAddressType,\n selectedAddress: this.addUpdateAddress,\n validationError: this.validationError,\n hasError: this.hasError,\n addressActionResponse: this.addressActionResponse,\n telemetryContent: this.telemetryContent,\n dropdownDisplayData: addressFormat.getPrefilledAddressDropdownData(\n this.resources.addressStateDefaultSelectionText,\n this.stateProvinceInfo\n ),\n onInputChange: this._onAddressAddUpdateInputChange,\n onDropdownChange: this._onAddressAddUpdateDropdownChange,\n hasExternalSubmitGroup: this.props.moduleState.hasExternalSubmitGroup,\n onSave: this.onSubmit,\n // tslint:disable-next-line: no-empty\n onCancel: !this.selectedAddress && !this.addressCommon.isAuthenticatedFlow() ? () => { } : this._resetView\n });\n };\n\n private _renderSelectAddress = (): IAddressSelectProps => {\n return AddressSelect({\n addressFormat: this.addressFormat,\n addresses: this.customerAddresses,\n resources: this.resources,\n addressPurposes: this.addressPurposes,\n selectedAddress: this.addressListSelectedAddress,\n onAddressOptionChange: this._onAddressOptionChange,\n hasExternalSubmitGroup: this.props.moduleState.hasExternalSubmitGroup,\n telemetryContent: this.telemetryContent,\n onAddAddress: this._goToAddAddress,\n onSave: this._onSelectAddress,\n // tslint:disable-next-line: no-empty\n onCancel: !this.selectedAddress ? () => { } : this._resetView\n });\n };\n\n private _renderShowAddress(): IAddressShowProps | null {\n if (this.selectedAddress) {\n return AddressShow({\n address: this.selectedAddress,\n addressFormat: this.addressFormat.getAddressFormat(this.selectedAddress.ThreeLetterISORegionName || ''),\n addressPurposes: this.addressPurposes\n });\n }\n\n return null;\n }\n\n private _attachMapAutoSuggest = async (): Promise => {\n const {\n data: {\n storeSelectorStateManager: { result: storeSelectorStateManager }\n }\n } = this.props;\n\n if (storeSelectorStateManager?.isMapApiLoaded) {\n this.autoSuggest?.attachAutoSuggest('#shipping_addressstreet', '#shipping_addressstreet_container', this._onSuggestionSelected);\n }\n }\n\n @action\n private _onSuggestionSelected = async (result: Microsoft.Maps.ISuggestionResult): Promise => {\n this._clearAddressFields();\n const address = this.addressFormat.getTranformedAddress(result, this.stateProvinceInfo);\n set(this.addUpdateAddress, { ['Street']: '' });\n set(this.addUpdateAddress, { ['ZipCode']: address.ZipCode });\n set(this.addUpdateAddress, { ['CountyName']: address.CountyName });\n set(this.addUpdateAddress, { ['City']: address.City });\n set(this.addUpdateAddress, { ['State']: address.State });\n set(this.addUpdateAddress, { ['DistrictName']: address.DistrictName });\n set(this.addUpdateAddress, { ['FullAddress']: address.FullAddress });\n // Bing autosuggest put the complete address in the Street input box. Updating the street input box to show only street address.\n setTimeout(() => {\n set(this.addUpdateAddress, { ['Street']: address.Street });\n }, 0);\n\n }\n\n @action\n private _clearAddressFields = (): void => {\n const addressFormatItem = this.addressFormat.getAddressFormat(this.addUpdateAddress.ThreeLetterISORegionName || this.countryRegionId);\n addressFormatItem.forEach(format => {\n if (this.addUpdateAddress[format.name] !== undefined && !this.autoSuggest?.excludedAddressFields.includes(format.name)) {\n this.addressFormat[format.name] = '';\n }\n });\n this._clearValidation();\n }\n\n @action\n private _clearValidation = (): void => {\n this.validationError = {};\n }\n\n private _onAddressOptionChange = (event: React.ChangeEvent) => {\n const addressRecordId = event.currentTarget.value;\n const selectedAddress = this.customerAddresses.find(address => (address.RecordId || '').toString() === addressRecordId);\n if (selectedAddress) {\n this.addressListSelectedAddress = selectedAddress;\n }\n };\n\n private onAddressAddUpdate = (name: string, value: string | boolean) => {\n set(this.addUpdateAddress, { [name]: value });\n this.addressFormat.validateAddressFormat(this.addUpdateAddress, this.validationError, this.countryRegionId, name);\n };\n\n private _onAddressAddUpdateInputChange = (event: React.ChangeEvent): void => {\n if (event.target.type === 'checkbox') {\n this.onAddressAddUpdate(event.target.name, event.target.checked);\n } else {\n const value = (event.target.value || '').replace(new RegExp('[<>]', 'gi'), '');\n this.onAddressAddUpdate(event.target.name, value);\n }\n };\n\n private _onAddressAddUpdateDropdownChange = (event: React.ChangeEvent): void => {\n this.onAddressAddUpdate(event.target.name, event.target.value);\n\n if (event.target.name === AddressItemType[AddressItemType.ThreeLetterISORegionName]) {\n this._onCountryChange(event.target.value);\n }\n };\n\n private _onAddressAddUpdateSubmit = (): void => {\n if (!this.addressFormat.validateAddressFormat(this.addUpdateAddress, this.validationError, this.countryRegionId)) {\n return;\n }\n\n let response: Promise;\n if (this.addressCommon.isAuthenticatedFlow()) {\n response =\n this.currentOperation === AddressOperation.Update\n ? this.addressCommon.updateCustomerAddress(this.addUpdateAddress)\n : this.addressCommon.addCustomerAddress(this.addUpdateAddress);\n } else {\n response = Promise.resolve({ address: this.addUpdateAddress });\n }\n\n this.isUpdating = true;\n this._updateModuleState();\n\n response.then(\n (result: IAddressResponse) => {\n this.isUpdating = false;\n\n if (result.address) {\n this.hasError = false;\n this._onAddOrUpdateSuccess(result);\n } else {\n this.hasError = true;\n this.addressActionResponse = result;\n this._updateModuleState();\n }\n },\n () => {\n this.hasError = true;\n this.isUpdating = false;\n this._updateModuleState();\n }\n );\n };\n\n private _onCountryChange = (countryRegionId: string) => {\n this.countryRegionId = countryRegionId;\n const twoLetterISORegionName = this.addressFormat.getTwoLetterISORegionName(countryRegionId);\n set(this.addUpdateAddress, { ['ThreeLetterISORegionName']: countryRegionId });\n set(this.addUpdateAddress, { ['TwoLetterISORegionName']: twoLetterISORegionName });\n this.autoSuggest?.changeAutoSuggestionCountryCode(twoLetterISORegionName);\n this._clearAddressFields();\n };\n\n private _getAddressFormatExcludeList = (): AddressItemType[] => {\n const { config } = this.props;\n const addressFormatExcludeList: AddressItemType[] = [];\n\n if (!config.showAddressType) {\n addressFormatExcludeList.push(AddressItemType.AddressTypeValue);\n }\n\n addressFormatExcludeList.push(AddressItemType.IsPrimary);\n\n return addressFormatExcludeList;\n }\n\n private _getStateProvinces = (): void => {\n if (\n !this.countryRegionId ||\n !(this.currentOperation === AddressOperation.Add || this.currentOperation === AddressOperation.Update)\n ) {\n return;\n }\n\n // tslint:disable-next-line:no-floating-promises\n this.addressCommon.getStateProvinces(this.countryRegionId).then((result: StateProvinceInfo[]) => {\n const stateInfo = result.some(state => state.StateId === this.addUpdateAddress.State);\n // Reset state if selected state not found in the list.\n if (!stateInfo) {\n set(this.addUpdateAddress, { ['State']: '' });\n }\n\n this.stateProvinceInfo = result;\n });\n };\n\n private _setDefaultCountryRegionId(): void {\n const { request } = this.props.context;\n const market = request && request.channel && request.channel.ChannelCountryRegionISOCode;\n this.countryRegionId = this.addressCommon.getDefaultCountryRegionId(this.countryRegionId, this.countryRegions, market);\n }\n\n private _getDefaultAddress = (): Address | undefined => {\n if (this.customerAddresses) {\n const primaryAddress = this.customerAddresses.find((address: Address) => address.IsPrimary);\n return primaryAddress || (this.customerAddresses.length > 0 ? this.customerAddresses[0] : undefined);\n }\n return undefined;\n };\n\n private _initModuleState = (): void => {\n this.props.moduleState.init({\n status: this._canShip() ? 'updating' : 'disabled',\n onEdit: this.onEdit,\n onCancel: this.onCancel,\n onSubmit: this.onSubmit\n });\n\n if (this._canShip()) {\n const defaultAddress = this._getShippingAddressFromCartLines() || this._getDefaultAddress();\n if (defaultAddress && !this.addressCommon.isEmpty(defaultAddress)) {\n this._updateCurrentOperation(AddressOperation.Show, defaultAddress);\n this._setShippingAddress(defaultAddress);\n this._updateModuleState();\n } else {\n this._updateCurrentOperation(AddressOperation.Add);\n }\n }\n };\n\n private onSubmit = (): void => {\n switch (this.currentOperation) {\n case AddressOperation.Add:\n case AddressOperation.Update:\n this._onAddressAddUpdateSubmit();\n break;\n case AddressOperation.List:\n this._onSelectAddress();\n break;\n default:\n this.props.telemetry.error('Invalid operation');\n }\n };\n\n private onCancel = (): void => {\n switch (this.currentOperation) {\n case AddressOperation.Add:\n case AddressOperation.Update:\n this._clearAddressFields();\n if (!(!this.selectedAddress && !this.addressCommon.isAuthenticatedFlow())) {\n this._resetView();\n }\n\n break;\n case AddressOperation.List:\n if (this.selectedAddress) {\n this._resetView();\n }\n break;\n default:\n this.props.telemetry.error('Invalid operation');\n }\n };\n\n private onEdit = (): void => {\n if (this.addressCommon.isAuthenticatedFlow() && this.shippingAddress) {\n this._updateCurrentOperation(AddressOperation.List, this.shippingAddress);\n } else if (this.shippingAddress) {\n this._updateCurrentOperation(AddressOperation.Update, this.shippingAddress);\n }\n\n this._updateModuleState();\n };\n\n private _getShippingAddressFromCartLines = (): Address | undefined => {\n const { request } = this.props.context;\n const { channelDeliveryOptionConfig } = this.props.data;\n const pickupDeliveryModeCode = request && request.channel && request.channel.PickupDeliveryModeCode;\n const emailDeliveryModeCode = request && request.channel && request.channel.EmailDeliveryModeCode;\n\n const cartLines = this.retailMultiplePickUpOptionEnabled ?\n ((this.props.data.checkout.result && this.props.data.checkout.result.checkoutCart.cart.CartLines) || []).filter(\n cartLine => (cartLine.DeliveryMode && cartLine.DeliveryMode !== '')\n ? (cartLine.DeliveryMode !== channelDeliveryOptionConfig.result?.PickupDeliveryModeCodes?.find(deliveryMode => deliveryMode === cartLine.DeliveryMode) && cartLine.DeliveryMode !== emailDeliveryModeCode)\n : cartLine\n ):\n ((this.props.data.checkout.result && this.props.data.checkout.result.checkoutCart.cart.CartLines) || []).filter(\n cartLine => (cartLine.DeliveryMode && cartLine.DeliveryMode !== '')\n ? (cartLine.DeliveryMode !== pickupDeliveryModeCode && cartLine.DeliveryMode !== emailDeliveryModeCode)\n : cartLine\n );\n\n if (cartLines && cartLines.length > 0) {\n return cartLines[0].ShippingAddress;\n }\n\n return undefined;\n };\n\n private _canShip = (): boolean => {\n const { checkout, channelDeliveryOptionConfig } = this.props.data;\n const { request } = this.props.context;\n const pickupDeliveryModeCode = request && request.channel && request.channel.PickupDeliveryModeCode;\n const emailDeliveryModeCode = request && request.channel && request.channel.EmailDeliveryModeCode;\n if (!checkout.result || !request.channel || checkout.result.checkoutCart.isEmpty || checkout.result.checkoutCart.hasInvoiceLine) {\n return false;\n }\n\n // @ts-ignore: Type-checker not realizing above request.channel check\n return this.retailMultiplePickUpOptionEnabled?\n checkout?.result?.checkoutCart?.cart?.CartLines?.some(\n cartLine => (cartLine.DeliveryMode && cartLine.DeliveryMode !== '')\n ? (cartLine.DeliveryMode !== channelDeliveryOptionConfig.result?.PickupDeliveryModeCodes?.find(deliveryMode => deliveryMode === cartLine.DeliveryMode) && cartLine.DeliveryMode !== emailDeliveryModeCode)\n : cartLine\n )\n : checkout?.result?.checkoutCart?.cart?.CartLines?.some(\n cartLine => (cartLine.DeliveryMode && cartLine.DeliveryMode !== '')\n ? (cartLine.DeliveryMode !== pickupDeliveryModeCode && cartLine.DeliveryMode !== emailDeliveryModeCode)\n : cartLine\n );\n };\n\n private _onSelectAddress = () => {\n this._updateCurrentOperation(AddressOperation.Show, this.addressListSelectedAddress);\n this._setShippingAddress(this.addressListSelectedAddress);\n this._updateModuleState();\n };\n\n private _goToAddAddress = () => {\n this._setDefaultCountryRegionId();\n this._updateCurrentOperation(AddressOperation.Add);\n };\n\n private _onAddOrUpdateSuccess = (response: IAddressResponse) => {\n if (response.customerAddresses) {\n this.customerAddresses = response.customerAddresses;\n }\n\n if (response.address) {\n this._updateCurrentOperation(AddressOperation.Show, response.address);\n this._setShippingAddress(response.address);\n this._updateModuleState();\n }\n };\n\n private _setShippingAddress = (address: Address): void => {\n if (this.props.data.checkout.result) {\n const newShippingAddress = { ...address };\n\n if (address.ThreeLetterISORegionName && !newShippingAddress.TwoLetterISORegionName) {\n newShippingAddress.TwoLetterISORegionName = this.addressFormat.getTwoLetterISORegionName(address.ThreeLetterISORegionName);\n }\n\n // tslint:disable-next-line:no-floating-promises\n this.props.data.checkout.result.updateShippingAddress({ newShippingAddress });\n }\n };\n\n @computed get shippingAddress(): Address | undefined {\n return this.props.data.checkout.result && this.props.data.checkout.result.shippingAddress;\n }\n\n private _resetView = (): void => {\n switch (this.currentOperation) {\n case AddressOperation.Add:\n case AddressOperation.Update:\n this._updateCurrentOperation(\n this.addressCommon.isAuthenticatedFlow() ? AddressOperation.List : AddressOperation.Show,\n this.shippingAddress\n );\n break;\n default:\n this._updateCurrentOperation(AddressOperation.Show, this.shippingAddress);\n }\n this._updateModuleState();\n };\n\n private _updateCurrentOperation = (operation: AddressOperation, selectedAddress?: Address) => {\n this.currentOperation = operation;\n this.selectedAddress = selectedAddress;\n\n if (this.currentOperation === AddressOperation.Add || this.currentOperation === AddressOperation.Update) {\n this.addUpdateAddress = { ...this.selectedAddress } || {};\n set(this.addUpdateAddress, {\n ['ThreeLetterISORegionName']: this.addUpdateAddress.ThreeLetterISORegionName || this.countryRegionId\n });\n set(this.addUpdateAddress, {\n ['AddressTypeValue']: this.addUpdateAddress.AddressTypeValue || this.defaultAddressType\n });\n } else if (this.currentOperation === AddressOperation.List) {\n this.addressListSelectedAddress = { ...this.selectedAddress } || {};\n }\n };\n\n private _updateModuleState = () => {\n if (this.currentOperation === AddressOperation.Show) {\n this.props.moduleState.onReady();\n } else if (this.isUpdating) {\n this.props.moduleState.onPending();\n } else {\n this.props.moduleState.onUpdating();\n }\n };\n}\n\nexport default CheckoutShippingAddress;\n","/*---------------------------------------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport { get, set } from 'mobx';\r\n\r\nimport {\r\n Address, CountryRegionInfo, StateProvinceInfo\r\n} from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\r\n\r\nimport { ICoreContext } from '@msdyn365-commerce/core';\r\nimport { AddressFields } from './address.fields';\r\n\r\nimport {\r\n AddressItemType, IAddressDropdownsData, IAddressItem, IAddressValidationRule\r\n} from './address-format.data';\r\nimport { AddressMetaData } from './address-meta-data';\r\n\r\n/**\r\n *\r\n * Retail Service Address format parser\r\n */\r\nexport class AddressFormat {\r\n private countryRegionsInfo?: CountryRegionInfo[];\r\n private addressMetaData: AddressMetaData;\r\n private context: ICoreContext;\r\n\r\n constructor(context: ICoreContext, countryRegionsInfo: CountryRegionInfo[], addressMetaData: AddressMetaData) {\r\n this.countryRegionsInfo = countryRegionsInfo;\r\n this.addressMetaData = addressMetaData;\r\n this.context = context;\r\n }\r\n\r\n public getAddressFormat(countryRegionId: string): IAddressItem[] {\r\n const countryRegionInfo = this._getCountryRegionInfo(countryRegionId);\r\n if (countryRegionInfo) {\r\n return this._getAddressDisplayFormat(countryRegionInfo);\r\n }\r\n return [];\r\n }\r\n\r\n public getCountryFormat(): { key?: string; value?: string }[] {\r\n return (this.countryRegionsInfo || []).map(countryRegion => {\r\n return {\r\n key: countryRegion.CountryRegionId,\r\n value: countryRegion.ShortName\r\n };\r\n });\r\n }\r\n\r\n public getStateFormat(stateProvinceInfo?: StateProvinceInfo[], isShippingAddress?: boolean): { key?: string; value?: string; disabled?: boolean }[] {\r\n let isDisabled = false;\r\n return (stateProvinceInfo || []).map(state => {\r\n if (isShippingAddress) {\r\n if (!this.context.actionContext.requestContext.app.config.statesSettings[state.StateId!.toLowerCase()]) {\r\n isDisabled = true;\r\n } else {\r\n isDisabled = false;\r\n }\r\n }\r\n return {\r\n key: state.StateId,\r\n value: state.StateName,\r\n disabled: isDisabled\r\n };\r\n });\r\n }\r\n\r\n public getPrefilledAddressDropdownData = (stateDefaultSelectionText: string, stateProvinceInfo?: StateProvinceInfo[], isShippingAddress?: boolean): IAddressDropdownsData => {\r\n const defaultStateText = {\r\n key: '',\r\n value: stateDefaultSelectionText,\r\n disabled: false\r\n };\r\n const dropdownData: IAddressDropdownsData = {};\r\n\r\n dropdownData[AddressItemType[AddressItemType.ThreeLetterISORegionName]] = this.getCountryFormat();\r\n dropdownData[AddressItemType[AddressItemType.State]] = this.getStateFormat(stateProvinceInfo, isShippingAddress);\r\n dropdownData[AddressItemType[AddressItemType.State]].unshift(defaultStateText);\r\n\r\n return dropdownData;\r\n };\r\n\r\n public getTwoLetterISORegionName = (countryRegionId: string): string | undefined => {\r\n const countryRegionInfo = this._getCountryRegionInfo(countryRegionId);\r\n\r\n return countryRegionInfo!.ISOCode;\r\n };\r\n\r\n public validateAddressFormat = (address: Address, validationError: Address, countryRegionId: string, isBilling?: boolean): boolean => {\r\n let isValid: boolean = true;\r\n const addressFormat = this.getAddressFormat((address.ThreeLetterISORegionName) || countryRegionId);\r\n\r\n if (isBilling) {\r\n const ZipCodeIndex = addressFormat.findIndex(addressFormatItem => addressFormatItem.name === AddressFields.ZipCode);\r\n const ZipCodeValidationIndex = addressFormat[ZipCodeIndex].validationRules!.findIndex(validationRule => validationRule.regEx !== '\\\\S');\r\n addressFormat[ZipCodeIndex].validationRules!.splice(ZipCodeValidationIndex, 1);\r\n }\r\n\r\n addressFormat.forEach(addressFormatItem => {\r\n set(validationError, { [addressFormatItem.name]: null });\r\n\r\n for (const validationRule of (addressFormatItem.validationRules || [])) {\r\n if (!this._validateRegEx(address, addressFormatItem.name, validationRule)) {\r\n set(validationError, { [addressFormatItem.name]: validationRule.message });\r\n isValid = false;\r\n break;\r\n }\r\n }\r\n });\r\n return isValid;\r\n };\r\n\r\n private _validateRegEx = (address: Address, propertyName: string, validationRule: IAddressValidationRule): boolean => {\r\n if (validationRule.regEx && validationRule.regEx.length > 0) {\r\n const regex = new RegExp(validationRule.regEx);\r\n return regex.test(get(address, propertyName) || '');\r\n }\r\n return true;\r\n };\r\n\r\n private _getCountryRegionInfo(countryRegionId: string): CountryRegionInfo | undefined {\r\n return (this.countryRegionsInfo || []).find(countryRegion => {\r\n return ((countryRegion.CountryRegionId || '').toLowerCase() === countryRegionId.toLowerCase());\r\n });\r\n }\r\n\r\n private _getAddressDisplayFormat(countryRegionInfo: CountryRegionInfo): IAddressItem[] {\r\n const addressDisplayItem: IAddressItem[] = [];\r\n\r\n if (countryRegionInfo && countryRegionInfo.AddressFormatLines) {\r\n const nameDisplayItem = this._extendAddressDisplayFormat(AddressItemType.Name, true);\r\n if (nameDisplayItem) {\r\n addressDisplayItem.push(nameDisplayItem);\r\n }\r\n\r\n countryRegionInfo.AddressFormatLines.forEach(formatLine => {\r\n if (formatLine.AddressComponentNameValue) {\r\n const addressItem = this.addressMetaData.getItemFormat(formatLine.AddressComponentNameValue);\r\n if (addressItem) {\r\n addressItem.isNewLine = formatLine.NewLine || false;\r\n addressDisplayItem.push(addressItem);\r\n }\r\n }\r\n });\r\n\r\n const phoneDisplayItem = this._extendAddressDisplayFormat(AddressItemType.Phone, false);\r\n if (phoneDisplayItem) {\r\n addressDisplayItem.push(phoneDisplayItem);\r\n }\r\n }\r\n\r\n return addressDisplayItem;\r\n }\r\n\r\n private _extendAddressDisplayFormat(type: AddressItemType, isNewLine: boolean): IAddressItem | undefined {\r\n const addressItem = this.addressMetaData.getItemFormat(type);\r\n if (addressItem) {\r\n addressItem.isNewLine = isNewLine;\r\n }\r\n return addressItem;\r\n }\r\n\r\n}\r\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport * as React from 'react';\n\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport { IAddressAddItem, IAddressAddUpdateProps } from '../../common/components/address-add';\nimport { IBusinessAccountAddressViewProps } from './business-account-address';\n\nconst AddressAddUpdate: React.FC = ({\n AddressForm,\n heading,\n items,\n hasError,\n error,\n isShowSaveButton,\n saveButton,\n isShowCancelButton,\n cancelButton,\n}) => {\n\n return (\n \n {heading}\n {items && items.map((item: IAddressAddItem) => {\n const { AddressItem, key, label, alert, input } = item;\n return (\n \n {label}\n {hasError && alert}\n {input}\n \n );\n })}\n {hasError &&\n \n {error.title}\n {error.message}\n \n }\n {isShowSaveButton && saveButton}\n {isShowCancelButton && cancelButton}\n \n );\n};\n\nconst BusinessAccountAddressView: React.FC = props => {\n const { BusinessAccountAddress, showAddOrUpdateAddress } = props;\n\n return (\n \n {}\n \n );\n};\n\nexport default BusinessAccountAddressView;\n","/*---------------------------------------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\r\nimport * as React from 'react';\r\n\r\nimport { IAddressAddItem, IAddressAddUpdateProps } from '../../common/components/address-add';\r\nimport { IAddressList, IAddressListItem, IAddressListProps } from '../../common/components/address-list';\r\nimport { IAddressShowItem, IAddressShowProps } from '../../common/components/address-show';\r\nimport { IAccountManagementAddressViewProps } from './smwe-account-management-address';\r\n\r\nconst AddressShow: React.FC = ({\r\n AddressDetail,\r\n items\r\n}) => {\r\n\r\n return (\r\n \r\n {items && items.map((item: IAddressShowItem) => {\r\n return (\r\n <>\r\n {item.description}\r\n \r\n );\r\n })}\r\n \r\n );\r\n};\r\n\r\nconst AddressList: React.FC = ({\r\n List,\r\n isShowList,\r\n heading,\r\n items\r\n}) => {\r\n\r\n if (!isShowList) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n {heading}\r\n {items && items.map((item: IAddressListItem) => {\r\n const { Item, key, error, showItems, isShowPrimaryButton, primaryButton, editButton } = item;\r\n const { Error, isShowError, title, message } = error;\r\n return (\r\n \r\n {isShowError && \r\n {title}\r\n {message}\r\n }\r\n {isShowPrimaryButton && primaryButton}\r\n {editButton}\r\n );\r\n })}\r\n \r\n );\r\n};\r\n\r\nconst AddressLists: React.FC = ({\r\n ListAddress,\r\n heading,\r\n isShowEmptyListMessage,\r\n emptyListMessage,\r\n addButton,\r\n primaryAddressList,\r\n otherAddressList\r\n}) => {\r\n\r\n return (\r\n \r\n {heading}\r\n {isShowEmptyListMessage && emptyListMessage}\r\n {addButton}\r\n \r\n \r\n \r\n );\r\n};\r\n\r\nconst AddressAddUpdate: React.FC = ({\r\n AddressForm,\r\n heading,\r\n items,\r\n hasError,\r\n error,\r\n isShowSaveButton,\r\n saveButton,\r\n isShowCancelButton,\r\n cancelButton,\r\n}) => {\r\n\r\n return (\r\n \r\n {heading}\r\n {items && items.map((item: IAddressAddItem) => {\r\n const { AddressItem, key, label, alert, input } = item;\r\n return (\r\n {label}\r\n {alert}\r\n {input}\r\n );\r\n })}\r\n {hasError && \r\n {error.title}\r\n {error.message}\r\n }\r\n {isShowSaveButton && saveButton}\r\n {isShowCancelButton && cancelButton}\r\n \r\n );\r\n};\r\n\r\nconst AccountManagementAddressView: React.FC = props => {\r\n const { AccountAddressManagement, viewState, showAddressList, showAddOrUpdateAddress } = props;\r\n\r\n return (\r\n \r\n {viewState.isShowAddresList && }\r\n {viewState.isShowAddOrUpdateAddress && }\r\n \r\n );\r\n};\r\n\r\nexport default AccountManagementAddressView;\r\n","import { Heading } from '@msdyn365-commerce-modules/data-types';\r\nimport { Address } from '@msdyn365-commerce/retail-proxy';\r\n\r\nexport enum AddressOperation {\r\n Add = 'Add',\r\n Show = 'Show',\r\n Update = 'Update',\r\n List = 'List'\r\n}\r\n\r\nexport enum AddressType {\r\n Shipping = 'Shipping',\r\n Billing = 'Billing'\r\n}\r\n\r\nexport interface IDropdownDisplayData {\r\n [index: string]: { key?: string; value?: string }[];\r\n}\r\n\r\nexport interface IAddressResponse {\r\n errorTitle?: string;\r\n errorMessage?: string;\r\n customerAddresses?: Address[];\r\n address?: Address;\r\n}\r\n\r\nexport interface IAddressConfig {\r\n heading?: Heading;\r\n primaryAddressSectionHeading?: Heading;\r\n otherAddressSectionHeading?: Heading;\r\n addAddressHeading?: Heading;\r\n editAddressHeading?: Heading;\r\n}\r\n\r\nexport interface IAddressResource {\r\n addressAddButtonText: string;\r\n addressAddButtonAriaLabel: string;\r\n addressPrimaryButtonText: string;\r\n addressPrimaryButtonAriaLabel: string;\r\n addressEditButtonText: string;\r\n addressEditButtonAriaLabel: string;\r\n addressSaveButtonText: string;\r\n addressSaveButtonAriaLabel: string;\r\n addressCancelButtonText: string;\r\n addressCancelButtonAriaLabel: string;\r\n addressStateDefaultSelectionText: string;\r\n addressNameLabel: string;\r\n addressNameRequiredErrorMessage: string;\r\n addressPhoneLabel: string;\r\n addressPhoneRequiredErrorMessage: string;\r\n addressZipCodeLabel: string;\r\n addressZipCodeRequiredErrorMessage: string;\r\n addressCityLabel: string;\r\n addressCityRequiredErrorMessage: string;\r\n addressCountyLabel: string;\r\n addressCountyRequiredErrorMessage: string;\r\n addressStateLabel: string;\r\n addressStateRequiredErrorMessage: string;\r\n addressThreeLetterISORegionNameLabel: string;\r\n addressThreeLetterISORegionNameRequiredErrorMessage: string;\r\n addressStreetRequiredErrorMessage: string;\r\n addressDistrictLabel: string;\r\n addressDistrictRequiredErrorMessage: string;\r\n addressStreetNumberLabel: string;\r\n addressStreetNumberRequiredErrorMessage: string;\r\n addressBuildingComplimentLabel: string;\r\n addressBuildingComplimentRequiredErrorMessage: string;\r\n addressPostboxLabel: string;\r\n addressPostboxRequiredErrorMessage: string;\r\n addressHouseRULabel: string;\r\n addressHouseRURequiredErrorMessage: string;\r\n addressFlatRULabel: string;\r\n addressFlatRURequiredErrorMessage: string;\r\n addressCountryOKSMCodeRULabel: string;\r\n addressCountryOKSMCodeRURequiredErrorMessage: string;\r\n addressErrorMessageTitle: string;\r\n addressGenericErrorMessage: string;\r\n addressEmptyListAddressMessage: string;\r\n}\r\n\r\n// tslint:disable-next-line:no-empty-interface\r\nexport interface IAddressModuleData {}","export enum AddressItemDisplayType {\r\n Input = 'Input',\r\n Dropdown = 'Dropdown'\r\n}\r\n\r\nexport enum AddressValidationRuleType {\r\n Required = 'Required',\r\n Format = 'Format'\r\n}\r\n\r\nexport enum AddressItemType {\r\n Name = 1001,\r\n Phone = 1002,\r\n ZipCode = 1,\r\n City = 2,\r\n County = 3,\r\n State = 4,\r\n ThreeLetterISORegionName = 5,\r\n Street = 6,\r\n District = 7,\r\n StreetNumber = 8,\r\n BuildingCompliment = 9,\r\n Postbox = 10,\r\n House_RU = 21,\r\n Flat_RU = 22,\r\n CountryOKSMCode_RU = 23,\r\n}\r\n\r\nexport interface IAddressItem {\r\n name: string;\r\n type: AddressItemType;\r\n label: string;\r\n maxLength: number;\r\n displayType: AddressItemDisplayType;\r\n validationRules?: IAddressValidationRule[];\r\n isNewLine: boolean;\r\n}\r\nexport interface IAddressValidationRule {\r\n type: AddressValidationRuleType;\r\n regEx: string;\r\n message: string;\r\n}\r\nexport interface IAddressDropdownsData {\r\n [index: string]: { key?: string; value?: string }[];\r\n}\r\n\r\n// tslint:disable-next-line:no-empty-interface\r\nexport interface IAddressFormatData {}","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport { ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\nimport AddressInputComponent from './address-input';\n\nexport interface IAddressBillingCheckbox {\n isChecked: boolean;\n value: string;\n ariaLabel: string;\n text: string;\n telemetryContent?: ITelemetryContent;\n onChange(event: React.ChangeEvent): void;\n}\n\nconst AddressBillingCheckbox: React.FC = ({\n isChecked,\n value,\n ariaLabel,\n text,\n telemetryContent,\n onChange\n}) => {\n\n const additionalAttributes = {\n checked: isChecked,\n 'aria-checked': isChecked,\n };\n\n return (\n \n );\n};\n\nexport default AddressBillingCheckbox;\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport * as React from 'react';\n\nexport interface IAddressBillingHeading {\n text: string;\n}\n\nconst IAddressBillingHeading: React.FC = ({\n text\n}) => (\n {text}
\n );\n\nexport default IAddressBillingHeading;\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport classnames from 'classnames';\nimport { action, computed, observable, reaction, set } from 'mobx';\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\n\nimport { IModuleStateProps, withModuleState } from '@msdyn365-commerce-modules/checkout-utilities';\nimport { getTelemetryObject, IModuleProps, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport {\n Address, AddressPurpose, CountryRegionInfo, StateProvinceInfo\n} from '@msdyn365-commerce/retail-proxy';\n\nimport { IGiftCardExtend } from '@msdyn365-commerce/global-state';\nimport { AutoSuggest } from '../../common/address-autosuggest';\nimport { IAutoSuggestOptions } from '../../common/address-autosuggest.data';\nimport { AddressCommon } from '../../common/address-common';\nimport { AddressFormat } from '../../common/address-format';\nimport { AddressItemType } from '../../common/address-format.data';\nimport { AddressMetaData } from '../../common/address-meta-data';\nimport {\n AddressOperation, AddressType, IAddressResource, IAddressResponse\n} from '../../common/address-module.data';\nimport { AddressAddUpdate, IAddressAddUpdateProps } from '../../common/components/address-add';\nimport AddressBillingCheckoxComponent from '../../common/components/address-billing-checkbox';\nimport AddressBillingHeadingComponent from '../../common/components/address-billing-heading';\nimport { AddressShow, IAddressShowProps } from '../../common/components/address-show';\nimport { ICheckoutBillingAddressData } from './checkout-billing-address.data';\nimport { ICheckoutBillingAddressProps } from './checkout-billing-address.props.autogenerated';\n\nexport interface IProps extends ICheckoutBillingAddressProps, IModuleStateProps { }\n\nexport interface ICheckoutBillingAddressViewState {\n isShowAddress: boolean;\n isShowAddOrUpdateAddress: boolean;\n isShowSameAsShippingCheckbox: boolean;\n}\n\nexport interface ICheckoutBillingAddressViewProps extends IProps {\n className: string;\n currentOperation: AddressOperation;\n selectedAddress?: Address;\n addUpdateAddress: Address;\n countryRegionId: string;\n stateProvinceInfo?: StateProvinceInfo[];\n validationError: object;\n addressActionResponse?: IAddressResponse;\n viewState: ICheckoutBillingAddressViewState;\n CheckoutBillingAddress: IModuleProps;\n sameAsShippingCheckbox: React.ReactNode;\n heading: React.ReactNode;\n showAddress: IAddressShowProps;\n showAddOrUpdateAddress: IAddressAddUpdateProps;\n}\n\n/**\n *\n * CheckoutBillingAddress component\n * @extends {React.PureComponent>}\n */\n// @ts-ignore\n@withModuleState\n@observer\nclass CheckoutBillingAddress extends React.Component {\n\n @observable private currentOperation: AddressOperation;\n @observable private isBillingAddressSameAsShipping: boolean;\n @observable private selectedAddress?: Address;\n @observable private addUpdateAddress: Address;\n @observable private countryRegionId: string = 'USA';\n @observable private stateProvinceInfo?: StateProvinceInfo[];\n @observable private validationError: object;\n @observable private addressActionResponse?: IAddressResponse;\n\n private addressCommon: AddressCommon;\n private addressFormat: AddressFormat;\n private countryRegions: CountryRegionInfo[];\n private addressPurposes: AddressPurpose[];\n private resources: IAddressResource;\n private defaultAddressType: number = 6; // Default to Home\n // private addRenderRef: React.RefObject;\n private telemetryContent?: ITelemetryContent;\n private autoSuggest?: AutoSuggest;\n\n constructor(props: IProps) {\n super(props);\n const { context, data, resources, telemetry } = this.props;\n\n this.addUpdateAddress = {};\n this.validationError = {};\n this.isBillingAddressSameAsShipping = false;\n this.resources = resources;\n this.currentOperation = AddressOperation.List;\n this.addressPurposes = data.addressPurposes.result || [];\n this.countryRegions = data.countryRegions.result || [];\n this.stateProvinceInfo = data.countryStates.result || [];\n this.addressCommon = new AddressCommon(context, resources, telemetry);\n this.addressFormat = new AddressFormat(this.countryRegions, new AddressMetaData({ ...resources }, this._getAddressFormatExcludeList()), this.addressPurposes);\n this.telemetryContent = getTelemetryObject(this.props.context.request.telemetryPageName!, this.props.friendlyName, this.props.telemetry);\n // this.addRenderRef = React.createRef();\n }\n\n public async componentDidMount(): Promise {\n\n const {\n context: {\n telemetry,\n actionContext: {\n requestContext: {\n channel\n }\n }\n },\n config: {\n autoSuggestionEnabled,\n autoSuggestOptions\n }\n } = this.props;\n\n this.props.data.checkout.then(() => {\n this._setDefaultCountryRegionId();\n this._initModuleState();\n });\n\n reaction(\n () => this.countryRegionId,\n () => this._getStateProvinces()\n );\n\n reaction(\n () => this.currentOperation,\n () => {\n this._getStateProvinces();\n }\n );\n\n reaction(\n () => this.props.data.checkout.result && this.props.data.checkout.result.shippingAddress,\n shippingAddress => {\n if (this.props.moduleState.isUpdating) {\n if (shippingAddress && this.isBillingAddressSameAsShipping) {\n this.isBillingAddressSameAsShipping = true;\n this._updateCurrentOperation(AddressOperation.Show, shippingAddress);\n } else if (shippingAddress && this.isBillingAddressSameAsShipping) {\n this._updateCurrentOperation(AddressOperation.Show, shippingAddress);\n }\n }\n }\n );\n\n reaction(\n () => this.isBillingAddressRequried,\n isBillingAddressRequried => {\n if (isBillingAddressRequried) {\n if (this.props.moduleState.isDisabled) {\n this.onEdit();\n }\n } else {\n // tslint:disable-next-line:no-floating-promises\n this.props.data.checkout.result?.removeBillingAddress({});\n this.props.moduleState.onDisable();\n }\n }\n );\n\n if (autoSuggestionEnabled) {\n\n if (channel && !channel.BingMapsApiKey) {\n telemetry.error('BingMapsApiKey is missing.');\n return;\n }\n\n if (channel && !channel.BingMapsEnabled) {\n telemetry.error('Map is disabled from HQ.');\n return;\n }\n\n const options: IAutoSuggestOptions = { ...autoSuggestOptions };\n this.autoSuggest = new AutoSuggest(telemetry, options, channel?.BingMapsApiKey, channel?.ChannelCountryRegionISOCode, channel?.DefaultLanguageId);\n\n // Customer doesn't have any address. Then add view will be loaded directly. Code for the same to handle that\n if(this.props.data.storeSelectorStateManager.result && (this.currentOperation === AddressOperation.Add || this.currentOperation === AddressOperation.Update)) {\n await this.autoSuggest?._loadMapAPI(await this.props.data.storeSelectorStateManager);\n }\n\n reaction(\n () => this.props.data.storeSelectorStateManager.result?.loadMapApi && (this.currentOperation === AddressOperation.Add || this.currentOperation === AddressOperation.Update),\n async () => {\n await this.autoSuggest?._loadMapAPI(await this.props.data.storeSelectorStateManager);\n }\n );\n\n reaction(\n () => this.props.data.storeSelectorStateManager.result?.isMapApiLoaded,\n async () => {\n await this._attachMapAutoSuggest();\n }\n );\n }\n }\n\n public async componentDidUpdate(): Promise {\n if (this.currentOperation === AddressOperation.Add || this.currentOperation === AddressOperation.Update) {\n if (this.props.data.storeSelectorStateManager.result?.isMapApiLoaded) {\n await this._attachMapAutoSuggest();\n }\n } else {\n this.autoSuggest?.disposeAutoSuggest();\n }\n }\n\n public render(): JSX.Element | null {\n if (!(this.isBillingAddressRequried)) {\n return null;\n }\n\n const { resources } = this.props;\n\n const { renderView, config } = this.props;\n\n const viewProps = {\n ...this.props,\n currentOperation: this.currentOperation,\n selectedAddress: this.selectedAddress,\n addUpdateAddress: this.addUpdateAddress,\n countryRegionId: this.countryRegionId,\n stateProvinceInfo: this.stateProvinceInfo,\n validationError: this.validationError,\n addressActionResponse: this.addressActionResponse,\n className: config.className,\n viewState: {\n isShowAddress: this.selectedAddress && this.currentOperation === AddressOperation.Show,\n isShowAddOrUpdateAddress: this.currentOperation !== AddressOperation.Show,\n isShowSameAsShippingCheckbox: this.isCartContainsItemsForShipping && this.props.moduleState.isUpdating\n },\n CheckoutBillingAddress: {\n moduleProps: this.props,\n className: classnames('ms-checkout-billing-address', config.className)\n },\n heading: ,\n // tslint:disable-next-line: max-line-length\n sameAsShippingCheckbox: (\n \n ),\n showAddress: this._renderShowAddress(),\n showAddOrUpdateAddress: this._renderAddOrUpdateAddress()\n };\n\n return renderView(viewProps) as React.ReactElement;\n }\n\n private _renderAddOrUpdateAddress = (): IAddressAddUpdateProps => {\n return AddressAddUpdate(\n {\n resources: this.resources,\n addressType: AddressType.Billing,\n addressFormat: this.addressFormat.getAddressFormat((this.addUpdateAddress.ThreeLetterISORegionName) || this.countryRegionId),\n defaultCountryRegionId: this.countryRegionId,\n defaultAddressType: this.defaultAddressType,\n selectedAddress: this.addUpdateAddress,\n validationError: this.validationError,\n addressActionResponse: this.addressActionResponse,\n dropdownDisplayData: this.addressFormat.getPrefilledAddressDropdownData(this.resources.addressStateDefaultSelectionText, this.stateProvinceInfo),\n telemetryContent: this.telemetryContent,\n onInputChange: this._onAddressAddUpdateInputChange,\n onDropdownChange: this._onAddressAddUpdateDropdownChange,\n hasExternalSubmitGroup: this.props.moduleState.hasExternalSubmitGroup,\n onSave: this._onSubmitAddress,\n onCancel: this._resetView\n }\n );\n }\n\n private _renderShowAddress(): IAddressShowProps | null {\n if (this.selectedAddress) {\n return AddressShow({ address: this.selectedAddress, addressFormat: this.addressFormat.getAddressFormat(this.selectedAddress.ThreeLetterISORegionName || ''), addressPurposes: this.addressPurposes });\n }\n\n return null;\n }\n\n private _onCountryChange = (countryRegionId: string) => {\n this.countryRegionId = countryRegionId;\n const twoLetterISORegionName = this.addressFormat.getTwoLetterISORegionName(countryRegionId);\n set(this.addUpdateAddress, { ['ThreeLetterISORegionName']: countryRegionId });\n set(this.addUpdateAddress, { ['TwoLetterISORegionName']: twoLetterISORegionName });\n this.autoSuggest?.changeAutoSuggestionCountryCode(twoLetterISORegionName);\n this._clearAddressFields();\n }\n\n private _getAddressFormatExcludeList = (): AddressItemType[] => {\n const { config } = this.props;\n const addressFormatExcludeList: AddressItemType[] = [];\n\n if (!config.showAddressType) {\n addressFormatExcludeList.push(AddressItemType.AddressTypeValue);\n }\n\n addressFormatExcludeList.push(AddressItemType.IsPrimary);\n\n return addressFormatExcludeList;\n }\n\n private _attachMapAutoSuggest = async (): Promise => {\n const {\n data: {\n storeSelectorStateManager: { result: storeSelectorStateManager }\n }\n } = this.props;\n\n if (storeSelectorStateManager?.isMapApiLoaded) {\n this.autoSuggest?.attachAutoSuggest('#billing_addressstreet', '#billing_addressstreet_container', this._onSuggestionSelected);\n }\n }\n\n @action\n private _onSuggestionSelected = async (result: Microsoft.Maps.ISuggestionResult): Promise => {\n this._clearAddressFields();\n const address = this.addressFormat.getTranformedAddress(result, this.stateProvinceInfo);\n set(this.addUpdateAddress, { ['Street']: '' });\n set(this.addUpdateAddress, { ['ZipCode']: address.ZipCode });\n set(this.addUpdateAddress, { ['CountyName']: address.CountyName });\n set(this.addUpdateAddress, { ['City']: address.City });\n set(this.addUpdateAddress, { ['State']: address.State });\n set(this.addUpdateAddress, { ['DistrictName']: address.DistrictName });\n set(this.addUpdateAddress, { ['FullAddress']: address.FullAddress });\n // Bing autosuggest put the complete address in the Street input box. Updating the street input box to show only street address.\n setTimeout(() => {\n set(this.addUpdateAddress, { ['Street']: address.Street });\n }, 0);\n\n }\n\n @action\n private _clearAddressFields = (): void => {\n const addressFormatItem = this.addressFormat.getAddressFormat(this.addUpdateAddress.ThreeLetterISORegionName || this.countryRegionId);\n addressFormatItem.forEach(format => {\n if (this.addUpdateAddress[format.name] !== undefined && !this.autoSuggest?.excludedAddressFields.includes(format.name)) {\n this.addressFormat[format.name] = '';\n }\n });\n this._clearValidation();\n }\n\n @action\n private _clearValidation = (): void => {\n this.validationError = {};\n }\n\n private onAddressAddUpdate = (name: string, value: string) => {\n set(this.addUpdateAddress, { [name]: value });\n this.addressFormat.validateAddressFormat(this.addUpdateAddress, this.validationError, this.countryRegionId, name);\n }\n\n private _onAddressAddUpdateInputChange = (event: React.ChangeEvent): void => {\n const value = (event.target.value || '').replace(new RegExp('[<>]', 'gi'), '');\n this.onAddressAddUpdate(event.target.name, value);\n }\n\n private _onAddressAddUpdateDropdownChange = (event: React.ChangeEvent): void => {\n this.onAddressAddUpdate(event.target.name, event.target.value);\n\n if (event.target.name === AddressItemType[AddressItemType.ThreeLetterISORegionName]) {\n this._onCountryChange(event.target.value);\n }\n }\n\n private _getStateProvinces = (): void => {\n if (!this.countryRegionId || !(this.currentOperation === AddressOperation.Add || this.currentOperation === AddressOperation.Update)) {\n return;\n }\n\n // tslint:disable-next-line:no-floating-promises\n this.addressCommon.getStateProvinces(this.countryRegionId).then(\n (result: StateProvinceInfo[]) => {\n const stateInfo = result.some(state => state.StateId === this.addUpdateAddress.State);\n // Reset state if selected state not found in the list.\n if (!stateInfo) {\n set(this.addUpdateAddress, { ['State']: '' });\n }\n this.stateProvinceInfo = result;\n });\n }\n\n private _initModuleState = (): void => {\n this.props.moduleState.init({\n status: this.isBillingAddressRequried ? 'updating' : 'disabled',\n onEdit: this.onEdit,\n onCancel: this.onCancel,\n onSubmit: this.onSubmit\n });\n\n const { billingAddress, isBillingAddressSameAsShippingAddress } = this.props.data.checkout.result || {};\n\n if (this.isBillingAddressRequried) {\n if (billingAddress) {\n this.isBillingAddressSameAsShipping = isBillingAddressSameAsShippingAddress || false;\n this._updateCurrentOperation(AddressOperation.Show, billingAddress);\n this._updateModuleState();\n } else if (this.isCartContainsItemsForShipping) {\n this.isBillingAddressSameAsShipping = true;\n this._updateCurrentOperation(AddressOperation.Show, this.shippingAddress);\n } else {\n this.isBillingAddressSameAsShipping = false;\n this._updateCurrentOperation(AddressOperation.Add);\n }\n }\n }\n\n private _setDefaultCountryRegionId(): void {\n const { request } = this.props.context;\n const market = request && request.channel && request.channel.ChannelCountryRegionISOCode;\n\n this.countryRegionId = this.addressCommon.getDefaultCountryRegionId(this.countryRegionId, this.countryRegions, market);\n }\n\n private _onBillingAddressSameAsShippingChange = (event: React.ChangeEvent) => {\n this.isBillingAddressSameAsShipping = event.currentTarget.checked;\n\n if (this.isBillingAddressSameAsShipping && this.shippingAddress) {\n this._updateCurrentOperation(AddressOperation.Show, this.shippingAddress);\n } else {\n this._updateCurrentOperation(AddressOperation.Add, this.billingAddress);\n }\n }\n\n @computed get isCartContainsItemsForShipping(): boolean {\n const { request } = this.props.context;\n const multiplePickupStoreSwitchName = 'Dynamics.AX.Application.RetailMultiplePickupDeliveryModeFeature';\n const { channelDeliveryOptionConfig, featureState } = this.props.data;\n const retailMultiplePickUpOptionEnabled = featureState?.result?.\n find(feature => feature.Name === multiplePickupStoreSwitchName)?.IsEnabled;\n\n const pickupDeliveryModeCode = request && request.channel && request.channel.PickupDeliveryModeCode;\n const emailDeliveryModeCode = request && request.channel && request.channel.EmailDeliveryModeCode;\n\n // if hasInvoiceLine is true, there are only invoices no items in cart and return false here\n return this.props.data.checkout.result?.checkoutCart.hasInvoiceLine\n ? false\n : retailMultiplePickUpOptionEnabled ?\n ((this.props.data.checkout.result && this.props.data.checkout.result.checkoutCart.cart.CartLines) || []).some(\n cartLine => (cartLine.DeliveryMode && cartLine.DeliveryMode !== '')\n ? (cartLine.DeliveryMode !== channelDeliveryOptionConfig.result?.PickupDeliveryModeCodes?.find(deliveryMode => deliveryMode === cartLine.DeliveryMode) && cartLine.DeliveryMode !== emailDeliveryModeCode)\n : cartLine\n )\n :((this.props.data.checkout.result && this.props.data.checkout.result.checkoutCart.cart.CartLines) || []).some(\n cartLine => (cartLine.DeliveryMode && cartLine.DeliveryMode !== '')\n ? (cartLine.DeliveryMode !== pickupDeliveryModeCode && cartLine.DeliveryMode !== emailDeliveryModeCode)\n : cartLine\n );\n }\n\n @computed get billingAddress(): Address | undefined {\n return this.props.data.checkout.result && this.props.data.checkout.result.billingAddress;\n }\n\n @computed get shippingAddress(): Address | undefined {\n return this.props.data.checkout.result && this.props.data.checkout.result.shippingAddress;\n }\n\n @computed get getLoyaltyAmount(): number {\n const checkoutState = this.props.data.checkout.result;\n return checkoutState && checkoutState.loyaltyAmount ? checkoutState.loyaltyAmount : 0;\n }\n\n @computed get getGiftCardTotalAmount(): number {\n const checkoutState = this.props.data.checkout.result;\n if (!checkoutState || !checkoutState.giftCardExtends) {\n return 0;\n }\n return checkoutState.giftCardExtends.reduce(\n (count: number, giftCard: IGiftCardExtend) => {\n return count + (giftCard.Balance || 0);\n },\n 0);\n }\n\n @computed get shouldPaidByCard(): boolean {\n const {\n data: {\n checkout\n },\n config\n } = this.props;\n if (!checkout.result) {\n return false;\n }\n\n const checkoutResult = checkout.result;\n const cart = checkoutResult.checkoutCart.cart;\n if (!cart || !cart.CartLines || !cart.CartLines.length) {\n return false;\n }\n\n const { paymentTenderType, tokenizedPaymentCard } = checkoutResult;\n const isPaidByOtherPaymentSource = config.paymenTenderType !== paymentTenderType && tokenizedPaymentCard;\n\n // Use payment card when it is not free or gift card balance + Loyalty amount can not cover the total amount\n const amountDue = (cart.TotalAmount || 0) - this.getGiftCardTotalAmount - this.getLoyaltyAmount;\n\n return amountDue > 0 && !isPaidByOtherPaymentSource;\n }\n\n @computed get isBillingAddressRequried(): boolean {\n return this.shouldPaidByCard;\n }\n\n private _onSubmitAddress = (): void => {\n if (!this.addressFormat.validateAddressFormat(this.addUpdateAddress, this.validationError, this.countryRegionId)) {\n this.props.moduleState.setHasError(true);\n return;\n }\n\n this._setBillingAddress(this.addUpdateAddress);\n this._updateCurrentOperation(AddressOperation.Show, this.addUpdateAddress);\n this._updateModuleState();\n };\n\n private onSubmit = (): void => {\n switch (this.currentOperation) {\n case AddressOperation.Add:\n case AddressOperation.Update:\n this._onSubmitAddress();\n break;\n case AddressOperation.Show:\n if (this.selectedAddress) {\n this._setBillingAddress(this.selectedAddress);\n this._updateCurrentOperation(AddressOperation.Show, this.selectedAddress);\n this._updateModuleState();\n }\n break;\n default:\n this.props.telemetry.error('Invalid operation');\n }\n };\n\n private onCancel = (): void => {\n switch (this.currentOperation) {\n case AddressOperation.Add:\n case AddressOperation.Update:\n this._resetView();\n this._clearAddressFields();\n break;\n case AddressOperation.Show:\n // @ts-ignore: Compiler not reconizing property form extending class\n this._resetView();\n break;\n default:\n this.props.telemetry.error('Invalid operation');\n }\n };\n\n private onEdit = (): void => {\n if (this.isBillingAddressSameAsShipping && this.shippingAddress && this.isCartContainsItemsForShipping) {\n this._updateCurrentOperation(AddressOperation.Show, this.shippingAddress);\n } else {\n this._updateCurrentOperation(AddressOperation.Add, this.billingAddress);\n }\n this.props.moduleState.onUpdating();\n }\n\n private _setBillingAddress = (address: Address): void => {\n if (this.props.data.checkout.result) {\n const newBillingAddress = { ...address };\n\n if (address.ThreeLetterISORegionName && !newBillingAddress.TwoLetterISORegionName) {\n newBillingAddress.TwoLetterISORegionName = this.addressFormat.getTwoLetterISORegionName(address.ThreeLetterISORegionName);\n }\n\n // tslint:disable-next-line:no-floating-promises\n this.props.data.checkout.result.updateBillingAddress({ newBillingAddress, additionalProperties: { isBillingAddressSameAsShippingAddress: this.isBillingAddressSameAsShipping } });\n }\n }\n\n private _resetView = () => {\n this._updateCurrentOperation(AddressOperation.Show, this.billingAddress);\n this._updateModuleState();\n }\n\n private _updateCurrentOperation = (operation: AddressOperation, selectedAddress?: Address) => {\n this.currentOperation = operation;\n this.selectedAddress = selectedAddress;\n\n if (this.currentOperation === AddressOperation.Add || this.currentOperation === AddressOperation.Update) {\n this.addUpdateAddress = { ...this.selectedAddress } || {};\n set(this.addUpdateAddress, { ['ThreeLetterISORegionName']: this.addUpdateAddress.ThreeLetterISORegionName || this.countryRegionId });\n set(this.addUpdateAddress, { ['AddressTypeValue']: this.addUpdateAddress.AddressTypeValue || this.defaultAddressType });\n }\n }\n\n private _updateModuleState = () => {\n if (this.currentOperation === AddressOperation.Show) {\n this.props.moduleState.onReady();\n } else {\n this.props.moduleState.onUpdating();\n }\n }\n}\n\nexport default CheckoutBillingAddress;","/*---------------------------------------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport * as React from 'react';\r\n\r\nexport interface IAddressButton {\r\n className: string;\r\n text: string;\r\n ariaLabel: string;\r\n disabled?: boolean;\r\n onClick(event: React.MouseEvent): void;\r\n}\r\n\r\nconst AddressButton: React.FC = ({ className, text, ariaLabel, disabled, onClick }) => (\r\n \r\n {text}\r\n \r\n);\r\n\r\nexport default AddressButton;\r\n","/*---------------------------------------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport * as React from 'react';\r\nimport { createAddressWarning } from './address-warning';\r\n\r\nexport interface IAdressInput {\r\n id?: string;\r\n name?: string;\r\n className: string;\r\n type: string;\r\n value: string;\r\n maxLength?: number;\r\n additionalAddributes?: object;\r\n placeholder?: string;\r\n onChange(event: React.ChangeEvent): void;\r\n hasWarning?(name: string, value: string): string | void;\r\n}\r\n\r\ninterface IAdressState {\r\n warningMessage: string;\r\n}\r\n\r\n/**\r\n * Class definition for an input field within a shipping address form\r\n */\r\nexport class AddressInputComponent extends React.Component {\r\n constructor (props: IAdressInput) {\r\n super(props);\r\n this._onInputBlur = this._onInputBlur.bind(this);\r\n this.state = {warningMessage: ''};\r\n }\r\n\r\n public render (): JSX.Element {\r\n const {\r\n id,\r\n name,\r\n className,\r\n type,\r\n value,\r\n maxLength,\r\n additionalAddributes,\r\n placeholder,\r\n onChange,\r\n } = this.props;\r\n return (\r\n \r\n {this.state.warningMessage && createAddressWarning(this.state.warningMessage)}\r\n \r\n \r\n );\r\n }\r\n\r\n private _onInputBlur (el: React.ChangeEvent): void {\r\n const hasWarning = this.props.hasWarning && this.props.hasWarning(this.props.name || '', el.target.value);\r\n if (hasWarning) {\r\n this.setState({warningMessage: hasWarning});\r\n } else {\r\n this.setState({warningMessage: ''});\r\n }\r\n }\r\n}","/*---------------------------------------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport * as React from 'react';\r\n\r\nexport interface IAddressWarning {\r\n message?: string;\r\n}\r\n\r\nexport const createAddressWarning = (message?: string) => {\r\n return (\r\n \r\n {message || ''}\r\n \r\n );\r\n};\r\n","/*---------------------------------------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport * as React from 'react';\r\n\r\nexport interface IAdressErrorMessage {\r\n message: string;\r\n}\r\n\r\nconst AdressErrorMessage: React.FC = ({ message }) => (\r\n \r\n {message}\r\n
\r\n);\r\n\r\nexport default AdressErrorMessage;\r\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport { get, set } from 'mobx';\n\nimport {\n Address, AddressPurpose, CountryRegionInfo, StateProvinceInfo\n} from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\n\nimport {\n AddressItemType, IAddressDropdownsData, IAddressItem, IAddressValidationRule\n} from './address-format.data';\nimport { AddressMetaData } from './address-meta-data';\n\n/**\n *\n * Retail Service Address format parser\n */\nexport class AddressFormat {\n private countryRegionsInfo?: CountryRegionInfo[];\n private addressPurposes?: AddressPurpose[];\n private addressMetaData: AddressMetaData;\n\n constructor(countryRegionsInfo: CountryRegionInfo[], addressMetaData: AddressMetaData, addressPurposes: AddressPurpose[]) {\n this.countryRegionsInfo = countryRegionsInfo;\n this.addressMetaData = addressMetaData;\n this.addressPurposes = addressPurposes;\n }\n\n public getAddressFormat(countryRegionId: string): IAddressItem[] {\n const countryRegionInfo = this._getCountryRegionInfo(countryRegionId);\n if (countryRegionInfo) {\n return this._getAddressDisplayFormat(countryRegionInfo);\n }\n return [];\n }\n\n public getCountryFormat(): { key?: string; value?: string }[] {\n return (this.countryRegionsInfo || []).map(countryRegion => {\n return {\n key: countryRegion.CountryRegionId,\n value: countryRegion.ShortName\n };\n });\n }\n\n public getStateFormat(stateProvinceInfo?: StateProvinceInfo[]): { key?: string; value?: string }[] {\n return (stateProvinceInfo || []).map(state => {\n return {\n key: state.StateId,\n value: state.StateName\n };\n });\n }\n\n public getAddressTypeFormat(): { key?: number; value?: string }[] {\n return (this.addressPurposes || []).map(addressPurpose => {\n return {\n key: addressPurpose.AddressType,\n value: addressPurpose.Name\n };\n });\n }\n\n public getPrefilledAddressDropdownData = (stateDefaultSelectionText: string, stateProvinceInfo?: StateProvinceInfo[]): IAddressDropdownsData => {\n const defaultStateText = {\n key: '',\n value: stateDefaultSelectionText\n };\n const dropdownData: IAddressDropdownsData = {};\n\n dropdownData[AddressItemType[AddressItemType.ThreeLetterISORegionName]] = this.getCountryFormat();\n dropdownData[AddressItemType[AddressItemType.State]] = this.getStateFormat(stateProvinceInfo);\n dropdownData[AddressItemType[AddressItemType.State]].unshift(defaultStateText);\n dropdownData[AddressItemType[AddressItemType.AddressTypeValue]] = this.getAddressTypeFormat();\n\n return dropdownData;\n }\n\n public getTwoLetterISORegionName = (countryRegionId: string): string | undefined => {\n const countryRegionInfo = this._getCountryRegionInfo(countryRegionId);\n\n return countryRegionInfo!.ISOCode;\n }\n\n public validateAddressFormat = (address: Address, validationError: Address, countryRegionId: string, propertyName?: string): boolean => {\n let isValid: boolean = true;\n let validationtor;\n const addressFormat = this.getAddressFormat((address.ThreeLetterISORegionName) || countryRegionId);\n\n addressFormat.forEach(addressFormatItem => {\n if (!propertyName || (propertyName && addressFormatItem.name === propertyName)) {\n validationtor = this._inputValidation(addressFormatItem, validationError, address);\n if (validationtor !== undefined) {\n isValid = validationtor;\n }\n }\n });\n\n return isValid;\n }\n\n public getTranformedAddress = (result: Microsoft.Maps.ISuggestionResult, stateProvinceInfo?: StateProvinceInfo[]): Address => {\n const address: Address = {};\n\n // Zip Code\n if (result.address.postalCode !== undefined) {\n address.ZipCode = result.address.postalCode;\n } else {\n address.ZipCode = '';\n }\n\n // State\n if (stateProvinceInfo) {\n const selectedState = stateProvinceInfo.find(state => state.StateName === result.address.adminDistrict);\n if (!selectedState) {\n address.State = '';\n address.StateName = result.address.adminDistrict;\n } else {\n address.State = selectedState.StateId;\n address.StateName = selectedState.StateName;\n }\n }\n\n // Street\n if(result.address.addressLine !== undefined) {\n address.Street = result.address.addressLine;\n } else {\n address.Street = ' ';\n }\n\n // City\n if(result.address.locality !== undefined) {\n address.City = result.address.locality;\n } else {\n address.City = '';\n }\n\n // District\n if(result.address.district !== undefined) {\n address.DistrictName = result.address.district;\n address.CountyName = result.address.district;\n } else {\n address.DistrictName = '';\n }\n\n // formatted Address\n address.FullAddress = result.address.formattedAddress;\n\n return address;\n }\n\n private _inputValidation(addressFormatItem: IAddressItem, validationError: Address, address: Address): boolean | undefined {\n set(validationError, { [addressFormatItem.name]: null });\n for (const validationRule of (addressFormatItem.validationRules || [])) {\n if (!this._validateRegEx(address, addressFormatItem.name, validationRule)) {\n set(validationError, { [addressFormatItem.name]: validationRule.message });\n return false;\n }\n }\n return undefined;\n }\n private _validateRegEx = (address: Address, propertyName: string, validationRule: IAddressValidationRule): boolean => {\n if (validationRule.regEx && validationRule.regEx.length > 0) {\n const regex = new RegExp(validationRule.regEx);\n return regex.test(get(address, propertyName) || '');\n }\n return true;\n }\n\n private _getCountryRegionInfo(countryRegionId: string): CountryRegionInfo | undefined {\n return (this.countryRegionsInfo || []).find(countryRegion => {\n return ((countryRegion.CountryRegionId || '').toLowerCase() === countryRegionId.toLowerCase());\n });\n }\n\n private _getAddressDisplayFormat(countryRegionInfo: CountryRegionInfo): IAddressItem[] {\n const addressDisplayItem: IAddressItem[] = [];\n\n if (countryRegionInfo && countryRegionInfo.AddressFormatLines) {\n const AddressTypeItem = this._extendAddressDisplayFormat(AddressItemType.AddressTypeValue, true);\n if (AddressTypeItem) {\n addressDisplayItem.push(AddressTypeItem);\n }\n\n const nameDisplayItem = this._extendAddressDisplayFormat(AddressItemType.Name, true);\n if (nameDisplayItem) {\n addressDisplayItem.push(nameDisplayItem);\n }\n\n countryRegionInfo.AddressFormatLines.forEach(formatLine => {\n if (formatLine.AddressComponentNameValue) {\n const addressItem = this.addressMetaData.getItemFormat(formatLine.AddressComponentNameValue);\n if (addressItem) {\n addressItem.isNewLine = formatLine.NewLine || false;\n addressDisplayItem.push(addressItem);\n }\n }\n });\n\n const phoneDisplayItem = this._extendAddressDisplayFormat(AddressItemType.Phone, false);\n if (phoneDisplayItem) {\n addressDisplayItem.push(phoneDisplayItem);\n }\n\n const isPrimaryDisplayItem = this._extendAddressDisplayFormat(AddressItemType.IsPrimary, false);\n if (isPrimaryDisplayItem) {\n addressDisplayItem.push(isPrimaryDisplayItem);\n }\n }\n\n return addressDisplayItem;\n }\n\n private _extendAddressDisplayFormat(type: AddressItemType, isNewLine: boolean): IAddressItem | undefined {\n const addressItem = this.addressMetaData.getItemFormat(type);\n if (addressItem) {\n addressItem.isNewLine = isNewLine;\n }\n return addressItem;\n }\n}\n","import {\n addAddress, AddressManagementInput, updateAddress, updatePrimaryAddress\n} from '@msdyn365-commerce-modules/retail-actions';\nimport { IActionInput, ICoreContext, IObservableAction, ITelemetry } from '@msdyn365-commerce/core';\nimport {\n Address, CountryRegionInfo, StateProvinceInfo\n} from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\n\nimport { getStateProvinceAction, GetStateProvincesInput } from '../actions/get-state-provinces';\nimport { IAddressResource, IAddressResponse } from './address-module.data';\n\n/**\n *\n * Address common\n */\nexport class AddressCommon {\n\n private context: ICoreContext;\n private resources: IAddressResource;\n private telemetry: ITelemetry;\n\n constructor(context: ICoreContext, resources: IAddressResource, telemetry: ITelemetry) {\n this.context = context;\n this.resources = resources;\n this.telemetry = telemetry;\n }\n\n public getDefaultCountryRegionId = (countryRegionId: string, countryRegions: CountryRegionInfo[], market?: string): string => {\n const marketISOCode = market || 'US';\n const currentCountryRegion = countryRegions.find(countryRegion => (countryRegion.ISOCode || '') === marketISOCode);\n return (currentCountryRegion && currentCountryRegion.CountryRegionId) || countryRegionId;\n }\n\n public parseRetailException = (resources: IAddressResource): IAddressResponse => {\n return {\n errorTitle: resources.addressErrorMessageTitle,\n errorMessage: resources.addressGenericErrorMessage\n };\n }\n\n public isAuthenticatedFlow = (): boolean => {\n return this.context.request.user.isAuthenticated;\n }\n\n public getStateProvinces = async (countryRegionId: string): Promise => {\n let response: StateProvinceInfo[] = [];\n if (this.context && this.context.actionContext) {\n try {\n const input = new GetStateProvincesInput(countryRegionId, this.context.request.apiSettings);\n response = await getStateProvinceAction(input, this.context.actionContext);\n } catch (error) {\n if (this.telemetry) {\n this.telemetry.error(`Error encountered ${error}`);\n this.telemetry.debug('Unable to get state provinces');\n }\n }\n }\n return Promise.resolve(response);\n }\n\n // For any address, check for common requried field else treat it as invalid\\empty address.\n public isEmpty = (address: Address): boolean => {\n if (address && address.ThreeLetterISORegionName && address.State && address.City) {\n return false;\n }\n\n return true;\n };\n\n public addCustomerAddress = (address: Address): Promise => {\n return this.submitCustomerAddress(addAddress, address);\n };\n\n public updateCustomerAddress = (address: Address): Promise => {\n return this.submitCustomerAddress(updateAddress, address);\n };\n\n public updateCustomerPrimaryAddress = (address: Address): Promise => {\n return this.submitCustomerAddress(updatePrimaryAddress, address);\n };\n\n private submitCustomerAddress = (addressAction: IObservableAction, address: Address): Promise => {\n address.AddressTypeValue = address.AddressTypeValue || 7; // 7 sets it to HOME by default\n\n const input = new AddressManagementInput(address);\n return this.execAddressAction(addressAction, input, address);\n };\n\n private execAddressAction = async (addressAction: IObservableAction, input: IActionInput | IActionInput[], address: Address): Promise => {\n let response: IAddressResponse = {};\n\n if (this.context && this.context.actionContext) {\n try {\n const addresses = await addressAction(input, this.context.actionContext);\n if (addresses.length > 0) {\n response.address = address.RecordId ? address : addresses[addresses.length - 1];\n } else {\n response.address = address;\n }\n response.customerAddresses = addresses;\n } catch (error) {\n if (this.telemetry) {\n this.telemetry.error(`Error encountered ${error}`);\n this.telemetry.debug('Unable to exec address action');\n }\n response = this.parseRetailException(this.resources);\n }\n }\n return Promise.resolve(response);\n };\n}\n","/*---------------------------------------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport * as React from 'react';\r\n\r\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\r\n\r\nimport { IAddressAddItem, IAddressAddUpdateProps } from '../../common/components/address-add';\r\nimport { IAddressSelectItem, IAddressSelectProps } from '../../common/components/address-select';\r\nimport { IAddressShowItem, IAddressShowProps } from '../../common/components/address-show';\r\nimport { ICheckoutShippingAddressViewProps } from './smwe-checkout-shipping-address';\r\n\r\nconst AddressShow: React.FC = ({\r\n AddressDetail,\r\n items\r\n}) => {\r\n\r\n return (\r\n \r\n {items && items.map((item: IAddressShowItem) => {\r\n return (\r\n <>\r\n {item.description}\r\n \r\n );\r\n })}\r\n \r\n );\r\n};\r\n\r\nconst AddressSelect: React.FC = ({\r\n SelectAddress,\r\n addButton,\r\n items,\r\n isShowSaveButton,\r\n saveButton,\r\n isShowCancelButton,\r\n cancelButton,\r\n}) => {\r\n\r\n return (\r\n \r\n {addButton}\r\n {items && items.map((item: IAddressSelectItem) => {\r\n const SelectItem = item.SelectItem;\r\n return (\r\n {item.input}\r\n \r\n );\r\n })}\r\n {isShowSaveButton && saveButton}\r\n {isShowCancelButton && cancelButton}\r\n \r\n );\r\n};\r\n\r\nconst AddressAddUpdate: React.FC = ({\r\n AddressForm,\r\n heading,\r\n items,\r\n hasError,\r\n error,\r\n isShowSaveButton,\r\n saveButton,\r\n isShowCancelButton,\r\n cancelButton,\r\n}) => {\r\n\r\n return (\r\n \r\n {heading}\r\n {items && items.map((item: IAddressAddItem) => {\r\n const { AddressItem, key, label, alert, input } = item;\r\n return (\r\n {label}\r\n {alert}\r\n {input}\r\n );\r\n })}\r\n {hasError && \r\n {error.title}\r\n {error.message}\r\n }\r\n {isShowSaveButton && saveButton}\r\n {isShowCancelButton && cancelButton}\r\n \r\n );\r\n};\r\n\r\nconst CheckoutShippingAddressView: React.FC = props => {\r\n const { CheckoutShippingAddress, viewState, showAddress, showAddressSelect, showAddOrUpdateAddress } = props;\r\n return (\r\n \r\n {viewState.isShowAddress && }\r\n {viewState.isShowAddresList && }\r\n {viewState.isShowAddOrUpdateAddress && }\r\n \r\n );\r\n};\r\n\r\nexport default CheckoutShippingAddressView;\r\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport * as React from 'react';\n\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\n\nimport { IAddressAddItem, IAddressAddUpdateProps } from '../../common/components/address-add';\nimport { IAddressShowItem, IAddressShowProps } from '../../common/components/address-show';\nimport { ICheckoutBillingAddressViewProps } from './checkout-billing-address';\n\nconst AddressShow: React.FC = ({\n AddressDetail,\n items\n}) => {\n\n return (\n \n {items && items.map((item: IAddressShowItem) => {\n return (\n <>\n {item.description}\n \n );\n })}\n \n );\n};\n\nconst AddressAddUpdate: React.FC = ({\n AddressForm,\n heading,\n items,\n hasError,\n error,\n isShowSaveButton,\n saveButton,\n isShowCancelButton,\n cancelButton,\n}) => {\n\n return (\n \n {heading}\n {items && items.map((item: IAddressAddItem) => {\n const { AddressItem, key, label, alert, input } = item;\n return (\n {label}\n {alert}\n {input}\n );\n })}\n {hasError && \n {error.title}\n {error.message}\n }\n {isShowSaveButton && saveButton}\n {isShowCancelButton && cancelButton}\n \n );\n};\n\nconst CheckoutBillingAddressView: React.FC = props => {\n const { CheckoutBillingAddress, viewState, heading, sameAsShippingCheckbox, showAddress, showAddOrUpdateAddress } = props;\n\n return (\n \n {heading}\n {viewState.isShowSameAsShippingCheckbox && sameAsShippingCheckbox}\n {viewState.isShowAddress && }\n {viewState.isShowAddOrUpdateAddress && }\n \n );\n};\n\nexport default CheckoutBillingAddressView;\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport * as React from 'react';\n\nexport interface IAdressAlert {\n message?: string;\n}\n\nconst AdressAlert: React.FC = ({ message }) => (\n \n {\n message &&\n <>\n {message}\n \n }\n \n);\n\nexport default AdressAlert;\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport { getPayloadObject, getTelemetryAttributes, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nexport interface IAdressCheckbox {\n id?: string;\n name?: string;\n className: string;\n type: string;\n isChecked: boolean;\n autoFocus?: boolean;\n additionalAddributes?: object;\n telemetryContent?: ITelemetryContent;\n onChange(event: React.ChangeEvent): void;\n}\n\nconst AdressCheckbox: React.FC = ({\n id,\n name,\n className,\n type,\n isChecked,\n additionalAddributes,\n telemetryContent,\n autoFocus,\n onChange\n}) => {\n const payLoad = getPayloadObject('click', telemetryContent!, name!);\n const attributes = getTelemetryAttributes(telemetryContent!, payLoad);\n return (\n \n );\n};\n\nexport default AdressCheckbox;\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport * as React from 'react';\n\nexport interface IAdressDropdown {\n id: string;\n name: string;\n className: string;\n value: string | number;\n additionalAddributes?: object;\n displayData: { key?: string | number; value?: string }[];\n onChange(event: React.ChangeEvent): void;\n}\n\nconst getDropdownItem = (key?: string | number, value?: string , selectedValue?: string | number): React.ReactNode => {\n let isSelected: boolean;\n if (typeof (key) === 'number') {\n isSelected = key === selectedValue;\n } else {\n isSelected = typeof(selectedValue)==='string' && (key || '').toLowerCase() === (selectedValue || '').toLowerCase();\n }\n\n return (\n \n );\n};\n\nconst AdressDropdown: React.FC = ({\n id,\n name,\n className,\n value,\n additionalAddributes,\n displayData,\n onChange\n}) => (\n \n {displayData && displayData.map(item =>\n (\n getDropdownItem(item.key, item.value, value)\n ))\n }\n \n );\n\nexport default AdressDropdown;\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport * as React from 'react';\n\nexport interface IAdressLabel {\n id: string;\n text: string;\n}\n\nconst AdressLabel: React.FC = ({\n id,\n text\n}) => (\n \n );\n\nexport default AdressLabel;\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport classname from 'classnames';\nimport { get } from 'mobx';\nimport * as React from 'react';\n\nimport { Heading as HeadingData } from '@msdyn365-commerce-modules/data-types';\nimport { Heading, INodeProps, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport { Address } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\n\nimport { AddressType, IAddressResource, IAddressResponse } from '../../common/address-module.data';\nimport {\n AddressItemDisplayType, AddressItemType, AddressValidationRuleType, IAddressDropdownsData,\n IAddressItem, IAddressValidationRule\n} from '../address-format.data';\nimport AddressAlertComponent from './address-alert';\nimport AddressButtonComponent from './address-button';\nimport AdressCheckboxComponent from './address-checkbox';\nimport AdressDropdownComponent from './address-dropdown';\nimport AddressErrorMessageComponent from './address-error-message';\nimport AddressErrorTitleComponent from './address-error-title';\nimport AddressInputComponent from './address-input';\nimport AddressLabelComponent from './address-label';\n\nexport interface IAddressAddInputProps {\n isUpdating?: boolean;\n hasError?: boolean;\n hasExternalSubmitGroup?: boolean;\n addressType: AddressType;\n addressFormat: IAddressItem[];\n defaultCountryRegionId: string;\n defaultAddressType: number;\n selectedAddress?: Address;\n dropdownDisplayData: IAddressDropdownsData;\n resources: IAddressResource;\n addressActionResponse?: IAddressResponse;\n addAddressHeading?: HeadingData;\n editAddressHeading?: HeadingData;\n validationError?: object;\n telemetryContent?: ITelemetryContent;\n onInputChange(event: React.ChangeEvent): void;\n onDropdownChange(event: React.ChangeEvent): void;\n onSave?(): void;\n onCancel?(): void;\n}\n\nexport interface IAddressError {\n AddressError: INodeProps;\n title: React.ReactNode;\n message: React.ReactNode;\n}\n\nexport interface IAddressAddItem {\n key: string;\n AddressItem: INodeProps;\n label: React.ReactNode;\n alert: React.ReactNode;\n input: React.ReactNode;\n}\n\nexport interface IAddressAddUpdateProps {\n AddressForm: INodeProps;\n heading: React.ReactNode;\n items: IAddressAddItem[];\n hasError: boolean;\n error: IAddressError;\n isShowSaveButton: boolean;\n saveButton: React.ReactNode;\n isShowCancelButton: boolean;\n cancelButton: React.ReactNode;\n}\n\nconst getRequriedAttribute = (validationRules?: IAddressValidationRule[]): object => {\n const requriedRule = (validationRules || []).find(validationRule => {\n return validationRule.type === AddressValidationRuleType.Required;\n });\n\n return requriedRule ? { 'aria-required': true } : {};\n};\n\nconst getAddessItems = (selectedAddress: Address, props: IAddressAddInputProps): IAddressAddItem[] => {\n const { addressFormat, addressType, dropdownDisplayData, defaultCountryRegionId, defaultAddressType, validationError = {}, onInputChange, onDropdownChange } = props;\n\n // @ts-ignore\n return addressFormat.map((addressFormatItem, index) => {\n const elementId = `${addressType.toLowerCase()}_address${addressFormatItem.name.toLowerCase()}`;\n const errorMessage = get(validationError, addressFormatItem.name);\n const className = classname('msc-address-form__item', `msc-address-form__item-${addressFormatItem.name.toLowerCase()}`, { 'msc-address-form__item-newline': addressFormatItem.isNewLine, 'address-form__item-invalid': errorMessage });\n let input;\n\n if (addressFormatItem.displayType === AddressItemDisplayType.Input) {\n input = (\n \n );\n } else if (addressFormatItem.displayType === AddressItemDisplayType.Checkbox) {\n input = (\n \n );\n } else {\n const displayData = dropdownDisplayData[addressFormatItem.name];\n let selectedValue = selectedAddress[addressFormatItem.name];\n\n if (addressFormatItem.type === AddressItemType.ThreeLetterISORegionName) {\n selectedValue = selectedValue || defaultCountryRegionId;\n }\n\n if (addressFormatItem.type === AddressItemType.AddressTypeValue) {\n selectedValue = selectedValue || defaultAddressType;\n }\n\n input = (\n \n );\n }\n\n return {\n key: addressFormatItem.name,\n AddressItem: { className: className, id: `${elementId}_container` },\n label: ,\n alert: ,\n input: input\n };\n });\n};\n\nexport const AddressAddUpdate = (props: IAddressAddInputProps): IAddressAddUpdateProps => {\n const { editAddressHeading, addAddressHeading, selectedAddress = {}, resources, hasError, onCancel, onSave, hasExternalSubmitGroup, isUpdating, addressActionResponse, telemetryContent } = props;\n const heading = selectedAddress.RecordId ? editAddressHeading : addAddressHeading;\n\n return {\n AddressForm: { className: 'msc-address-form' },\n heading: heading && ,\n items: getAddessItems(selectedAddress, props),\n isShowSaveButton: !hasExternalSubmitGroup,\n saveButton: onSave && (\n \n ),\n isShowCancelButton: !hasExternalSubmitGroup,\n cancelButton: onCancel && (\n \n ),\n hasError: hasError || false,\n error: {\n AddressError: { className: 'msc-address-form__error' },\n title: addressActionResponse && addressActionResponse.errorTitle && ,\n message: addressActionResponse && addressActionResponse.errorMessage && \n }\n };\n};","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport * as React from 'react';\n\nexport interface IAdressErrorMessage {\n message: string;\n}\n\nconst AdressErrorMessage: React.FC = ({ message }) => (\n \n {message}\n
\n);\n\nexport default AdressErrorMessage;\n","import {\r\n AddressItemDisplayType, AddressItemType, AddressValidationRuleType, IAddressItem,\r\n IAddressValidationRule\r\n} from './address-format.data';\r\nimport { IAddressResource } from './address-module.data';\r\n\r\n/**\r\n * Address meta data\r\n */\r\nexport class AddressMetaData {\r\n\r\n private metaData: IAddressItem[] = [];\r\n private resources: IAddressResource;\r\n private requiredFieldRegEx: string = '\\\\S';\r\n\r\n private phoneValidation: string = '^\\\\(?([0-9]{3})\\\\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$';\r\n private zipcodeValidation: string = '(^[0-9]{5}$)|(^[0-9]{5}-[0-9]{4}$)';\r\n private resourcesPrefix: string = 'address';\r\n private maxLength: number = 64;\r\n private requiredFields: AddressItemType[];\r\n\r\n constructor(resources: IAddressResource) {\r\n this.resources = resources || {};\r\n this.requiredFields = [AddressItemType.Name, AddressItemType.ZipCode, AddressItemType.City, AddressItemType.State, AddressItemType.ThreeLetterISORegionName, AddressItemType.Street, AddressItemType.Phone];\r\n this._init();\r\n }\r\n\r\n public getItemFormat(id: number): IAddressItem | undefined {\r\n return this.metaData.find((item) => {\r\n return item.type === id;\r\n });\r\n }\r\n\r\n private _init(): void {\r\n this._addItem(AddressItemType.Name, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.Phone, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.ZipCode, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.City, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.County, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.State, AddressItemDisplayType.Dropdown);\r\n this._addItem(AddressItemType.ThreeLetterISORegionName, AddressItemDisplayType.Dropdown);\r\n this._addItem(AddressItemType.Street, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.District, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.StreetNumber, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.BuildingCompliment, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.Postbox, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.House_RU, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.Flat_RU, AddressItemDisplayType.Input);\r\n this._addItem(AddressItemType.CountryOKSMCode_RU, AddressItemDisplayType.Input);\r\n }\r\n\r\n private _addItem(type: AddressItemType, displayType: AddressItemDisplayType): void {\r\n const nameKey = AddressItemType[type].replace('_', '');\r\n const item: IAddressItem = {\r\n type,\r\n displayType,\r\n name: AddressItemType[type],\r\n label: this.resources[`${this.resourcesPrefix}${nameKey}Label`],\r\n maxLength: this.maxLength,\r\n validationRules: this._validationRules(type, nameKey),\r\n isNewLine: true\r\n };\r\n\r\n this.metaData.push(item);\r\n }\r\n\r\n private _validationRules(type: AddressItemType, name: string): IAddressValidationRule[] {\r\n const validationRules: IAddressValidationRule[] = [];\r\n\r\n if (type === AddressItemType.Phone) {\r\n validationRules.push(\r\n this._validationRule(AddressValidationRuleType.Required, this.phoneValidation, 'Phone # is invalid')\r\n );\r\n }\r\n\r\n if (type === AddressItemType.ZipCode) {\r\n validationRules.push(\r\n this._validationRule(AddressValidationRuleType.Required, this.zipcodeValidation, 'Invalid Zip Code')\r\n );\r\n }\r\n\r\n for (const ruleType of Object.keys(AddressValidationRuleType)) {\r\n const key = `${this.resourcesPrefix}${name}${ruleType}`;\r\n const message = this.resources[`${key}ErrorMessage`];\r\n switch (ruleType) {\r\n case AddressValidationRuleType.Required: {\r\n if (this.requiredFields.find((itemType: AddressItemType) => itemType === type)) {\r\n validationRules.push(this._validationRule(ruleType, this.requiredFieldRegEx, message));\r\n }\r\n break;\r\n }\r\n default:\r\n }\r\n }\r\n return validationRules;\r\n }\r\n\r\n private _validationRule(type: AddressValidationRuleType, regEx: string, message: string): IAddressValidationRule {\r\n return {\r\n type,\r\n regEx,\r\n message\r\n };\r\n }\r\n\r\n}\r\n","/*---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport { getPayloadObject, getTelemetryAttributes, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nexport interface IAdressInput {\n id?: string;\n name?: string;\n className: string;\n type: string;\n value: string;\n maxLength?: number;\n autoFocus?: boolean;\n additionalAddributes?: object;\n telemetryContent?: ITelemetryContent;\n onChange(event: React.ChangeEvent): void;\n}\n\nconst AdressInput: React.FC = ({\n id,\n name,\n className,\n type,\n value,\n maxLength,\n additionalAddributes,\n autoFocus,\n telemetryContent,\n onChange\n}) => {\n const payLoad = getPayloadObject('click', telemetryContent!, name!);\n const attributes = getTelemetryAttributes(telemetryContent!, payLoad);\n return (\n \n );\n};\n\nexport default AdressInput;\n","import {\r\n addAddress, AddressManagementInput, updateAddress, updatePrimaryAddress\r\n} from '@msdyn365-commerce-modules/retail-actions';\r\nimport { IActionInput, ICoreContext, IObservableAction, ITelemetry } from '@msdyn365-commerce/core';\r\nimport {\r\n Address, CountryRegionInfo, StateProvinceInfo\r\n} from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\r\n\r\nimport { getStateProvinceAction, GetStateProvincesInput } from '../dataActions/get-state-provinces';\r\nimport { IAddressResource, IAddressResponse } from './address-module.data';\r\n\r\n/**\r\n *\r\n * Address common\r\n */\r\nexport class AddressCommon {\r\n\r\n private context: ICoreContext;\r\n private customerAccountNumber?: string;\r\n private resources: IAddressResource;\r\n private telemetry: ITelemetry;\r\n\r\n constructor(context: ICoreContext, resources: IAddressResource, telemetry: ITelemetry, customerAccountNumber?: string) {\r\n this.context = context;\r\n this.customerAccountNumber = customerAccountNumber;\r\n this.resources = resources;\r\n this.telemetry = telemetry;\r\n }\r\n\r\n public getDefaultCountryRegionId = (countryRegionId: string, countryRegions: CountryRegionInfo[], market?: string): string => {\r\n const marketISOCode = market || 'US';\r\n const currentCountryRegion = countryRegions.find(countryRegion => (countryRegion.ISOCode || '') === marketISOCode);\r\n return (currentCountryRegion && currentCountryRegion.CountryRegionId) || countryRegionId;\r\n };\r\n\r\n public parseRetailException = (resources: IAddressResource): IAddressResponse => {\r\n return {\r\n errorTitle: resources.addressErrorMessageTitle,\r\n errorMessage: resources.addressGenericErrorMessage\r\n };\r\n };\r\n\r\n public isAuthenticatedFlow = (): boolean => {\r\n return !!this.customerAccountNumber;\r\n };\r\n\r\n public getStateProvinces = async (countryRegionId: string): Promise => {\r\n let response: StateProvinceInfo[] = [];\r\n if (this.context && this.context.actionContext) {\r\n try {\r\n const input = new GetStateProvincesInput(countryRegionId, this.context.request.apiSettings);\r\n response = await getStateProvinceAction(input, this.context.actionContext);\r\n } catch (error) {\r\n if (this.telemetry) {\r\n this.telemetry.error(`Error encountered ${error}`);\r\n }\r\n }\r\n }\r\n return Promise.resolve(response);\r\n };\r\n\r\n public addCustomerAddress = (address: Address): Promise => {\r\n return this.submitCustomerAddress(addAddress, address);\r\n };\r\n\r\n public updateCustomerAddress = (address: Address): Promise => {\r\n return this.submitCustomerAddress(updateAddress, address);\r\n };\r\n\r\n public updateCustomerPrimaryAddress = (address: Address): Promise => {\r\n return this.submitCustomerAddress(updatePrimaryAddress, address);\r\n };\r\n\r\n private submitCustomerAddress = (addressAction: IObservableAction, address: Address): Promise => {\r\n address.AddressTypeValue = address.AddressTypeValue || 7; // 7 sets it to HOME by default\r\n\r\n const input = new AddressManagementInput(address, this.customerAccountNumber || '');\r\n return this.execAddressAction(addressAction, input, address);\r\n };\r\n\r\n private execAddressAction = async (addressAction: IObservableAction, input: IActionInput | IActionInput[], address: Address): Promise => {\r\n let response: IAddressResponse = {};\r\n\r\n if (this.context && this.context.actionContext) {\r\n try {\r\n const addresses = await addressAction(input, this.context.actionContext);\r\n if (addresses.length > 0) {\r\n response.address = address.RecordId ? address : addresses[addresses.length - 1];\r\n }\r\n response.customerAddresses = addresses;\r\n } catch (error) {\r\n if (this.telemetry) {\r\n this.telemetry.error(`Error encountered ${error}`);\r\n }\r\n response = this.parseRetailException(this.resources);\r\n }\r\n }\r\n return Promise.resolve(response);\r\n };\r\n}\r\n","import { Heading } from '@msdyn365-commerce-modules/data-types';\nimport { Address } from '@msdyn365-commerce/retail-proxy';\n\nexport enum AddressOperation {\n Add = 'Add',\n Show = 'Show',\n Update = 'Update',\n List = 'List'\n}\n\nexport enum AddressType {\n Shipping = 'Shipping',\n Billing = 'Billing',\n Company = 'Company'\n}\n\nexport interface IDropdownDisplayData {\n [index: string]: { key?: string; value?: string }[];\n}\n\nexport interface IAddressResponse {\n errorTitle?: string;\n errorMessage?: string;\n customerAddresses?: Address[];\n address?: Address;\n}\n\nexport interface IAddressConfig {\n heading?: Heading;\n primaryAddressSectionHeading?: Heading;\n otherAddressSectionHeading?: Heading;\n addAddressHeading?: Heading;\n editAddressHeading?: Heading;\n}\n\nexport interface IAddressResource {\n addressAddButtonText: string;\n addressAddButtonAriaLabel: string;\n addressPrimaryButtonText: string;\n addressPrimaryButtonAriaLabel: string;\n addressEditButtonText: string;\n addressEditButtonAriaLabel: string;\n addressRemoveButtonText: string;\n addressRemoveButtonAriaLabel: string;\n addressSaveButtonText: string;\n addressSaveButtonAriaLabel: string;\n addressCancelButtonText: string;\n addressCancelButtonAriaLabel: string;\n addressStateDefaultSelectionText: string;\n addressNameLabel: string;\n addressNameLabelOptional?: string;\n addressNameRequiredErrorMessage: string;\n addressPhoneLabel: string;\n addressPhoneLabelOptional?: string;\n addressPhoneRequiredErrorMessage: string;\n addressZipCodeLabel: string;\n addressZipCodeLabelOptional?: string;\n addressZipCodeRequiredErrorMessage: string;\n addressCityLabel: string;\n addressCityLabelOptional?: string;\n addressCityRequiredErrorMessage: string;\n addressCountyLabel: string;\n addressCountyLabelOptional?: string;\n addressCountyRequiredErrorMessage: string;\n addressStateLabel: string;\n addressStateLabelOptional?: string;\n addressStateRequiredErrorMessage: string;\n addressThreeLetterISORegionNameLabel: string;\n addressThreeLetterISORegionNameLabelOptional?: string;\n addressThreeLetterISORegionNameRequiredErrorMessage: string;\n addressStreetRequiredErrorMessage: string;\n addressDistrictLabel: string;\n addressDistrictLabelOptional?: string;\n addressDistrictRequiredErrorMessage: string;\n addressStreetNumberLabel: string;\n addressStreetNumberLabelOptional?: string;\n addressStreetNumberRequiredErrorMessage: string;\n addressBuildingComplimentLabel: string;\n addressBuildingComplimentLabelOptional?: string;\n addressBuildingComplimentRequiredErrorMessage: string;\n addressPostboxLabel: string;\n addressPostboxLabelOptional?: string;\n addressPostboxRequiredErrorMessage: string;\n addressHouseRULabel: string;\n addressHouseRULabelOptional?: string;\n addressHouseRURequiredErrorMessage: string;\n addressFlatRULabel: string;\n addressFlatRULabelOptional?: string;\n addressFlatRURequiredErrorMessage: string;\n addressCountryOKSMCodeRULabel: string;\n addressCountryOKSMCodeRURequiredErrorMessage: string;\n addressErrorMessageTitle: string;\n addressGenericErrorMessage: string;\n addressEmptyListAddressMessage: string;\n}"],"sourceRoot":""}