;\n\n private readonly attributeClassName: string = 'ms-account-profile__attributes-element';\n\n private readonly maxIntegerLimit: number = 2_100_000_000;\n\n private readonly minIntegerLimit: number = -2_100_000_000;\n\n private readonly maxDecimalLimit: number = 7_900_000_000_000;\n\n private readonly minDecimalLimit: number = -7_900_000_000_000;\n\n private readonly maxStringLength: number = 1000;\n\n private readonly maxVATNumberLength: number = 20;\n\n private readonly maxPhoneLength: number = 25;\n\n private readonly editAsyncCustomerFeatureName: string = 'Dynamics.AX.Application.RetailEnableAsyncCustomerEditFeature';\n\n private isEditAsyncCustomerFeatureEnabled: boolean = false;\n\n constructor(props: IAccountProfileAttributesProps) {\n super(props);\n this.state = {\n editAttributes: false,\n phone: '',\n vatNumber: '',\n attributes: {},\n attributeError: {}\n };\n this.initialAttributes = {};\n this.initialCustomerAttributes = [];\n this.initialPhone = '';\n this.initialVatNumber = '';\n this.attributePayloadData = [];\n const telemetryPageName =\n (this.props.accountProfileProps &&\n this.props.accountProfileProps.context &&\n this.props.accountProfileProps.context.request &&\n this.props.accountProfileProps.context.request.telemetryPageName) ||\n '';\n const friendlyName = (this.props.accountProfileProps && this.props.accountProfileProps.friendlyName) || '';\n const telemetry = (this.props.accountProfileProps && this.props.accountProfileProps.telemetry) || {};\n this.telemetryContent = getTelemetryObject(telemetryPageName, friendlyName, telemetry);\n this.payLoad = getPayloadObject('click', this.telemetryContent, '');\n this.editRef = React.createRef();\n this.attributesContainerRef = React.createRef();\n }\n\n public componentDidMount(): void {\n this._buildPayloadData();\n this._getAttributes();\n this._getCustomerPhoneAndVatNumber();\n reaction(\n () => this.props.accountProfileProps.data.customerInformation.result,\n () => {\n const customerInformation = this.props.accountProfileProps.data.customerInformation.result;\n this.initialCustomerAttributes = customerInformation && customerInformation.Attributes;\n this._getAttributes();\n this._getCustomerPhoneAndVatNumber();\n }\n );\n reaction(\n () => this.props.accountProfileProps.data.attributeDefinitions.result,\n () => {\n this._buildPayloadData();\n }\n );\n }\n\n public shouldComponentUpdate(nextProps: IAccountProfileAttributesProps, nextState: IAccountProfileAttributesState): boolean {\n if (this.state === nextState && this.props.accountProfileProps.data === nextProps.accountProfileProps.data) {\n return false;\n }\n return true;\n }\n\n public render(): JSX.Element | null {\n return this._renderAttributes();\n }\n\n private readonly _renderAttributes = (): JSX.Element | null => {\n const { config, data, resources } = this.props.accountProfileProps;\n const attributeDefinitions: AttributeDefinition[] = data.attributeDefinitions.result || [];\n const additionalInformationSectionHeading =\n (config.additionalInformationSectionHeading && config.additionalInformationSectionHeading.text) || '';\n const showAttributes = config.showAttributes || '';\n const attributes = showAttributes.split(',');\n const elements = attributes.map(att => {\n const attributeDefinition: AttributeDefinition = attributeDefinitions.find(\n attribute => attribute.IsHidden === false && attribute.Name!.toLocaleLowerCase() === att.toLocaleLowerCase()\n ) || { RecordId: 0 };\n return this._renderAttribute(attributeDefinition);\n });\n const edit = (this.state && this.state.editAttributes) || false;\n this.payLoad.contentAction.etext = `${resources.attributesEditButtonText} ${additionalInformationSectionHeading}`;\n const editAttributes = getTelemetryAttributes(this.telemetryContent!, this.payLoad);\n this.payLoad.contentAction.etext = `${resources.attributesSaveButtonText} ${additionalInformationSectionHeading}`;\n const saveAttributes = getTelemetryAttributes(this.telemetryContent!, this.payLoad);\n this.payLoad.contentAction.etext = `${resources.attributesCancelButtonText} ${additionalInformationSectionHeading}`;\n const cancelAttributes = getTelemetryAttributes(this.telemetryContent!, this.payLoad);\n const customerInformation = data.customerInformation.result;\n\n this.isEditAsyncCustomerFeatureEnabled =\n data.featureState?.result?.find(feature => feature.Name === this.editAsyncCustomerFeatureName)?.IsEnabled || false;\n\n // Disable the 'Edit' button if the switch is enabled and the customer is async.\n const disableBtn: boolean =\n (this.props.accountProfileProps.context.app?.config?.canRenderAsyncCustomerDataAsUnmodifiable || false) &&\n (customerInformation?.IsAsyncCustomer || false) &&\n !this.isEditAsyncCustomerFeatureEnabled;\n return (\n \n {config.additionalInformationSectionHeading && (\n
\n )}\n {config.showPhone && this._renderPhone()}\n {config.showVatNumber && this._renderVatNumber()}\n {elements}\n {this.gotException && (\n
\n \n {this.props.accountProfileProps.resources.attributesSaveExceptionMessage}\n \n
\n )}\n {!edit && (\n
\n {resources.attributesEditButtonText}\n \n )}\n {edit && (\n
\n {resources.attributesSaveButtonText}\n \n )}\n {edit && (\n
\n {resources.attributesCancelButtonText}\n \n )}\n
\n );\n };\n\n private readonly _renderPhone = (): JSX.Element | null => {\n const { phoneSectionHeading } = this.props.accountProfileProps.config;\n const heading = (phoneSectionHeading && phoneSectionHeading.text) || '';\n const className = (heading && heading.replace(/ /g, '_')) || '';\n const editAttributes = (this.state && this.state.editAttributes) || false;\n return (\n \n {phoneSectionHeading && }\n \n {this._renderError('Phone')}\n
\n );\n };\n\n private readonly _renderVatNumber = (): JSX.Element | null => {\n const { vatNumberSectionHeading } = this.props.accountProfileProps.config;\n const heading = (vatNumberSectionHeading && vatNumberSectionHeading.text) || '';\n const className = (heading && heading.replace(/ /g, '_')) || '';\n const editAttributes = (this.state && this.state.editAttributes) || false;\n return (\n \n {vatNumberSectionHeading && }\n \n {this._renderError('VATNumber')}\n
\n );\n };\n\n private readonly _renderAttribute = (customAttribute: AttributeDefinition): JSX.Element | null => {\n const editAttributes = (this.state && this.state.editAttributes) || false;\n const className = (customAttribute.Name && customAttribute.Name.replace(/ /g, '_')) || '';\n switch (customAttribute.ExtDataType && customAttribute.ExtDataType.Value) {\n case AccountAttributeDataTypeValue.Integer:\n case AccountAttributeDataTypeValue.Decimal:\n return this._renderIntegerDecimalInput(customAttribute, className, editAttributes);\n case AccountAttributeDataTypeValue.Text:\n return this._renderTextInputOrSelect(customAttribute, className, editAttributes);\n case AccountAttributeDataTypeValue.TrueFalse:\n return this._renderBoolean(customAttribute, className, editAttributes);\n default:\n return null;\n }\n };\n\n private readonly _renderIntegerDecimalInput = (\n customAttribute: AttributeDefinition,\n className: string,\n editAttributes: boolean\n ): JSX.Element | null => {\n const edit = (this.state && this.state.editAttributes) || false;\n const attributeProps = this._getAttributeProps(customAttribute.Name || '');\n const displayName: string = attributeProps.Name || '';\n return (\n \n \n \n {this._renderError(customAttribute.Name || '')}\n
\n );\n };\n\n private readonly _renderTextInputOrSelect = (\n customAttribute: AttributeDefinition,\n className: string,\n editAttributes: boolean\n ): JSX.Element | null => {\n const isEnumeration: boolean = customAttribute.IsEnumeration || false;\n const edit = (this.state && this.state.editAttributes) || false;\n const attributeProps = this._getAttributeProps(customAttribute.Name || '');\n const displayName: string = attributeProps.Name || '';\n if (isEnumeration && customAttribute.EnumerationDetails) {\n const value = this.state.attributes[customAttribute.Name || ''] || '';\n const hasNoValue = value === '';\n return (\n \n \n \n {hasNoValue && (\n \n )}\n {customAttribute.EnumerationDetails.map(option => {\n const selected = option.EnumerationValue === this.state.attributes[customAttribute.Name || ''];\n return (\n \n {option.EnumerationValue}\n \n );\n })}\n \n
\n );\n }\n return (\n \n \n \n {this._renderError(customAttribute.Name || '')}\n
\n );\n };\n\n private readonly _renderBoolean = (\n customAttribute: AttributeDefinition,\n className: string,\n editAttributes: boolean\n ): JSX.Element | null => {\n let value = this.state.attributes[customAttribute.Name || ''] || '';\n const hasNoValue = value === '';\n const render = !(hasNoValue && !editAttributes);\n value = value || 'false';\n const toggleState = (value === 'true' && 'enable') || 'disable';\n const arialabel = format(this.props.accountProfileProps.resources.attributeToggleButtonAriaLabel, customAttribute.Name);\n const ariaPressed = (value === 'true' && true) || false;\n const attributeProps = this._getAttributeProps(customAttribute.Name || '');\n const displayName: string = attributeProps.Name || '';\n let toggleValue = 'false';\n if (value === 'true') {\n toggleValue = 'false';\n } else {\n toggleValue = 'true';\n }\n\n return (\n \n
\n {render && (\n
\n \n \n \n
\n )}\n
\n );\n };\n\n private readonly _renderError = (attributeName: string): JSX.Element | null => {\n const error: string = (this.state && this.state.attributeError && this.state.attributeError[attributeName]) || '';\n const hasError = !StringExtensions.isNullOrWhitespace(error);\n if (hasError) {\n return (\n \n {error} \n
\n );\n }\n return null;\n };\n\n private readonly _getAttributeProps = (attributeName: string): IAttributePropertiesType => {\n const attributePayloadData = this.attributePayloadData.find(att => att.name === attributeName);\n const isMandatory: boolean = (attributePayloadData && attributePayloadData.isMandatory) || false;\n return {\n Name: isMandatory ? `${attributeName || ''} *` : attributeName || '',\n IsMandatory: isMandatory\n };\n };\n\n private readonly _onPhoneChange = (event: React.ChangeEvent): void => {\n const value = event.target.value;\n this.setState({ phone: value });\n };\n\n private readonly _onVatNumberChange = (event: React.ChangeEvent): void => {\n const value = event.target.value;\n this.setState({ vatNumber: value });\n };\n\n private readonly _enableAttributes = () => {\n this.hasError = false;\n\n // To clear exception messages\n this.gotException = false;\n this.setState({ editAttributes: true, attributeError: {} });\n if (MsDyn365.isBrowser) {\n setTimeout(() => {\n if (this.attributesContainerRef.current) {\n const attributes: HTMLCollectionOf = this.attributesContainerRef.current.getElementsByClassName(\n this.attributeClassName\n );\n if (attributes && attributes.length > 0) {\n this._setFocus(attributes[0] as HTMLElement);\n }\n }\n }, 0);\n }\n };\n\n private readonly _disableAttributes = () => {\n this.setState({\n editAttributes: false,\n attributeError: {},\n attributes: this.initialAttributes,\n phone: this.initialPhone,\n vatNumber: this.initialVatNumber\n });\n if (MsDyn365.isBrowser) {\n setTimeout(() => {\n this._setFocus(this.editRef.current);\n }, 0);\n }\n };\n\n private readonly _onAttributeChange = (attributeDefinition: AttributeDefinition) => (event: React.ChangeEvent) => {\n const value = event.target.value;\n const name = attributeDefinition.Name || '';\n this.setState({\n attributes: {\n ...this.state.attributes,\n [name]: value\n }\n });\n };\n\n private readonly _onAttributeCheck = (attributeDefinition: AttributeDefinition, value: string) => (\n event: React.MouseEvent\n ) => {\n const name = attributeDefinition.Name || '';\n this.setState({\n attributes: {\n ...this.state.attributes,\n [name]: value\n }\n });\n };\n\n private readonly _onAttributeSelect = (attributeDefinition: AttributeDefinition) => (event: React.ChangeEvent) => {\n const value = event.currentTarget.selectedOptions[0].value;\n const index = event.currentTarget.selectedOptions[0].index;\n const name = attributeDefinition.Name || '';\n this.setState({\n attributes: {\n ...this.state.attributes,\n [name]: value\n },\n selectedIndex: {\n ...this.state.selectedIndex,\n [name]: index\n }\n });\n };\n\n private readonly _getAttributes = () => {\n const { config, data } = this.props.accountProfileProps;\n const showAttributes = config.showAttributes || '';\n const showAttributesArray = showAttributes.split(',');\n const customer = data.customerInformation.result;\n const custmerAttributes: CustomerAttribute[] = (customer && customer.Attributes) || [];\n const attributes: IDictionary = {};\n\n showAttributesArray.forEach(showAttribute => {\n const attributePayloadData = this.attributePayloadData.find(att => att.name === showAttribute);\n const isMandatory: boolean = (attributePayloadData && attributePayloadData.isMandatory) || false;\n const defaultValue = attributePayloadData && attributePayloadData.defaultValue;\n const attribute = custmerAttributes.find(att => att.Name === showAttribute);\n let value: string = '';\n if (attribute && attribute.AttributeValue) {\n const name = (attribute && attribute.Name) || '';\n switch (attribute.DataTypeValue) {\n case AccountAttributeDataTypeValue.Integer:\n if (attribute.AttributeValue.IntegerValue) {\n value = String(attribute.AttributeValue.IntegerValue);\n attributes[name] = value;\n }\n break;\n case AccountAttributeDataTypeValue.Decimal:\n if (attribute.AttributeValue.DecimalValue) {\n value = String(attribute.AttributeValue.DecimalValue);\n attributes[name] = value;\n }\n break;\n case AccountAttributeDataTypeValue.Text:\n if (attribute.AttributeValue.StringValue) {\n value = attribute.AttributeValue.StringValue;\n attributes[name] = value;\n }\n break;\n case AccountAttributeDataTypeValue.TrueFalse:\n if (attribute.AttributeValue.BooleanValue !== null) {\n value = String(attribute.AttributeValue.BooleanValue);\n attributes[name] = value;\n }\n break;\n default:\n\n // Do nothing\n }\n }\n if (StringExtensions.isNullOrWhitespace(value) && isMandatory) {\n attributes[showAttribute] = '';\n }\n if (value.length === 0 && defaultValue) {\n attributes[showAttribute] = String(defaultValue);\n }\n });\n if (Object.keys(this.initialAttributes).length === 0) {\n this.initialAttributes = attributes;\n }\n this.setState({ attributes });\n };\n\n // eslint-disable-next-line\n private readonly _addOrUpdateAttribute = (customer: Customer) => {\n const { resources } = this.props.accountProfileProps;\n const { phone, vatNumber } = this.state;\n const attributeError: IDictionary = {};\n let hasError: boolean = false;\n let hasValue: boolean = true;\n for (const [key, value] of Object.entries(this.state.attributes)) {\n const payloadData: IAttributePayloadData = this.attributePayloadData.find(data => data.name === key) || {};\n if (payloadData) {\n switch (payloadData.dataTypeValue) {\n case AccountAttributeDataTypeValue.Decimal:\n const decimalValue = Number(value);\n if (isNaN(decimalValue)) {\n const typeError = format(resources.attributeInputTypeErrorText, payloadData.name, 'Decimal');\n attributeError[payloadData.name || ''] = typeError;\n hasError = true;\n } else if (payloadData.lowerBoundValue !== undefined && payloadData.upperBoundValue !== undefined) {\n if (decimalValue < payloadData.lowerBoundValue || decimalValue > payloadData.upperBoundValue) {\n const rangeError = format(\n resources.attributeInputRangeErrorText,\n payloadData.name,\n payloadData.lowerBoundValue,\n payloadData.upperBoundValue\n );\n attributeError[payloadData.name || ''] = rangeError;\n hasError = true;\n }\n } else {\n if (decimalValue > this.maxDecimalLimit) {\n attributeError[payloadData.name || ''] = format(\n resources.attributeInputValueExceedsMaximumErrorText,\n payloadData.name,\n this.maxDecimalLimit\n );\n hasError = true;\n }\n\n if (decimalValue < this.minDecimalLimit) {\n attributeError[payloadData.name || ''] = format(\n resources.attributeInputValueExceedsMinimumErrorText,\n payloadData.name,\n this.minDecimalLimit\n );\n hasError = true;\n }\n }\n\n if (!hasError) {\n if (StringExtensions.isNullOrWhitespace(value)) {\n hasValue = false;\n } else {\n payloadData.decimalValue = decimalValue;\n hasValue = true;\n }\n }\n break;\n case AccountAttributeDataTypeValue.Integer:\n const integerValue = Number(value);\n if (isNaN(integerValue) || value.includes('.')) {\n const typeError = format(resources.attributeInputTypeErrorText, payloadData.name, 'Integer');\n attributeError[payloadData.name || ''] = typeError;\n hasError = true;\n } else if (payloadData.lowerBoundValue !== undefined && payloadData.upperBoundValue !== undefined) {\n if (integerValue < payloadData.lowerBoundValue || integerValue > payloadData.upperBoundValue) {\n const rangeError = format(\n resources.attributeInputRangeErrorText,\n payloadData.name,\n payloadData.lowerBoundValue,\n payloadData.upperBoundValue\n );\n attributeError[payloadData.name || ''] = rangeError;\n hasError = true;\n }\n } else {\n if (integerValue > this.maxIntegerLimit) {\n attributeError[payloadData.name || ''] = format(\n resources.attributeInputValueExceedsMaximumErrorText,\n payloadData.name,\n this.maxIntegerLimit\n );\n hasError = true;\n }\n\n if (integerValue < this.minIntegerLimit) {\n attributeError[payloadData.name || ''] = format(\n resources.attributeInputValueExceedsMinimumErrorText,\n payloadData.name,\n this.minIntegerLimit\n );\n hasError = true;\n }\n }\n\n if (!hasError) {\n if (StringExtensions.isNullOrWhitespace(value)) {\n hasValue = false;\n } else {\n payloadData.integerValue = integerValue;\n hasValue = true;\n }\n }\n break;\n case AccountAttributeDataTypeValue.Text:\n let trimValue = '';\n if (!StringExtensions.isNullOrWhitespace(value)) {\n trimValue = value.trim();\n }\n if (trimValue.length > this.maxStringLength) {\n attributeError[payloadData.name || ''] = format(\n resources.attributeInputStringMaxLengthErrorText,\n payloadData.name,\n this.maxStringLength\n );\n hasError = true;\n }\n if (!hasError) {\n payloadData.textValue = trimValue;\n }\n break;\n case AccountAttributeDataTypeValue.TrueFalse:\n payloadData.booleanValue = value === 'true';\n break;\n default:\n\n // Do nothing\n }\n\n if (payloadData.isMandatory && StringExtensions.isNullOrWhitespace(value)) {\n attributeError[payloadData.name || ''] = format(resources.attributeInputMandatoryErrorText, payloadData.name);\n hasError = true;\n }\n\n const custmerAttributes: CustomerAttribute[] = (customer && customer.Attributes) || [];\n const attribute = custmerAttributes.find(att => att.Name === key);\n const index = custmerAttributes.findIndex(att => att.Name === key);\n\n if (index !== -1 && !hasValue) {\n custmerAttributes.splice(index, 1);\n }\n\n if (!hasError && hasValue) {\n if (attribute) {\n attribute.Attribute = undefined;\n attribute.DataTypeValue = payloadData.dataTypeValue;\n attribute.Name = payloadData.name;\n attribute.RecordId = payloadData.recordId;\n attribute.Units = undefined;\n attribute.AttributeValue = {\n IntegerValue: payloadData.integerValue,\n BooleanValue: payloadData.booleanValue,\n StringValue: payloadData.textValue,\n DecimalValue: payloadData.decimalValue\n };\n attribute.ExtensionProperties = [];\n attribute.NameTranslations = [];\n } else {\n custmerAttributes.push({\n '@odata.type': '#Microsoft.Dynamics.Commerce.Runtime.DataModel.CustomerAttribute',\n Attribute: undefined,\n DataTypeValue: payloadData.dataTypeValue,\n KeyName: payloadData.name,\n Name: payloadData.name,\n RecordId: payloadData.recordId,\n Units: undefined,\n AttributeValue: {\n // @ts-expect-error\n '@odata.type': '#Microsoft.Dynamics.Commerce.Runtime.DataModel.CommercePropertyValue',\n IntegerValue: payloadData.integerValue,\n BooleanValue: payloadData.booleanValue,\n StringValue: payloadData.textValue,\n DecimalValue: payloadData.decimalValue\n },\n 'ExtensionProperties@odata.type': '#Collection(Microsoft.Dynamics.Commerce.Runtime.DataModel.CommerceProperty)',\n ExtensionProperties: [],\n 'NameTranslations@odata.type':\n '#Collection(Microsoft.Dynamics.Commerce.Runtime.DataModel.TextValueTranslation)',\n NameTranslations: []\n });\n }\n }\n }\n }\n\n if (phone.trim().length > this.maxPhoneLength) {\n attributeError.Phone = format(resources.attributeInputStringMaxLengthErrorText, 'Phone', this.maxPhoneLength);\n hasError = true;\n } else {\n customer.Phone = phone.trim();\n }\n\n if (vatNumber.trim().length > this.maxVATNumberLength) {\n attributeError.VATNumber = format(resources.attributeInputStringMaxLengthErrorText, 'VAT Number', this.maxVATNumberLength);\n hasError = true;\n } else {\n customer.VatNumber = vatNumber.trim();\n }\n\n this.hasError = hasError;\n this.setState({ attributeError });\n };\n\n private readonly _saveAttributes = async () => {\n const { context, data } = this.props.accountProfileProps;\n const customer = data.customerInformation.result;\n\n if (customer && context) {\n this._addOrUpdateAttribute(customer);\n const input = new updateCustomerAttributesInput(\n customer.AccountNumber,\n customer.Attributes || [],\n context.request.apiSettings,\n customer.Phone,\n customer.VatNumber\n );\n\n this.isUpdatingAttributes = true;\n this.gotException = false;\n\n if (!this.hasError) {\n this.setState({ editAttributes: false });\n try {\n await updateCustomerAttributes(input, context.actionContext);\n } catch (error) {\n this.gotException = true;\n customer.Attributes = this.initialCustomerAttributes;\n if (context.telemetry) {\n context.telemetry.exception(error);\n context.telemetry.debug('Unable to update customer attributes');\n }\n this.setState({\n attributeError: {},\n attributes: this.initialAttributes,\n phone: this.initialPhone,\n vatNumber: this.initialVatNumber\n });\n }\n this.setState({ editAttributes: false });\n if (!this.gotException) {\n this.initialAttributes = this.state.attributes;\n this.initialCustomerAttributes = customer.Attributes;\n this.initialPhone = this.state.phone;\n this.initialVatNumber = this.state.vatNumber;\n }\n }\n\n this.isUpdatingAttributes = false;\n\n if (MsDyn365.isBrowser) {\n setTimeout(() => {\n this._setFocus(this.editRef.current);\n }, 0);\n }\n }\n };\n\n private readonly _setFocus = (element: HTMLElement | null) => {\n element?.focus();\n };\n\n private readonly _buildPayloadData = () => {\n const { data } = this.props.accountProfileProps;\n const attributeDefinitions = data.attributeDefinitions.result || [];\n const attributes: IDictionary = {};\n\n attributeDefinitions.forEach(attributeDefinition => {\n const attributePayloadData: IAttributePayloadData = {};\n attributePayloadData.recordId = attributeDefinition.RecordId;\n attributePayloadData.name = attributeDefinition.Name;\n attributePayloadData.dataTypeValue = attributeDefinition.DataTypeValue;\n attributePayloadData.isEnumeration = attributeDefinition.IsEnumeration;\n attributePayloadData.isMandatory = attributeDefinition.IsMandatory;\n switch (attributeDefinition.DataTypeValue) {\n case AccountAttributeDataTypeValue.Integer:\n const defaultIntegerValue = attributeDefinition.DefaultValue && attributeDefinition.DefaultValue.IntegerValue;\n attributePayloadData.lowerBoundValue = attributeDefinition.LowerBound && attributeDefinition.LowerBound.IntegerValue;\n attributePayloadData.upperBoundValue = attributeDefinition.UpperBound && attributeDefinition.UpperBound.IntegerValue;\n if (attributePayloadData.name && defaultIntegerValue) {\n attributePayloadData.defaultValue = String(defaultIntegerValue);\n attributes[attributePayloadData.name] = String(defaultIntegerValue);\n }\n break;\n case AccountAttributeDataTypeValue.Decimal:\n const defaultDecimalValue = attributeDefinition.DefaultValue && attributeDefinition.DefaultValue.DecimalValue;\n attributePayloadData.lowerBoundValue = attributeDefinition.LowerBound && attributeDefinition.LowerBound.DecimalValue;\n attributePayloadData.upperBoundValue = attributeDefinition.UpperBound && attributeDefinition.UpperBound.DecimalValue;\n if (attributePayloadData.name && defaultDecimalValue) {\n attributePayloadData.defaultValue = String(defaultDecimalValue);\n attributes[attributePayloadData.name] = String(defaultDecimalValue);\n }\n break;\n case AccountAttributeDataTypeValue.Text:\n const defaultStringValue = attributeDefinition.DefaultValue && attributeDefinition.DefaultValue.StringValue;\n if (attributePayloadData.name && defaultStringValue) {\n attributePayloadData.defaultValue = defaultStringValue;\n attributes[attributePayloadData.name] = defaultStringValue;\n }\n break;\n case AccountAttributeDataTypeValue.TrueFalse:\n const defaultBooleanValue =\n (attributeDefinition.DefaultValue && attributeDefinition.DefaultValue.BooleanValue) || false;\n if (attributePayloadData.name) {\n attributePayloadData.defaultValue = String(defaultBooleanValue);\n attributes[attributePayloadData.name] = String(defaultBooleanValue);\n }\n break;\n default:\n\n // Do nothing\n }\n this.attributePayloadData.push(attributePayloadData);\n });\n Object.keys(attributes).length > 0 && this.setState({ attributes });\n };\n\n private readonly _getCustomerPhoneAndVatNumber = () => {\n const customer = this.props.accountProfileProps.data.customerInformation.result;\n const phone = (customer && customer.Phone) || '';\n const vatNumber = (customer && customer.VatNumber) || '';\n this.setState({ phone, vatNumber });\n if (this.initialPhone.length === 0) {\n this.initialPhone = phone;\n }\n if (this.initialVatNumber.length === 0) {\n this.initialVatNumber = vatNumber;\n }\n };\n}\n\nexport default AccountProfileAttributes;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as Msdyn365 from '@msdyn365-commerce/core';\nimport { ILinkData } from '@msdyn365-commerce/core';\nimport { getPayloadObject, getTelemetryAttributes, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nexport interface ILinksData {\n linkText?: string;\n linkUrl: ILinkData;\n ariaLabel?: string;\n openInNewTab?: boolean;\n isDisabled?: boolean;\n}\n\nexport interface IAccountProfileLinks {\n links: ILinksData[];\n requestContext: Msdyn365.IRequestContext;\n\n /**\n * The telemetry content\n */\n telemetryContent?: ITelemetryContent;\n onTextChange?(index: number): (event: Msdyn365.ContentEditableEvent) => void;\n}\n\nconst AccountProfileLinks: React.FC = ({ links, telemetryContent, requestContext, onTextChange }) => {\n if (links.length === 0) {\n return null;\n }\n const editableLinks = _mapEditableLinks(links, telemetryContent);\n return (\n \n {editableLinks && editableLinks.length > 0 ? (\n \n ) : null}\n
\n );\n};\n\nconst _mapEditableLinks = (linkdata: ILinksData[], telemetryContent?: ITelemetryContent): Msdyn365.ILinksData[] | null => {\n if (!linkdata || linkdata.length === 0) {\n return null;\n }\n const editableLinks: Msdyn365.ILinksData[] = [];\n const payLoad = getPayloadObject('click', telemetryContent!, '');\n linkdata.forEach((link, index) => {\n payLoad.contentAction.etext = link.linkText;\n const attributes = getTelemetryAttributes(telemetryContent!, payLoad);\n const editableLink: Msdyn365.ILinksData = {\n ariaLabel: link.ariaLabel,\n className: link.isDisabled ? 'ms-account-profile__section-link-disable' : 'ms-account-profile__section-link',\n linkText: link.linkText,\n linkUrl: link.linkUrl.destinationUrl,\n openInNewTab: link.openInNewTab,\n role: 'link',\n additionalProperties: attributes\n };\n editableLinks.push(editableLink);\n });\n\n return editableLinks;\n};\n\nexport default AccountProfileLinks;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as Msdyn365 from '@msdyn365-commerce/core';\nimport { Customer } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\nimport {\n ArrayExtensions,\n updateCustomerPersonalization,\n updateCustomerPersonalizationInput\n} from '@msdyn365-commerce-modules/retail-actions';\nimport {\n Button,\n getPayloadObject,\n getTelemetryAttributes,\n getTelemetryObject,\n IModuleProps,\n INodeProps,\n IPayLoad,\n ITelemetryContent\n} from '@msdyn365-commerce-modules/utilities';\nimport classnames from 'classnames';\nimport get from 'lodash/get';\nimport { computed, observable } from 'mobx';\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\n\nimport { IAccountProfileData } from './account-profile.data';\nimport {\n IAccountProfileProps,\n IEmailAddressSectionHeadingData,\n IHeadingData,\n INameSectionHeadingData\n} from './account-profile.props.autogenerated';\nimport AccountProfileAttributes from './components/account-profile-attributes';\nimport DescriptionComponent from './components/account-profile-description';\nimport LinksComponent, { ILinksData } from './components/account-profile-links';\nimport TextComponent from './components/account-profile-text';\n\nexport interface IAccountPreference {\n accountPreference: INodeProps;\n heading: React.ReactNode;\n buttonWrapper: INodeProps;\n buttonYesText: React.ReactNode;\n buttonNoText: React.ReactNode;\n button: React.ReactNode;\n description: React.ReactNode;\n onUpdateAccountPreference(preferenceType?: string): void;\n}\n\nexport interface IAccountPreferences {\n accountPreferences: INodeProps;\n heading?: React.ReactNode;\n personalization: IAccountPreference;\n extraPreferences?: IAccountPreference[];\n}\n\nexport interface IAccountProfileItem {\n AccountProfileItem: INodeProps;\n heading?: React.ReactNode;\n links?: React.ReactNode;\n description?: React.ReactNode;\n}\n\nexport interface IAccountCustomerAttributes {\n customerAttributes?: React.ReactNode;\n}\n\nexport interface IAccountProfileViewProps extends IAccountProfileProps {\n AccountProfile: IModuleProps;\n accountProfileWrapper?: INodeProps;\n className: string;\n heading?: React.ReactNode;\n emailSection: IAccountProfileItem;\n nameSection: IAccountProfileItem;\n preferenceSection: IAccountPreferences;\n customerAttributesWrapper?: INodeProps;\n customerAttributesSection?: IAccountCustomerAttributes;\n infoMessageBar?: React.ReactNode;\n}\n\n/**\n *\n * AccountProfile component.\n * @extends {React.Component>}\n */\n@observer\nclass AccountProfile extends React.Component> {\n @observable private isUpdatingPreference: boolean = false;\n\n private readonly telemetryContent?: ITelemetryContent;\n private readonly payLoad: IPayLoad;\n private readonly editAsyncCustomerFeatureName: string = 'Dynamics.AX.Application.RetailEnableAsyncCustomerEditFeature';\n\n private isEditAsyncCustomerFeatureEnabled: boolean = false;\n\n constructor(props: IAccountProfileProps) {\n super(props);\n this.telemetryContent = getTelemetryObject(\n this.props.context.request.telemetryPageName!,\n this.props.friendlyName,\n this.props.telemetry\n );\n this.payLoad = getPayloadObject('click', this.telemetryContent, '');\n }\n\n public shouldComponentUpdate(nextProps: IAccountProfileProps): boolean {\n if (this.props.data === nextProps.data) {\n return false;\n }\n return true;\n }\n\n public render(): JSX.Element {\n const { config, resources, data } = this.props;\n const { className, heading, emailAddressSectionHeading, nameSectionHeading, showAttributes, showPhone, showVatNumber } = config;\n\n const { editButtonText, editButtonAriaLabel } = resources;\n const customerInformation = data.customerInformation.result;\n\n this.isEditAsyncCustomerFeatureEnabled =\n data.featureState?.result?.find(feature => feature.Name === this.editAsyncCustomerFeatureName)?.IsEnabled || false;\n\n const invalidAsyncCustomerState: boolean =\n (this.props.context.app?.config?.canRenderAsyncCustomerDataAsUnmodifiable || false) &&\n (customerInformation?.IsAsyncCustomer || false) &&\n !this.isEditAsyncCustomerFeatureEnabled;\n\n // As per the design, phone and vat numbers are part of the profile attributes section\n const shouldRenderAttributes = (showAttributes && showAttributes.length > 0) || showPhone || showVatNumber || false;\n const editLink: ILinksData = {\n linkUrl: {\n destinationUrl: get(this.props, 'context.request.user.editProfileUrl', '')\n },\n linkText: editButtonText,\n ariaLabel: editButtonAriaLabel,\n isDisabled: invalidAsyncCustomerState\n };\n\n const viewProps = {\n ...this.props,\n className,\n AccountProfile: {\n moduleProps: this.props,\n className: classnames('ms-account-profile', config.className)\n },\n infoMessageBar: invalidAsyncCustomerState && (\n \n ),\n accountProfileWrapper: {\n className: classnames('ms-account-profile-wrapper')\n },\n heading: heading && (\n \n ),\n emailSection: this._renderEmailSection(\n classnames('ms-account-profile__section', 'ms-account-profile__section-email'),\n emailAddressSectionHeading as IEmailAddressSectionHeadingData,\n customerInformation && customerInformation.Email\n ),\n nameSection: this._renderNameSection(\n classnames('ms-account-profile__section', 'ms-account-profile__section-name'),\n nameSectionHeading as INameSectionHeadingData,\n this.getDescription(customerInformation),\n Msdyn365.isOboRequest(this.props.context.request) ? undefined : [editLink]\n ),\n preferenceSection: this._renderPreferenceSection(\n classnames('ms-account-profile__section', 'ms-account-profile__section-preferences'),\n invalidAsyncCustomerState,\n customerInformation\n ),\n customerAttributesWrapper: {\n className: classnames('ms-account-profile__attributes-wrapper')\n },\n customerAttributesSection: shouldRenderAttributes && this._renderCustomerAttributes()\n };\n return this.props.renderView(viewProps) as React.ReactElement;\n }\n\n public handleHeadingChange = (event: Msdyn365.ContentEditableEvent) => (this.props.config.heading.text = event.target.value);\n\n public handleEmailHeadingChange = (event: Msdyn365.ContentEditableEvent) =>\n (this.props.config.emailAddressSectionHeading!.text = event.target.value);\n\n public handleNameHeadingChange = (event: Msdyn365.ContentEditableEvent) =>\n (this.props.config.nameSectionHeading!.text = event.target.value);\n\n public handleLinkTextChange = (linkIndex: number) => (event: Msdyn365.ContentEditableEvent) => {\n if (this.props.resources.editButtonText) {\n this.props.resources.editButtonText = event.target.value;\n }\n };\n\n @computed get editProfileUrl(): string {\n return get(this.props, 'context.request.user.editProfileUrl', '');\n }\n\n private getDescription(customerInformation: Customer | undefined): string {\n let description = '';\n if (customerInformation !== undefined) {\n if (customerInformation.FirstName) {\n description += customerInformation.FirstName;\n }\n if (customerInformation.LastName) {\n description += customerInformation.FirstName ? ` ${customerInformation.LastName}` : customerInformation.LastName;\n }\n }\n return description;\n }\n\n private _renderEmailSection(\n className: string,\n heading?: IEmailAddressSectionHeadingData,\n description?: string,\n links?: ILinksData[]\n ): IAccountProfileItem {\n return {\n AccountProfileItem: {\n className\n },\n heading: heading && heading.text && (\n \n ),\n links: links && links.length > 0 && (\n \n ),\n description: description && (\n \n )\n };\n }\n\n private _renderNameSection(\n className: string,\n heading?: INameSectionHeadingData,\n description?: string,\n links?: ILinksData[]\n ): IAccountProfileItem {\n if (!ArrayExtensions.hasElements(links)) {\n return {\n AccountProfileItem: {\n className\n },\n heading: heading && (\n \n ),\n description: description && (\n \n )\n };\n }\n return {\n AccountProfileItem: {\n className\n },\n heading: heading && (\n \n ),\n links: (\n \n ),\n description: description && (\n \n )\n };\n }\n\n private readonly onClickEventHandler = (className: string) => async () => {\n return this._updateAccountPersonalization(className);\n };\n\n private _renderPreferenceSection(\n className: string,\n invalidAsyncCustomerState: boolean,\n customerInformation?: Customer\n ): IAccountPreferences | null {\n const {\n personalizationDescription,\n personalizationEnableButtonAriaLabel,\n webTrackingDescription,\n webTrackingEnableButtonAriaLabel\n } = this.props.resources;\n const { preferencesSectionHeading, personalizationSectionHeading, webTrackingSectionHeading } = this.props.config;\n const { enableDataAnalytics } = this.props.context.request.features;\n const extraPreferences: IAccountPreference[] = [];\n\n if (!customerInformation) {\n this.props.context.telemetry.error('Account profile data is empty, module wont render');\n return null;\n }\n\n // Show browser activity login preference if switch is enabled AND a heading is provided\n enableDataAnalytics &&\n webTrackingSectionHeading &&\n extraPreferences.push(\n this._renderPreference(\n 'web-tracking',\n webTrackingSectionHeading as IHeadingData,\n webTrackingEnableButtonAriaLabel,\n webTrackingDescription,\n customerInformation.OptOutWebActivityTracking || false,\n invalidAsyncCustomerState\n )\n );\n\n return {\n accountPreferences: {\n className\n },\n heading: preferencesSectionHeading && (\n \n ),\n personalization: this._renderPreference(\n 'personalization',\n personalizationSectionHeading as IHeadingData,\n personalizationEnableButtonAriaLabel,\n personalizationDescription,\n customerInformation.OptOutPersonalization || false,\n invalidAsyncCustomerState\n ),\n extraPreferences: extraPreferences || undefined\n };\n }\n\n private readonly _renderPreference = (\n className: string,\n sectionHeading: IHeadingData,\n enableAriaLabel: string,\n description: string,\n isOptOut: boolean,\n disableBtn: boolean\n ) => {\n const { toggleDisableText, toggleEnableText } = this.props.resources;\n const toggleState = isOptOut ? 'disable' : 'enable';\n const onClickHandler = this.onClickEventHandler(className);\n this.payLoad.contentAction.etext = sectionHeading.text;\n const attributes = getTelemetryAttributes(this.telemetryContent!, this.payLoad);\n\n return {\n accountPreference: {\n className: classnames('ms-account-profile__preference', `ms-account-profile__preference-${className}`, {\n 'ms-account-profile__personalization-updating': this.isUpdatingPreference\n })\n },\n heading: sectionHeading && (\n \n ),\n buttonWrapper: {\n className: classnames('ms-account-profile__toggle-wrapper', `ms-account-profile__toggle-${toggleState}`, {\n // Disable the toggle completely if customer is async.\n 'ms-account-profile__toggle-disabled': disableBtn\n })\n },\n buttonYesText: ,\n buttonNoText: ,\n button: (\n \n ),\n description: ,\n onUpdateAccountPreference: async () => this._updateAccountPersonalization(className)\n };\n };\n\n private readonly _updateAccountPersonalization = async (preferenceType?: string) => {\n const customerInformation = this.props.data.customerInformation.result;\n\n if (customerInformation) {\n const {\n telemetry,\n context: { request, actionContext }\n } = this.props;\n\n let isOptOutPersonalization = false;\n let input;\n\n switch (preferenceType) {\n case 'web-tracking':\n isOptOutPersonalization = customerInformation.OptOutWebActivityTracking || false;\n input = new updateCustomerPersonalizationInput(\n customerInformation.AccountNumber,\n !isOptOutPersonalization,\n request.apiSettings,\n preferenceType\n );\n break;\n case undefined:\n case 'personalization':\n default:\n isOptOutPersonalization = customerInformation.OptOutPersonalization || false;\n input = new updateCustomerPersonalizationInput(\n customerInformation.AccountNumber,\n !isOptOutPersonalization,\n request.apiSettings,\n preferenceType\n );\n }\n\n this.isUpdatingPreference = true;\n\n try {\n await updateCustomerPersonalization(input, actionContext);\n } catch (error) {\n if (telemetry) {\n telemetry.exception(error);\n telemetry.debug('Unable to update customer personalization');\n }\n }\n\n this.isUpdatingPreference = false;\n }\n };\n\n private readonly _renderCustomerAttributes = (): React.ReactNode => {\n return ;\n };\n}\n\nexport default AccountProfile;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { IAccountPreference, IAccountPreferences, IAccountProfileItem, IAccountProfileViewProps } from './account-profile';\n\nconst AccountPreferencesSection: React.FC = ({ accountPreferences, heading, personalization, extraPreferences }) => {\n return (\n \n {heading}\n \n {extraPreferences &&\n extraPreferences.map((preferenceSecton, index) => {\n return ;\n })}\n \n );\n};\n\nconst AccountPreferenceSection: React.FC = ({\n accountPreference,\n heading,\n description,\n buttonWrapper,\n buttonYesText,\n button,\n buttonNoText\n}) => {\n return (\n \n {heading}\n {description}\n \n {buttonNoText}\n {button}\n {buttonYesText}\n \n \n );\n};\n\nconst AccountProfileSection: React.FC = ({ AccountProfileItem, heading, links, description }) => {\n return (\n \n {heading}\n {description}\n {links}\n \n );\n};\n\nconst AccountProfileView: React.FC = props => {\n const {\n AccountProfile,\n infoMessageBar,\n accountProfileWrapper,\n heading,\n emailSection,\n nameSection,\n preferenceSection,\n customerAttributesWrapper,\n customerAttributesSection\n } = props;\n\n return (\n \n {infoMessageBar}\n {accountProfileWrapper && (\n \n {heading}\n \n \n \n \n )}\n {customerAttributesWrapper && {customerAttributesSection} }\n \n );\n};\n\nexport default AccountProfileView;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as React from 'react';\n\ninterface IAccountProfileDescription {\n className: string;\n description: string;\n}\n\n// eslint-disable-next-line no-redeclare\nconst IAccountProfileDescription: React.FC = ({ className, description }) => (\n {description}
\n);\n\nexport default IAccountProfileDescription;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as React from 'react';\n\ninterface IAccountProfileText {\n className: string;\n text: string;\n}\n\n// eslint-disable-next-line no-redeclare\nconst IAccountProfileText: React.FC = ({ className, text }) => {text} ;\n\nexport default IAccountProfileText;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport MsDyn365, { ICoreContext, IDateFormatOptions, IRequestContext } from '@msdyn365-commerce/core';\nimport { BusinessPartnerOperationRequest, BusinessPartnerOperationRequestDetails } from '@msdyn365-commerce/retail-proxy';\nimport { ArrayExtensions, StringExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport {\n IDataTableProps,\n IHeadingsProperty,\n ITableItemProps,\n ITableRowProps,\n Table,\n TableDataType\n} from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { IB2bRequestsStatusData } from '../b2b-requests-status.data';\nimport { IB2bRequestsStatusProps } from '../b2b-requests-status.props.autogenerated';\n\nexport interface IB2bRequestsTableProps {\n moduleProps: IB2bRequestsStatusProps;\n isMobile: boolean;\n mobileExcludedColumns: string[];\n}\n\nexport interface IB2bRequestsTableResources {\n b2bRequestsTypeCreateProspect: string;\n b2bRequestsTypeAddUser: string;\n b2bRequestsTypeEditUser: string;\n b2bRequestsTypeDeleteUser: string;\n b2bRequestsTypeRequestAccountStatement: string;\n b2bRequestsTypeRequestInvoiceCopy: string;\n b2bRequestsTypeUnknown: string;\n b2bRequestsStatusRequested: string;\n b2bRequestsStatusProcessed: string;\n b2bRequestsStatusError: string;\n b2bRequestsNumberOfItems: string;\n b2bRequestsNumberOfItemsSingular: string;\n b2bRequestsNameDisplay: string;\n b2bRequestsPreviousText: string;\n b2bRequestsNextText: string;\n b2bRequestsUserColumn: string;\n b2bRequestsStatusColumn: string;\n b2bRequestsRequestDateColumn: string;\n b2bRequestsTypeColumn: string;\n b2bRequestsDescriptionColumn: string;\n b2bRequestsAccountStatementDetails: string;\n b2bRequestsInvoiceCopyDetails: string;\n businessUserSelectCheckBoxAriaLabelText?: string;\n sortByAscending?: string;\n sortByDescending?: string;\n}\n\nexport enum RequestsTableColumnHeader {\n Name = 'User',\n Status = 'Status',\n RequestDate = 'Request date',\n Type = 'Request type',\n Description = 'Request detail'\n}\n\nconst getCurrentUrl = (reqContext: IRequestContext): URL => {\n if (MsDyn365.isBrowser) {\n return new URL(window.location.href);\n }\n\n // NOTE: Typing on requestURL is incorrect\n if (reqContext.url.requestUrl.href) {\n return new URL(reqContext.url.requestUrl.href);\n }\n return new URL(reqContext.url.requestUrl.href);\n};\n\nconst getUserName = (request: BusinessPartnerOperationRequest, resources: IB2bRequestsTableResources) => {\n if (StringExtensions.isNullOrEmpty(request.UserFirstName)) {\n if (StringExtensions.isNullOrEmpty(request.UserLastName)) {\n return '';\n }\n\n return request.UserLastName;\n } else if (StringExtensions.isNullOrEmpty(request.UserLastName)) {\n return request.UserFirstName;\n }\n\n return resources.b2bRequestsNameDisplay.replace('{0}', request.UserFirstName!).replace('{1}', request.UserLastName!);\n};\n\nconst formatDate = (context: ICoreContext, date: Date | undefined) => {\n if (date === undefined) {\n return '';\n }\n\n const dateOptions: IDateFormatOptions = { year: 'numeric', month: 'long', day: 'numeric' };\n return context.cultureFormatter.formatDate(date, dateOptions);\n};\n\n/**\n * Gets the value to display for the request details.\n * @param request - The request to parse for the details.\n * @param resources - The resources.\n * @param context - The context.\n * @returns The string to display.\n */\nconst getDetails = (request: BusinessPartnerOperationRequest, resources: IB2bRequestsTableResources, context: ICoreContext) => {\n if (!request.Details) {\n return '';\n }\n\n const requestDetails: BusinessPartnerOperationRequestDetails = request.Details;\n\n const accountStatementStartDateTime = formatDate(context, requestDetails.AccountStatementStartDateTime) || '';\n const accountStatementEndDateTime = formatDate(context, requestDetails.AccountStatementEndDateTime) || '';\n const invoiceId = requestDetails.InvoiceId ?? '';\n\n switch (request.TypeValue) {\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers -- workaround for not being able to use enum value\n case 5:\n if (\n !StringExtensions.isNullOrEmpty(accountStatementStartDateTime) &&\n !StringExtensions.isNullOrEmpty(accountStatementEndDateTime)\n ) {\n return resources.b2bRequestsAccountStatementDetails\n .replace('{0}', accountStatementStartDateTime)\n .replace('{1}', accountStatementEndDateTime);\n }\n\n return '';\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers -- workaround for not being able to use enum value\n case 6:\n if (!StringExtensions.isNullOrEmpty(invoiceId)) {\n return resources.b2bRequestsInvoiceCopyDetails.replace('{0}', invoiceId);\n }\n\n return '';\n default:\n return '';\n }\n};\n\nconst createTableItems = (\n operationRequests: BusinessPartnerOperationRequest[] | undefined,\n props: IB2bRequestsStatusProps\n): ITableRowProps[] => {\n if (!ArrayExtensions.hasElements(operationRequests)) {\n return [];\n }\n\n return operationRequests.map(request => {\n return {\n row: [\n {\n id: props.resources.b2bRequestsTypeColumn,\n type: TableDataType.Text,\n value: getDisplayFriendlyTypeValue(request.TypeValue ?? 0, props.resources)\n } as ITableItemProps,\n {\n id: props.resources.b2bRequestsRequestDateColumn,\n type: TableDataType.Text,\n value: formatDate(props.context, request.CreatedDateTime)\n } as ITableItemProps,\n {\n id: props.resources.b2bRequestsDescriptionColumn,\n type: TableDataType.Text,\n value: getDetails(request, props.resources, props.context)\n } as ITableItemProps,\n {\n id: props.resources.b2bRequestsUserColumn,\n type: TableDataType.Text,\n value: getUserName(request, props.resources)\n } as ITableItemProps,\n {\n id: props.resources.b2bRequestsStatusColumn,\n type: TableDataType.Text,\n value: getDisplayFriendlyStatusValue(request.StatusValue ?? 0, props.resources)\n } as ITableItemProps\n ],\n isSelected: false,\n className: props.config.className\n };\n });\n};\n\nconst getDisplayFriendlyTypeValue = (typeValue: number, resources: IB2bRequestsTableResources): string => {\n switch (typeValue) {\n case 1:\n return resources.b2bRequestsTypeCreateProspect;\n case 2:\n return resources.b2bRequestsTypeAddUser;\n case 3:\n return resources.b2bRequestsTypeDeleteUser;\n case 4:\n return resources.b2bRequestsTypeEditUser;\n case 5:\n return resources.b2bRequestsTypeRequestAccountStatement;\n case 6:\n return resources.b2bRequestsTypeRequestInvoiceCopy;\n default:\n return resources.b2bRequestsTypeUnknown;\n }\n};\n\nconst getDisplayFriendlyStatusValue = (statusValue: number, resources: IB2bRequestsTableResources): string => {\n switch (statusValue) {\n case 1:\n return resources.b2bRequestsStatusProcessed;\n case 2:\n return resources.b2bRequestsStatusError;\n default:\n return resources.b2bRequestsStatusRequested;\n }\n};\n\nconst createTableProps = (tableProps: IB2bRequestsTableProps) => {\n const { context, data, resources } = tableProps.moduleProps;\n\n const tableData = createTableItems(data.operationRequests.result, tableProps.moduleProps);\n const tableHeading =\n (ArrayExtensions.hasElements(tableData) &&\n tableData[0].row\n .filter(item => {\n // Check that this is either not mobile or the column should be displayed when mobile.\n return !tableProps.isMobile || !tableProps.mobileExcludedColumns.includes(item.id);\n })\n .map(item => {\n return {\n name: item.id,\n sortable: true,\n ariaLabel: resources.columnSortAriaLabel\n } as IHeadingsProperty;\n })) ||\n [];\n\n return {\n resources: {},\n headings: tableHeading,\n rows: tableData,\n className: `${tableProps.moduleProps.config.className}__table`,\n editLinkText: '',\n deleteLinkText: '',\n viewLinkText: '',\n enableToModify: false,\n actionLinkText: '',\n showCheckBoxes: false,\n isSortable: true,\n showPagination: true,\n minifyActions: tableProps.isMobile,\n excludedColumns: tableProps.isMobile ? tableProps.mobileExcludedColumns : [],\n paginationProperty: {\n skipCount:\n context.request.query?.skip && !isNaN(Number.parseInt(context.request.query.skip, 10))\n ? Number.parseInt(context.request.query.skip, 10)\n : 0,\n itemPerPage: 10,\n prevText: resources.b2bRequestsPreviousText,\n nextText: resources.b2bRequestsNextText,\n paginationText: '',\n url: (context && getCurrentUrl(context.request).href) || ''\n },\n isSingleSelectOnly: true,\n actions: {\n onDelete: undefined,\n onEdit: undefined,\n onView: undefined\n },\n businessUserSelectCheckBoxAriaLabelText: tableProps.moduleProps.resources.businessUserSelectCheckBoxAriaLabelText,\n sortByAscending: tableProps.moduleProps.resources.sortByAscending,\n sortByDescending: tableProps.moduleProps.resources.sortByDescending\n } as IDataTableProps;\n};\n\nexport const B2bRequestsTable: React.FC = (tableProps: IB2bRequestsTableProps) => {\n return ;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { format, Heading, IModuleProps, isMobile, VariantType } from '@msdyn365-commerce-modules/utilities';\nimport { computed } from 'mobx';\nimport * as React from 'react';\nimport { isChannelTypeB2B } from '@msdyn365-commerce/core';\n\nimport { IB2bRequestsStatusData } from './b2b-requests-status.data';\nimport { IB2bRequestsStatusProps, IHeadingData } from './b2b-requests-status.props.autogenerated';\nimport { B2bRequestsTable } from './components/b2b-requests-table';\n\nexport interface IB2bRequestsStatusViewProps extends IB2bRequestsStatusProps {\n b2bRequestsStatus: IModuleProps;\n heading?: React.ReactNode;\n table: React.ReactNode;\n}\n\n/**\n *\n * B2bRequestsStatus component.\n * @extends {React.PureComponent>}\n */\nclass B2bRequestsStatus extends React.PureComponent> {\n @computed get isMobile(): boolean {\n const size = isMobile({ variant: VariantType.Viewport, context: this.props.context.request });\n return size === 'xs';\n }\n\n public render(): JSX.Element | null {\n const { config } = this.props;\n\n if (!isChannelTypeB2B(this.props.context.actionContext.requestContext)) {\n return null;\n }\n\n const className = config.className || '';\n\n const viewProps = {\n ...this.props,\n b2bRequestsStatus: {\n moduleProps: this.props,\n className\n },\n heading: this.renderHeader(className, config.heading),\n table: this.renderTable()\n };\n\n return this.props.renderView(viewProps) as React.ReactElement;\n }\n\n private readonly renderHeader = (className: string, headingData: IHeadingData): React.ReactNode => {\n const itemCount = this.props.data.operationRequests.result?.length ?? 0;\n\n return (\n \n \n {this.getItemNumberDisplayString(itemCount)} \n
\n );\n };\n\n /**\n * Returns columns that needs to be excluded for mobile view.\n * @returns Array of column names.\n */\n private readonly _retrieveExcludedColumns = (): string[] => {\n const { resources } = this.props;\n return [resources.b2bRequestsRequestDateColumn, resources.b2bRequestsDescriptionColumn, resources.b2bRequestsUserColumn];\n };\n\n private readonly renderTable = (): React.ReactNode => {\n return (\n \n );\n };\n\n private readonly getItemNumberDisplayString = (itemCount: number): string => {\n switch (itemCount) {\n case 0:\n return '';\n case 1:\n return format(this.props.resources.b2bRequestsNumberOfItemsSingular, itemCount);\n default:\n return format(this.props.resources.b2bRequestsNumberOfItems, itemCount);\n }\n };\n}\n\nexport default B2bRequestsStatus;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Module } from '@msdyn365-commerce-modules/utilities';\nimport React from 'react';\n\nimport { IB2bRequestsStatusViewProps } from './b2b-requests-status';\n\nconst B2bRequestsStatusView: React.FC = props => {\n const { b2bRequestsStatus, heading, table } = props;\n return (\n \n {heading}\n {table}\n \n );\n};\n\nexport default B2bRequestsStatusView;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport React from 'react';\n\nexport const SignUpText: React.FC<{ text: string }> = (props: { text: string }) => {\n return {props.text}
;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport MsDyn365, * as Msdyn365 from '@msdyn365-commerce/core';\nimport { issueLoyalty, IssueLoyaltyInput } from '@msdyn365-commerce-modules/retail-actions';\nimport {\n Button,\n getPayloadObject,\n getTelemetryAttributes,\n getTelemetryObject,\n IModuleProps,\n ITelemetryContent,\n TelemetryConstant\n} from '@msdyn365-commerce-modules/utilities';\nimport classname from 'classnames';\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\n\nimport { SignUpText } from './components/loyalty-sign-up-small-components';\nimport { ILoyaltySignUpData } from './loyalty-sign-up.data';\nimport { ILoyaltySignUpProps } from './loyalty-sign-up.props.autogenerated';\n\nexport interface IAccountLoyaltyJoinState {\n clicked: boolean;\n}\nexport interface ILoyaltySignUpViewProps extends ILoyaltySignUpProps {\n LoyaltySignUp: IModuleProps;\n heading: React.ReactNode;\n memberHeading: React.ReactNode;\n signInLink: React.ReactElement;\n signUpText: React.ReactElement;\n signUpButton: React.ReactElement;\n detailsLink: React.ReactElement;\n termsLink: React.ReactElement;\n loading: boolean;\n infoMessageBar?: React.ReactNode;\n}\n\n/**\n *\n * LoyaltySignUp component.\n * @extends {React.Component>}\n */\n@observer\nclass LoyaltySignUp extends React.Component, IAccountLoyaltyJoinState> {\n private readonly telemetryContent?: ITelemetryContent;\n private readonly loyaltySignInAttributes: Msdyn365.IDictionary | undefined;\n private readonly loyaltySignUpAttributes: Msdyn365.IDictionary | undefined;\n private readonly loyaltyDetailsLinkAttributes: Msdyn365.IDictionary | undefined;\n private readonly loyaltyTermsLinkAttributes: Msdyn365.IDictionary | undefined;\n\n constructor(props: ILoyaltySignUpProps) {\n super(props);\n this.state = { clicked: false };\n this.telemetryContent = getTelemetryObject(\n this.props.context.request.telemetryPageName!,\n this.props.friendlyName,\n this.props.telemetry\n );\n const payLoad = getPayloadObject('click', this.telemetryContent, TelemetryConstant.SignIn);\n this.loyaltySignInAttributes = getTelemetryAttributes(this.telemetryContent, payLoad);\n payLoad.contentAction.etext = TelemetryConstant.SignUp;\n this.loyaltySignUpAttributes = getTelemetryAttributes(this.telemetryContent, payLoad);\n payLoad.contentAction.etext = TelemetryConstant.LoyaltyDetailLink;\n this.loyaltyDetailsLinkAttributes = getTelemetryAttributes(this.telemetryContent, payLoad);\n payLoad.contentAction.etext = TelemetryConstant.LoyaltyTermsLink;\n this.loyaltyTermsLinkAttributes = getTelemetryAttributes(this.telemetryContent, payLoad);\n }\n\n public shouldComponentUpdate(nextProps: ILoyaltySignUpProps, nextState: IAccountLoyaltyJoinState): boolean {\n if (this.state === nextState && this.props.data === nextProps.data) {\n return false;\n }\n return true;\n }\n\n public render(): JSX.Element | null {\n const {\n config: { className, heading, memberHeading },\n resources,\n context: {\n actionContext,\n request: {\n user: { signInUrl, isAuthenticated }\n }\n },\n data\n } = this.props;\n\n const termsUrl = Msdyn365.getUrlSync('loyaltyTerms', actionContext);\n let loyaltyJoinUrl = `${Msdyn365.getUrlSync('loyaltyJoin', actionContext)}?joiningLoyalty=true`;\n if (MsDyn365.isBrowser) {\n loyaltyJoinUrl = `${window.location.origin}${loyaltyJoinUrl}`;\n }\n const signInurl = `${signInUrl}?ru=${loyaltyJoinUrl}`;\n const completeClass = classname('ms-loyalty-signup', className);\n const loyaltyCard = data.loyaltyCard;\n const hasLoyaltyAccount = loyaltyCard.result && loyaltyCard.result.CardTenderTypeValue !== undefined;\n const customerInformation = data.customerInformation?.result;\n\n const invalidAsyncCustomerState: boolean =\n (this.props.context.app?.config?.canRenderAsyncCustomerDataAsUnmodifiable || false) &&\n (customerInformation?.IsAsyncCustomer || false);\n const viewProps = {\n ...this.props,\n className: completeClass,\n LoyaltySignUp: {\n moduleProps: this.props,\n className: completeClass\n },\n infoMessageBar: invalidAsyncCustomerState && (\n \n ),\n loading: !this.props.context.request.params.isEditor && loyaltyCard?.status === 'LOADING',\n heading: !hasLoyaltyAccount && heading && heading.text && (\n \n ),\n memberHeading: hasLoyaltyAccount && memberHeading && memberHeading.text && (\n \n ),\n signInLink: !isAuthenticated && (\n \n {this.props.resources.joinLoyaltyButtonText}\n \n ),\n signUpText: !hasLoyaltyAccount && ,\n signUpButton: !hasLoyaltyAccount && isAuthenticated && (\n \n {this.props.resources.joinLoyaltyButtonText}\n \n ),\n detailsLink: hasLoyaltyAccount && (\n \n {this.props.resources.viewLoyaltyPageText}\n \n ),\n termsLink: !hasLoyaltyAccount && (\n \n {this.props.resources.loyaltyTermsLinkText}\n \n )\n };\n\n return this.props.renderView(viewProps) as React.ReactElement;\n }\n\n public handleHeadingChange = (event: Msdyn365.ContentEditableEvent) => (this.props.config.heading!.text = event.target.value);\n\n public handleMemberHeadingChange = (event: Msdyn365.ContentEditableEvent) =>\n (this.props.config.memberHeading!.text = event.target.value);\n\n private readonly _issueLoyalty = () => {\n if (this.props.context.request.user.isAuthenticated && !this.state.clicked) {\n this.setState({ clicked: true });\n const input = new IssueLoyaltyInput(this.props.context.request.apiSettings);\n\n issueLoyalty(input, this.props.context.actionContext)\n .then(() => {\n if (MsDyn365.isBrowser) {\n window.location.assign(Msdyn365.getUrlSync('loyalty', this.props.context.actionContext) || '');\n }\n })\n .catch((error: Error) => {\n this.setState({ clicked: false });\n this.props.telemetry.error(error.message);\n this.props.telemetry.debug('Unable to issue loyalty card');\n });\n }\n };\n}\n\nexport default LoyaltySignUp;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Module } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { ILoyaltySignUpViewProps } from './loyalty-sign-up';\n\nconst LoyaltySignUpView: React.FC = props => {\n const {\n LoyaltySignUp,\n heading,\n memberHeading,\n signInLink,\n signUpText,\n signUpButton,\n detailsLink,\n termsLink,\n loading,\n infoMessageBar\n } = props;\n\n if (loading) {\n props.context.telemetry.error('LoyaltySignUp data is empty, module wont render');\n return null;\n }\n\n return (\n \n {infoMessageBar}\n {memberHeading}\n {heading}\n {detailsLink}\n {signUpText}\n {termsLink}\n {signUpButton}\n {signInLink}\n \n );\n};\n\nexport default LoyaltySignUpView;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport {\n Button,\n getPayloadObject,\n getTelemetryAttributes,\n INodeProps,\n ITelemetryContent,\n Modal,\n ModalBody,\n ModalFooter,\n ModalHeader,\n TelemetryConstant\n} from '@msdyn365-commerce-modules/utilities';\nimport React from 'react';\n\nexport interface ILoyaltyTermsModalProps {\n resources: ILoyaltyTermsModalResources;\n returnRef: React.RefObject | undefined;\n checked: boolean;\n isOpen: boolean;\n terms: React.ReactNode;\n telemetryContent?: ITelemetryContent;\n onToggle(): void;\n onSubmit(): void;\n onCheck(): void;\n}\n\nexport interface ILoyaltyTermsModalResources {\n loyaltyTermsHeading: string;\n loyaltyAgreeToTerms: string;\n joinLoyaltyTermsText: string;\n cancelLoyaltyTermsText: string;\n}\n\nexport interface ILoyaltyTermsModalViewProps {\n modal: INodeProps;\n modalHeader: INodeProps;\n modalFooter: INodeProps;\n modalBody: INodeProps;\n heading: React.ReactElement;\n cancelButton: React.ReactElement;\n submitButton: React.ReactElement;\n terms: React.ReactNode;\n checkbox: React.ReactElement;\n agreeText: React.ReactElement;\n agreeSection: INodeProps;\n}\n\nexport const LoyaltyTermsModal = (props: ILoyaltyTermsModalProps): ILoyaltyTermsModalViewProps => {\n const payLoad = getPayloadObject('click', props.telemetryContent!, TelemetryConstant.LoyaltyTermsCancel);\n const loyaltyTermCancelAttributes = getTelemetryAttributes(props.telemetryContent!, payLoad);\n payLoad.contentAction.etext = TelemetryConstant.LoyaltyTermsSubmit;\n const loyaltyTermSubmitAttributes = getTelemetryAttributes(props.telemetryContent!, payLoad);\n payLoad.contentAction.etext = TelemetryConstant.LoyaltyTermsAgree;\n const loyaltyTermCheckboxAttributes = getTelemetryAttributes(props.telemetryContent!, payLoad);\n return {\n modal: {\n tag: Modal,\n className: 'ms-loyalty-terms__modal',\n toggle: props.onToggle,\n applicationNode: 'renderPage',\n isOpen: props.isOpen,\n returnFocusRef: props.returnRef\n },\n modalHeader: { tag: ModalHeader, className: 'ms-loyalty-terms__modal-header', toggle: props.onToggle },\n modalFooter: { tag: ModalFooter, className: 'ms-loyalty-terms__modal-footer' },\n modalBody: { tag: ModalBody, className: 'ms-loyalty-terms__modal-body' },\n cancelButton: (\n \n {props.resources.cancelLoyaltyTermsText}\n \n ),\n submitButton: (\n \n {props.resources.joinLoyaltyTermsText}\n \n ),\n heading: {props.resources.loyaltyTermsHeading}
,\n terms: props.terms,\n agreeSection: { className: 'ms-loyalty-terms__agree-section' },\n checkbox: (\n \n ),\n agreeText: {props.resources.loyaltyAgreeToTerms}
\n };\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { getUrlSync } from '@msdyn365-commerce/core';\nimport { getLoyaltyCardAsync } from '@msdyn365-commerce/retail-proxy/dist/DataActions/StoreOperationsDataActions.g';\nimport { GetLoyaltyCardInput, issueLoyalty, IssueLoyaltyInput } from '@msdyn365-commerce-modules/retail-actions';\nimport { Button, getTelemetryObject, IModuleProps, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport classname from 'classnames';\nimport * as React from 'react';\n\nimport { ILoyaltyTermsModalViewProps, LoyaltyTermsModal } from './components/loyalty-terms-modal';\nimport { ILoyaltyTermsData } from './loyalty-terms.data';\nimport { ILoyaltyTermsProps } from './loyalty-terms.props.autogenerated';\n\nexport interface ILoyaltyTermsState {\n checked: boolean;\n clicked: boolean;\n isModalOpen: boolean;\n}\nexport interface ILoyaltyTermsViewProps extends ILoyaltyTermsProps {\n LoyaltyTerms: IModuleProps;\n modalToggle: React.ReactElement;\n modal: ILoyaltyTermsModalViewProps;\n loading: boolean;\n}\n\n/**\n *\n * LoyaltyTerms component.\n * @extends {React.Component>}\n */\nclass LoyaltyTerms extends React.Component, ILoyaltyTermsState> {\n private readonly toggleRef: React.RefObject;\n\n private readonly telemetryContent: ITelemetryContent;\n\n public constructor(props: ILoyaltyTermsProps) {\n super(props);\n this._toggle = this._toggle.bind(this);\n this._submit = this._submit.bind(this);\n this._checkboxChecked = this._checkboxChecked.bind(this);\n this.toggleRef = React.createRef();\n this.telemetryContent = getTelemetryObject(\n this.props.context.request.telemetryPageName!,\n this.props.friendlyName,\n this.props.telemetry\n );\n let search = this.props.context.request.url.requestUrl.search;\n let isJoining = false;\n if (search) {\n search = search.substring(1);\n const qsps = search.split('&');\n for (const qsp of qsps) {\n const splitQsp = qsp.split('=');\n isJoining = splitQsp[0] === 'joiningLoyalty' && splitQsp[1] === 'true';\n if (isJoining) {\n break;\n }\n }\n }\n\n this.state = {\n isModalOpen: isJoining,\n checked: false,\n clicked: false\n };\n }\n\n public shouldComponentUpdate(nextProps: ILoyaltyTermsProps, nextState: ILoyaltyTermsState): boolean {\n if (this.state === nextState && this.props.data === nextProps.data) {\n return false;\n }\n return true;\n }\n\n public render(): JSX.Element | null {\n const {\n config: { className, hideToggle },\n resources,\n slots: { serviceTerms },\n data: { loyaltyCard },\n context: {\n request: {\n user: { isAuthenticated }\n }\n }\n } = this.props;\n const completeClass = classname('ms-loyalty-terms', className);\n\n const viewProps = {\n ...this.props,\n className: completeClass,\n LoyaltyTerms: {\n moduleProps: this.props,\n className: completeClass\n },\n loading: loyaltyCard.status === 'LOADING',\n modalToggle: hideToggle !== true && (\n \n {resources.joinLoyaltytermsToggleText}\n \n ),\n modal:\n isAuthenticated &&\n loyaltyCard.result &&\n loyaltyCard.result.CardNumber === undefined &&\n LoyaltyTermsModal({\n resources: { ...resources },\n returnRef: this.toggleRef,\n checked: this.state.checked,\n isOpen: this.state.isModalOpen,\n terms: serviceTerms,\n telemetryContent: this.telemetryContent,\n onToggle: this._toggle,\n onSubmit: this._submit,\n onCheck: this._checkboxChecked\n })\n };\n\n return this.props.renderView(viewProps) as React.ReactElement;\n }\n\n private _toggle(): void {\n this.setState({ isModalOpen: !this.state.isModalOpen, checked: false });\n }\n\n private _submit(): void {\n if (this.props.context.request.user.isAuthenticated && !this.state.clicked) {\n this.setState({ clicked: true });\n const input = new IssueLoyaltyInput(this.props.context.request.apiSettings);\n\n issueLoyalty(input, this.props.context.actionContext)\n .then(card => {\n if (this.props.config.redirectToLoyalty) {\n window.location.assign(getUrlSync('loyalty', this.props.context.actionContext) || '');\n } else {\n getLoyaltyCardAsync({ callerContext: this.props.context.actionContext }, card.CardNumber || '')\n .then(fullCard => {\n this.props.context.actionContext.update(\n new GetLoyaltyCardInput(this.props.context.request.apiSettings),\n fullCard\n );\n })\n .catch((error: Error) => {\n this.props.context.actionContext.update(\n new GetLoyaltyCardInput(this.props.context.request.apiSettings),\n card\n );\n this.props.telemetry.error(error.message);\n this.props.telemetry.debug('Unable to fetch loyalty card');\n });\n }\n })\n .catch((error: Error) => {\n this.setState({ clicked: false });\n this.props.telemetry.error(error.message);\n this.props.telemetry.debug('Unable to issue loyalty card');\n });\n }\n }\n\n private _checkboxChecked(): void {\n this.setState({ checked: !this.state.checked });\n }\n}\n\nexport default LoyaltyTerms;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { ILoyaltyTermsViewProps } from './loyalty-terms';\n\nconst LoyaltyTermsView: React.FC = props => {\n const { LoyaltyTerms, modalToggle, modal, loading } = props;\n\n return !loading && modal ? (\n \n {modalToggle}\n \n {modal.heading} \n \n {modal.terms}\n \n {modal.checkbox}\n {modal.agreeText}\n \n \n \n {modal.submitButton}\n {modal.cancelButton}\n \n \n \n ) : null;\n};\n\nexport default LoyaltyTermsView;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Button, getPayloadObject, getTelemetryAttributes, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nexport interface IPasswordResetButton {\n id?: string;\n className: string;\n text: string;\n ariaLabel: string;\n disabled?: boolean;\n telemetryContent?: ITelemetryContent;\n onClick?(event: React.MouseEvent): void;\n}\n\nconst PasswordResetButton: React.FC = ({ id, className, text, ariaLabel, disabled, telemetryContent, onClick }) => {\n const payLoad = getPayloadObject('click', telemetryContent!, text);\n const attributes = getTelemetryAttributes(telemetryContent!, payLoad);\n return (\n \n {text}\n \n );\n};\n\nexport default PasswordResetButton;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport classnames from 'classnames';\nimport * as React from 'react';\n\nexport interface IPasswordResetErrorProps {\n id?: string;\n className: string;\n type?: string;\n message?: string;\n}\n\nconst PasswordResetError: React.FC = ({ id, className, type = 'page', message }) => {\n const errorClassName = `${className}__${type}-error`;\n\n return (\n \n );\n};\n\nexport default PasswordResetError;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { INodeProps } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nexport interface IPasswordResetInputProps {\n id?: string;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n type: any;\n value?: string;\n pattern?: string;\n className: string;\n maxLength?: string;\n onChange?(event: React.ChangeEvent): void;\n}\n\nexport interface IPasswordResetInput {\n key: string;\n AddressItem: INodeProps;\n label: React.ReactNode;\n alert: React.ReactNode;\n input: React.ReactNode;\n}\n\nconst GetMaxLength = (maxLength?: string): number | undefined => {\n if (maxLength) {\n const parsedMaxLength = Number.parseInt(maxLength, 10);\n if (!isNaN(parsedMaxLength)) {\n return parsedMaxLength;\n }\n }\n\n return undefined;\n};\n\nconst PasswordResetInput: React.FC = ({ id, type, value, pattern, className, maxLength, onChange }) => (\n \n);\n\nexport default PasswordResetInput;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as React from 'react';\n\nexport interface IPasswordResetLabel {\n id: string;\n forId: string;\n className: string;\n text: string;\n}\n\nconst PasswordResetLabel: React.FC = ({ id, forId, className, text }) => (\n \n {text}\n \n);\n\nexport default PasswordResetLabel;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as React from 'react';\n\nexport interface IPasswordResetLoadingIcon {\n className: string;\n}\n\nconst PasswordResetLoadingIcon: React.FC = ({ className }) =>
;\n\nexport default PasswordResetLoadingIcon;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as React from 'react';\n\nexport interface IPasswordResetLoadingMessage {\n className: string;\n message: string;\n}\n\nconst PasswordResetLoadingMessage: React.FC = ({ className, message }) => (\n {message}
\n);\n\nexport default PasswordResetLoadingMessage;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as Msdyn365 from '@msdyn365-commerce/core';\nimport { PasswordRegex } from '@msdyn365-commerce-modules/retail-actions';\nimport { getTelemetryObject, IModuleProps, INodeProps, ITelemetryContent, Modal, ModalBody } from '@msdyn365-commerce-modules/utilities';\nimport classnames from 'classnames';\nimport { observable } from 'mobx';\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\n\nimport PasswordResetButtonComponent from './components/password-reset-button';\nimport PasswordResetErrorComponent from './components/password-reset-error';\nimport PasswordResetInputComponent from './components/password-reset-input';\nimport PasswordResetLabelComponent from './components/password-reset-label';\nimport PasswordResetLoadingIconComponent from './components/password-reset-loading-icon';\nimport PasswordResetLoadingMessageComponent from './components/password-reset-loading-message';\nimport { IPasswordResetConfig, IPasswordResetProps } from './password-reset.props.autogenerated';\n\nexport interface IPasswordResetViewState {\n isShowLoading: boolean;\n}\n\nexport interface IPasswordResetItem {\n wrapper: INodeProps;\n key: string;\n label: React.ReactNode;\n errorMessage: React.ReactNode;\n input: React.ReactNode;\n}\n\nexport interface IPasswordResetLocalAccount {\n localAccount: INodeProps;\n items: IPasswordResetItem[];\n errorMessage: React.ReactNode[];\n buttonsWrapper: INodeProps;\n buttons: React.ReactNode[];\n verificationSuccessModal: INodeProps;\n verificationSuccessModalMessage: INodeProps;\n}\n\nexport interface IPasswordResetLoading {\n modal: INodeProps;\n modalBody: INodeProps;\n icon: React.ReactNode;\n message: React.ReactNode;\n}\n\nexport interface IPasswordResetViewProps {\n className: string;\n viewState: IPasswordResetViewState;\n loading: IPasswordResetLoading;\n passwordReset: IModuleProps;\n defaultAADConainer: INodeProps;\n aadConainer: INodeProps;\n heading: React.ReactNode;\n passwordResetLocalAccount: IPasswordResetLocalAccount;\n}\n\n/**\n *\n * PasswordReset component.\n * @extends {React.Component>}\n */\n@observer\nclass PasswordReset extends React.Component> {\n private readonly moduleClassName: string = 'ms-password-reset';\n\n private readonly telemetryContent?: ITelemetryContent;\n\n @observable private newPasswordRegex: string;\n\n @observable private reenterPasswordRegex: string;\n\n @observable private isInitialized: boolean;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private initializationTimer: any;\n\n constructor(props: IPasswordResetProps) {\n super(props);\n\n this.newPasswordRegex = PasswordRegex.defaultRegex.source;\n this.reenterPasswordRegex = PasswordRegex.defaultRegex.source;\n this.isInitialized = false;\n this.telemetryContent = getTelemetryObject(\n this.props.context.request.telemetryPageName!,\n this.props.friendlyName,\n this.props.telemetry\n );\n }\n\n public componentDidMount(): void {\n this._onInit();\n }\n\n // After successful AAD initialization, call initialize method provided by AAD to attach events.\n public componentDidUpdate(): void {\n // eslint-disable-next-line @typescript-eslint/dot-notation, @typescript-eslint/no-unsafe-member-access -- Auto-suppressed.\n if (this.isInitialized && window && window['$element'] && window['$element']['initialize']) {\n // eslint-disable-next-line @typescript-eslint/dot-notation, @typescript-eslint/no-unsafe-member-access -- Auto-suppressed.\n window['$element']['initialize']();\n }\n }\n\n public shouldComponentUpdate(nextProps: IPasswordResetProps, nextState: IPasswordResetViewState): boolean {\n if (this.state === nextState && this.props.data === nextProps.data) {\n return false;\n }\n return true;\n }\n\n public render(): JSX.Element {\n const { config, resources } = this.props;\n\n const viewProps = {\n ...this.props,\n viewState: {\n isShowLoading: !this.isInitialized\n },\n passwordReset: {\n moduleProps: this.props,\n className: classnames(this.moduleClassName, config.className)\n },\n loading: {\n modal: {\n tag: Modal,\n isOpen: true\n },\n modalBody: {\n tag: ModalBody\n },\n icon: ,\n message: \n },\n defaultAADConainer: {\n id: 'api',\n style: { display: 'none' }\n },\n aadConainer: {\n id: this.isInitialized ? 'api' : null,\n className: `${this.moduleClassName}__container`\n },\n heading: config.heading && (\n \n ),\n passwordResetLocalAccount: this._renderLocalAccount()\n };\n\n return this.props.renderView(viewProps) as React.ReactElement;\n }\n\n public handleHeadingChange = (event: Msdyn365.ContentEditableEvent) => (this.props.config.heading!.text = event.target.value);\n\n // eslint-disable-next-line @typescript-eslint/naming-convention\n public _onInit = () => {\n this._prePopulateData();\n this._updateErrorMessage();\n\n // Check if AAD initialization is complete. AAD do not provide any event to subscribe so we need to check variable set by AAD to check initialization status.\n this.initializationTimer = setInterval(() => {\n this._isInitializationSuccessful();\n }, 100);\n setTimeout(() => {\n clearInterval(this.initializationTimer);\n }, 10_000);\n };\n\n // After successful AAD initialization, remove waiting and preload any data, if needed.\n private readonly _isInitializationSuccessful = () => {\n // eslint-disable-next-line @typescript-eslint/dot-notation, @typescript-eslint/no-unsafe-member-access -- Auto-suppressed.\n if (window && window['$diags'] && window['$diags']['initializationSuccessful']) {\n clearInterval(this.initializationTimer);\n this.isInitialized = true;\n }\n };\n\n private readonly _prePopulateData = () => {\n // eslint-disable-next-line @typescript-eslint/dot-notation, @typescript-eslint/no-unsafe-member-access -- Auto-suppressed.\n if (window['SA_FIELDS'] && window['SA_FIELDS']['AttributeFields']) {\n // eslint-disable-next-line @typescript-eslint/dot-notation, @typescript-eslint/no-unsafe-member-access -- Auto-suppressed.\n window['SA_FIELDS']['AttributeFields'].map((obj: { ID: string; PAT: string }) => {\n switch (obj.ID.toLowerCase()) {\n case 'newpassword': {\n this.newPasswordRegex = obj.PAT;\n break;\n }\n case 'reenterpassword': {\n this.reenterPasswordRegex = obj.PAT;\n break;\n }\n default:\n }\n });\n }\n };\n\n private readonly _updateErrorMessage = () => {\n const { resources } = this.props;\n\n // eslint-disable-next-line @typescript-eslint/dot-notation -- Auto-suppressed.\n if (window && window['CONTENT']) {\n const message = {\n verifying_blurb: resources.loadingMessage\n };\n\n // eslint-disable-next-line @typescript-eslint/dot-notation -- Auto-suppressed.\n Object.assign(window['CONTENT'], message);\n }\n };\n\n private _renderLocalAccount(): IPasswordResetLocalAccount {\n const { resources } = this.props;\n return {\n localAccount: {\n id: 'attributeList',\n className: `${this.moduleClassName}__account-items attr`\n },\n items: [\n this._renderInput('newPassword', 'password', resources.newPasswordLabelText, this.newPasswordRegex),\n this._renderInput('reenterPassword', 'password', resources.confirmPasswordLabelText, this.reenterPasswordRegex)\n ],\n errorMessage: [\n ,\n ,\n ,\n \n ],\n buttonsWrapper: {\n className: `${this.moduleClassName}__buttons`\n },\n buttons: [\n ,\n \n ],\n verificationSuccessModal: {\n className: `${this.moduleClassName}__verifying-modal verifying-modal`\n },\n verificationSuccessModalMessage: {\n id: 'verifying_blurb',\n className: `${this.moduleClassName}__verifying-modal-message`\n }\n };\n }\n\n private _renderInput(id: string, type: string, labelText: string, pattern?: string): IPasswordResetItem {\n const className = `${this.moduleClassName}__account-item`;\n return {\n wrapper: {\n className: classnames(className, `${className}-${id}`, 'entry-item', 'attrEntry')\n },\n key: id,\n label: (\n \n ),\n errorMessage: (\n \n ),\n input: (\n \n )\n };\n }\n}\n\nexport default PasswordReset;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { IPasswordResetItem, IPasswordResetLoading, IPasswordResetLocalAccount, IPasswordResetViewProps } from './password-reset';\n\nconst PasswordResetItem: React.FC = ({ wrapper, label, errorMessage, input }) => {\n return (\n \n {label}\n {errorMessage}\n {input}\n \n );\n};\n\nconst LocalAccount: React.FC = ({\n localAccount,\n items,\n errorMessage,\n buttonsWrapper,\n buttons,\n verificationSuccessModal,\n verificationSuccessModalMessage\n}) => {\n return (\n \n {items &&\n items.map((item: IPasswordResetItem) => {\n // eslint-disable-next-line react/jsx-key\n return ;\n })}\n {errorMessage &&\n errorMessage.map((error: React.ReactNode, index: number) => {\n return {error} ;\n })}\n \n {buttons &&\n buttons.map((button: React.ReactNode, index: number) => {\n return {button} ;\n })}\n \n\n \n \n \n \n );\n};\n\nconst PasswordResetLoading: React.FC = ({ modal, modalBody, icon, message }) => {\n return (\n \n \n {icon}\n {message}\n \n \n );\n};\n\nconst PasswordResetView: React.FC = props => {\n const { passwordReset, viewState, loading, defaultAADConainer, aadConainer, heading, passwordResetLocalAccount } = props;\n\n return (\n \n {viewState.isShowLoading && }\n {viewState.isShowLoading && }\n \n {heading}\n {LocalAccount(passwordResetLocalAccount)}\n \n \n );\n};\n\nexport default PasswordResetView;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Button, getPayloadObject, getTelemetryAttributes, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nexport interface ISignInButton {\n id?: string;\n className: string;\n text: string;\n ariaLabel: string;\n disabled?: boolean;\n telemetryContent?: ITelemetryContent;\n onClick?(event: React.MouseEvent): void;\n}\n\nconst SignInButton: React.FC = ({ id, className, text, ariaLabel, telemetryContent, disabled, onClick }) => {\n const payLoad = getPayloadObject('click', telemetryContent!, text);\n const attributes = getTelemetryAttributes(telemetryContent!, payLoad);\n return (\n \n {text}\n \n );\n};\n\nexport default SignInButton;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as React from 'react';\n\nexport interface ISignInDescription {\n className: string;\n description: string;\n}\n\nconst SignInDescription: React.FC = ({ className, description }) => {description}
;\n\nexport default SignInDescription;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport classnames from 'classnames';\nimport * as React from 'react';\n\nexport interface ISignInErrorProps {\n id?: string;\n className: string;\n type?: string;\n message?: string;\n}\n\nconst SignInError: React.FC = ({ id, className, type = 'page', message }) => {\n const errorClassName = `${className}__${type}-error`;\n\n return (\n \n );\n};\n\nexport default SignInError;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { INodeProps } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nexport interface ISignInInputProps {\n id?: string;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n type: any;\n value?: string;\n pattern?: string;\n className: string;\n maxLength?: string;\n ariaLabel?: string;\n onChange?(event: React.ChangeEvent): void;\n}\n\nexport interface ISignInInput {\n key: string;\n AddressItem: INodeProps;\n label: React.ReactNode;\n alert: React.ReactNode;\n input: React.ReactNode;\n}\n\nconst GetMaxLength = (maxLength?: string): number | undefined => {\n if (maxLength) {\n const parsedMaxLength = Number.parseInt(maxLength, 10);\n if (!isNaN(parsedMaxLength)) {\n return parsedMaxLength;\n }\n }\n\n return undefined;\n};\n\nconst SignInInput: React.FC = ({ id, type, value, pattern, className, maxLength, ariaLabel, onChange }) => (\n \n);\n\nexport default SignInInput;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as React from 'react';\n\nexport interface ISignInLabel {\n id: string;\n forId: string;\n className: string;\n text: string;\n}\n\nconst SignInLabel: React.FC = ({ id, forId, className, text }) => (\n \n {text}\n \n);\n\nexport default SignInLabel;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { getPayloadObject, getTelemetryAttributes, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nexport interface ISignInLink {\n id?: string;\n className: string;\n href: string;\n ariaLabel: string;\n text: string;\n telemetryContent?: ITelemetryContent;\n}\n\nconst SignInLink: React.FC = ({ id, className, href, telemetryContent, ariaLabel, text }) => {\n const payLoad = getPayloadObject('click', telemetryContent!, text);\n const attributes = getTelemetryAttributes(telemetryContent!, payLoad);\n return (\n \n {text}\n \n );\n};\n\nexport default SignInLink;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as React from 'react';\n\nexport interface ISignInLoadingIcon {\n className: string;\n}\n\nconst SignInLoadingIcon: React.FC = ({ className }) =>
;\n\nexport default SignInLoadingIcon;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as React from 'react';\n\nexport interface ISignInLoadingMessage {\n className: string;\n message: string;\n}\n\nconst SignInLoadingMessage: React.FC = ({ className, message }) => (\n {message}
\n);\n\nexport default SignInLoadingMessage;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as React from 'react';\n\nexport interface ISignInText {\n className: string;\n text: string;\n}\n\nconst SignInText: React.FC = ({ className, text }) => {text} ;\n\nexport default SignInText;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as Msdyn365 from '@msdyn365-commerce/core';\nimport { EmailRegex } from '@msdyn365-commerce-modules/retail-actions';\nimport { getTelemetryObject, IModuleProps, INodeProps, ITelemetryContent, Modal, ModalBody } from '@msdyn365-commerce-modules/utilities';\nimport classnames from 'classnames';\nimport { observable } from 'mobx';\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\n\nimport SignInButtonComponent from './components/sign-in-button';\nimport SignInDescriptionComponent from './components/sign-in-description';\nimport SignInErrorComponent from './components/sign-in-error';\nimport SignInInputComponent from './components/sign-in-input';\nimport SignInLabelComponent from './components/sign-in-label';\nimport SignInLinkComponent from './components/sign-in-link';\nimport SignInLoadingIconComponent from './components/sign-in-loading-icon';\nimport SignInLoadingMessageComponent from './components/sign-in-loading-message';\nimport SignInTextComponent from './components/sign-in-text';\nimport { ISignInConfig, ISignInProps, ISignInResources } from './sign-in.props.autogenerated';\n\nexport interface ISignInViewState {\n isShowLoading: boolean;\n}\n\nexport interface ISignInItem {\n wrapper: INodeProps;\n key: string;\n label: React.ReactNode;\n error: React.ReactNode;\n input: React.ReactNode;\n}\n\nexport interface ISignInSocialItem {\n key: string;\n button: INodeProps;\n image: React.ReactNode;\n text: React.ReactNode;\n}\n\nexport interface ISignInB2BItem {\n key: string;\n button: INodeProps;\n text: React.ReactNode;\n}\n\nexport interface ISignInSocialAccount {\n socialAccounts: INodeProps;\n items: ISignInSocialItem[];\n}\n\nexport interface ISignInB2BAccount {\n socialAccounts: INodeProps;\n items: ISignInB2BItem[];\n}\nexport interface ISignInLocalAccount {\n localAccount: INodeProps;\n items: ISignInItem[];\n forgetPassword: React.ReactNode;\n disclaimer: React.ReactNode;\n error: React.ReactNode;\n signInButton: React.ReactNode;\n}\n\nexport interface ISignInLoading {\n modal: INodeProps;\n modalBody: INodeProps;\n icon: React.ReactNode;\n message: React.ReactNode;\n}\n\nexport interface ISignInViewProps {\n className: string;\n viewState: ISignInViewState;\n signIn: IModuleProps;\n loading: ISignInLoading;\n defaultAADConainer: INodeProps;\n aadConainer: INodeProps;\n signInSection: INodeProps;\n signInSectionHeading: React.ReactNode;\n signInLocalAccount: ISignInLocalAccount;\n signInSocialAccount: ISignInSocialAccount;\n signInB2BAccount: ISignInB2BAccount;\n signUpSection: INodeProps;\n signUpSectionHeading: React.ReactNode;\n signUpDescription: React.ReactNode;\n signUpLink: React.ReactNode;\n}\n\n/**\n * SignIn component\n * All AAD related module is rendered on AAD page and we need to respect HTML contract provide by AAD.\n * Please ensure any change in module don't break contract with AAD.\n * @extends {React.Component>}\n */\n@observer\nclass SignIn extends React.Component> {\n private readonly moduleClassName: string = 'ms-sign-in';\n\n private readonly telemetryContent?: ITelemetryContent;\n\n @observable private emailId: string;\n\n @observable private emailRegex: string;\n\n @observable private isInitialized: boolean;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private initializationTimer: any;\n\n constructor(props: ISignInProps) {\n super(props);\n this.emailRegex = EmailRegex.defaultRegex.source;\n this.isInitialized = false;\n this.telemetryContent = getTelemetryObject(\n this.props.context.request.telemetryPageName!,\n this.props.friendlyName,\n this.props.telemetry\n );\n this.emailId = 'logonIdentifier';\n }\n\n public componentDidMount(): void {\n this._prePopulateData();\n this._onInit();\n }\n\n // After successful AAD initialization, call initialize method provided by AAD to attach events.\n public componentDidUpdate(): void {\n // eslint-disable-next-line @typescript-eslint/dot-notation, @typescript-eslint/no-unsafe-member-access -- Auto-suppressed.\n if (this.isInitialized && window && window['$element'] && window['$element']['initialize']) {\n // eslint-disable-next-line @typescript-eslint/dot-notation, @typescript-eslint/no-unsafe-member-access -- Auto-suppressed.\n window['$element']['initialize']();\n }\n }\n\n public shouldComponentUpdate(nextProps: ISignInProps, nextState: ISignInViewState): boolean {\n if (this.state === nextState && this.props.data === nextProps.data) {\n return false;\n }\n return true;\n }\n\n public render(): JSX.Element {\n const config: ISignInConfig = this.props.config || {};\n const resources: ISignInResources = this.props.resources || {};\n\n const viewProps = {\n ...this.props,\n viewState: {\n isShowLoading: !this.isInitialized\n },\n signIn: {\n moduleProps: this.props,\n className: classnames(this.moduleClassName, config.className)\n },\n loading: {\n modal: {\n tag: Modal,\n isOpen: true\n },\n modalBody: {\n tag: ModalBody\n },\n icon: ,\n message: \n },\n defaultAADConainer: {\n id: 'api',\n style: { display: 'none' }\n },\n aadConainer: {\n id: this.isInitialized ? 'api' : null,\n className: `${this.moduleClassName}__container`\n },\n signInSection: {\n className: `${this.moduleClassName}__sign-in-section`\n },\n signInSectionHeading: (\n \n ),\n signInLocalAccount: {\n localAccount: {\n className: `${this.moduleClassName}__account-items localAccount`\n },\n items: [\n this._renderInput(\n this.emailId,\n 'email',\n resources.emailAddressLabelText,\n resources.emailAddressAriaLabel,\n this.emailRegex\n ),\n this._renderInput('password', 'password', resources.passwordLabelText)\n ],\n forgetPassword: (\n \n ),\n disclaimer: config.signInDisclaimer && (\n \n ),\n error: ,\n signInButton: (\n \n )\n },\n signInSocialAccount: {\n socialAccounts: {\n className: `${this.moduleClassName}__social-accounts`\n },\n items: [\n this._renderSocialAccount(\n 'FacebookExchange',\n resources.facebookButtonText,\n resources.facebookButtonAriaLabel,\n config.facebookIcon\n ),\n this._renderSocialAccount(\n 'MicrosoftAccountExchange',\n resources.microsoftButtonText,\n resources.microsoftButtonAriaLabel,\n config.microsoftIcon\n )\n ]\n },\n signInB2BAccount: {\n socialAccounts: {\n className: `${this.moduleClassName}__b2b-social-accounts`\n },\n items: [\n this._renderB2BSocialAccount(\n 'StoreManagerB2BSignin',\n resources.b2bButtonText,\n resources.b2bButtonAriaLabel,\n config.displayB2bAccountManagerSignin\n )\n ]\n },\n signUpSection: {\n className: `${this.moduleClassName}__sign-up-section`\n },\n signUpSectionHeading: (\n \n ),\n signUpDescription: (\n \n ),\n signUpLink: (\n \n )\n };\n\n return this.props.renderView(viewProps) as React.ReactElement;\n }\n\n public handleParagraphChange = (event: Msdyn365.ContentEditableEvent) => (this.props.config.signInDisclaimer = event.target.value);\n\n public handleSignInHeadingChange = (event: Msdyn365.ContentEditableEvent) =>\n (this.props.config.signInHeading.text = event.target.value);\n\n public handleSignUpHeadingChange = (event: Msdyn365.ContentEditableEvent) =>\n (this.props.config.signUpHeading.text = event.target.value);\n\n private readonly _onInit = () => {\n this._prePopulateData();\n this._updateErrorMessage();\n\n // Check if AAD initialization is complete. AAD do not provide any event to subscribe so we need to check variable set by AAD to check initialization status.\n this.initializationTimer = setInterval(() => {\n this._isInitializationSuccessful();\n }, 100);\n setTimeout(() => {\n clearInterval(this.initializationTimer);\n }, 10_000);\n };\n\n // After successful AAD initialization, remove waiting and preload any data, if needed.\n private readonly _isInitializationSuccessful = () => {\n // eslint-disable-next-line @typescript-eslint/dot-notation, @typescript-eslint/no-unsafe-member-access -- Auto-suppressed.\n if (window && window['$diags'] && window['$diags']['initializationSuccessful']) {\n clearInterval(this.initializationTimer);\n this.isInitialized = true;\n }\n };\n\n private readonly _prePopulateData = () => {\n // eslint-disable-next-line @typescript-eslint/dot-notation, @typescript-eslint/no-unsafe-member-access -- Auto-suppressed.\n if (window && window['CONTENT'] && window['CONTENT']['email_pattern']) {\n // eslint-disable-next-line @typescript-eslint/dot-notation, @typescript-eslint/no-unsafe-member-access -- Auto-suppressed.\n this.emailRegex = window['CONTENT']['email_pattern'];\n }\n\n // eslint-disable-next-line @typescript-eslint/dot-notation, @typescript-eslint/no-unsafe-member-access -- Auto-suppressed.\n if (window['SA_FIELDS'] && window['SA_FIELDS']['AttributeFields']) {\n // @ts-expect-error\n this.emailId = (window.SA_FIELDS.AttributeFields || [])[0].ID || this.emailId;\n }\n };\n\n private readonly _updateErrorMessage = () => {\n const resources: ISignInResources = this.props.resources || {};\n\n // eslint-disable-next-line @typescript-eslint/dot-notation -- Auto-suppressed.\n if (window && window['CONTENT']) {\n const errorMessages = {\n requiredField_email: resources.requriedEmailError,\n requiredField_password: resources.requriedPasswordError,\n invalid_email: resources.invalidEmailError,\n invalid_password: resources.invalidPasswordError,\n unknown_error: resources.unknownError\n };\n\n // eslint-disable-next-line @typescript-eslint/dot-notation -- Auto-suppressed.\n Object.assign(window['CONTENT'], errorMessages);\n }\n };\n\n private _renderInput(id: string, type: string, labelText: string, ariaLabel?: string, pattern?: string): ISignInItem {\n const className = `${this.moduleClassName}__account-item`;\n return {\n wrapper: {\n className: classnames(className, `${className}-${id}`, 'entry-item', 'attrEntry')\n },\n key: id,\n label: (\n \n ),\n error: (\n \n ),\n input: (\n \n )\n };\n }\n\n private _renderSocialAccount(id: string, text: string, ariaLabel: string, iconImage?: Msdyn365.IImageData): ISignInSocialItem {\n return {\n key: id,\n button: {\n id,\n tag: 'button',\n className: classnames(\n `${this.moduleClassName}__social-account`,\n `${this.moduleClassName}__social-account-${id}`,\n 'accountButton',\n 'msc-btn'\n ),\n 'aria-label': ariaLabel\n },\n image: this._createImageMarkup(iconImage),\n text: \n };\n }\n\n private _renderB2BSocialAccount(\n id: string,\n text: string,\n ariaLabel: string,\n _displayB2bAccountManagerSignin: boolean | undefined\n ): ISignInB2BItem | null {\n if (_displayB2bAccountManagerSignin) {\n return {\n key: id,\n button: {\n id,\n tag: 'button',\n className: classnames(\n `${this.moduleClassName}__social-account`,\n `${this.moduleClassName}__social-account-${id}`,\n 'accountButton',\n 'msc-btn'\n ),\n 'aria-label': ariaLabel\n },\n text: \n };\n }\n return null;\n }\n\n private _createImageMarkup(iconImage?: Msdyn365.IImageData): React.ReactNode | null {\n if (iconImage) {\n const imageProps = {\n gridSettings: this.props.context.request.gridSettings || {},\n imageSettings: iconImage && iconImage.imageSettings\n };\n const pictureClassName = `${this.moduleClassName}__social-account-picture`;\n return (\n \n \n
\n );\n }\n return null;\n }\n}\n\nexport default SignIn;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport {\n ISignInItem,\n ISignInLoading,\n ISignInLocalAccount,\n ISignInSocialAccount,\n ISignInSocialItem,\n ISignInB2BAccount,\n ISignInB2BItem,\n ISignInViewProps\n} from './sign-in';\n\nconst LocalAccount: React.FC = ({ localAccount, items, forgetPassword, disclaimer, error, signInButton }) => {\n return (\n \n {items &&\n items.map((item: ISignInItem) => {\n return (\n \n {item.label}\n {item.error}\n {item.input}\n \n );\n })}\n {forgetPassword}\n {disclaimer}\n {error}\n {signInButton}\n \n );\n};\n\nconst SocialAccount: React.FC = ({ socialAccounts, items }) => {\n return (\n \n {items &&\n items.map((item: ISignInSocialItem) => {\n return (\n \n {item.image}\n {item.text}\n \n );\n })}\n \n );\n};\n\nconst B2BAccount: React.FC = ({ socialAccounts, items }) => {\n return (\n \n {items &&\n items.map((item: ISignInB2BItem) => {\n return (\n item && (\n \n {item.text}\n \n )\n );\n })}\n \n );\n};\n\nconst SignInLoading: React.FC = ({ modal, modalBody, icon, message }) => {\n return (\n \n \n {icon}\n {message}\n \n \n );\n};\n\nconst SignInView: React.FC = props => {\n const {\n signIn,\n viewState,\n loading,\n defaultAADConainer,\n aadConainer,\n signInSection,\n signUpSection,\n signInSectionHeading,\n signInLocalAccount,\n signInSocialAccount,\n signUpSectionHeading,\n signInB2BAccount,\n signUpDescription,\n signUpLink\n } = props;\n\n return (\n \n {viewState.isShowLoading && }\n {viewState.isShowLoading && }\n \n \n {signInSectionHeading}\n {LocalAccount(signInLocalAccount)}\n {SocialAccount(signInSocialAccount)}\n {B2BAccount(signInB2BAccount)}\n \n \n {signUpSectionHeading}\n {signUpDescription}\n {signUpLink}\n \n \n \n );\n};\n\nexport default SignInView;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport MsDyn365, { IRequestContext } from '@msdyn365-commerce/core';\nimport {\n AccountStatementRequest,\n BusinessPartnerOperationDeliveryType,\n BusinessPartnerUser,\n BusinessPartnerUsersDataActions\n} from '@msdyn365-commerce/retail-proxy';\nimport { AdminRequestStatementButton, RequestStatementModal } from '@msdyn365-commerce-modules/account-management';\nimport {\n addOrganizationUser,\n AddOrganizationUserInput,\n ArrayExtensions,\n deleteOrganizationUser,\n DeleteOrganizationUserInput,\n editOrganizationUser,\n EditOrganizationUserInput,\n EmailRegex,\n Random,\n StringExtensions\n} from '@msdyn365-commerce-modules/retail-actions';\nimport {\n Button,\n getPayloadObject,\n getTelemetryAttributes,\n getTelemetryObject,\n Heading,\n IDataTableProps,\n IHeadingsProperty,\n IModuleProps,\n INodeProps,\n IPayLoad,\n ITableItemProps,\n ITableRowProps,\n ITelemetryContent,\n Table,\n TableDataType,\n TelemetryConstant\n} from '@msdyn365-commerce-modules/utilities';\nimport classnames from 'classnames';\nimport { computed, observable } from 'mobx';\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\n\nimport { IBusinessOrganizationListData } from './business-organization-list.data';\nimport { IBusinessOrganizationListProps, IBusinessOrganizationListResources } from './business-organization-list.props.autogenerated';\nimport { FormButton, FormFieldError, FormInput, FormLabel, IBusinessFormItem, IUserFormItem } from './components';\n\nexport interface IBusinessOrganizationListViewProps extends IBusinessOrganizationListProps {\n OrganizationUserList: IModuleProps;\n moduleContainer: INodeProps;\n heading: React.ReactNode;\n noUsersText?: string;\n addUserButton?: React.ReactNode;\n search?: React.ReactNode;\n organizationListTable: React.ReactNode;\n form?: IFormViewProps;\n formItems?: IUserFormItem[];\n formType: FormType;\n deleteUserForm?: React.ReactNode;\n viewUserDetails?: React.ReactNode;\n modalHeading?: React.ReactNode;\n modalState?: boolean;\n requestAccountStatementButton: React.ReactNode;\n requestStatementModal: React.ReactNode;\n toggleModal?(): void;\n}\n\nexport interface IBusinessOrganizationListState {\n isReady: boolean;\n formItems: IUserFormItem[];\n isFormActive: boolean;\n formType: FormType;\n selectedUserData?: BusinessPartnerUser;\n referenceBack?: HTMLButtonElement | null;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n displayedUserData?: any;\n refresh: boolean;\n isModalOpen: boolean;\n hasFormError: boolean;\n hasActionError: boolean;\n isStatementRequestModalOpen: boolean;\n statementRequestFromDateString: string;\n statementRequestToDateString: string;\n isStatementRequestAdminDropdownOpen: boolean;\n statementRequestFullOrg: boolean;\n statementRequestMaxDateString?: string;\n businessUserActionRetailErrorMsg: string;\n}\n\ntype GridSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport enum FormType {\n None = 'NONE',\n Edit = 'EDIT',\n Remove = 'REMOVE',\n View = 'VIEW',\n Add = 'ADD'\n}\n\nexport enum InputType {\n Text = 'text',\n Email = 'email'\n}\n\nexport enum InputID {\n FirstName = 'FirstName',\n LastName = 'LastName',\n B2BUserId = 'B2BUserId',\n Email = 'Email',\n SpendingLimit = 'SpendingLimit',\n Status = 'Status',\n FullName = 'Name'\n}\n\nexport interface IFormViewProps {\n modalClassName: string;\n FormWrapper: INodeProps;\n modalHeading?: string;\n modalDescription?: React.ReactNode;\n inputs?: IBusinessFormItem[];\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n selectedUser?: any;\n buttons?: React.ReactNode[];\n errorMessage?: React.ReactNode[];\n resources: IBusinessOrganizationListResources;\n toggle?(): void;\n}\n\nexport const renderInputSection = (\n inputs: IUserFormItem[],\n className: string,\n asteriskAfterLabel: string,\n onInputChange: (event: React.ChangeEvent) => void\n): IBusinessFormItem[] => {\n return inputs.map(element => {\n const { customClass, id, type, label, maxChars, isRequired, pattern, value, isDisabled, fieldReference } = element;\n return {\n wrapper: {\n className: classnames(className, id, customClass)\n },\n key: id,\n label: ,\n errorMessage: ,\n input: (\n \n )\n };\n });\n};\n\ninterface IUserTableItemProps extends ITableItemProps {\n user: BusinessPartnerUser;\n}\n\n/**\n *\n * BusinessOrganizationList component.\n * @extends {React.PureComponent>}\n */\n@observer\nclass BusinessOrganizationList extends React.Component<\n IBusinessOrganizationListProps,\n IBusinessOrganizationListState\n> {\n public BusinessFormDefaultInputs: IUserFormItem[] = [\n {\n id: InputID.FirstName,\n type: InputType.Text,\n label: this.props.resources.businessUserFirstNameLabelText,\n value: '',\n isRequired: true,\n customClass: 'width-50'\n },\n {\n id: InputID.LastName,\n type: InputType.Text,\n label: this.props.resources.businessUserLastNameLabelText,\n value: '',\n isRequired: true,\n customClass: 'width-50'\n },\n {\n id: InputID.Email,\n type: InputType.Email,\n label: this.props.resources.businessUserEmailAddressLabelText,\n value: '',\n isRequired: true,\n pattern: EmailRegex.defaultRegex.source,\n customClass: 'width-100'\n },\n {\n id: InputID.SpendingLimit,\n type: InputType.Text,\n label: this.props.resources.businessUserSpendingLimitLabelText,\n value: '',\n isRequired: false,\n customClass: 'width-50',\n maxChars: this.props.config?.maxLength\n }\n ];\n\n @observable\n private _viewport: GridSize;\n\n private readonly delayFocus: number = 110;\n\n private formChildReference: React.RefObject[] = [];\n\n private userFormEditReference: React.RefObject[] = [];\n\n private userFormDeleteReference: React.RefObject[] = [];\n\n private readonly submitButtonReference: React.RefObject;\n\n private readonly addUserButtonReference: React.RefObject;\n\n private readonly statementRequestButtonReference: React.RefObject;\n\n private readonly moduleClassName: string = 'ms-business-organization-list';\n\n private readonly mobileExcludedColumns: string[];\n\n @computed get isMobile(): boolean {\n return this._viewport === 'xs' || this._viewport === 'sm';\n }\n\n @computed get canSubmitStatementRequest(): boolean {\n return (\n !StringExtensions.isNullOrWhitespace(this.state.statementRequestFromDateString) &&\n !StringExtensions.isNullOrWhitespace(this.state.statementRequestToDateString)\n );\n }\n\n @computed get selectedUserName(): string {\n const { businessUserSelectedUserDisplayName } = this.props.resources;\n return this.state.selectedUserData\n ? businessUserSelectedUserDisplayName\n .replace('{firstName}', this.state.selectedUserData.FirstName || '')\n .replace('{lastName}', this.state.selectedUserData.LastName || '')\n : '';\n }\n\n private readonly telemetryContent?: ITelemetryContent;\n\n private readonly payLoad: IPayLoad;\n\n constructor(props: IBusinessOrganizationListProps) {\n super(props);\n this._toggleModal = this._toggleModal.bind(this);\n this._onInputChange = this._onInputChange.bind(this);\n this._handleRemoveUserButton = this._handleRemoveUserButton.bind(this);\n\n this.mobileExcludedColumns = [InputID.Email, InputID.Status, InputID.SpendingLimit];\n this._viewport =\n props.context.request && props.context.request.device && props.context.request.device.Type === 'Mobile' ? 'xs' : 'lg';\n this._updateViewport = this._updateViewport.bind(this);\n this.submitButtonReference = React.createRef();\n this.addUserButtonReference = React.createRef();\n this.statementRequestButtonReference = React.createRef();\n this.state = {\n isReady: false,\n formItems: this.addedReference(),\n isFormActive: false,\n formType: FormType.None,\n refresh: true,\n isModalOpen: false,\n hasFormError: false,\n hasActionError: false,\n isStatementRequestModalOpen: false,\n statementRequestFromDateString: '',\n statementRequestToDateString: '',\n isStatementRequestAdminDropdownOpen: false,\n statementRequestFullOrg: false,\n statementRequestMaxDateString: new Date().toISOString().split('T')[0],\n businessUserActionRetailErrorMsg: ''\n };\n\n this.telemetryContent = getTelemetryObject(\n this.props.context.request.telemetryPageName!,\n this.props.friendlyName,\n this.props.telemetry\n );\n this.payLoad = getPayloadObject('click', this.telemetryContent, '');\n }\n\n public addedReference(): IUserFormItem[] {\n const newFormFields = this.BusinessFormDefaultInputs;\n return newFormFields.map((input, index) => {\n this.formChildReference[Number(index)] = React.createRef();\n input.fieldReference = this.formChildReference[Number(index)];\n return input;\n });\n }\n\n public componentDidMount(): void {\n if (MsDyn365.isBrowser && window.addEventListener) {\n window.addEventListener('resize', this._updateViewport);\n this._updateViewport();\n }\n }\n\n public componentWillUnmount(): void {\n if (MsDyn365.isBrowser && window.removeEventListener) {\n window.removeEventListener('resize', this._updateViewport);\n }\n }\n\n public shouldComponentUpdate(\n nextProps: IBusinessOrganizationListProps,\n nextState: IBusinessOrganizationListState\n ): boolean {\n if (this.state === nextState && this.props.data === nextProps.data) {\n return false;\n }\n\n if (!this.state.isModalOpen && this.state.isModalOpen !== nextState.isModalOpen) {\n setTimeout(() => {\n this.formChildReference[0].current?.focus();\n this.submitButtonReference.current?.focus();\n }, this.delayFocus);\n }\n return true;\n }\n\n public render(): JSX.Element | null {\n const {\n config,\n resources,\n data: { users }\n } = this.props;\n const { className, heading } = config;\n const {\n businessUserAddUserButtonText,\n businessUserLoadingMessage,\n businessUserEmptyListMessage,\n businessUserErrorGettingUsersMessage,\n userAccountStatementLabel,\n fullOrganizationLabel,\n requestStatementButtonLabel,\n statementRequestModalHeaderLabel,\n cancelLabel,\n fromDateLabel,\n toDateLabel,\n submitRequestLabel,\n sendToEmailLabel,\n selectedUserLabel\n } = resources;\n const {\n formItems,\n isFormActive,\n formType,\n isModalOpen,\n statementRequestFromDateString,\n statementRequestToDateString,\n isStatementRequestModalOpen,\n statementRequestMaxDateString\n } = this.state;\n\n const hasUsers = users && users.result && users.result.length > 0;\n this.payLoad.contentAction.etext = TelemetryConstant.AddUser;\n const addUserAttributes = getTelemetryAttributes(this.telemetryContent!, this.payLoad);\n\n const customer = this.props.data.customerInformation?.result;\n\n if (!hasUsers) {\n let errorMessage = '';\n if (users.status === 'LOADING') {\n errorMessage = businessUserLoadingMessage;\n } else if (users.status === 'FAILED') {\n errorMessage = businessUserErrorGettingUsersMessage;\n } else if (users.result && users.result.length === 0) {\n errorMessage = businessUserEmptyListMessage;\n }\n\n const errorProps = {\n ...this.props,\n className,\n OrganizationUserList: {\n moduleProps: this.props,\n className: classnames(this.moduleClassName, className)\n },\n moduleContainer: {\n className: `${this.moduleClassName}__container`\n },\n heading: heading && ,\n addUserButton: (\n \n {businessUserAddUserButtonText}\n \n ),\n noUsersText: {errorMessage}
\n };\n\n return this.props.renderView(errorProps) as React.ReactElement;\n }\n\n const viewProps = {\n ...this.props,\n className,\n OrganizationUserList: {\n moduleProps: this.props,\n className: classnames(this.moduleClassName, className)\n },\n moduleContainer: {\n className: `${this.moduleClassName}__container`\n },\n heading: heading && ,\n modalState: isModalOpen,\n addUserButton: (\n \n {businessUserAddUserButtonText}\n \n ),\n organizationListTable: ,\n toggleModal: this._toggleModal,\n formType,\n form:\n isFormActive && isModalOpen && (formType === FormType.Add || formType === FormType.Edit)\n ? this._renderUserForm()\n : this._renderUserDetails(),\n formItems,\n requestAccountStatementButton: (\n \n ),\n requestStatementModal: (\n \n )\n } as IBusinessOrganizationListViewProps;\n\n return this.props.renderView(viewProps) as React.ReactElement;\n }\n\n // _createTableProps: creates the props for the organization list table\n private _createTableProps(): IDataTableProps {\n const { config, resources, context } = this.props;\n const { tableSort, showPagination, paginationItemPerPage } = config;\n const {\n businessUserPaginationNextButtonText,\n businessUserPaginationPreviousButtonText,\n businessUserEditButtonText,\n businessUserViewUserButtonText,\n businessUserDeleteButtonText,\n businessUserActionButtonText,\n businessUserPaginationAriaLabel,\n columnSortAriaLabel\n } = resources;\n\n const tableData = this._createTableItems();\n const tableHeading =\n (ArrayExtensions.hasElements(tableData) &&\n tableData[0].row.map(item => {\n if (this.isMobile && this.mobileExcludedColumns.includes(item.id)) {\n return undefined;\n }\n return {\n name: item.id,\n sortable: (tableSort && tableSort) || false,\n ariaLabel: columnSortAriaLabel\n } as IHeadingsProperty;\n })) ||\n [];\n\n return {\n resources,\n headings: tableHeading,\n rows: tableData,\n className: `${this.moduleClassName}__table`,\n editLinkText: this.isMobile ? businessUserEditButtonText : '', // '' === showing just icon\n deleteLinkText: this.isMobile ? businessUserDeleteButtonText : '', // '' === showing just icon\n viewLinkText: businessUserViewUserButtonText,\n editLinkTooltip: businessUserEditButtonText,\n deleteLinkTooltip: businessUserDeleteButtonText,\n viewLinkTooltip: businessUserViewUserButtonText,\n enableToModify: true,\n actionLinkText: businessUserActionButtonText,\n showCheckBoxes: true,\n isSortable: tableSort,\n resourcePrefix: 'businessUser',\n showPagination,\n minifyActions: this.isMobile,\n excludedColumns: this.isMobile ? this.mobileExcludedColumns : [],\n paginationProperty: {\n skipCount:\n context &&\n context.request &&\n context.request.query &&\n context.request.query.skip &&\n !isNaN(Number.parseInt(context.request.query.skip, 10))\n ? Number.parseInt(context.request.query.skip, 10)\n : 0,\n itemPerPage: paginationItemPerPage || 10,\n prevText: businessUserPaginationPreviousButtonText,\n nextText: businessUserPaginationNextButtonText,\n paginationText: businessUserPaginationAriaLabel,\n url: (context && this._getCurrentUrl(context.request).href) || ''\n },\n isSingleSelectOnly: true,\n tableAriaLabel: resources.tableAriaLabel,\n tableTabIndex: 0,\n businessUserSelectCheckBoxAriaLabelText: resources.businessUserSelectCheckBoxAriaLabelText,\n sortByAscending: resources.sortByAscending,\n sortByDescending: resources.sortByDescending,\n actions: {\n onDelete: this._handleDeleteIcon,\n onEdit: this._handleEditIcon,\n onView: (this.isMobile && this._handleViewDetails) || undefined\n },\n formatPrice: this._formatPrice,\n checkBoxCallback: this._onSelectRow\n };\n }\n\n // _createTableItems: converts users recieved from the data-action(IBusinessParterUser[]) to tableRows(ITableItemProps[])\n private _createTableItems(): ITableRowProps[] {\n const {\n resources,\n data: { users }\n } = this.props;\n const { businessUserActiveStatusText, businessUserPendingStatusText, businessUserRemovedStatusText } = resources;\n const usersList = users && users.result;\n\n if (!ArrayExtensions.hasElements(usersList)) {\n return [];\n }\n\n return usersList.map((user, index) => {\n let statusString = '';\n this.userFormEditReference[index] = React.createRef();\n this.userFormDeleteReference[index] = React.createRef();\n\n switch (user.StatusValue) {\n case 0:\n statusString = businessUserPendingStatusText;\n break;\n case 1:\n statusString = businessUserActiveStatusText;\n break;\n case 2:\n default:\n statusString = businessUserRemovedStatusText;\n }\n\n return {\n row: [\n {\n id: InputID.FullName,\n type: TableDataType.Text,\n value: `${user.FirstName} ${user.LastName}`,\n user\n } as IUserTableItemProps,\n {\n id: InputID.Email,\n type: TableDataType.Text,\n value: user.Email || '',\n className: `${this.moduleClassName}__padRight`\n } as IUserTableItemProps,\n {\n id: InputID.Status,\n type: TableDataType.Text,\n value: statusString\n } as IUserTableItemProps,\n {\n id: InputID.SpendingLimit,\n type: TableDataType.Price,\n value: user.SpendingLimit || 0\n } as IUserTableItemProps\n ],\n isSelected: false,\n buttonReferences: {\n edit: this.userFormEditReference[index],\n delete: this.userFormDeleteReference[index]\n }\n };\n });\n }\n\n // _toggleModal: closes the modal and resets the form states\n private _toggleModal(): void {\n this.state.referenceBack?.focus();\n this.setState({\n isModalOpen: false,\n isFormActive: false,\n referenceBack: undefined,\n formType: FormType.None\n });\n }\n\n // _handleAddUserButtonClicked: resets input fields, opens the modal, and sets the form states\n private readonly _handleAddUserButtonClicked = () => {\n // Reset form\n const newForm = this.state.formItems;\n newForm.forEach(input => {\n if (input.id === InputID.Email) {\n // Make sure email input is re enabled (it gets disabled when admin is editing user)\n input.isDisabled = false;\n }\n\n input.value = '';\n });\n\n const newUser = { B2BUserId: Random.Guid.generateGuid() } as BusinessPartnerUser;\n\n this.setState({\n formItems: newForm,\n isFormActive: true,\n formType: FormType.Add,\n referenceBack: this.addUserButtonReference.current,\n isModalOpen: true,\n hasFormError: false,\n hasActionError: false,\n selectedUserData: newUser\n });\n };\n\n // _handleAddEditFormSaveButton: triggered on the save button for both add/edit forms. Calls the appropriate data-action and reloads the page when successful\n private readonly _handleAddEditFormSaveButton = async () => {\n const { context } = this.props;\n const { formType, formItems } = this.state;\n\n const updatedUser = this._createBusinessPartner(formItems);\n\n if (formType === FormType.Edit) {\n editOrganizationUser(new EditOrganizationUserInput(updatedUser), context.actionContext)\n .then(() => {\n window.location.reload(false);\n })\n .catch(error => {\n context.telemetry.trace(error);\n this.setState({\n hasActionError: true\n });\n });\n } else {\n addOrganizationUser(new AddOrganizationUserInput(updatedUser), context.actionContext)\n .then(() => {\n window.location.reload(false);\n })\n .catch(error => {\n context.telemetry.trace(error);\n this.setState({\n hasActionError: true,\n businessUserActionRetailErrorMsg: error.message\n });\n });\n }\n };\n\n // _createBusinessPartner: attempts to convert input values(IUserFormItem) to a new user(BusinessPartnerUser)\n private readonly _createBusinessPartner = (inputs: IUserFormItem[]): BusinessPartnerUser => {\n const newUser: BusinessPartnerUser = { ...this.state.selectedUserData! };\n\n inputs.forEach(input => {\n // Deals with input values need need to be converted into numbers\n if (input.id === InputID.SpendingLimit) {\n newUser[input.id] = Number.parseFloat(input.value) || 0;\n } else {\n newUser[input.id] = input.value;\n }\n });\n\n return newUser;\n };\n\n // _handleEditIcon: converts the table row data(ITableItemProps[]) to input fields(IUserFormItem) and opens the edit form\n private readonly _handleEditIcon = (userData: ITableItemProps[], referenceBack?: HTMLButtonElement | null) => {\n // Split full name into first and last\n const possibleName = userData.find(cell => {\n return cell.id === 'Name';\n });\n const fullName = (possibleName && (possibleName.value as string)) || '';\n const lastSpaceIndex = fullName.lastIndexOf(' ');\n const firstName = fullName.substring(0, lastSpaceIndex);\n\n const lastName = fullName.substring(lastSpaceIndex + 1);\n\n // Create clone of formItems, map users information, update state\n const { formItems } = this.state;\n const newForm = formItems;\n\n newForm.forEach(input => {\n switch (input.id) {\n case InputID.FirstName:\n input.value = firstName;\n break;\n case InputID.LastName:\n input.value = lastName;\n break;\n case InputID.Email: // Email can never be null/undefined as it is a required field\n input.isDisabled = true;\n const possibleCell = userData.find(cell => {\n return input.id === cell.id;\n });\n input.value = (possibleCell && (possibleCell.value as string)) || '';\n break;\n default:\n const dataCell = userData.find(cell => {\n return input.id === cell.id;\n });\n input.value = (dataCell && (dataCell.value as string)) || '';\n }\n });\n\n this.setState({\n formItems: newForm,\n isFormActive: true,\n referenceBack,\n formType: FormType.Edit,\n isModalOpen: true,\n hasFormError: false,\n hasActionError: false,\n selectedUserData: (userData[0] as IUserTableItemProps).user\n });\n };\n\n // _handleDeleteIcon: opens removeUser confirmation window\n private readonly _handleDeleteIcon = (userData: ITableItemProps[], referenceBack?: HTMLButtonElement | null) => {\n const newUser: BusinessPartnerUser = { ...(userData[0] as IUserTableItemProps).user };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const displayedUserData: any = {};\n\n userData.forEach((cell: ITableItemProps) => {\n if (cell.id === 'Name') {\n // Split full name into first and last\n const fullName = cell.value as string;\n const lastSpaceIndex = fullName.lastIndexOf(' ');\n displayedUserData.FirstName = fullName.substring(0, lastSpaceIndex);\n\n displayedUserData.LastName = fullName.substring(lastSpaceIndex + 1);\n } else if (cell.type === TableDataType.Price) {\n displayedUserData[cell.id] = this.props.context.cultureFormatter.formatCurrency(cell.value as string);\n } else {\n displayedUserData[cell.id] = cell.value;\n }\n });\n\n this.setState({\n displayedUserData,\n referenceBack,\n selectedUserData: newUser,\n formType: FormType.Remove,\n isModalOpen: true,\n isFormActive: false\n });\n };\n\n // _handleViewDetails: opens user details window\n private readonly _handleViewDetails = (userData: ITableItemProps[]) => {\n const newUser: BusinessPartnerUser = { ...(userData[0] as IUserTableItemProps).user };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const displayedUserData: any = {};\n\n userData.forEach((cell: ITableItemProps) => {\n if (cell.id === 'Name') {\n // Split full name into first and last\n const fullName = cell.value as string;\n const lastSpaceIndex = fullName.lastIndexOf(' ');\n displayedUserData.FirstName = fullName.substring(0, lastSpaceIndex);\n\n displayedUserData.LastName = fullName.substring(lastSpaceIndex + 1);\n } else if (cell.type === TableDataType.Price) {\n displayedUserData[cell.id] = this.props.context.cultureFormatter.formatCurrency(cell.value as string);\n } else {\n displayedUserData[cell.id] = cell.value;\n }\n });\n\n this.setState({\n displayedUserData,\n selectedUserData: newUser,\n formType: FormType.View,\n isModalOpen: true,\n isFormActive: false\n });\n };\n\n // _handleRemoveUserButton: triggered on confirmation of removing a user.\n private readonly _handleRemoveUserButton = () => {\n // TODO\n const { context } = this.props;\n const { selectedUserData: deleteUserData } = this.state;\n\n if (deleteUserData) {\n deleteOrganizationUser(new DeleteOrganizationUserInput(deleteUserData), context.actionContext)\n .then(() => {\n window.location.reload(false);\n })\n .catch(error => {\n context.telemetry.trace(error);\n });\n }\n this.setState({\n formType: FormType.None,\n isModalOpen: false\n });\n };\n\n private readonly callbackRemoveButton = () => {\n this._handleRemoveUserButton();\n };\n\n // _renderUserDetails: creates the remove/view form props\n private _renderUserDetails(): IFormViewProps {\n const { resources } = this.props;\n const { formType, displayedUserData } = this.state;\n const {\n businessUserRemoveModalHeaderText,\n businessUserRemoveModalDescription,\n businessUserViewModalHeaderText,\n businessUserCancelButtonText,\n businessUserCancelRemoveUserButtonText,\n businessUserRemoveUserButtonText,\n businessUserErrorUpdatingUsersMessage\n } = resources;\n\n const formClassName = `${this.moduleClassName}__form`;\n const typeClassName = formType === FormType.Remove ? 'type-remove' : 'type-view';\n const handleRemoveButton = this.callbackRemoveButton;\n\n return {\n modalClassName: classnames(`${this.moduleClassName}__modal`, typeClassName),\n FormWrapper: {\n className: formClassName\n },\n modalHeading: formType === FormType.Remove ? businessUserRemoveModalHeaderText : businessUserViewModalHeaderText,\n modalDescription: formType === FormType.Remove && (\n {businessUserRemoveModalDescription}
\n ),\n selectedUser: displayedUserData,\n buttons: [\n formType === FormType.Remove && (\n \n {businessUserRemoveUserButtonText}\n \n ),\n \n {formType === FormType.Remove ? businessUserCancelRemoveUserButtonText : businessUserCancelButtonText}\n \n ],\n errorMessage: [\n \n ],\n resources\n };\n }\n\n // _renderUserForm: creates the add/edit form props\n private _renderUserForm(): IFormViewProps {\n const { resources } = this.props;\n const { formType, formItems, hasFormError, hasActionError, isReady, businessUserActionRetailErrorMsg } = this.state;\n const {\n businessUserEditUserFormHeadingText,\n businessUserAddUserFormHeadingText,\n businessUserSaveButtonArialabel,\n businessUserSaveButtonText,\n businessUserCancelButtonArialabel,\n businessUserCancelButtonText,\n businessUserFieldIncorrectErrorText,\n businessUserActionErrorText,\n businessUserAllFieldsRequiredMessage,\n asteriskAfterLabel\n } = resources;\n\n const formClassName = `${this.moduleClassName}__form`;\n const typeClassName = formType === FormType.Add ? 'type-add' : 'type-edit';\n\n return {\n modalClassName: classnames(`${this.moduleClassName}__modal`, typeClassName),\n FormWrapper: {\n className: formClassName\n },\n modalHeading: formType === FormType.Add ? businessUserAddUserFormHeadingText : businessUserEditUserFormHeadingText,\n modalDescription: formType === FormType.Add && (\n {businessUserAllFieldsRequiredMessage}
\n ),\n inputs: renderInputSection(formItems, `${formClassName}-item`, asteriskAfterLabel, this._onInputChange),\n buttons: [\n ,\n \n ],\n errorMessage: [\n hasFormError && (\n \n ),\n hasActionError && (\n \n )\n ],\n resources\n };\n }\n\n // _onInputChange: updates the fomrItems state on every input change\n private readonly _onInputChange = (event: React.ChangeEvent): void => {\n const newForm = this.state.formItems;\n\n newForm.forEach(item => {\n if (item.id === event.target.id) {\n item.value = event.target.value;\n }\n });\n\n // Update state object with latest values and check if form is ready\n // TODO: remove !refresh\n this.setState(prev => ({\n refresh: !prev.refresh,\n isReady: this._isFormReady(),\n formItems: newForm,\n hasFormError: false,\n hasActionError: false\n }));\n };\n\n // _isFormReady: checks whether the current values in the input fields are valid for submission, this will also disable/enable the submit button.\n private readonly _isFormReady = (): boolean => {\n const { formItems } = this.state;\n\n for (const formItem of formItems) {\n // Will return TRUE if:\n // - input field is required and EMPTY\n // OR\n // - pattern provided and value does not match pattern\n // OR\n // - if spendingLimit input --> make sure value can be parsed into an NUMBER\n if (formItem.isRequired && formItem.value.length === 0) {\n return false;\n } else if (formItem.pattern !== undefined && formItem.value.match(formItem.pattern) === null) {\n return false;\n } else if (formItem.id === InputID.SpendingLimit && formItem.value !== '' && isNaN(Number.parseFloat(formItem.value))) {\n this.setState({\n hasFormError: true\n });\n return false;\n }\n }\n\n return true;\n };\n\n private readonly _formatPrice = (price: number): string => {\n return this.props.context.cultureFormatter ? this.props.context.cultureFormatter.formatCurrency(price) : price.toString();\n };\n\n private readonly _getCurrentUrl = (reqContext: IRequestContext): URL => {\n if (MsDyn365.isBrowser) {\n return new URL(window.location.href);\n }\n\n // NOTE: Typing on requestURL is incorrect\n if (reqContext.url.requestUrl.href) {\n return new URL(reqContext.url.requestUrl.href);\n }\n return new URL(reqContext.url.requestUrl.href);\n };\n\n private _updateViewport(): void {\n this._viewport = this._getViewport();\n }\n\n private readonly _getViewport = (): GridSize => {\n const { context } = this.props;\n\n // Always render in mobile viewport on a mobile device\n if (context.request && context.request.device && context.request.device.Type === 'Mobile') {\n return 'xs';\n }\n\n if (MsDyn365.isBrowser && window.innerWidth) {\n const gridSettings = context.request.gridSettings;\n if (gridSettings) {\n if (gridSettings.xs && window.innerWidth <= gridSettings.xs.w) {\n return 'xs';\n } else if (gridSettings.sm && window.innerWidth <= gridSettings.sm.w) {\n return 'sm';\n } else if (gridSettings.md && window.innerWidth <= gridSettings.md.w) {\n return 'md';\n } else if (gridSettings.lg && window.innerWidth <= gridSettings.lg.w) {\n return 'lg';\n }\n return 'xl';\n }\n }\n\n return 'xs';\n };\n\n private readonly _toggleStatementRequestDropdown = (): void => {\n this.setState({\n isStatementRequestAdminDropdownOpen: !this.state.isStatementRequestAdminDropdownOpen\n });\n };\n\n private readonly _updateFromDate = (newFromDate: string) => {\n this.setState({\n statementRequestFromDateString: newFromDate\n });\n };\n\n private readonly _updateToDate = (newToDate: string) => {\n this.setState({\n statementRequestToDateString: newToDate\n });\n };\n\n private readonly _showRequestStatementModal = (isFullOrg: boolean) => {\n this.setState({\n statementRequestFullOrg: isFullOrg,\n isStatementRequestModalOpen: true\n });\n };\n\n private readonly _requestStatement = () => {\n const customer = this.props.data.customerInformation.result!;\n const businessPartnerUsers = this.props.data.users.result!;\n\n const currentUser = businessPartnerUsers.find(element => element.Email === customer.Email);\n const B2BUserId = this._getB2BUserId(currentUser);\n\n const statementRequest: AccountStatementRequest = {\n FromDate: new Date(this.state.statementRequestFromDateString),\n ToDate: new Date(this.state.statementRequestToDateString),\n IsForFullOrganization: this.state.statementRequestFullOrg,\n RequestedUserId: B2BUserId,\n RequestingUserEmail: customer.Email,\n DeliveryTypeValue: BusinessPartnerOperationDeliveryType?.Email || 1\n };\n\n const context = { callerContext: this.props.context.actionContext };\n\n BusinessPartnerUsersDataActions.requestAccountStatementAsync(context, B2BUserId, statementRequest);\n\n this._closeStatementRequestModal();\n };\n\n private readonly _getB2BUserId = (currentUser: BusinessPartnerUser | undefined) => {\n if (this.state.statementRequestFullOrg || !this.state.selectedUserData) {\n return currentUser ? currentUser.B2BUserId : '';\n }\n return this.state.selectedUserData.B2BUserId;\n };\n\n private readonly _closeStatementRequestModal = () => {\n this.setState({\n isStatementRequestModalOpen: false\n });\n this.statementRequestButtonReference.current?.focus();\n };\n\n private readonly _onSelectRow = (records: ITableRowProps[]) => {\n const selectedRow = records.find(rowProps => rowProps.isSelected);\n\n this.setState({\n selectedUserData: selectedRow ? (selectedRow.row[0] as IUserTableItemProps).user : undefined\n });\n };\n}\n\nexport default BusinessOrganizationList;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Modal, ModalBody, ModalFooter, ModalHeader, Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { IBusinessOrganizationListViewProps, IFormViewProps, InputID } from './business-organization-list';\nimport { IBusinessFormItem } from './components/small-components';\n\nconst BusinessFormItem: React.FC = ({ wrapper, label, errorMessage, input }) => {\n return (\n \n {label}\n {errorMessage}\n {input}\n \n );\n};\n\nconst BusinessUserForm: React.FC = (props: IFormViewProps) => {\n const { modalClassName, FormWrapper, modalHeading, modalDescription, inputs, buttons, errorMessage, toggle } = props;\n\n const modalBody = (\n <>\n {modalDescription}\n \n {inputs &&\n inputs.map((item: IBusinessFormItem) => {\n return ;\n })}\n {errorMessage &&\n errorMessage.map((error: React.ReactNode, index: number) => {\n return {error} ;\n })}\n \n >\n );\n\n const modalFooter =\n buttons &&\n buttons.map((button: React.ReactNode, index: number) => {\n return {button} ;\n });\n\n return _renderModal(modalClassName, true, modalHeading, modalBody, modalFooter, toggle);\n};\n\nconst BusinessUserDetails: React.FC = (props: IFormViewProps) => {\n const { modalClassName, FormWrapper, modalHeading, modalDescription, selectedUser, buttons, errorMessage, resources, toggle } = props;\n let modalBody = null;\n\n if (!selectedUser) {\n modalBody = errorMessage;\n } else {\n const { FirstName, LastName } = selectedUser;\n const userFullName = `${FirstName} ${LastName}`;\n\n modalBody = (\n <>\n {modalDescription}\n \n \n {userFullName}\n \n {Object.keys(selectedUser).map((data, index) => {\n if (data === InputID.FirstName || data === InputID.LastName) {\n return null;\n }\n const label = resources[`table${data}HeadingText`] || data;\n return (\n \n {label}\n {': '}\n {selectedUser[data]}\n \n );\n })}\n \n >\n );\n }\n\n const modalFooter =\n buttons &&\n buttons.map((button: React.ReactNode, index: number) => {\n return {button} ;\n });\n\n return _renderModal(modalClassName, true, modalHeading, modalBody, modalFooter, toggle);\n};\n\nconst _getForm = (type: string, formProps: IFormViewProps, toggleModal?: () => void) => {\n switch (type) {\n case 'ADD':\n case 'EDIT':\n return ;\n case 'VIEW':\n case 'REMOVE':\n return ;\n default:\n return null;\n }\n};\n\nconst _renderModal = (\n className: string,\n isModalOpen: boolean,\n headingSection: React.ReactNode,\n bodySection: React.ReactNode,\n footerSection: React.ReactNode,\n toggleModal?: () => void\n) => {\n return (\n \n {headingSection} \n {bodySection} \n {footerSection} \n \n );\n};\n\nconst BusinessOrganizationList: React.FC = props => {\n const {\n OrganizationUserList,\n moduleContainer,\n heading,\n noUsersText,\n addUserButton,\n organizationListTable,\n form,\n formType,\n toggleModal,\n requestAccountStatementButton,\n requestStatementModal\n } = props;\n\n const ButtonList: React.ReactNode = (\n \n {addUserButton}\n {requestAccountStatementButton}\n \n );\n\n if (noUsersText) {\n return (\n \n \n {heading}\n {ButtonList}\n {requestStatementModal}\n {noUsersText}\n \n \n );\n }\n\n return (\n \n \n {heading}\n {ButtonList}\n {requestStatementModal}\n {organizationListTable}\n \n {form && _getForm(formType, form, toggleModal)}\n \n );\n};\n\nexport default BusinessOrganizationList;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport {\n Button,\n format,\n getPayloadObject,\n getTelemetryAttributes,\n INodeProps,\n ITelemetryContent\n} from '@msdyn365-commerce-modules/utilities';\nimport classnames from 'classnames';\nimport * as React from 'react';\n\nimport { InputType } from '../business-organization-list';\n\nexport interface IBusinessForm {\n FormWrapper: INodeProps;\n message?: React.ReactNode;\n items: IBusinessFormItem[];\n buttons: React.ReactNode[];\n errorMessage: React.ReactNode[];\n}\n\nexport interface IBusinessFormItem {\n wrapper: INodeProps;\n key: string;\n label: React.ReactNode;\n errorMessage: React.ReactNode;\n input: React.ReactNode;\n}\n\nexport interface IBusinessFormInput {\n label: React.ReactNode;\n alert: React.ReactNode;\n input: React.ReactNode;\n}\n\nexport interface IUserFormItem {\n id: string;\n type: InputType;\n label: string;\n value: string;\n maxChars?: string;\n isRequired: boolean;\n pattern?: string;\n isDisabled?: boolean;\n customClass?: string;\n fieldReference?: React.RefObject;\n}\n\nexport interface IBusinessFormInputProps {\n id?: string;\n type: string;\n value?: string;\n pattern?: string;\n className: string;\n maxLength?: string;\n isRequired: boolean;\n isDisabled?: boolean;\n placeholder?: string;\n fieldReference?: React.RefObject;\n onChange?(event: React.ChangeEvent): void;\n}\n\nexport const FormInput: React.FC = ({\n id,\n type,\n value,\n pattern,\n className,\n maxLength,\n isRequired,\n isDisabled,\n onChange,\n fieldReference,\n placeholder\n}) => (\n \n);\n\nexport interface IBusinessFormLabel {\n id: string;\n forId: string;\n className: string;\n text: string;\n asteriskText: string;\n}\n\nexport const FormLabel: React.FC = ({ id, forId, className, text, asteriskText }) => (\n \n {format(asteriskText, text)}\n \n);\n\nexport interface IBusinessFormButton {\n id?: string;\n className: string;\n text: string;\n ariaLabel: string;\n disabled?: boolean;\n telemetryContent?: ITelemetryContent;\n onClick?(event: React.MouseEvent): void;\n}\n\nexport const FormButton: React.FC = ({ id, className, text, ariaLabel, telemetryContent, disabled, onClick }) => {\n const payLoad = getPayloadObject('click', telemetryContent!, text);\n const attributes = getTelemetryAttributes(telemetryContent!, payLoad);\n return (\n \n {text}\n \n );\n};\n\nexport interface IBusinessFormErrorProps {\n id?: string;\n className: string;\n type?: string;\n message?: string;\n}\n\nexport const FormFieldError: React.FC = ({ id, className, type = 'page', message }) => {\n const errorClassName = `${className}__${type}-error`;\n\n return (\n \n );\n};\n\nconst GetMaxLength = (maxLength?: string): number | undefined => {\n if (maxLength) {\n const parsedMaxLength = Number.parseInt(maxLength, 10);\n if (!isNaN(parsedMaxLength)) {\n return parsedMaxLength;\n }\n }\n\n return undefined;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as Msdyn365 from '@msdyn365-commerce/core';\nimport { INodeProps } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { IAdditionalContentData, ILinksData } from '../content-block.props.autogenerated';\n\n/**\n * IContentBlockAdditionalContentProps: Interface for\n * Content Block Additional Content Component props.\n */\nexport interface IContentBlockAdditionalContentProps {\n requestContext: Msdyn365.IRequestContext;\n additionalContent: IAdditionalContentData[] | undefined;\n handleAdditionalTextChange(index: number, event: Msdyn365.ContentEditableEvent): void;\n handleAdditionalParagraphChange(index: number, event: Msdyn365.ContentEditableEvent): void;\n handleAdditionalLinkTextChange(linkIndex: number, index: number, event: Msdyn365.ContentEditableEvent): void;\n}\n\n/**\n * IContentBlockAdditionalContentProps: Interface for\n * Content Block Additional Content view props.\n */\nexport interface IContentBlockAdditionalContentViewProps {\n additionalContentNode: INodeProps;\n additionalContentItems?: IContentBlockAdditionalContentItemViewProps[];\n}\n\n/**\n * IContentBlockAdditionalContentProps: Interface for\n * Content Block Additional Content Item view props.\n */\nexport interface IContentBlockAdditionalContentItemViewProps {\n heading: React.ReactNode;\n text: React.ReactNode;\n links: React.ReactNode;\n additionalContentItemContainer: INodeProps;\n additionalContentItemLinks: INodeProps;\n}\n\n/**\n * Renders additional content heading.\n * @param additionalContentHeading - Additional content heading.\n * @param props - Content Block Additional content component props.\n * @param itemIndex - Item index.\n * @returns Heading Node.\n */\nconst renderHeading = (additionalContentHeading: string, props: IContentBlockAdditionalContentProps, itemIndex: number) => {\n const requestContext = props.requestContext;\n return (\n {\n props.handleAdditionalTextChange(itemIndex, event);\n },\n requestContext\n }}\n />\n );\n};\n\n/**\n * Renders additional content heading.\n * @param additionalContentParagraphText - Additional content paragraph text.\n * @param props - Content Block Additional content component props.\n * @param itemIndex - Item index.\n * @returns Paragraph Node.\n */\nconst renderParagraph = (additionalContentParagraphText: string, props: IContentBlockAdditionalContentProps, itemIndex: number) => {\n const requestContext = props.requestContext;\n return (\n {\n props.handleAdditionalTextChange(itemIndex, event);\n },\n requestContext\n }}\n />\n );\n};\n\n/**\n * Renders additional content heading.\n * @param ctaLink - Additional content link.\n * @param props - Content Block Additional content component props.\n * @param itemIndex - Item index.\n * @param linkIndex - Additional content link index.\n * @returns Link Node.\n */\nconst renderLinks = (ctaLink: ILinksData, props: IContentBlockAdditionalContentProps, itemIndex: number, linkIndex: number) => {\n const editableLink: Msdyn365.ILinksData = {\n ariaLabel: ctaLink.ariaLabel,\n className: 'ms-content-block__details__additional-content-cta-links',\n linkText: ctaLink.linkText,\n linkUrl: ctaLink.linkUrl.destinationUrl,\n openInNewTab: ctaLink.openInNewTab,\n role: 'link'\n };\n const requestContext = props.requestContext;\n return (\n {\n props.handleAdditionalLinkTextChange(linkIndex, itemIndex, event);\n },\n requestContext\n }}\n />\n );\n};\n\n/**\n * Create node for each additonal content item.\n * @param item - Content block additonal content item props.\n * @param props - Content Block Additional content component props.\n * @param itemIndex - Item index.\n * @returns IContentBlockAdditionalContentItemViewProps.\n */\nconst assembleNode = (\n item: IAdditionalContentData,\n props: IContentBlockAdditionalContentProps,\n itemIndex: number\n): IContentBlockAdditionalContentItemViewProps => {\n const headingNode = item.heading && renderHeading(item.heading, props, itemIndex);\n const paragraphNode = item.subtext && renderParagraph(item.subtext, props, itemIndex);\n const linksNode = item.links?.map((ctaLink: ILinksData, index: number) => {\n return renderLinks(ctaLink, props, itemIndex, index);\n });\n\n return {\n heading: headingNode,\n text: paragraphNode,\n links: linksNode,\n additionalContentItemContainer: { className: 'ms-content-block__details__additional-content__container' },\n additionalContentItemLinks: { className: 'ms-content-block__details__additional-content-cta' }\n };\n};\n\n/**\n * ContentBlockAdditionalContent component.\n * @param props - Content Block Additional content component props.\n * @returns Content Block Additional content view props.\n */\nexport const contentBlockAdditionalContent = (\n props: IContentBlockAdditionalContentProps\n): IContentBlockAdditionalContentViewProps | undefined => {\n const { additionalContent } = props;\n if (!additionalContent) {\n return undefined;\n }\n\n const reactNodes: IContentBlockAdditionalContentItemViewProps[] = [];\n additionalContent.map((item, index: number) => {\n return reactNodes.push(assembleNode(item, props, index));\n });\n\n return {\n additionalContentNode: { className: 'ms-content-block__details__additional-content' },\n additionalContentItems: reactNodes\n };\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as Msdyn365 from '@msdyn365-commerce/core';\nimport { getPayloadObject, getTelemetryAttributes, ITelemetryContent, onTelemetryClick } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { ILinksData } from '../content-block.props.autogenerated';\n\nexport interface IContentCardLinks {\n links: ILinksData[];\n requestContext: Msdyn365.IRequestContext;\n telemetryContent: ITelemetryContent;\n role?: string;\n onTextChange?(index: number): (event: Msdyn365.ContentEditableEvent) => void;\n}\n\n/**\n *\n * ContentCardLinks component.\n * @extends {React.PureComponent}\n */\nexport class ContentCardLinks extends React.PureComponent {\n public render(): JSX.Element {\n const editableLinks = this._mapEditableLinks(this.props.links);\n return (\n \n {editableLinks && editableLinks.length > 0 ? (\n \n ) : null}\n
\n );\n }\n\n private readonly _mapEditableLinks = (linkdata: ILinksData[]): Msdyn365.ILinksData[] | null => {\n if (!linkdata || linkdata.length === 0) {\n return null;\n }\n const editableLinks: Msdyn365.ILinksData[] = [];\n linkdata.forEach((link, index) => {\n // Construct telemetry attribute to render\n const payLoad = getPayloadObject('click', this.props.telemetryContent, '', '');\n const linkText = link.linkText ? link.linkText : '';\n payLoad.contentAction.etext = linkText;\n const attributes = getTelemetryAttributes(this.props.telemetryContent, payLoad);\n const btnClass = index === 0 ? 'msc-cta__primary' : 'msc-cta__secondary';\n const editableLink: Msdyn365.ILinksData = {\n ariaLabel: link.ariaLabel,\n className: btnClass,\n linkText: link.linkText,\n linkUrl: link.linkUrl.destinationUrl,\n openInNewTab: link.openInNewTab,\n role: this.props.role,\n additionalProperties: attributes,\n onClick: onTelemetryClick(this.props.telemetryContent, payLoad, linkText)\n };\n editableLinks.push(editableLink);\n });\n\n return editableLinks;\n };\n}\nexport default ContentCardLinks;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as Msdyn365 from '@msdyn365-commerce/core';\nimport { ArrayExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport { getTelemetryObject, IModuleProps, INodeProps, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport classnames from 'classnames';\nimport * as React from 'react';\n\nimport { contentBlockAdditionalContent, IContentBlockAdditionalContentViewProps } from './components/additional-content';\nimport LinksComponent from './components/links';\nimport { actionableRegion as region, IContentBlockConfig, IContentBlockProps } from './content-block.props.autogenerated';\n\nexport interface IContentBlockViewProps extends IContentBlockProps<{}> {\n title?: React.ReactNode;\n text?: React.ReactNode;\n image?: React.ReactNode;\n links?: React.ReactNode;\n className?: string;\n contentBlockContainer: IModuleProps;\n imageContainer: INodeProps;\n detailsContainer: INodeProps;\n contentBlockAnchorTag?: INodeProps;\n imageLink?: string;\n imageAriaLabel?: string;\n additionalContent?: IContentBlockAdditionalContentViewProps;\n handleAdditionalText?(): void;\n handleAdditionalParagraph?(): void;\n handleAdditionalLinkTextChange?(): void;\n}\n\n/**\n * Site-builder configuration for the module.\n */\nexport interface IContentBlockFullConfig extends IContentBlockConfig {\n // eslint-disable-next-line @typescript-eslint/naming-convention -- This field comes from SDK.\n msdyn365__moduleLayout?: string;\n}\n\n/**\n * ContentCard component.\n * @extends {React.PureComponent}\n */\nexport class ContentBlock extends React.PureComponent> {\n private readonly telemetryContent: ITelemetryContent = getTelemetryObject(\n this.props.context.request.telemetryPageName!,\n this.props.friendlyName,\n this.props.telemetry\n );\n\n public render(): JSX.Element | null {\n const { heading, paragraph, image, links, className, imageAriaLabel } = this.props.config;\n const contentBlockTitle = heading && (\n \n );\n const imageProps = {\n gridSettings: this.props.context.request.gridSettings ?? {},\n imageSettings: image?.imageSettings\n };\n const contentBlockLinks = links && ArrayExtensions.hasElements(links) && (\n \n );\n const contentBlockText = paragraph && (\n \n );\n const contentBlockImage = (\n \n );\n\n if (!contentBlockTitle && !contentBlockText && !contentBlockLinks) {\n this.props.context.telemetry.error('Content block content is empty, module wont render.');\n return null;\n }\n const contentBlockviewProps = {\n ...this.props,\n title: contentBlockTitle,\n text: contentBlockText,\n image: contentBlockImage,\n links: contentBlockLinks,\n moduleClass: this.props.config.className,\n contentBlockContainer: {\n moduleProps: this.props,\n className: classnames('ms-content-block', className)\n },\n imageContainer: { className: 'ms-content-block__image' },\n detailsContainer: { className: 'ms-content-block__details' },\n contentBlockAnchorTag: {\n tag: 'a',\n className: 'ms-content-block__link',\n role: 'link'\n },\n imageLink: this._getImageLink(),\n imageAriaLabel,\n additionalContent: contentBlockAdditionalContent({\n requestContext: this.props.context.request,\n additionalContent: this.props.config.additionalContent,\n handleAdditionalTextChange: this.handleAdditionalTextChange,\n handleAdditionalParagraphChange: this.handleAdditionalParagraphChange,\n handleAdditionalLinkTextChange: this.handleAdditionalLinkTextChange\n }),\n handleAdditionalText: this.handleAdditionalTextChange,\n handleAdditionalParagraph: this.handleAdditionalParagraphChange,\n handleAdditionalLinkTextChange: this.handleAdditionalLinkTextChange\n };\n\n return this.props.renderView(contentBlockviewProps) as React.ReactElement;\n }\n\n /**\n * To handle text change.\n * @param event - To handle text change event.\n * @name - HandleTextChange\n * @public\n * @returns - The Text value.\n */\n public handleTextChange = (event: Msdyn365.ContentEditableEvent) => (this.props.config.heading!.text = event.target.value);\n\n /**\n * To handle paragraph change.\n * @param event - To handle text change event.\n * @name - HandleParagraphChange\n * @public\n * @returns - The Paragraph value.\n */\n public handleParagraphChange = (event: Msdyn365.ContentEditableEvent) => (this.props.config.paragraph = event.target.value);\n\n /**\n * Handle link text change.\n * @param linkIndex - The link index.\n * @returns - Void.\n */\n public handleLinkTextChange = (linkIndex: number) => (event: Msdyn365.ContentEditableEvent) => {\n if (this.props.config.links && this.props.config.links[Number(linkIndex)]) {\n this.props.config.links[Number(linkIndex)].linkText = event.target.value;\n }\n };\n\n public handleAdditionalTextChange(index: number, event: Msdyn365.ContentEditableEvent): void {\n if (this.props.config.additionalContent) {\n this.props.config.additionalContent[Number(index)].heading = event.target.value;\n }\n }\n\n public handleAdditionalLinkTextChange(linkIndex: number, index: number, event: Msdyn365.ContentEditableEvent): void {\n const additionalContentObject =\n (this.props.config.additionalContent &&\n ArrayExtensions.hasElements(this.props.config.additionalContent) &&\n this.props.config.additionalContent[Number(index)]) ||\n {};\n if (additionalContentObject.links) {\n additionalContentObject.links[Number(linkIndex)].linkText = event.target.value;\n }\n }\n\n public handleAdditionalParagraphChange(index: number, event: Msdyn365.ContentEditableEvent): void {\n if (this.props.config.additionalContent) {\n this.props.config.additionalContent[Number(index)].subtext = event.target.value;\n }\n }\n\n private _getImageLink(): string | null {\n const { imageLink, links, actionableRegion } = this.props.config;\n if (actionableRegion === region.imageAndLinks) {\n if (imageLink?.destinationUrl) {\n return imageLink.destinationUrl;\n } else if (links && ArrayExtensions.hasElements(links) && links[0].linkUrl) {\n return links[0].linkUrl.destinationUrl;\n }\n return null;\n }\n return null;\n }\n}\n\nexport default ContentBlock;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { IContentBlockAdditionalContentItemViewProps, IContentBlockAdditionalContentViewProps } from './components/additional-content';\nimport { IContentBlockViewProps } from './content-block';\n\n/**\n * Render Additional Content.\n * @param additionalContent - Additional content view props.\n * @returns JSX Element.\n */\nconst renderAdditionalContent = (additionalContent: IContentBlockAdditionalContentViewProps) => {\n return (\n \n {additionalContent.additionalContentItems?.map((item: IContentBlockAdditionalContentItemViewProps) => {\n return (\n <>\n {item.heading}\n \n {item.text}\n {item.links} \n \n >\n );\n })}\n \n );\n};\n\nconst ContentBlockView: React.FC = props => {\n const {\n contentBlockContainer,\n imageContainer,\n detailsContainer,\n title,\n text,\n links,\n image,\n contentBlockAnchorTag,\n imageLink,\n imageAriaLabel,\n additionalContent\n } = props;\n\n if (imageLink) {\n return (\n \n \n {image} \n \n \n {title}\n {text}\n {links}\n {additionalContent && renderAdditionalContent(additionalContent)}\n \n \n );\n }\n return (\n \n {image} \n \n {title}\n {text}\n {links}\n {additionalContent && renderAdditionalContent(additionalContent)}\n \n \n );\n};\n\nexport default ContentBlockView;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport {\n IGroup,\n IGroupDelivery,\n IGroups,\n IHeader,\n IList,\n IOrderHistoryViewProps,\n IOrderInformation,\n ISalesOrder\n} from '@msdyn365-commerce-modules/order-management';\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nexport const OrderHistoryOrderInfomation: React.FC = ({\n orderInformationProps,\n salesId,\n receiptId,\n channelName,\n createdDate,\n count,\n amount,\n channelReferenceId\n}) => (\n \n {channelName}\n {salesId}\n {receiptId}\n {createdDate}\n {count}\n {amount}\n {channelReferenceId}\n \n);\n\nexport const OrderHistoryGroupDelivery: React.FC = ({\n deliveryProps,\n heading,\n count,\n processing,\n address,\n trackingInfo\n}) => (\n \n {heading}\n {count}\n {processing}\n {address}\n {trackingInfo}\n \n);\n\nexport const OrderHistoryGroup: React.FC = ({ groupProps, delivery, salesLinesProps, salesLines }) => (\n \n {salesLines && (\n \n {salesLines.map(salesLine => (\n {salesLine.salesLine} \n ))}\n \n )}\n \n);\n\nexport const OrderHistoryGroups: React.FC = ({ groupsProps, groups }) => (\n \n {groups.map((group, index) => (\n \n ))}\n \n);\n\nexport const OrderHistoryHeader: React.FC = ({ headerProps, heading, orderCountLabel, extraActions }) => (\n \n {heading}\n {orderCountLabel}\n {extraActions}\n \n);\n\nexport const OrderHistorySalesOder: React.FC = ({\n salesOrderProps,\n orderInfomation,\n groups,\n orderDetailsLink,\n expandProductsButton\n}) => (\n \n {orderInfomation && }\n {groups && }\n {expandProductsButton}\n {orderDetailsLink}\n \n);\n\nexport const OrderHistoryList: React.FC = ({ listProps, salesOrders }) => (\n \n {salesOrders && salesOrders.map((salesOrder, index) => )}\n \n);\n\nconst OrderHistoryView: React.FC = ({\n orderHistoryProps,\n header,\n alert,\n loading,\n emptyMessage,\n backToShoppingLink,\n list,\n table,\n moreButton\n}) => (\n \n {header && }\n {loading}\n {alert && (\n <>\n {alert}\n {backToShoppingLink}\n >\n )}\n {emptyMessage && (\n \n {emptyMessage}\n {backToShoppingLink}\n \n )}\n {list && }\n {table}\n {moreButton && moreButton}\n \n);\n\nexport default OrderHistoryView;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { ExtensibleEnumeration } from '@msdyn365-commerce/retail-proxy';\nimport { ArrayExtensions, EmailRegex } from '@msdyn365-commerce-modules/retail-actions';\nimport * as React from 'react';\n\nimport { IOrderLookupResources, IOrderLookupSearchAdditionalFieldsData } from '../order-lookup.props.autogenerated';\n\n/**\n * Render label.\n * @param className - Classname for label.\n * @param value - Text for label.\n * @returns -The JSX Element.\n */\nexport const labelGroup = (className: string, value: string): JSX.Element => {\n return {value}
;\n};\n\n/**\n * Error label.\n * @param responseErrorMessage - Error message for label.\n * @param errorMessageClassName - Error message for class name.\n * @returns - Error ReactNode.\n */\nexport const renderErrorLabel = (responseErrorMessage: string, errorMessageClassName: string): React.ReactNode => {\n return responseErrorMessage && {responseErrorMessage}
;\n};\n\n/**\n * Registered user message.\n * @param resources - Resource values.\n * @param signInUrl - Signin url.\n * @param signInLinkClassName - Signin link classname.\n * @param registeredUserClassName - Registered user message classname.\n * @returns - ReactNode.\n */\nexport const renderRegisteredUserMessage = (\n resources: IOrderLookupResources,\n signInUrl: string,\n signInLinkClassName: string,\n registeredUserClassName: string\n): React.ReactNode => {\n const { orderLookupRegisteredUserText, orderLookupViewAccountText, orderLookupSignInLinkText } = resources;\n const message: string = orderLookupRegisteredUserText;\n const infoMessage: string = orderLookupViewAccountText;\n const signInText: string = orderLookupSignInLinkText;\n return (\n \n );\n};\n\n/**\n * EmailValid submit.\n * @param email - Onsubmit of form and button click.\n * @returns - Boolean.\n */\nexport const isEmailValid = (email: string): boolean => {\n return EmailRegex.defaultRegex.test(email);\n};\n\n/**\n * Additional field validation for on submit.\n * @param name - Onsubmit of form and button click.\n * @returns - Boolean.\n */\nexport const isAdditionalFieldValid = (name: string): boolean => {\n const regEx = new RegExp('^(?!\\\\s)[A-Za-z0-9\\\\s]+$', 'u');\n return regEx.test(name);\n};\n\n/**\n * Validate order lookup field against extensible enum.\n * @param orderStatusLookUpParameter - Order lookup parameter.\n * @param orderLookupExtensibleEnum - Order lookup extensible enum.\n * @returns - Boolean.\n */\nexport const validateOrderLookupField = (\n orderStatusLookUpParameter: string,\n orderLookupExtensibleEnum: ExtensibleEnumeration[]\n): boolean => {\n let isValidField: boolean = false;\n for (const item of orderLookupExtensibleEnum) {\n if (item.Name.toLocaleLowerCase() === orderStatusLookUpParameter.toLocaleLowerCase()) {\n isValidField = true;\n return isValidField;\n }\n }\n return isValidField;\n};\n\n/**\n * Validate order lookup additional fields with proxy values.\n * @param value - Value to be validated.\n * @param orderLookupExtensibleEnum - Order lookup extensible enum.\n * @returns - Boolean.\n */\nexport const validateAdditionalFieldWithProxy = (value: string, orderLookupExtensibleEnum: ExtensibleEnumeration[]): boolean => {\n return !orderLookupExtensibleEnum.some(item => item.Name.toLocaleLowerCase() === value.toLocaleLowerCase());\n};\n\n/**\n * Validate order lookup additional fields against extensible enum.\n * @param orderStatusLookUpAdditionalParameters - Order lookup parameter.\n * @param orderLookupExtensibleEnum - Order lookup extensible enum.\n * @returns - Boolean.\n */\nexport const validateOrderLookupAdditionalField = (\n orderStatusLookUpAdditionalParameters: IOrderLookupSearchAdditionalFieldsData[],\n orderLookupExtensibleEnum: ExtensibleEnumeration[]\n): boolean => {\n let isValidAdditionalField: boolean = false;\n if (ArrayExtensions.hasElements(orderStatusLookUpAdditionalParameters)) {\n orderStatusLookUpAdditionalParameters.map(item => {\n const fieldKey: string = item.fieldKey ?? '';\n if (!isValidAdditionalField) {\n isValidAdditionalField = validateAdditionalFieldWithProxy(fieldKey, orderLookupExtensibleEnum);\n }\n return isValidAdditionalField;\n });\n } else {\n isValidAdditionalField = false;\n }\n return isValidAdditionalField;\n};\n\n/**\n * Render validation message if field does not matches with extensible enum.\n * @param orderLookupFieldValidationErrorMessage - Order lookup validation message.\n * @returns - ReactNode.\n */\nexport const renderFieldErrors = (orderLookupFieldValidationErrorMessage: string): React.ReactNode => {\n return {orderLookupFieldValidationErrorMessage}
;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\n\nimport { labelGroup } from '../utilities/order-lookup-utility';\n\n/**\n * Additional input field props.\n */\nexport interface IOrderLookupAdditionalFieldInfoInput {\n className: string;\n ariaLabel: string;\n inputType: string;\n value: string;\n name: string;\n additionalFieldLabel: string;\n additionalFieldLabelClassName: string;\n isValidAdditionalFieldName: boolean;\n additionalFieldValidationMessage: string;\n onChange(event: React.ChangeEvent): void;\n}\n\n/**\n * Order lookup additional field props.\n */\nexport interface IOrderLookupAdditionalFieldInfo {\n additionalFieldLabel: React.ReactNode;\n additionalFieldInput: React.ReactNode;\n additionalFieldError: React.ReactNode;\n}\n\n/**\n * RenderOrderLookupAdditionalFieldInput component.\n */\n@observer\nexport default class RenderOrderLookupAdditionalFieldInput extends React.Component {\n public constructor(props: IOrderLookupAdditionalFieldInfoInput) {\n super(props);\n }\n\n public shouldComponentUpdate(nextProps: IOrderLookupAdditionalFieldInfoInput): boolean {\n if (this.props === nextProps) {\n return false;\n }\n return true;\n }\n\n public render(): JSX.Element | undefined {\n return (\n \n {this._getOrderLookupAdditionalFields().additionalFieldLabel}\n {this._getOrderLookupAdditionalFields().additionalFieldError}\n {this._getOrderLookupAdditionalFields().additionalFieldInput}\n
\n );\n }\n\n /**\n * Function to create the order lookup additional fields.\n * @returns IOrderLookupFieldInfo.\n */\n private _getOrderLookupAdditionalFields(): IOrderLookupAdditionalFieldInfo {\n return {\n additionalFieldLabel: labelGroup(this.props.additionalFieldLabelClassName, this.props.additionalFieldLabel),\n additionalFieldInput: (\n \n \n
\n ),\n additionalFieldError: (\n \n {!this.props.isValidAdditionalFieldName ? this.props.additionalFieldValidationMessage : ''}\n
\n )\n };\n }\n}\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\n\nimport { labelGroup } from '../utilities/order-lookup-utility';\n\n/**\n * Input field props.\n */\nexport interface IOrderLookupFieldInfoInput {\n inputReference?: React.RefObject;\n className: string;\n ariaLabel: string;\n inputType: string;\n value: string;\n name: string;\n orderLookupLabel: string;\n orderLookupLabelClassName: string;\n fieldErrorClassName: string;\n isInputTypeError: boolean;\n isValidInputField: boolean;\n renderAlert(className: string): JSX.Element;\n onChange(event: React.ChangeEvent): void;\n}\n\n/**\n * Order lookup field props.\n */\nexport interface IOrderLookupFieldInfo {\n label: React.ReactNode;\n input: React.ReactNode;\n error: React.ReactNode;\n}\n\n/**\n * RenderOrderLookupInputs component.\n */\n@observer\nexport default class RenderOrderLookupFormFields extends React.Component {\n public constructor(props: IOrderLookupFieldInfoInput) {\n super(props);\n }\n\n public shouldComponentUpdate(nextProps: IOrderLookupFieldInfoInput): boolean {\n if (this.props === nextProps) {\n return false;\n }\n return true;\n }\n\n public render(): JSX.Element | undefined {\n return (\n \n {this._getOrderLookupFields().label}\n {this._getOrderLookupFields().error}\n {this._getOrderLookupFields().input}\n
\n );\n }\n\n /**\n * Function to create the order lookup fields.\n * @returns IOrderLookupFieldInfo.\n */\n private _getOrderLookupFields(): IOrderLookupFieldInfo {\n return {\n label: labelGroup(this.props.orderLookupLabelClassName, this.props.orderLookupLabel),\n input: (\n \n \n
\n ),\n error: (\n \n {this.props.isInputTypeError ? this.props.renderAlert(this.props.name) : ''}\n {this.props.isValidInputField ? this.props.renderAlert(this.props.name) : ''}\n
\n )\n };\n }\n}\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as Msdyn365 from '@msdyn365-commerce/core';\nimport { IActionContext } from '@msdyn365-commerce/core-internal';\nimport { ExtensibleEnumeration, StoreOperationsDataActions } from '@msdyn365-commerce/retail-proxy';\nimport { ArrayExtensions, StringExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport { Button, IModuleProps, INodeProps } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport RenderOrderLookupAdditionalFieldInput from './components/order-lookup-additional-fields';\nimport RenderOrderLookupFormFields from './components/order-lookup-fields';\nimport {\n IOrderLookupProps,\n IOrderLookupSearchAdditionalFieldsData,\n orderStatusLookUpParametersType as orderStatusLookUpParametersTypes\n} from './order-lookup.props.autogenerated';\nimport {\n isAdditionalFieldValid,\n isEmailValid,\n renderErrorLabel,\n renderFieldErrors,\n renderRegisteredUserMessage,\n validateOrderLookupAdditionalField,\n validateOrderLookupField\n} from './utilities/order-lookup-utility';\n\n/**\n * OrderLookup view props.\n */\nexport interface IOrderLookupViewProps extends IOrderLookupProps<{}> {\n additionalProperties: JSX.Element[] | undefined;\n orderLookup: IModuleProps;\n orderLookupContainer: INodeProps;\n orderLookupAdditionalFieldContainer: INodeProps;\n paragraph?: React.ReactNode;\n heading?: React.ReactNode;\n submitButton?: INodeProps;\n submitButtonLabelText?: string;\n orderLookupForm?: INodeProps;\n renderOrderLookupInputField: JSX.Element | undefined;\n orderNumberInput?: JSX.Element | undefined;\n errorMessage?: React.ReactNode;\n fieldErrorMessage?: React.ReactNode;\n registeredUserMessage?: React.ReactNode;\n onChange?(event: React.ChangeEvent): void;\n submit?(): void;\n}\n\n/**\n * OrderLookupSearchValues -- supported values.\n */\nenum OrderLookupSearchValues {\n email = 'email',\n ordernumber = 'ordernumber'\n}\n\n/**\n * To render and handle state for additional order lookup fields.\n */\nexport interface IOrderLookupAdditionalFields {\n labelName: string;\n isValidFieldName: boolean;\n fieldValue: string;\n ariaLabel: string;\n additionalfieldErrorMessage: string;\n}\n\n/**\n * OrderLookup view props.\n */\nexport interface IOrderLookupFormState {\n orderNumber: string;\n email: string;\n isOrdNumberError: boolean;\n isEmailError: boolean;\n isValidEmailError: boolean;\n isReqError: boolean;\n isDisabled: boolean;\n isValidLookupField: boolean;\n isValidAdditionalLookupField: boolean;\n responseErrorMessage: string;\n additionalProperties: IOrderLookupAdditionalFields[];\n}\n\n/**\n *\n * OrderLookup component.\n * @extends {React.PureComponent>}\n */\nclass OrderLookup extends React.PureComponent, IOrderLookupFormState> {\n public orderNumberInputRef: React.RefObject;\n\n public emailInputRef: React.RefObject;\n\n public isEmailValue: boolean = false;\n\n private requiredErrorMessage: string | undefined;\n\n private emailValidationErrorMessage: string | undefined;\n\n private isOrderNumberValue: boolean = false;\n\n private orderLookupExtensibleEnum: ExtensibleEnumeration[] = [];\n\n public constructor(props: IOrderLookupProps<{}>) {\n super(props);\n this.orderNumberInputRef = React.createRef();\n this.emailInputRef = React.createRef();\n const { config } = this.props;\n const { orderLookupSearchAdditionalFields } = config;\n const additionalPropertyStates: IOrderLookupAdditionalFields[] = [];\n\n if (orderLookupSearchAdditionalFields) {\n for (const item of orderLookupSearchAdditionalFields) {\n additionalPropertyStates.push({\n labelName: item.labelName ?? '',\n isValidFieldName: true,\n fieldValue: '',\n ariaLabel: item.ariaLabel ?? '',\n additionalfieldErrorMessage: item.validationMessage ?? ''\n });\n }\n }\n\n this.state = {\n orderNumber: '',\n email: '',\n isOrdNumberError: false,\n isEmailError: false,\n isValidEmailError: false,\n isReqError: false,\n isDisabled: true,\n isValidLookupField: true,\n isValidAdditionalLookupField: false,\n responseErrorMessage: '',\n additionalProperties: additionalPropertyStates\n };\n }\n\n public render(): JSX.Element | null {\n const {\n config: { paragraph, heading },\n resources,\n context\n } = this.props;\n\n const {\n orderLookupDefaultHeadingText,\n orderLookupButtonLabel,\n orderLookupFormAriaLabel,\n orderLookupOrderNumberLabel,\n orderLookupOrderNumberAriaLabel,\n orderLookupSubmitAriaLabel,\n orderLookupFieldValidationErrorMessage\n } = resources;\n\n const { responseErrorMessage, isDisabled, orderNumber, isOrdNumberError } = this.state;\n\n const headingText = StringExtensions.isNullOrEmpty(heading?.text) ? orderLookupDefaultHeadingText : heading?.text;\n const headingTag = heading?.tag ?? 'h1';\n\n const moduleClassName = 'ms-order-lookup';\n const orderLookupContainerClassName = `${moduleClassName}__details`;\n const orderLookupHeadingClassName = `${orderLookupContainerClassName}__heading`;\n const orderLookupFormClassName = `${orderLookupContainerClassName}__form`;\n const orderLookupAdditionalFiledContainerClassName = `${orderLookupFormClassName}__additional-fields-container`;\n const orderLookupFormFieldsClassName = `${orderLookupFormClassName}__fields`;\n const orderNumberLabelClassName = `${orderLookupFormFieldsClassName}__order-number-label`;\n const orderNumberInputErrorClassName = `${orderLookupFormFieldsClassName}__order-number-input-error`;\n const submitButtonClassName = `${orderLookupFormClassName}__submit`;\n const labelErrorMessageClassName = `${moduleClassName}__error-message`;\n const registeredUserClassName = `${moduleClassName}__registered-user`;\n const signinLinkClassName = `${registeredUserClassName}__sign-in-link msc-btn`;\n\n const orderLookupHeading = (\n \n );\n\n const viewProps: IOrderLookupViewProps = {\n ...this.props,\n orderLookup: {\n moduleProps: this.props,\n className: moduleClassName\n },\n\n orderLookupContainer: {\n className: orderLookupContainerClassName\n },\n orderLookupAdditionalFieldContainer: {\n className: orderLookupAdditionalFiledContainerClassName\n },\n paragraph: paragraph && this._createParagraph(paragraph),\n heading: orderLookupHeading,\n\n renderOrderLookupInputField: this._renderOrderLookupInput(),\n orderLookupForm: {\n className: orderLookupFormClassName,\n tag: 'form',\n 'aria-label': orderLookupFormAriaLabel,\n name: 'orderLookupForm',\n role: 'form',\n autoComplete: 'off',\n onSubmit: this.handleSubmit\n },\n orderNumberInput: (\n \n ),\n\n submitButton: {\n className: submitButtonClassName,\n tag: Button,\n 'aria-label': orderLookupSubmitAriaLabel,\n type: 'submit',\n role: 'button',\n title: orderLookupButtonLabel,\n onClick: this.handleSubmit,\n disabled: isDisabled\n },\n\n submitButtonLabelText: orderLookupButtonLabel,\n errorMessage: renderErrorLabel(responseErrorMessage, labelErrorMessageClassName),\n fieldErrorMessage:\n (!this.state.isValidLookupField || this.state.isValidAdditionalLookupField) &&\n renderFieldErrors(orderLookupFieldValidationErrorMessage),\n registeredUserMessage: renderRegisteredUserMessage(\n resources,\n context.request.user.signInUrl ?? '',\n signinLinkClassName,\n registeredUserClassName\n ),\n onChange: this.onChange,\n submit: this.handleSubmit,\n additionalProperties: this._renderAdditionalFields()\n };\n return this.props.renderView(viewProps);\n }\n\n public async componentDidMount(): Promise {\n const { config, context } = this.props;\n const { actionContext } = context;\n const { orderStatusLookUpParametersType, orderLookupSearchAdditionalFields } = config;\n let isOrderLookupAdditionalFieldValid: boolean = false;\n let isOrderLookupFieldValid: boolean = false;\n\n const getExtensibleEnumerations = await StoreOperationsDataActions.getExtensibleEnumerationsAsync({ callerContext: actionContext });\n this.orderLookupExtensibleEnum =\n getExtensibleEnumerations.find(item => item.TypeName === 'OrderLookupAdditionalCriteriaType')?.ExtensibleEnumerations ?? [];\n\n const orderLookupParameter: string = orderStatusLookUpParametersType ?? '';\n const orderLookupAdditionalParameter: IOrderLookupSearchAdditionalFieldsData[] = orderLookupSearchAdditionalFields ?? [];\n\n isOrderLookupFieldValid = validateOrderLookupField(orderLookupParameter, this.orderLookupExtensibleEnum);\n isOrderLookupAdditionalFieldValid = validateOrderLookupAdditionalField(\n orderLookupAdditionalParameter,\n this.orderLookupExtensibleEnum\n );\n this.setLookupFieldState(isOrderLookupFieldValid, isOrderLookupAdditionalFieldValid);\n }\n\n /**\n * Handle text change.\n * @param event - The dialog that is allowed to remain open.\n */\n public handleTextChange = (event: Msdyn365.ContentEditableEvent): void => {\n this.props.config.heading!.text = event.target.value;\n };\n\n /**\n * Handle paragraph change.\n * @param event - The dialog that is allowed to remain open.\n */\n public handleParagraphChange = (event: Msdyn365.ContentEditableEvent): void => {\n const { config } = this.props;\n config.paragraph = event.target.value;\n };\n\n /**\n * Sets isValidLookupField after validating with extensible emun.\n * @param isValidField - Sets the property.\n * @param isValidAdditionalField - Sets the additional field property.\n */\n public setLookupFieldState(isValidField: boolean, isValidAdditionalField: boolean): void {\n this.setState({ isValidLookupField: isValidField, isValidAdditionalLookupField: isValidAdditionalField });\n }\n\n /**\n * HandleSubmit submit.\n */\n public readonly handleSubmit = (): void => {\n const { config, context } = this.props;\n const { actionContext } = context;\n const { additionalProperties, orderNumber, email } = this.state;\n const orderLookupValue = email;\n const { orderStatusLookUpParametersType } = config;\n const orderLookupName = orderStatusLookUpParametersType !== undefined ? orderStatusLookUpParametersType : '';\n const isValid: boolean = this._validateOrderLookupForm();\n if (isValid) {\n const actionContextValue: IActionContext = actionContext;\n const orderDetailsPath = Msdyn365.getUrlSync('orderDetails', actionContextValue) ?? '';\n if (orderDetailsPath) {\n const baseUrl = new URL(window.location.origin);\n const redirectUrl = new URL(orderDetailsPath, baseUrl);\n const searchParameters = redirectUrl.searchParams;\n\n searchParameters.set('confirmationId', orderNumber);\n searchParameters.set('propertyName', orderLookupName);\n searchParameters.set('propertyValue', orderLookupValue);\n\n if (ArrayExtensions.hasElements(additionalProperties)) {\n additionalProperties.map((item, index) => {\n const fieldName = !StringExtensions.isNullOrWhitespace(item.ariaLabel)\n ? item.ariaLabel.replace(' ', '').toLocaleLowerCase()\n : '';\n const fieldValue = !StringExtensions.isNullOrWhitespace(item.fieldValue) ? item.fieldValue : '';\n searchParameters.set(`field${index + 1}Name`, fieldName);\n searchParameters.set(`field${index + 1}Value`, fieldValue);\n return item;\n });\n }\n\n window.location.assign(redirectUrl.toString());\n }\n }\n };\n\n /**\n * OnChange event.\n * @param event - Value of input field.\n */\n public readonly onChange = (event: React.ChangeEvent): void => {\n const { additionalProperties } = this.state;\n const { config } = this.props;\n const { orderStatusLookUpParametersType } = config;\n const name = event.target.name || '';\n const value = event.target.value || '';\n this.isOrderNumberValue = !StringExtensions.isNullOrWhitespace(this.orderNumberInputRef.current?.value);\n this.isEmailValue = !StringExtensions.isNullOrWhitespace(this.emailInputRef.current?.value);\n\n if (orderStatusLookUpParametersType?.toLocaleLowerCase() === 'none') {\n this.isEmailValue = true;\n }\n\n this.setState({ responseErrorMessage: '' });\n const additionalPropertyStates: IOrderLookupAdditionalFields[] = [];\n let isAdditionalFieldError: boolean = true as boolean;\n let isKeyExistInAdditionalFieldArray: boolean = false as boolean;\n\n for (const item of additionalProperties) {\n const fieldName: string = item.ariaLabel.replace(' ', '');\n if (fieldName.toLocaleLowerCase() === name.toLocaleLowerCase()) {\n additionalPropertyStates.push({\n labelName: item.labelName,\n isValidFieldName: true,\n fieldValue: value,\n ariaLabel: item.ariaLabel,\n additionalfieldErrorMessage: item.additionalfieldErrorMessage\n });\n } else {\n additionalPropertyStates.push({\n labelName: item.labelName,\n isValidFieldName: item.isValidFieldName,\n fieldValue: item.fieldValue,\n ariaLabel: item.ariaLabel,\n additionalfieldErrorMessage: item.additionalfieldErrorMessage\n });\n }\n if (fieldName.toLocaleLowerCase() === orderStatusLookUpParametersType?.toLocaleLowerCase()) {\n isKeyExistInAdditionalFieldArray = true;\n }\n }\n\n for (const items of additionalPropertyStates) {\n if (StringExtensions.isNullOrWhitespace(items.fieldValue)) {\n isAdditionalFieldError = false;\n }\n }\n\n this.setState({ additionalProperties: additionalPropertyStates });\n\n if (!isKeyExistInAdditionalFieldArray) {\n switch (name.toLocaleLowerCase()) {\n case OrderLookupSearchValues.ordernumber: {\n this.setState({\n orderNumber: value,\n isOrdNumberError: false,\n isReqError: false\n });\n break;\n }\n case OrderLookupSearchValues.email: {\n this.setState({\n email: value,\n isEmailError: false,\n isValidEmailError: false,\n isReqError: false\n });\n break;\n }\n default: {\n this.setState({ isReqError: false });\n }\n }\n }\n\n if (\n this.isOrderNumberValue &&\n this.isEmailValue &&\n isAdditionalFieldError &&\n this.state.isValidLookupField &&\n !this.state.isValidAdditionalLookupField\n ) {\n this.setState({ isDisabled: false });\n } else {\n this.setState({ isDisabled: true });\n }\n };\n\n private _createParagraph(text?: Msdyn365.RichText): React.ReactNode | null {\n const { context } = this.props;\n const { request } = context;\n if (!text) {\n return null;\n }\n return (\n \n );\n }\n\n /**\n * Render order lookup validation message.\n * @param className - Class name for error field.\n * @returns - JSX.Element.\n */\n private readonly _renderAlert = (className: string): JSX.Element => {\n const {\n resources: { orderLookupEmailValidationErrorMessage, orderLookupRequiredTextErrorMessage }\n } = this.props;\n\n const { isEmailError, email, isValidEmailError, isReqError } = this.state;\n if (isEmailError) {\n this.requiredErrorMessage = orderLookupRequiredTextErrorMessage;\n }\n\n if (!StringExtensions.isNullOrEmpty(email) && isValidEmailError) {\n this.emailValidationErrorMessage = orderLookupEmailValidationErrorMessage;\n }\n\n const isRequireError = isReqError;\n const isEmailValidError = isValidEmailError;\n const isValidEmailInput = className.toLocaleLowerCase() === OrderLookupSearchValues.email;\n return (\n <>\n {isRequireError && (\n \n {this.requiredErrorMessage}\n \n )}\n {isEmailValidError && isValidEmailInput && (\n \n {this.emailValidationErrorMessage}\n \n )}\n >\n );\n };\n\n /**\n * Render order number validation message.\n * @param className - Class name for error field.\n * @returns - JSX.Element.\n */\n private readonly _renderOrderNumberAlert = (className: string): JSX.Element => {\n const {\n resources: { orderLookupOrderNumberValidationErrorMessage, orderLookupRequiredTextErrorMessage }\n } = this.props;\n\n const { isOrdNumberError, isReqError } = this.state;\n return (\n <>\n {isReqError && (\n \n {orderLookupRequiredTextErrorMessage}\n \n )}\n {isOrdNumberError && (\n \n {orderLookupOrderNumberValidationErrorMessage}\n \n )}\n >\n );\n };\n\n private _renderAdditionalFields(): JSX.Element[] | undefined {\n const { additionalProperties } = this.state;\n const additionalFieldsInput: JSX.Element[] = [];\n for (const item of additionalProperties) {\n const name: string = item.ariaLabel.replace(' ', '');\n additionalFieldsInput.push(\n \n );\n }\n return additionalFieldsInput;\n }\n\n /**\n * Render Input field for order lookup.\n * @returns - IOrderLookupFieldInfo.\n */\n private readonly _renderOrderLookupInput = (): JSX.Element | undefined => {\n const { email, isEmailError, isValidEmailError } = this.state;\n const {\n config: { orderStatusLookUpParametersType },\n resources: { orderLookupEmailLabel, orderLookupEmailAriaLabel }\n } = this.props;\n\n switch (orderStatusLookUpParametersType) {\n case orderStatusLookUpParametersTypes.none:\n return undefined;\n case orderStatusLookUpParametersTypes.email:\n default:\n return (\n \n );\n }\n };\n\n /**\n * _validation for additional fields.\n * @returns - Returns IOrderLookupAdditionalFields[].\n */\n private readonly _additionalFieldValidation = (): IOrderLookupAdditionalFields[] => {\n const additionalPropertyStates: IOrderLookupAdditionalFields[] = [];\n for (const item of this.state.additionalProperties) {\n const isFieldValid: boolean = !StringExtensions.isNullOrWhitespace(item.fieldValue) && isAdditionalFieldValid(item.fieldValue);\n additionalPropertyStates.push({\n labelName: item.labelName,\n isValidFieldName: isFieldValid,\n fieldValue: item.fieldValue,\n ariaLabel: item.ariaLabel,\n additionalfieldErrorMessage: item.additionalfieldErrorMessage\n });\n }\n return additionalPropertyStates;\n };\n\n /**\n * _validateOrderLookupForm submit.\n * @returns - Returns boolean.\n */\n private readonly _validateOrderLookupForm = (): boolean => {\n const { config } = this.props;\n const { orderNumber, email } = this.state;\n const { orderStatusLookUpParametersType } = config;\n let additionalPropertyStates: IOrderLookupAdditionalFields[] = [];\n let isValid = false;\n let isDisable = false;\n\n if (ArrayExtensions.hasElements(this.state.additionalProperties)) {\n additionalPropertyStates = this._additionalFieldValidation();\n for (const item of additionalPropertyStates) {\n if (!item.isValidFieldName) {\n isDisable = true;\n }\n }\n\n if (isDisable) {\n this.setState({\n additionalProperties: additionalPropertyStates,\n isDisabled: true\n });\n }\n }\n\n if (StringExtensions.isNullOrWhitespace(orderNumber)) {\n this.setState({\n isOrdNumberError: true,\n isReqError: true,\n isDisabled: true\n });\n } else if (orderNumber.trim() !== orderNumber) {\n this.setState({\n isOrdNumberError: true,\n isReqError: false,\n isDisabled: true\n });\n } else if (\n orderStatusLookUpParametersType === orderStatusLookUpParametersTypes.email &&\n StringExtensions.isNullOrWhitespace(email)\n ) {\n this.setState({\n isEmailError: true,\n isReqError: true,\n isDisabled: true\n });\n } else if (orderStatusLookUpParametersType === orderStatusLookUpParametersTypes.email && !isEmailValid(email)) {\n this.setState({\n isValidEmailError: true,\n isDisabled: true\n });\n } else if (isDisable || !this.state.isValidLookupField || this.state.isValidAdditionalLookupField) {\n this.setState({\n isDisabled: true\n });\n } else {\n this.setState({\n isDisabled: false\n });\n isValid = true;\n }\n return isValid;\n };\n}\n\nexport default OrderLookup;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { ArrayExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { IOrderLookupViewProps } from './order-lookup';\n\n/**\n * View component.\n * @param props - The view properties.\n * @returns - Returns JSX Element.\n */\nexport const OrderLookupViewComponent: React.FC = props => {\n const {\n orderLookup,\n orderLookupContainer,\n orderLookupAdditionalFieldContainer,\n heading,\n paragraph,\n orderLookupForm,\n renderOrderLookupInputField,\n orderNumberInput,\n errorMessage,\n submitButton,\n additionalProperties,\n registeredUserMessage,\n fieldErrorMessage\n } = props;\n return (\n \n \n {heading}\n {paragraph}\n \n {orderNumberInput}\n {renderOrderLookupInputField}\n {ArrayExtensions.hasElements(additionalProperties) && (\n \n {additionalProperties.map((item: JSX.Element) => (\n {item} \n ))}\n \n )}\n {fieldErrorMessage}\n \n {props.submitButtonLabelText}\n \n {errorMessage}\n \n {registeredUserMessage}\n \n \n );\n};\n\nexport default OrderLookupViewComponent;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { getRichTextHtml } from '@msdyn365-commerce/core';\nimport * as React from 'react';\n\n/**\n * Product specification table row.\n */\nexport interface IProductSpecificationTableRow {\n productName?: string;\n cellData?: React.ReactNode;\n className?: string;\n}\n\n/**\n * Product specification table row component.\n * @param props - For product specification table row.\n * @param props.productName - Product name.\n * @param props.cellData - Cell data.\n * @param props.className - Class name.\n * @returns - Returns JSX element.\n */\nexport const ProductSpecificationTableRow: React.FC = ({ productName, cellData, className }) => (\n \n \n {/* eslint-disable-next-line react/no-danger */}\n \n \n {cellData} \n \n);\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as Msdyn365 from '@msdyn365-commerce/core';\nimport { AttributeValue } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\nimport { Drawer, IModuleProps, INodeProps, Module } from '@msdyn365-commerce-modules/utilities';\nimport classnames from 'classnames';\nimport { reaction } from 'mobx';\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\n\nimport { validateCatalogId } from '@msdyn365-commerce-modules/retail-actions';\nimport { AttributesForSelectedVariantInput, getAttributesForSelectedVariant } from '../..';\nimport { ProductSpecificationTableRow } from './components/product-specification-table-stucture';\nimport { IProductSpecificationData } from './product-specification.data';\nimport { displayStyle, IProductSpecificationProps } from './product-specification.props.autogenerated';\n\n/**\n * Maintain Drawer State.\n */\nexport interface IProductSpecificationState {\n isDrawerOpen: boolean;\n isAdditionalMediaDrawerOpen: boolean;\n drawerListId: number | undefined;\n}\n\n/**\n * Product specification view props.\n */\nexport interface IProductSpecificationViewProps extends IProductSpecificationProps<{}> {\n ProductSpecification: IModuleProps;\n ProductSpecificationTableProps: INodeProps;\n ProductSpecificationTableBodyProps: INodeProps;\n productSpecificationResult?: (JSX.Element | null)[];\n\n title?: React.ReactNode;\n isAccrodion?: boolean;\n handleText?(event: Msdyn365.ContentEditableEvent): void;\n}\n\n/**\n * Check for display style either accordion or table.\n */\nexport interface IProductSpecificationExtentedProps extends IProductSpecificationProps {\n displayStyle?: displayStyle;\n}\n\n/**\n *\n * ProductSpecification component.\n * @extends {React.Component>}\n */\n@observer\nclass ProductSpecification extends React.Component {\n public constructor(props: IProductSpecificationExtentedProps) {\n super(props);\n this.state = {\n isDrawerOpen: false,\n isAdditionalMediaDrawerOpen: false,\n drawerListId: undefined\n };\n }\n\n public async componentDidMount(): Promise {\n const { context, data, telemetry } = this.props;\n const catalogId = Msdyn365.getCatalogId(this.props.context.request);\n validateCatalogId(catalogId);\n reaction(\n () => (data.product.result ? data.product.result.RecordId : null),\n () => {\n if (context && data.product.result) {\n const actionInput = new AttributesForSelectedVariantInput(\n data.product.result.RecordId,\n\n +context.actionContext.requestContext.apiSettings.channelId,\n data.product.result,\n catalogId\n );\n\n getAttributesForSelectedVariant(actionInput, this.props.context.actionContext).catch((error: Error) => {\n telemetry.error(error.message);\n telemetry.debug('Unable to update attributes for Product');\n telemetry.error(error.message);\n });\n }\n }\n );\n }\n\n public shouldComponentUpdate(nextProps: IProductSpecificationExtentedProps, nextState: IProductSpecificationState): boolean {\n if (this.state === nextState && this.props.data === nextProps.data) {\n return false;\n }\n return true;\n }\n\n public render(): JSX.Element | null {\n let data: IProductSpecificationData;\n try {\n data = this.props.data;\n } catch (error) {\n this.props.telemetry.error(`Something went wrong ------${error}`);\n return {error}
;\n }\n\n if (!data.productSpecificationData.result || data.productSpecificationData.result.length <= 0) {\n this.props.telemetry.error('Product specification content is empty, module wont render.');\n return null;\n }\n\n const { heading, className } = this.props.config;\n const { productSpecificationData } = this.props.data;\n const isAccrodion = this.props.config.displayStyle === displayStyle.accordion;\n const viewProps = {\n ...this.props,\n handleText: this.handleHeadingChange,\n ProductSpecification: {\n moduleProps: this.props,\n className: classnames('ms-product-specification', className)\n },\n ProductSpecificationTableProps: isAccrodion\n ? {\n moduleProps: this.props,\n className: classnames('ms-product-specification__accordion', className)\n }\n : {\n className: classnames('ms-product-specification__table table-striped table-bordered'),\n tag: 'table'\n },\n isAccrodion,\n ProductSpecificationTableBodyProps: isAccrodion\n ? {}\n : {\n className: '',\n tag: 'tbody'\n },\n title: heading?.text && (\n \n ),\n productSpecificationResult:\n productSpecificationData.result && (isAccrodion ? this._createDrawerBody(data) : this._createTableBody(data))\n } as IProductSpecificationViewProps;\n\n return this.props.renderView(viewProps) as React.ReactElement;\n }\n\n /**\n * Handle Heading Text Change.\n * @param event - Current event.\n */\n public handleHeadingChange = (event: Msdyn365.ContentEditableEvent): void => {\n this.props.config.heading!.text = event.target.value;\n };\n\n private _createTableBody(content: IProductSpecificationData): (JSX.Element | null)[] {\n return content.productSpecificationData.result!.map((product, index) => {\n const cellData: JSX.Element | null = this._renderProductCell(product);\n\n if (!cellData) {\n return null;\n }\n\n return (\n <>\n \n {this.props.context.request.app?.config?.OmniChannelMedia && this._createAdditionalMediaDrawer()}\n >\n );\n });\n }\n\n private _createDrawerBody(content: IProductSpecificationData): (JSX.Element | null)[] {\n const accordionItemContainer: IModuleProps = {\n moduleProps: this.props,\n className: 'ms-product-specification-title'\n };\n\n const drawers = content.productSpecificationData.result!.map(product => {\n const cellData: JSX.Element | null = this._renderProductCell(product);\n if (!cellData) {\n return null;\n }\n return (\n \n \n {cellData}
\n \n \n );\n });\n\n if (this.props.context.request.app?.config?.OmniChannelMedia) {\n drawers.push(this._createAdditionalMediaDrawer());\n }\n\n return drawers;\n }\n private _createAdditionalMediaDrawer(): JSX.Element {\n const accordionItemContainer: IModuleProps = {\n moduleProps: this.props,\n className: 'ms-product-specification-title'\n };\n\n return (\n \n {\n this.setState(prevState => ({\n ...prevState,\n isAdditionalMediaDrawerOpen: !prevState.isAdditionalMediaDrawerOpen\n }));\n }}\n >\n \n \n \n );\n }\n\n private readonly _toggle = (drawerListId: number | undefined) => (): void => {\n if (this.state.drawerListId !== drawerListId) {\n this.setState({ drawerListId, isDrawerOpen: true });\n } else {\n this.setState({ drawerListId: undefined, isDrawerOpen: false });\n }\n };\n\n private _renderProductCell(product: AttributeValue): JSX.Element | null {\n switch (product.DataTypeValue) {\n case 0: // None\n // Return span here instead of null so the row still shows\n return ;\n case 1: // Currency\n return this._renderCurrencyCell(product);\n case 2: // DateTime\n return this._renderDateTimeCell(product);\n case 3: // Decimal\n return this._renderDecimalCell(product);\n case 4: // Integer\n return this._renderIntegerCell(product);\n case 5: // Text\n return this._renderTextCell(product);\n case 6: // TrueFalse\n return this._renderTrueFalseCell(product);\n case 40: // Video\n this.props.telemetry.warning('Got video specification type, not supported yet so skipping line');\n return null;\n case 41: // Image\n this.props.telemetry.warning('Got image specification type, not supported yet so skipping line');\n return null;\n default:\n this.props.telemetry.warning(`Got unknown specification type ${product.DataTypeValue} so skipping line`);\n return null;\n }\n }\n\n private _renderCurrencyCell(product: AttributeValue): JSX.Element | null {\n if (product.CurrencyValue !== null && product.CurrencyValue !== undefined) {\n return (\n \n {product.CurrencyCode}\n {product.CurrencyValue}\n \n );\n }\n\n return null;\n }\n\n private _renderDateTimeCell(product: AttributeValue): JSX.Element | null {\n if (product.DateTimeOffsetValue?.toUTCString) {\n return {product.DateTimeOffsetValue.toUTCString()} ;\n }\n\n return null;\n }\n\n private _renderIntegerCell(product: AttributeValue): JSX.Element | null {\n if (product.IntegerValue !== null && product.IntegerValue !== undefined) {\n return {product.IntegerValue} ;\n }\n\n return null;\n }\n\n private _renderDecimalCell(product: AttributeValue): JSX.Element | null {\n if (product.FloatValue !== null && product.FloatValue !== undefined) {\n return {product.FloatValue} ;\n }\n\n return null;\n }\n\n private _renderTextCell(product: AttributeValue): JSX.Element | null {\n if (product.TextValue !== null && product.TextValue !== undefined) {\n // eslint-disable-next-line react/no-danger\n return ;\n }\n\n return null;\n }\n\n private _renderTrueFalseCell(product: AttributeValue): JSX.Element | null {\n // TODO 20369885 setting to default value is needed to work around a platform bug where\n // config string value does not get its default value.\n if (product.BooleanValue) {\n return {this.props.resources.trueValueText ? this.props.resources.trueValueText : 'Yes'} ;\n }\n return {this.props.resources.falseValueText ? this.props.resources.falseValueText : 'No'} ;\n }\n}\n\nexport default ProductSpecification;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { ArrayExtensions, ObjectExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { IProductSpecificationViewProps } from './product-specification';\n\nconst ProductSpecificationView: React.FC = props => {\n const { ProductSpecification, ProductSpecificationTableProps, ProductSpecificationTableBodyProps, productSpecificationResult } = props;\n const rowdata =\n productSpecificationResult &&\n ArrayExtensions.hasElements(productSpecificationResult) &&\n productSpecificationResult.filter(row => !ObjectExtensions.isNullOrUndefined(row));\n\n return rowdata && ArrayExtensions.hasElements(rowdata) ? (\n \n {props.title}\n \n {rowdata} \n \n \n ) : null;\n};\n\nexport default ProductSpecificationView;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { ArrayExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport { IModuleProps, INodeProps } from '@msdyn365-commerce-modules/utilities';\nimport classnames from 'classnames';\nimport * as React from 'react';\n\nimport { ISocialShareConfig, ISocialShareProps, orientation } from './social-share.props.autogenerated';\n\nexport interface ISocialShareViewProps extends ISocialShareProps {\n isConsentGiven: boolean;\n SocialShareItemElements: React.ReactNode[];\n SocialShare: IModuleProps;\n SocialShareList: INodeProps;\n SocialShareItem: INodeProps;\n SocialShareItemCustomization: INodeProps;\n}\n\n/**\n *\n * SocialShare component.\n * @extends {React.PureComponent>}\n */\nclass SocialShare extends React.PureComponent> {\n constructor(props: ISocialShareProps) {\n super(props);\n }\n\n public render(): JSX.Element | null {\n const { slots } = this.props;\n\n if (!slots || !ArrayExtensions.hasElements(slots.socialShareItems)) {\n this.props.context.telemetry.error('No social media is enable for sharing, module wont render');\n return null;\n }\n\n const isConsentGiven =\n this.props.context.request &&\n this.props.context.request.cookies &&\n this.props.context.request.cookies.isConsentGiven &&\n this.props.context.request.cookies.isConsentGiven();\n\n if (!isConsentGiven && !this.props.context.request.params.isEditor) {\n return null;\n }\n\n const viewprops = {\n ...this.props,\n SocialShare: {\n moduleProps: this.props,\n className: classnames('ms-social-share', this.props.config.className)\n },\n SocialShareList: {\n 'data-title': this.props.config.caption,\n className: `ms-social-share-ul ${this.props.config.caption && 'caption'} ${\n this.props.config.orientation === orientation.vertical ? 'vertical' : ''\n }`,\n tag: 'ul',\n role: 'group'\n },\n SocialShareItem: {\n className: 'ms-social-share-li',\n tag: 'li',\n tabIndex: '0',\n role: 'link'\n },\n SocialShareItemElements: slots && slots.socialShareItems.length > 0 && slots.socialShareItems\n };\n\n return this.props.renderView(viewprops) as React.ReactElement;\n }\n}\n\nexport default SocialShare;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport React, { ReactNode } from 'react';\n\nimport { ISocialShareViewProps } from './social-share';\n\nexport const SocialShareView: React.FC = props => {\n const { SocialShareList, SocialShareItemElements, SocialShareItem, SocialShare } = props;\n if (SocialShareItemElements.length === 0) {\n props.context.telemetry.error('Social media list is empty, module wont render');\n return null;\n }\n return (\n \n \n {SocialShareItemElements.map((SocialShareElement: ReactNode, index: number) => {\n return (\n \n {SocialShareElement}\n \n );\n })}\n \n \n );\n};\n\nexport default SocialShareView;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport {\n IBusinessFormItem,\n IBusinessOrganizationListViewProps,\n IFormViewProps,\n InputID\n} from '@msdyn365-commerce-modules/business-organization-list';\nimport { Modal, ModalBody, ModalFooter, ModalHeader, Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport {\n IBusinessOrganizationListProps,\n IBusinessOrganizationListResources\n} from '../definition-extensions/business-organization-list.ext.props.autogenerated';\n\n/**\n * Business Form Item component.\n * @param props - View props.\n * @returns The JSX Element.\n */\nconst BusinessFormItemComponent: React.FC = (props: IBusinessFormItem) => {\n const { wrapper, label, errorMessage, input } = props;\n return (\n \n {label}\n {errorMessage}\n {input}\n \n );\n};\n\n/**\n * To render modal.\n * @param className - The modal classname.\n * @param isModalOpen - The boolean for modal open status.\n * @param headingSection - The heading section of modal.\n * @param bodySection - The body section of modal.\n * @param footerSection - The footer section of modal.\n * @param toggleModal - The toggle modal callback function.\n * @returns The JSX Element.\n */\nconst renderModal = (\n className: string,\n isModalOpen: boolean,\n headingSection: React.ReactNode,\n bodySection: React.ReactNode,\n footerSection: React.ReactNode,\n toggleModal?: () => void\n) => {\n return (\n \n {headingSection} \n {bodySection} \n {footerSection} \n \n );\n};\n\n/**\n * Business User Form component.\n * @param props - View props.\n * @returns The JSX Element.\n */\nconst BusinessUserFormComponent: React.FC = (props: IFormViewProps) => {\n // eslint-disable-next-line @typescript-eslint/naming-convention -- Dependency from module file.\n const { modalClassName, FormWrapper, modalHeading, modalDescription, inputs, buttons, errorMessage, toggle } = props;\n\n const modalBody = (\n <>\n {modalDescription}\n \n {inputs &&\n inputs.map((item: IBusinessFormItem) => {\n return ;\n })}\n {errorMessage?.map((error: React.ReactNode, index: number) => {\n return {error} ;\n })}\n \n >\n );\n\n const modalFooter =\n buttons &&\n buttons.map((button: React.ReactNode, index: number) => {\n return {button} ;\n });\n\n return renderModal(modalClassName, true, modalHeading, modalBody, modalFooter, toggle);\n};\n\n/**\n * Selected user interface.\n */\ninterface ISelectedUser {\n // eslint-disable-next-line @typescript-eslint/naming-convention -- Dependency from module file.\n FirstName?: string;\n // eslint-disable-next-line @typescript-eslint/naming-convention -- Dependency from module file.\n LastName?: string;\n}\n\n/**\n * Business User Details component.\n * @param props - View props.\n * @returns The JSX Element.\n */\nconst BusinessUserDetailsComponent: React.FC = (props: IFormViewProps) => {\n // eslint-disable-next-line @typescript-eslint/naming-convention -- Dependency from module file.\n const { modalClassName, FormWrapper, modalHeading, modalDescription, buttons, errorMessage, resources, toggle } = props;\n let modalBody = null;\n const selectedUser = props.selectedUser as ISelectedUser | string;\n\n if (!selectedUser) {\n modalBody = errorMessage;\n } else {\n // eslint-disable-next-line @typescript-eslint/naming-convention -- Dependency from module file.\n const { FirstName, LastName } = selectedUser as ISelectedUser;\n const userFullName = `${FirstName as string} ${LastName as string}`;\n\n modalBody = (\n <>\n {modalDescription}\n \n \n {userFullName}\n \n {Object.keys(selectedUser).map((data, index) => {\n if (data === InputID.FirstName || data === InputID.LastName) {\n return null;\n }\n const label = (resources[`table${data}HeadingText`] as string) || data;\n return (\n \n {label}\n {': '}\n {selectedUser[data]}\n \n );\n })}\n \n >\n );\n }\n\n const modalFooter =\n buttons &&\n buttons.map((button: React.ReactNode, index: number) => {\n return {button} ;\n });\n\n return renderModal(modalClassName, true, modalHeading, modalBody, modalFooter, toggle);\n};\n\n/**\n * To get form.\n * @param type - The type of form.\n * @param formProps - The form props.\n * @param toggleModal - The toggle modal callback function.\n * @returns The JSX Element.\n */\nconst getForm = (type: string, formProps: IFormViewProps, toggleModal?: () => void) => {\n switch (type) {\n case 'ADD':\n case 'EDIT':\n return ;\n case 'VIEW':\n case 'REMOVE':\n return ;\n default:\n return null;\n }\n};\n\n/**\n * Business Organization List component.\n * @param props - View props.\n * @returns The JSX Element.\n */\nconst BusinessOrganizationListComponent: React.FC> = props => {\n // eslint-disable-next-line @typescript-eslint/naming-convention -- Dependency from module file.\n const {\n OrganizationUserList,\n moduleContainer,\n heading,\n noUsersText,\n addUserButton,\n organizationListTable,\n form,\n formType,\n toggleModal,\n requestAccountStatementButton,\n requestStatementModal\n } = props;\n\n const buttonList: React.ReactNode = (\n \n {addUserButton}\n {requestAccountStatementButton}\n \n );\n\n if (noUsersText) {\n return (\n \n \n {heading}\n \n \n {props.resources.headingForEmptyUserOrganizationList}\n \n \n {props.resources.textForEmptyUserOrganizationList}\n \n {buttonList}\n \n {requestStatementModal}\n {noUsersText}\n \n \n );\n }\n\n return (\n \n \n {heading}\n {buttonList}\n {requestStatementModal}\n {organizationListTable}\n \n {form && getForm(formType, form, toggleModal)}\n \n );\n};\n\nexport default BusinessOrganizationListComponent;\n","'use strict';\nvar $ = require('../internals/export');\nvar global = require('../internals/global');\n\n// `globalThis` object\n// https://tc39.es/ecma262/#sec-globalthis\n$({ global: true, forced: global.globalThis !== global }, {\n globalThis: global\n});\n","'use strict';\n// TODO: Remove from `core-js@4`\nrequire('../modules/es.global-this');\n"],"names":["StoreType","Map","React","constructor","props","super","pushpinMap","globalThis","selectedPushPin","undefined","clusterClickHandler","cachedOrgUnitFoundCount","mapRef","handleHeadingChange","event","this","config","heading","text","target","value","_initMap","context","actionContext","requestContext","channel","data","storeSelectorStateManager","result","isMapApiLoaded","map","Microsoft","Maps","current","credentials","BingMapsApiKey","pushpinAccessible","labelOverlay","LabelOverlay","hidden","showMapTypeSelector","showLocateMeButton","showTrafficButton","navigationBarMode","enableInertia","customMapStyle","elements","countryRegion","labelVisible","version","_updateMapForOrgUnitChanges","_this$props$data$stor","_storeSelectorStateMa","pushpinOptions","orgUnitStoreInformation","selectedStoreLocationId","positionUser","lastInlineShownStoreInfo","positionUserChanged","firstOrgUnitsRender","cachedLastInlineShownStoreInfo","checkSameLocation","_this$map","currentLayer","layers","clear","storeLocationList","filter","store","OrgUnitAvailability","length","firstThreeLocations","slice","reduce","acc","org","_org$OrgUnitAvailabil","storeLocation","OrgUnitLocation","Latitude","Longitude","push","Location","index","unitStoreInfo","entries","_unitStoreInfo$OrgUni","OrgUnitNumber","isSelectedLocation","storeType","OrgUnitName","startsWith","Retailer","VenchiStore","options","_getPushpinOptions","resources","pushpin","Pushpin","Events","addHandler","handleClickEventOnPushPinStore","set","currentLocation","boundLocations","setView","bounds","LocationRect","fromLocations","padding","pushpinObject","getZoom","center","getLocation","zoom","fromShapes","Array","from","values","pushpinData","loadModule","clusterLayer","removeHandler","size","pushpins","ClusterLayer","clusteredPinCallback","customizeClusteredPin","gridSize","clusteringEnabled","setOptions","clusterClicked","insert","_updateMapForSelectedStore","_this$props$data$stor2","_getPushpinColorAndIcon","currentPushpin","get","_this$map2","mapLayer","containedPushpins","getPrimitives","mapBounds","getBounds","includes","contains","currentZoom","getZoomRange","max","nextZoom","cluster","e","locs","i","len","orgUnitNumber","setSelectedStoreLocationId","color","selectionColor_retailer","color_retailer","selectionColor_store","color_store","icon","mapResources","title","storeLabelRetailer","storeLabelVenchi","componentDidMount","_this$props$data$stor3","telemetry","BingMapsEnabled","when","_this$props$data$stor4","setMapModuleLoaded","_this$props$data$stor5","reaction","_this$props$data$stor6","loadMapApi","_this$props$data$stor7","_this$props$context","key","lang","locale","market","ChannelCountryRegionISOCode","_this$props$data$stor8","_this$props$data$stor9","_this$props$data$stor10","error","render","className","shouldDisplayMap","listMapViewState","displayMap","viewProps","_objectSpread","ModuleProps","tag","moduleProps","classname","show","Header","headerProps","Msdyn365","Object","assign","editProps","onEdit","request","MapProps","ref","renderView","input","secondInput","__decorate","observer","MapHeader","_ref","Node","_ref2","Module","id","ariaLabel","disabled","onClick","Button","type","message","errorClassName","classnames","role","GetMaxLength","maxLength","parsedMaxLength","Number","parseInt","isNaN","pattern","required","onChange","name","forId","htmlFor","successClassName","SignUp","moduleClassName","handleParagraphChange","disclaimer","_onInit","_prePopulateData","_updateErrorMessage","initializationTimer","setInterval","_isInitializationSuccessful","setTimeout","clearInterval","window","isInitialized","obj","ID","toLowerCase","isEmailVerificationRequried","templateVersion","emailRegex","PAT","VERIFY","isGivenNameVerificationRequried","isSurnameVerificationRequried","newPasswordRegex","reenterPasswordRegex","UX_INPUT_TYPE","PAT_DESC","invalidPasswordError","invalidEmailAddressError","errorMessages","required_field","requiredFieldMissingError","getValue","v1Value","v2Value","EmailRegex","defaultRegex","source","PasswordRegex","componentDidUpdate","shouldComponentUpdate","nextProps","nextState","state","_this$props","_this$props$config$re","regionCRM","regionLanguageMapping","find","regionMapping","pageLanguage","LastConsentSource","Source","EcomSignUpLegalEntity","viewState","isShowLoading","signUp","loading","modal","Modal","isOpen","modalBody","ModalBody","SignUpLoadingIconComponent","SignUpLoadingMessageComponent","loadingMessage","defaultAADConainer","style","display","aadConainer","signUpLocalAccount","_renderLocalAccount","localAccount","items","_renderInput","emailAddressLabelText","passwordLabelText","confirmPasswordLabelText","firstNameLabelText","firstNameMaxLength","lastNameLabelText","lastNameMaxLength","addressZipCodeLabelOptional","birthdayLabelText","phoneLabelText","emailVerification","isRequired","email","verificationCodeLabelText","verificationControlWrapper","buttonWrapper","buttons","SignUpButtonComponent","sendCodeButtonAriaLabel","sendCodeButtonText","verifyCodeButtonAriaLabel","verifyCodeButtonText","resendCodeButtonAriaLabel","resendCodeButtonText","changeEmailButtonAriaLabel","changeEmailButtonText","successMessage","SignUpSuccessComponent","verificationCodeSendSuccess","emailAddressVerifiedSuccess","errorMessage","SignUpErrorComponent","retryError","retryNotAllowedError","throttledError","codeExpiredError","serverError","invalidEmailError","givenNameVerification","givenName","requiredFieldMissingSummaryError","surnameVerification","surname","signUpButtonArialabel","signUpButtonText","cancelButtonArialabel","cancelButtonText","passwordEntryMismatchError","fieldIncorrectError","labelText","cssClassName","wrapper","label","SignUpLabelComponent","SignUpInputComponent","observable","SignUpItem","SignUpEmailVerification","button","SignUpGivenNameVerificationComponent","_ref3","SignUpSurnameVerificationComponent","_ref4","LocalAccount","birthDate","setBirthDate","formatDateState","setFormatDateState","patternUS","signUpButton","document","getElementById","onclick","preventDefault","stopPropagation","profiling_ref","handleChange","checked","item","_props$resources","_props$resources2","_props$resources3","_props$resources4","_props$resources5","_props$resources6","_props$resources$emai","emailRepErrorText","email_rep","email_rep_error","email_rep_error_backup","textContent","emailRepeatLabelText","endsWith","onKeyUp","currentTarget","today","Date","match","checkDate","onPaste","birthday_proxy","birthday_hidden","onchange","BirthdayText","PostalText","phone_number_proxy","phone_number_hidden","PhoneText","hideMarketing","defaultChecked","preflagMarketing","htmlGenericMarketing","privacyPolicyURL","dangerouslySetInnerHTML","__html","format","USmarketingText","hideProfiling","preflagProfiling","htmlProfiling","hideThirdParty","preflagThirdParty","htmlThirdParty","SignUpLoading","_ref5","AccountCustomerBalanceTile","telemetryContent","getTelemetryObject","telemetryPageName","friendlyName","_initState","hasError","setState","content","ErrorComponent","apiGenericErrorMessage","customerResult","allowOnAccountPayment","AllowOnAccountPayment","isB2BSite","isChannelTypeB2B","enableCustomerAccountPayment","isCustomerAccountPaymentEnabled","links","Heading","headingTag","isDetailsLinkDisplayed","LinksComponent","onTextChange","account","Balance","CreditLimit","InvoiceAccountBalance","InvoiceAccountCreditLimit","noCreditErrorMessage","accountCreditVerbagePrefix","accountCreditVerbagePostfix","currencyCode","formatCurrency","customerCredit","customerCreditFormatted","toFixed","CreditComponent","verbagePrefix","verbagePostfix","computed","_mapEditableLinks","linkdata","editableLinks","payLoad","getPayloadObject","forEach","link","contentAction","etext","linkText","attributes","getTelemetryAttributes","editableLink","linkUrl","destinationUrl","openInNewTab","additionalProperties","AccountGenericTile","handleLinkTextChange","linkIndex","AccountLoyaltyTile","signUpLinkText","viewLinkText","signUpLinkAriaLabel","viewLinkAriaLabel","accountLoyaltySummary","accountLoyaltyMemberSummary","loyaltyCard","description","url","CardNumber","decimalPrecision","points","RewardPoints","rewardPoint","ActivePoints","DescriptionComponent","AccountOrderTemplatesTileDescription","AccountOrderTemplatesTileLinks","AccountOrderTemplatesTile","params","isEditor","accountOrderTemplatesTileDescription","orderTemplates","orderTemplatesCount","AccountProfileEdit","onTextBoxChange","PRE","_htmlDecode","verifying_blurb","accountProfileEdit","AccountProfileEditLoadingIconComponent","AccountProfileEditLoadingMessageComponent","accountProfileEditLocalAccount","str","createElement","innerHTML","childNodes","nodeValue","AccountProfileEditErrorComponent","buttonsWrapper","AccountProfileEditButtonComponent","saveButtonAriaLabel","saveButtonText","verificationSuccessModal","verificationSuccessModalMessage","showEmail","AccountProfileEditLabelComponent","AccountProfileEditInputComponent","AccountProfileEditItem","AccountProfileEditLoading","AccountAttributeDataTypeValue","AccountProfileAttributes","isUpdatingAttributes","gotException","attributeClassName","maxIntegerLimit","minIntegerLimit","maxDecimalLimit","minDecimalLimit","maxStringLength","maxVATNumberLength","maxPhoneLength","editAsyncCustomerFeatureName","isEditAsyncCustomerFeatureEnabled","_renderAttributes","_data$featureState","_this$props$accountPr","accountProfileProps","attributeDefinitions","additionalInformationSectionHeading","showAttributes","split","att","attributeDefinition","attribute","IsHidden","Name","toLocaleLowerCase","RecordId","_renderAttribute","edit","editAttributes","attributesEditButtonText","attributesSaveButtonText","saveAttributes","attributesCancelButtonText","cancelAttributes","customerInformation","featureState","feature","IsEnabled","disableBtn","app","canRenderAsyncCustomerDataAsUnmodifiable","IsAsyncCustomer","attributesContainerRef","Text","showPhone","_renderPhone","showVatNumber","_renderVatNumber","attributesSaveExceptionMessage","_enableAttributes","innerRef","editRef","_saveAttributes","_disableAttributes","phoneSectionHeading","replace","_onPhoneChange","phone","_renderError","vatNumberSectionHeading","_onVatNumberChange","vatNumber","customAttribute","ExtDataType","Value","Integer","Decimal","_renderIntegerDecimalInput","_renderTextInputOrSelect","TrueFalse","_renderBoolean","attributeProps","_getAttributeProps","displayName","_onAttributeChange","IsMandatory","isEnumeration","IsEnumeration","EnumerationDetails","hasNoValue","_onAttributeSelect","selected","option","EnumerationValue","toggleState","arialabel","attributeToggleButtonAriaLabel","ariaPressed","toggleValue","TextComponent","toggleDisableText","_onAttributeCheck","toggleEnableText","attributeName","attributeError","StringExtensions","isNullOrWhitespace","attributePayloadData","isMandatory","MsDyn365","isBrowser","getElementsByClassName","_setFocus","initialAttributes","initialPhone","initialVatNumber","selectedOptions","selectedIndex","_getAttributes","showAttributesArray","customer","custmerAttributes","Attributes","showAttribute","defaultValue","AttributeValue","DataTypeValue","IntegerValue","String","DecimalValue","StringValue","BooleanValue","keys","_addOrUpdateAttribute","hasValue","payloadData","dataTypeValue","decimalValue","typeError","attributeInputTypeErrorText","lowerBoundValue","upperBoundValue","rangeError","attributeInputRangeErrorText","attributeInputValueExceedsMaximumErrorText","attributeInputValueExceedsMinimumErrorText","integerValue","trimValue","trim","attributeInputStringMaxLengthErrorText","textValue","booleanValue","attributeInputMandatoryErrorText","findIndex","splice","Attribute","recordId","Units","ExtensionProperties","NameTranslations","KeyName","Phone","VATNumber","VatNumber","async","updateCustomerAttributesInput","AccountNumber","apiSettings","updateCustomerAttributes","initialCustomerAttributes","exception","debug","element","focus","_buildPayloadData","defaultIntegerValue","DefaultValue","LowerBound","UpperBound","defaultDecimalValue","defaultStringValue","defaultBooleanValue","_getCustomerPhoneAndVatNumber","isDisabled","AccountProfile","isUpdatingPreference","handleEmailHeadingChange","emailAddressSectionHeading","handleNameHeadingChange","nameSectionHeading","editButtonText","onClickEventHandler","_updateAccountPersonalization","_renderPreference","sectionHeading","enableAriaLabel","isOptOut","onClickHandler","accountPreference","buttonYesText","buttonNoText","toString","onUpdateAccountPreference","isOptOutPersonalization","preferenceType","OptOutWebActivityTracking","updateCustomerPersonalizationInput","OptOutPersonalization","updateCustomerPersonalization","_renderCustomerAttributes","_this$props$context$a","editButtonAriaLabel","invalidAsyncCustomerState","shouldRenderAttributes","editLink","infoMessageBar","accountProcessingPendingInfoMessage","accountProfileWrapper","emailSection","_renderEmailSection","Email","nameSection","_renderNameSection","getDescription","preferenceSection","_renderPreferenceSection","customerAttributesWrapper","customerAttributesSection","FirstName","LastName","AccountProfileItem","ArrayExtensions","hasElements","personalizationDescription","personalizationEnableButtonAriaLabel","webTrackingDescription","webTrackingEnableButtonAriaLabel","preferencesSectionHeading","personalizationSectionHeading","webTrackingSectionHeading","enableDataAnalytics","features","extraPreferences","accountPreferences","personalization","AccountPreferencesSection","AccountPreferenceSection","preferenceSecton","AccountProfileSection","RequestsTableColumnHeader","getUserName","isNullOrEmpty","UserFirstName","UserLastName","b2bRequestsNameDisplay","formatDate","date","cultureFormatter","year","month","day","getDetails","_requestDetails$Invoi","Details","requestDetails","accountStatementStartDateTime","AccountStatementStartDateTime","accountStatementEndDateTime","AccountStatementEndDateTime","invoiceId","InvoiceId","TypeValue","b2bRequestsAccountStatementDetails","b2bRequestsInvoiceCopyDetails","getDisplayFriendlyTypeValue","typeValue","b2bRequestsTypeCreateProspect","b2bRequestsTypeAddUser","b2bRequestsTypeDeleteUser","b2bRequestsTypeEditUser","b2bRequestsTypeRequestAccountStatement","b2bRequestsTypeRequestInvoiceCopy","b2bRequestsTypeUnknown","getDisplayFriendlyStatusValue","statusValue","b2bRequestsStatusProcessed","b2bRequestsStatusError","b2bRequestsStatusRequested","createTableProps","tableProps","_context$request$quer","tableData","operationRequests","_request$TypeValue","_request$StatusValue","row","b2bRequestsTypeColumn","TableDataType","b2bRequestsRequestDateColumn","CreatedDateTime","b2bRequestsDescriptionColumn","b2bRequestsUserColumn","b2bRequestsStatusColumn","StatusValue","isSelected","createTableItems","headings","isMobile","mobileExcludedColumns","sortable","columnSortAriaLabel","rows","editLinkText","deleteLinkText","enableToModify","actionLinkText","showCheckBoxes","isSortable","showPagination","minifyActions","excludedColumns","paginationProperty","skipCount","query","skip","itemPerPage","prevText","b2bRequestsPreviousText","nextText","b2bRequestsNextText","paginationText","reqContext","URL","location","href","requestUrl","isSingleSelectOnly","actions","onDelete","onView","businessUserSelectCheckBoxAriaLabelText","sortByAscending","sortByDescending","B2bRequestsTable","Table","B2bRequestsStatus","renderHeader","headingData","_this$props$data$oper","_this$props$data$oper2","itemCount","getItemNumberDisplayString","_retrieveExcludedColumns","renderTable","b2bRequestsNumberOfItemsSingular","b2bRequestsNumberOfItems","variant","VariantType","Viewport","b2bRequestsStatus","table","SignUpText","LoyaltySignUp","handleMemberHeadingChange","memberHeading","_issueLoyalty","user","isAuthenticated","clicked","IssueLoyaltyInput","issueLoyalty","then","catch","TelemetryConstant","SignIn","loyaltySignInAttributes","loyaltySignUpAttributes","LoyaltyDetailLink","loyaltyDetailsLinkAttributes","LoyaltyTermsLink","loyaltyTermsLinkAttributes","_data$customerInforma","signInUrl","termsUrl","loyaltyJoinUrl","origin","signInurl","completeClass","hasLoyaltyAccount","CardTenderTypeValue","status","signInLink","joinLoyaltyButtonText","signUpText","loyaltyProgramText","detailsLink","viewLoyaltyPageText","termsLink","loyaltyTermsLinkText","LoyaltyTermsModal","LoyaltyTermsCancel","loyaltyTermCancelAttributes","LoyaltyTermsSubmit","loyaltyTermSubmitAttributes","LoyaltyTermsAgree","loyaltyTermCheckboxAttributes","toggle","onToggle","applicationNode","returnFocusRef","returnRef","modalHeader","ModalHeader","modalFooter","ModalFooter","cancelButton","cancelLoyaltyTermsText","submitButton","onSubmit","joinLoyaltyTermsText","loyaltyTermsHeading","terms","agreeSection","checkbox","onCheck","agreeText","loyaltyAgreeToTerms","LoyaltyTerms","_toggle","bind","_submit","_checkboxChecked","toggleRef","search","isJoining","substring","qsps","qsp","splitQsp","isModalOpen","hideToggle","slots","serviceTerms","modalToggle","joinLoyaltytermsToggleText","card","redirectToLoyalty","getUrlSync","getLoyaltyCardAsync","callerContext","fullCard","update","GetLoyaltyCardInput","PasswordReset","passwordReset","PasswordResetLoadingIconComponent","PasswordResetLoadingMessageComponent","passwordResetLocalAccount","newPasswordLabelText","PasswordResetErrorComponent","PasswordResetButtonComponent","PasswordResetLabelComponent","PasswordResetInputComponent","PasswordResetItem","PasswordResetLoading","signInDisclaimer","handleSignInHeadingChange","signInHeading","handleSignUpHeadingChange","signUpHeading","emailId","SA_FIELDS","AttributeFields","requiredField_email","requriedEmailError","requiredField_password","requriedPasswordError","invalid_email","invalid_password","unknown_error","unknownError","signIn","SignInLoadingIconComponent","SignInLoadingMessageComponent","signInSection","signInSectionHeading","signInLocalAccount","emailAddressAriaLabel","forgetPassword","SignInLinkComponent","forgotPasswordButtonAriaLabel","forgotPasswordButtonText","SignInErrorComponent","signInButton","SignInButtonComponent","loginButtonAriaLabel","loginButtonText","signInSocialAccount","socialAccounts","_renderSocialAccount","facebookButtonText","facebookButtonAriaLabel","facebookIcon","microsoftButtonText","microsoftButtonAriaLabel","microsoftIcon","signInB2BAccount","_renderB2BSocialAccount","b2bButtonText","b2bButtonAriaLabel","displayB2bAccountManagerSignin","signUpSection","signUpSectionHeading","signUpDescription","SignInDescriptionComponent","signUpDescriptionText","signUpLink","signUpButtonAriaLabel","SignInLabelComponent","SignInInputComponent","iconImage","image","_createImageMarkup","SignInTextComponent","_displayB2bAccountManagerSignin","imageProps","gridSettings","imageSettings","pictureClassName","shouldSkipToMainImage","SignInLoading","SocialAccount","B2BAccount","FormType","InputType","InputID","renderInputSection","inputs","asteriskAfterLabel","onInputChange","customClass","maxChars","fieldReference","FormLabel","asteriskText","FormFieldError","FormInput","placeholder","BusinessOrganizationList","_this$props$config","BusinessFormDefaultInputs","businessUserFirstNameLabelText","businessUserLastNameLabelText","businessUserEmailAddressLabelText","SpendingLimit","businessUserSpendingLimitLabelText","delayFocus","formChildReference","userFormEditReference","userFormDeleteReference","_handleAddUserButtonClicked","newForm","formItems","newUser","B2BUserId","Random","Guid","generateGuid","isFormActive","formType","Add","referenceBack","addUserButtonReference","hasFormError","hasActionError","selectedUserData","_handleAddEditFormSaveButton","updatedUser","_createBusinessPartner","Edit","editOrganizationUser","EditOrganizationUserInput","reload","trace","addOrganizationUser","AddOrganizationUserInput","businessUserActionRetailErrorMsg","parseFloat","_handleEditIcon","userData","possibleName","cell","fullName","lastSpaceIndex","lastIndexOf","firstName","lastName","possibleCell","dataCell","_handleDeleteIcon","displayedUserData","Price","Remove","_handleViewDetails","View","_handleRemoveUserButton","deleteUserData","deleteOrganizationUser","DeleteOrganizationUserInput","None","callbackRemoveButton","_onInputChange","prev","refresh","isReady","_isFormReady","formItem","_formatPrice","price","_getCurrentUrl","_getViewport","device","Type","innerWidth","xs","w","sm","md","lg","_toggleStatementRequestDropdown","isStatementRequestAdminDropdownOpen","_updateFromDate","newFromDate","statementRequestFromDateString","_updateToDate","newToDate","statementRequestToDateString","_showRequestStatementModal","isFullOrg","statementRequestFullOrg","isStatementRequestModalOpen","_requestStatement","currentUser","users","_getB2BUserId","statementRequest","FromDate","ToDate","IsForFullOrganization","RequestedUserId","RequestingUserEmail","DeliveryTypeValue","BusinessPartnerOperationDeliveryType","BusinessPartnerUsersDataActions","_closeStatementRequestModal","_this$statementReques","statementRequestButtonReference","_onSelectRow","records","selectedRow","rowProps","_toggleModal","Status","_viewport","_updateViewport","submitButtonReference","addedReference","statementRequestMaxDateString","toISOString","businessUserSelectedUserDisplayName","addEventListener","componentWillUnmount","removeEventListener","_this$formChildRefere","_this$submitButtonRef","_this$props$data$cust","businessUserAddUserButtonText","businessUserLoadingMessage","businessUserEmptyListMessage","businessUserErrorGettingUsersMessage","userAccountStatementLabel","fullOrganizationLabel","requestStatementButtonLabel","statementRequestModalHeaderLabel","cancelLabel","fromDateLabel","toDateLabel","submitRequestLabel","sendToEmailLabel","selectedUserLabel","hasUsers","AddUser","addUserAttributes","errorProps","OrganizationUserList","moduleContainer","addUserButton","noUsersText","modalState","organizationListTable","_createTableProps","toggleModal","form","_renderUserForm","_renderUserDetails","requestAccountStatementButton","AdminRequestStatementButton","buttonReference","onRequestStatement","onToggleDropdown","myUserAccountLabel","isDropdownShowing","requestStatementModal","RequestStatementModal","fromDateString","toDateString","onChangeFromDate","onChangeToDate","canSubmitRequest","canSubmitStatementRequest","modalHeaderLabel","onSubmitRequest","selectedUser","selectedOrganizationLabel","selectedUserName","modalAriaLabel","maxDateString","tableSort","paginationItemPerPage","businessUserPaginationNextButtonText","businessUserPaginationPreviousButtonText","businessUserEditButtonText","businessUserViewUserButtonText","businessUserDeleteButtonText","businessUserActionButtonText","businessUserPaginationAriaLabel","_createTableItems","editLinkTooltip","deleteLinkTooltip","viewLinkTooltip","resourcePrefix","tableAriaLabel","tableTabIndex","formatPrice","checkBoxCallback","businessUserActiveStatusText","businessUserPendingStatusText","businessUserRemovedStatusText","usersList","statusString","FullName","buttonReferences","delete","_this$state$reference","businessUserRemoveModalHeaderText","businessUserRemoveModalDescription","businessUserViewModalHeaderText","businessUserCancelButtonText","businessUserCancelRemoveUserButtonText","businessUserRemoveUserButtonText","businessUserErrorUpdatingUsersMessage","formClassName","typeClassName","handleRemoveButton","modalClassName","FormWrapper","modalHeading","modalDescription","businessUserEditUserFormHeadingText","businessUserAddUserFormHeadingText","businessUserSaveButtonArialabel","businessUserSaveButtonText","businessUserCancelButtonArialabel","businessUserFieldIncorrectErrorText","businessUserActionErrorText","businessUserAllFieldsRequiredMessage","FormButton","BusinessFormItem","BusinessUserForm","_renderModal","BusinessUserDetails","userFullName","headingSection","bodySection","footerSection","wrapClassName","autoFocus","fade","ButtonList","_getForm","formProps","assembleNode","itemIndex","_item$links","renderHeading","additionalContentHeading","handleAdditionalTextChange","subtext","renderParagraph","additionalContentParagraphText","ctaLink","renderLinks","handleAdditionalLinkTextChange","additionalContentItemContainer","additionalContentItemLinks","contentBlockAdditionalContent","additionalContent","reactNodes","additionalContentNode","additionalContentItems","ContentCardLinks","btnClass","onTelemetryClick","ContentBlock","handleTextChange","paragraph","_heading$tag","_this$props$context$r","_this$props$config$im","imageAriaLabel","contentBlockTitle","contentBlockLinks","msdyn365__moduleLayout","contentBlockText","contentBlockImage","preserveImageSpace","moduleType","typeName","imagePropertyName","moduleId","layout","contentBlockviewProps","moduleClass","contentBlockContainer","imageContainer","detailsContainer","contentBlockAnchorTag","imageLink","_getImageLink","handleAdditionalParagraphChange","handleAdditionalText","handleAdditionalParagraph","additionalContentObject","actionableRegion","renderAdditionalContent","_additionalContent$ad","OrderHistoryOrderInfomation","orderInformationProps","salesId","receiptId","channelName","createdDate","count","amount","channelReferenceId","OrderHistoryGroupDelivery","deliveryProps","processing","address","trackingInfo","OrderHistoryGroup","groupProps","delivery","salesLinesProps","salesLines","salesLine","LineId","OrderHistoryGroups","groupsProps","groups","group","OrderHistoryHeader","orderCountLabel","extraActions","OrderHistorySalesOder","_ref6","salesOrderProps","orderInfomation","orderDetailsLink","expandProductsButton","OrderHistoryList","_ref7","listProps","salesOrders","salesOrder","_ref8","orderHistoryProps","header","alert","emptyMessage","backToShoppingLink","list","moreButton","labelGroup","renderErrorLabel","responseErrorMessage","errorMessageClassName","renderRegisteredUserMessage","signInLinkClassName","registeredUserClassName","orderLookupRegisteredUserText","orderLookupViewAccountText","orderLookupSignInLinkText","infoMessage","signInText","renderFieldErrors","orderLookupFieldValidationErrorMessage","RenderOrderLookupAdditionalFieldInput","_getOrderLookupAdditionalFields","additionalFieldLabel","additionalFieldError","additionalFieldInput","additionalFieldLabelClassName","inputType","isValidAdditionalFieldName","additionalFieldValidationMessage","RenderOrderLookupFormFields","_getOrderLookupFields","orderLookupLabelClassName","orderLookupLabel","inputReference","fieldErrorClassName","isInputTypeError","renderAlert","isValidInputField","OrderLookupSearchValues","OrderLookup","isEmailValue","isOrderNumberValue","orderLookupExtensibleEnum","handleSubmit","orderNumber","orderLookupValue","orderStatusLookUpParametersType","orderLookupName","_validateOrderLookupForm","_Msdyn365$getUrlSync","actionContextValue","orderDetailsPath","baseUrl","redirectUrl","searchParameters","searchParams","fieldName","fieldValue","_this$orderNumberInpu","_this$emailInputRef$c","orderNumberInputRef","emailInputRef","additionalPropertyStates","isAdditionalFieldError","isKeyExistInAdditionalFieldArray","labelName","isValidFieldName","additionalfieldErrorMessage","ordernumber","isOrdNumberError","isReqError","isEmailError","isValidEmailError","isValidLookupField","isValidAdditionalLookupField","_renderAlert","orderLookupEmailValidationErrorMessage","orderLookupRequiredTextErrorMessage","requiredErrorMessage","emailValidationErrorMessage","isRequireError","isEmailValidError","isValidEmailInput","_renderOrderNumberAlert","orderLookupOrderNumberValidationErrorMessage","_renderOrderLookupInput","orderLookupEmailLabel","orderLookupEmailAriaLabel","_additionalFieldValidation","isFieldValid","RegExp","test","isValid","isDisable","isEmailValid","orderLookupSearchAdditionalFields","_item$labelName","_item$ariaLabel","_item$validationMessa","validationMessage","_context$request$user","orderLookupDefaultHeadingText","orderLookupButtonLabel","orderLookupFormAriaLabel","orderLookupOrderNumberLabel","orderLookupOrderNumberAriaLabel","orderLookupSubmitAriaLabel","headingText","orderLookupContainerClassName","orderLookupFormClassName","orderLookupAdditionalFiledContainerClassName","orderLookupFormFieldsClassName","orderNumberLabelClassName","orderNumberInputErrorClassName","submitButtonClassName","signinLinkClassName","orderLookupHeading","orderLookup","orderLookupContainer","orderLookupAdditionalFieldContainer","_createParagraph","renderOrderLookupInputField","orderLookupForm","autoComplete","orderNumberInput","submitButtonLabelText","fieldErrorMessage","registeredUserMessage","submit","_renderAdditionalFields","_getExtensibleEnumera","_getExtensibleEnumera2","isOrderLookupAdditionalFieldValid","isOrderLookupFieldValid","getExtensibleEnumerations","StoreOperationsDataActions","TypeName","ExtensibleEnumerations","orderLookupAdditionalParameter","validateOrderLookupField","orderStatusLookUpParameter","isValidField","validateOrderLookupAdditionalField","orderStatusLookUpAdditionalParameters","isValidAdditionalField","_item$fieldKey","fieldKey","validateAdditionalFieldWithProxy","some","setLookupFieldState","additionalFieldsInput","OrderLookupViewComponent","_orderLookupForm$clas","_submitButton$classNa","ProductSpecificationTableRow","productName","cellData","scope","getRichTextHtml","ProductSpecification","drawerListId","isDrawerOpen","isAdditionalMediaDrawerOpen","catalogId","validateCatalogId","product","actionInput","AttributesForSelectedVariantInput","channelId","getAttributesForSelectedVariant","productSpecificationData","isAccrodion","displayStyle","handleText","ProductSpecificationTableProps","ProductSpecificationTableBodyProps","productSpecificationResult","_createDrawerBody","_createTableBody","_renderProductCell","OmniChannelMedia","_createAdditionalMediaDrawer","_this$props$context$r2","accordionItemContainer","drawers","_product$Name","Drawer","collapseProps","timeout","openGlyph","closeGlyph","glyphPlacement","toggleButtonText","additionalDownloadsText","prevState","additionalMediaLocations","mediaLocation","Uri","download","AltText","_renderCurrencyCell","_renderDateTimeCell","_renderDecimalCell","_renderIntegerCell","_renderTextCell","_renderTrueFalseCell","warning","CurrencyValue","CurrencyCode","_product$DateTimeOffs","DateTimeOffsetValue","toUTCString","FloatValue","TextValue","trueValueText","falseValueText","rowdata","ObjectExtensions","isNullOrUndefined","SocialShare","socialShareItems","cookies","isConsentGiven","viewprops","SocialShareList","caption","orientation","SocialShareItem","tabIndex","SocialShareItemElements","SocialShareView","SocialShareElement","BusinessFormItemComponent","renderModal","BusinessUserFormComponent","BusinessUserDetailsComponent","buttonList","headingForEmptyUserOrganizationList","textForEmptyUserOrganizationList","getForm","$","global","forced"],"sourceRoot":""}