\n) => () => {\n props.onRequestInvoice!(props.data.invoice, requestInvoiceButtonReference);\n};\n\nconst getDesktopRowCells = (props: IInvoicesTableRowProps, onSelectLine: () => void) => {\n const {\n data: { invoice, customer }\n } = props;\n\n const isCurrentUser =\n !StringExtensions.isNullOrWhitespace(customer.AccountNumber) && customer.AccountNumber === invoice.customerAccountNumber;\n\n const linkToInvoiceDetails = getInvoiceDetailsPageUrlSync(props.data.invoice.id, props.context.actionContext);\n const invoiceRowArialabel = format(props.resources.invoiceListSelectRadioAriaLabelText, invoice.id);\n return (\n <>\n | \n \n | \n \n \n {invoice.id}\n \n | \n \n {formatDate(props.context, invoice.invoiceDate)}\n | \n \n {invoice.customerName}\n {isCurrentUser ? {props.resources.invoiceCurrentUser} : null}\n | \n {formatAmount(props.context, invoice.amount, invoice.currencyCode)} | \n \n {formatDate(props.context, invoice.dueDate)}\n | \n {formatAmount(props.context, invoice.amountDue, invoice.currencyCode)} | \n \n {getInvoiceStatusText(props.resources, invoice.status)}\n | \n {extraActionsPopup(props)} | \n \n );\n};\n\nlet setShowPreviousActions: React.Dispatch> | undefined;\n\n/**\n * On Click view details function.\n * @param linkToInvoiceDetails -Link to invoice details.\n * @returns Go to invoice details.\n */\nconst onClickViewDetails = (linkToInvoiceDetails: string) => () => {\n if (MsDyn365.isBrowser) {\n window.location.href = linkToInvoiceDetails;\n }\n return;\n};\n\n/**\n * Toggle function.\n * @param isShowActions -Link to invoice details.\n * @param setShowActions -Link to invoice details.\n * @returns Go to invoice details.\n */\nconst toggle = (isShowActions: boolean, setShowActions: React.Dispatch>) => () => {\n const shouldShowActions = !isShowActions;\n if (shouldShowActions) {\n if (setShowPreviousActions) {\n setShowPreviousActions(false);\n }\n setShowActions(shouldShowActions);\n setShowPreviousActions = setShowActions;\n } else {\n setShowPreviousActions = undefined;\n setShowActions(shouldShowActions);\n }\n};\n\nconst extraActionsPopup = (props: IInvoicesTableRowProps): JSX.Element | null => {\n const {\n resources: {\n invoiceViewDetailsButtonAriaLabel,\n invoiceViewDetailsButtonText,\n invoiceActionsButtonTextAriaLabel,\n invoiceActionsButtonIsOnBehalfOfTextAriaLabel\n },\n data: { index }\n } = props;\n\n const [showActions, setShowActions] = useState(false);\n const isOnBehalfOfRequest = isOboRequest(props.context.request);\n\n const linkToInvoiceDetails = getInvoiceDetailsPageUrlSync(props.data.invoice.id, props.context.actionContext);\n\n const className = `${props.className}__extra-actions-cell`;\n const actionsContainerClassName = `${className}__actions-container`;\n const payInvoiceClassName = `${actionsContainerClassName}__pay-invoice`;\n return (\n \n
\n {showActions && !isOnBehalfOfRequest && (\n
\n
\n {invoiceViewDetailsButtonText}\n \n \n \n \n )}\n
\n \n | \n \n \n {invoice.id}\n \n
\n {invoice.customerName}\n | \n \n {formatDate(props.context, invoice.dueDate)}\n
\n {getInvoiceStatusText(props.resources, invoice.status)}\n | \n {extraActionsPopup(props)} | \n \n );\n};\n\nconst InvoicesTableRow: React.FC = (props: IInvoicesTableRowProps): JSX.Element => {\n const {\n data: { invoice }\n } = props;\n\n const onSelectLine = () => {\n invoice.isSelected = !invoice.isSelected;\n props.onChange();\n };\n\n let rowCells: JSX.Element;\n if (props.isMobile) {\n rowCells = getMobileRowCells(props, onSelectLine);\n } else {\n rowCells = getDesktopRowCells(props, onSelectLine);\n }\n\n return {rowCells}
;\n};\n\nexport const InvoicesTableRowComponent: React.FunctionComponent = msdyn365Commerce.createComponent<\n // @ts-expect-error\n IInvoicesTableRowComponent\n>('InvoicesTableRowComponent', { component: InvoicesTableRow });\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IComponent, IComponentProps, ICoreContext, msdyn365Commerce } from '@msdyn365-commerce/core';\nimport { Customer } from '@msdyn365-commerce/retail-proxy';\nimport { ArrayExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport React, { useState } from 'react';\n\nimport { InvoiceModel } from '../../helpers/invoice-data';\nimport { IInvoiceErrorState } from '../../invoices-list';\nimport { IInvoicesTableHeaderResources, InvoicesTableHeaderComponent } from './components/invoices-table-header-component';\nimport { IInvoicesTableRowResources, InvoicesTableRowComponent } from './components/invoices-table-row-component';\n\ninterface IInvoicesTableData {\n invoices: InvoiceModel[];\n customer: Customer;\n}\n\nexport interface IInvoicesTableResources extends IInvoicesTableHeaderResources, IInvoicesTableRowResources {}\n\nexport interface IInvoicesTableProps extends IComponentProps {\n context: ICoreContext;\n className: string;\n invoiceButtonReferences?: React.RefObject[];\n payInvoiceButtonReferences?: React.RefObject[];\n resources: IInvoicesTableResources;\n\n onChange(): void;\n onError?(errorState: IInvoiceErrorState, reference?: React.RefObject): void;\n onRequestInvoice(invoice: InvoiceModel, requestInvoiceButtonReference: React.RefObject): void;\n}\n\nexport interface IInvoicesTableComponent extends IComponent {}\n\ntype GridSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nconst getViewport = (context: ICoreContext): GridSize => {\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 (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\nconst isMobileView = (context: ICoreContext) => {\n const viewport = getViewport(context);\n return viewport === 'xs' || viewport === 'sm';\n};\n\n/**\n * On select all function.\n * @param props -Invoice table props.\n * @returns On change.\n */\nconst onSelectAllHandler = (props: IInvoicesTableProps) => (isSelected: boolean) => {\n props.data.invoices.forEach(invoice => {\n invoice.isSelected = isSelected;\n });\n props.onChange();\n};\n\nconst InvoicesTable: React.FC = (props: IInvoicesTableProps): JSX.Element => {\n const [isMobile, setIsMobile] = useState(isMobileView(props.context));\n\n const updateViewport = () => {\n setIsMobile(isMobileView(props.context));\n };\n\n if (typeof window !== undefined && window.addEventListener) {\n window.addEventListener('resize', updateViewport);\n }\n const rowClassName = `${props.className}__row`;\n const headerClassName = `${props.className}__header`;\n\n return (\n \n );\n};\n\nexport const InvoicesTableComponent: React.FunctionComponent = msdyn365Commerce.createComponent<\n // @ts-expect-error\n IInvoicesTableComponent\n>('InvoicesTableComponent', { component: InvoicesTable });\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IComponent, IComponentProps, ICoreContext, ITelemetry, msdyn365Commerce } from '@msdyn365-commerce/core';\nimport { ArrayExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport { Button, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport React, { useState } from 'react';\n\nimport { InvoiceModel } from '../helpers/invoice-data';\nimport { payInvoices } from '../helpers/pay-invoices';\nimport { IInvoiceErrorState } from '../invoices-list';\n\ninterface IMakePaymentData {\n invoices: InvoiceModel[];\n}\n\nexport interface IMakePaymentResources {\n makePaymentButtonText: string;\n makePaymentButtonAriaLabel: string;\n}\n\nexport interface IMakePaymentProps extends IComponentProps {\n context: ICoreContext;\n itemKey?: string;\n telemetry: ITelemetry;\n moduleId: string;\n moduleTypeName: string;\n telemetryContent?: ITelemetryContent;\n navigationUrl?: string;\n buttonReferences?: React.RefObject;\n resources: IMakePaymentResources;\n disabled?: boolean;\n\n onError?(errorState: IInvoiceErrorState, reference?: React.RefObject): void;\n}\n\nexport interface IMakePaymentComponent extends IComponent {}\n\nconst onClick = async (\n _event: React.MouseEvent,\n props: IMakePaymentProps,\n setDisabled: (disabled: boolean) => void\n): Promise => {\n setDisabled(true);\n\n const propagateError = (errorState: IInvoiceErrorState): void => {\n if (props.onError) {\n props.onError(errorState, props.buttonReferences);\n }\n setDisabled(false);\n };\n\n await payInvoices(props.data.invoices, props.context.actionContext, propagateError);\n};\n\nconst MakePaymentComponentActions = {\n onClick\n};\n\n/**\n * On Click function.\n * @param input -Make payment props.\n * @param setDisabled -Set Disabled.\n * @returns Make payment component on click.\n */\nconst onClickHandler = (input: IMakePaymentProps, setDisabled: React.Dispatch>) => async (\n event: React.MouseEvent\n) => {\n await MakePaymentComponentActions.onClick(event, input, setDisabled);\n};\n\nconst MakePayment: React.FC = (input: IMakePaymentProps): JSX.Element => {\n const {\n data: { invoices }\n } = input;\n const hasInvoices = ArrayExtensions.hasElements(invoices.filter(invoice => invoice.canBePaid));\n const [disabled, setDisabled] = useState(false);\n\n return (\n \n {input.resources.makePaymentButtonText}\n \n );\n};\n\n// @ts-expect-error\nexport const MakePaymentComponent: React.FunctionComponent = msdyn365Commerce.createComponent(\n 'MakePayment',\n { component: MakePayment }\n);\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IComponent, IComponentProps, ICoreContext, msdyn365Commerce } from '@msdyn365-commerce/core';\nimport { Button } from '@msdyn365-commerce-modules/utilities';\nimport React, { useState } from 'react';\n\nimport { IPayableInvoice } from '../helpers/invoice-data';\nimport { payInvoices } from '../helpers/pay-invoices';\nimport { IInvoiceErrorState } from '../invoices-list';\n\nexport interface IPayInvoiceData {\n invoice: IPayableInvoice;\n}\n\nexport interface IPayInvoiceResources {\n payInvoiceButtonText: string;\n payInvoiceButtonAriaLabel: string;\n}\n\nexport interface IPayInvoiceProps extends IComponentProps {\n context: ICoreContext;\n className: string;\n reference?: React.RefObject;\n resources: IPayInvoiceResources;\n disabled?: boolean;\n\n onError?(errorState: IInvoiceErrorState, reference?: React.RefObject): void;\n}\n\ninterface IPayInvoiceComponent extends IComponent {}\n\nconst onClick = async (\n _event: React.MouseEvent,\n props: IPayInvoiceProps,\n setDisabled: (disabled: boolean) => void\n): Promise => {\n setDisabled(true);\n\n const propagateError = (errorState: IInvoiceErrorState): void => {\n if (props.onError) {\n props.onError(errorState, props.reference);\n }\n setDisabled(false);\n };\n\n await payInvoices([props.data.invoice], props.context.actionContext, propagateError);\n};\n\nconst PayInvoiceComponentActions = {\n onClick\n};\n\n/**\n * On click handler function.\n * @param props -Invoice props.\n * @param setDisabled -Set disabled.\n * @returns Pay invoice component action.\n */\nconst onClickHandler = (props: IPayInvoiceProps, setDisabled: React.Dispatch>) => async (\n event: React.MouseEvent\n) => {\n await PayInvoiceComponentActions.onClick(event, props, setDisabled);\n};\n\nconst PayInvoice: React.FC = (props: IPayInvoiceProps): JSX.Element => {\n const [disabled, setDisabled] = useState(false);\n\n return (\n \n {props.resources.payInvoiceButtonText}\n \n );\n};\n\n// @ts-expect-error\nexport const PayInvoiceComponent: React.FunctionComponent = msdyn365Commerce.createComponent(\n 'PayInvoiceComponent',\n { component: PayInvoice, ...PayInvoiceComponentActions }\n);\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Button } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\ninterface IRequestInvoiceButtonProps {\n innerReference?: React.RefObject;\n className: string;\n requestInvoiceButtonLabel: string;\n onClicked(): void;\n}\n\nexport const RequestInvoiceButton: React.FC = ({\n className,\n onClicked,\n requestInvoiceButtonLabel,\n innerReference\n}) => {\n return (\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 { InvoicePaidStatus, OrderInvoice } from '@msdyn365-commerce/retail-proxy';\n\nexport interface IPayableInvoice {\n readonly id: string;\n readonly canBePaid: boolean;\n}\n\n/**\n * Represents invoice data model.\n */\nexport class InvoiceModel implements IPayableInvoice {\n public id: string;\n\n public invoiceDate?: Date;\n\n public customerAccountNumber?: string;\n\n public customerName?: string;\n\n public amount?: number;\n\n public dueDate?: Date;\n\n public amountDue?: number;\n\n public status?: InvoicePaidStatus;\n\n public currencyCode?: string;\n\n public isSelected: boolean;\n\n public constructor(invoice: OrderInvoice) {\n this.id = invoice.Id || '';\n this.invoiceDate = invoice.InvoiceDate ? new Date(invoice.InvoiceDate) : undefined;\n this.customerAccountNumber = invoice.CustomerAccountNumber;\n this.customerName = invoice.CustomerName;\n this.amount = invoice.TotalAmount;\n this.dueDate = invoice.InvoiceDueDate ? new Date(invoice.InvoiceDueDate) : undefined;\n this.amountDue = invoice.AmountBalance;\n this.status = invoice.InvoicePaidStatusValue;\n this.currencyCode = invoice.CurrencyCode;\n\n this.isSelected = false;\n }\n\n public get canBePaid(): boolean {\n return this.status !== InvoicePaidStatus.Paid;\n }\n}\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { InvoicePaidStatus } from '@msdyn365-commerce/retail-proxy';\n\nexport interface IInvoiceStatusResources {\n invoiceStatusNone: string;\n invoiceStatusUnpaid: string;\n invoiceStatusPartiallyPaid: string;\n invoiceStatusPaid: string;\n}\n\nexport const getInvoiceStatusText = (resources: IInvoiceStatusResources, invoiceStatus: InvoicePaidStatus | undefined) => {\n switch (invoiceStatus) {\n case InvoicePaidStatus.None:\n return resources.invoiceStatusNone;\n\n case InvoicePaidStatus.Unpaid:\n return resources.invoiceStatusUnpaid;\n\n case InvoicePaidStatus.PartiallyPaid:\n return resources.invoiceStatusPartiallyPaid;\n\n case InvoicePaidStatus.Paid:\n return resources.invoiceStatusPaid;\n default:\n return '';\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, IActionContext } from '@msdyn365-commerce/core';\nimport { getCartState } from '@msdyn365-commerce/global-state';\nimport { ArrayExtensions } from '@msdyn365-commerce-modules/retail-actions';\n\nimport { IInvoiceErrorState } from '../invoices-list';\nimport { IPayableInvoice } from './invoice-data';\n\nexport type ICartActionFailureReason = 'EMPTYINPUT' | 'CARTACTIONFAILED';\nexport interface IAddInvoicesToCartFailureResult {\n failureReason: ICartActionFailureReason;\n}\n\nexport const payInvoices = async (\n invoices: IPayableInvoice[],\n actionContext: IActionContext,\n onError: (errorState: IInvoiceErrorState) => void\n) => {\n const invoicesToAdd: string[] = invoices.filter(invoice => invoice.canBePaid).map(invoice => invoice.id);\n\n if (!ArrayExtensions.hasElements(invoicesToAdd)) {\n onError({ errorMessage: '', errorReason: { failureReason: 'EMPTYINPUT' } });\n return;\n }\n\n const cartState = await getCartState(actionContext);\n const result = await cartState.addInvoicesToCart({ invoiceIds: invoicesToAdd });\n\n if (result.status !== 'SUCCESS') {\n onError({\n errorMessage: '',\n errorReason: { failureReason: 'CARTACTIONFAILED' },\n otherError: result.errorDetails?.LocalizedMessage,\n errorCode: result.errorDetails?.ErrorResourceId\n });\n return;\n }\n\n const cartUrl = getUrlSync('cart', actionContext);\n if (cartUrl) {\n window?.location.assign(cartUrl);\n }\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { ArrayExtensions, StringExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport { Modal, ModalBody, ModalFooter, ModalHeader } from '@msdyn365-commerce-modules/utilities';\n\n/* ---------------------------------------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT License. See License.txt in the project root for license information.\n *--------------------------------------------------------------------------------------------*/\nimport classnames from 'classnames';\nimport * as React from 'react';\n\nimport { InvoiceModel } from '../helpers/invoice-data';\nimport { IInvoicesListResources } from '../invoices-list.props.autogenerated';\n\ninterface IRequestInvoiceModalProps {\n className: string;\n email: string;\n isModalOpen: boolean;\n submitRequestLabel: string;\n modalHeaderLabel: string;\n sendToEmailLabel: string;\n cancelLabel: string;\n searchPlaceholderLabel: string;\n invoices: InvoiceModel[];\n invoicesFoundString: string;\n singleInvoiceFoundString: string;\n searchButtonAltText: string;\n resources: IInvoicesListResources;\n toggle(): void;\n onSubmitRequest(invoiceId: string): void;\n}\n\n/**\n * On submit request click function.\n * @param selectedInvoiceIndex -Check is busy.\n * @param onClosing -On closing function.\n * @param filteredInvoices -Invoice modal.\n * @param onSubmitRequest -On submit request function.\n * @returns Call on submit request.\n */\nconst onSubmitRequestClick = (\n onClosing: () => void,\n filteredInvoices: InvoiceModel[],\n onSubmitRequest: (invoiceId: string) => void,\n checkboxRef: React.MutableRefObject\n) => () => {\n const defaultIndex = 0;\n let closingFlag: number = 0;\n\n filteredInvoices.map((invoice, index) => {\n const inputInvoice = checkboxRef.current[Number(index)] as React.RefObject;\n if (inputInvoice.current?.checked === true && index >= defaultIndex) {\n onSubmitRequest(invoice.id);\n closingFlag = closingFlag + 1;\n }\n });\n if (closingFlag <= filteredInvoices.length) {\n onClosing();\n }\n};\n\n/**\n * On search input change function.\n * @param setSearchInput -Set search input.\n * @returns Set search input function.\n */\nconst searchInputChangedHandler = (setSearchInput: React.Dispatch>) => (\n event: React.ChangeEvent\n) => {\n setSearchInput(event.target.value);\n};\n\n/**\n * Search entered handler.\n * @param invoices -InvoiceModel.\n * @param searchInput -String.\n * @param setFilteredInvoices -InvoiceModel action.\n * @param filteredInvoices -Filtered Invoices.\n * @param setSelectedInvoiceIndex -Selected Invoice Index.\n * @param setShouldShowSearchResults -Show search result action.\n * @param setInvoiceOptions -Invoice options action.\n * @param selectedInvoiceIndex -Selected invoice index.\n * @param className -String.\n * @returns Set invoice options.\n */\nconst searchEnteredHandler = (\n invoices: InvoiceModel[],\n searchInput: string,\n setFilteredInvoices: React.Dispatch>,\n filteredInvoices: InvoiceModel[],\n setSelectedInvoiceIndex: React.Dispatch>,\n setShouldShowSearchResults: React.Dispatch>,\n setInvoiceOptions: React.Dispatch>,\n selectedInvoiceIndex: number,\n className: string,\n checkboxRef: React.MutableRefObject\n) => () => {\n let updatedInvoices = filteredInvoices;\n if (!StringExtensions.isNullOrEmpty(searchInput)) {\n updatedInvoices = invoices.filter(invoice => invoice.id.toLocaleUpperCase().includes(searchInput.toLocaleUpperCase()));\n } else {\n updatedInvoices = invoices;\n }\n\n if (ArrayExtensions.hasElements(updatedInvoices)) {\n setFilteredInvoices(updatedInvoices);\n setSelectedInvoiceIndex(0);\n } else {\n setFilteredInvoices(updatedInvoices);\n setSelectedInvoiceIndex(-1);\n }\n setShouldShowSearchResults(true);\n\n setInvoiceOptions(\n renderInvoiceOptions(\n StringExtensions.isNullOrEmpty(searchInput) ? invoices : updatedInvoices,\n setSelectedInvoiceIndex,\n className,\n checkboxRef\n )\n );\n};\n\n/**\n * On cancel function.\n * @param onClosing -Closing function.\n * @param toggle -Toggle Function.\n * @returns Toggle function.\n */\nconst onCancelHandler = (onClosing: () => void, toggle: () => void) => () => {\n onClosing();\n toggle();\n};\n\n/**\n * On invoice select.\n * @param setSelectedInvoiceIndex -Set Selected Invoice Index.\n * @param index -Number.\n * @returns Set Selected Invoice Index.\n */\nconst onInvoiceSelectHandler = (setSelectedInvoiceIndex: (newIndex: number) => void, index: number) => () => {\n setSelectedInvoiceIndex(index);\n};\n\nconst renderInvoiceOptions = (\n filteredInvoices: InvoiceModel[],\n setSelectedInvoiceIndex: (newIndex: number) => void,\n className: string,\n checkboxRef: React.MutableRefObject\n) => {\n checkboxRef.current = filteredInvoices.map((_invoice, i) => checkboxRef.current[Number(i)] ?? React.createRef());\n return (\n \n {filteredInvoices.map((invoice, index) => {\n const onInvoiceSelect = onInvoiceSelectHandler(setSelectedInvoiceIndex, index);\n\n const checkboxId = `invoice__${invoice.id}`;\n const checkboxName = `invoiceSelect__${invoice.id}`;\n\n return (\n
\n \n \n
\n );\n })}\n
\n
\n
\n {email}\n
\n
\n {shouldShowSearchResults && (\n
\n {searchResultString.substring(0, invoicesFoundReplaceIndex)}\n {filteredInvoices.length}\n {searchResultString.substring(invoicesFoundReplaceIndex + 3)}\n
\n )}\n
\n \n \n
\n {invoiceOptions}\n
\n
\n
\n
\n
{invoicesListDescTitle}
\n
{amountText}
\n
{countText}
\n
\n
\n
{this.props.resources.invoiceEmptyInvoiceLinesTitle}
\n
{this.props.resources.invoiceEmptyInvoiceLinesDescription}
\n
\n \n {this.props.resources.invoiceEmptyInvoiceLinesContinueShoppingButtonText}\n \n
\n
\n
\n {this._renderMakePayment(containerHeaderClass, isOnBehalfOfRequest)}\n {this._renderInvoiceRequestButton()}\n
\n
{this._renderInvoiceErrors()}
\n
{this._renderInvoicesList(containerContentClass)}
\n
\n
{this.props.promoCodeHeadingText}
\n {this._renderForm(this.props.promoPlaceholderText, this.props.promoCodeApplyButtonText, this.props.cart)}\n
\n {this.state.error}\n
\n {this._renderAppliedPromoCode(this.props)}\n
\n
\n {'Code '}\n {coupon.Code}\n {'Applied '}\n
\n
\n
\n \n
\n \n \n );\n }\n\n private _renderDrawerLink(item: IMenuItemData): JSX.Element | null {\n if (item.linkURL && !StringExtensions.isNullOrWhitespace(item.linkURL)) {\n return this._renderLinkMenuItem(item);\n } else if (!item.linkURL) {\n return this._renderSpanMenuItem(item);\n }\n return null;\n }\n\n private _renderDisplay(): JSX.Element[] {\n const { ListItem } = this.props.navProps;\n const menuItemData: IMenuItemData[] = this.props.navProps.menuItemData;\n const { activeMenu } = this.state;\n const menuItemList: JSX.Element[] = [];\n\n if (ArrayExtensions.hasElements(menuItemData)) {\n menuItemData[0].id = 1;\n }\n\n if (this.state.isOnlyMobile && activeMenu !== undefined && ArrayExtensions.hasElements(menuItemData)) {\n const menuItem = this._getFromSubMenu(undefined, menuItemData);\n\n if (menuItem) {\n menuItemList.push(\n \n {` `}\n {this._createMenuItemList(menuItem)} {` `}\n \n );\n }\n } else {\n for (const [index, item] of menuItemData.entries()) {\n menuItemList.push(\n \n {this._createMenuItemList(item)}\n \n );\n }\n }\n\n return menuItemList;\n }\n\n private _getFromSubMenu(parentMenuId?: number, menu?: IMenuItemData[]): IMenuItemData | null {\n if (!menu) {\n return null;\n }\n\n for (let index = 0; index <= menu.length - NavMenuConstants.one; index++) {\n const item: IMenuItemData = menu[Number(index)];\n\n if (item.id === this.state.activeMenu) {\n if (!NavigationMenuRootDisabled.isBackTrack) {\n this.setState({ parentMenu: parentMenuId });\n } else {\n this.setState({ parentMenu: parentMenuId, mobileViewLabelText: item.linkText });\n }\n return item;\n }\n const found = this._getFromSubMenu(item.id, item.subMenu);\n if (found) {\n return found;\n }\n }\n return null;\n }\n\n private _createMenuItemList(menuItemData: IMenuItemData): JSX.Element | null {\n if (ArrayExtensions.hasElements(menuItemData.subMenu)) {\n if (this.state.isOnlyMobile && this.state.activeMenu !== undefined) {\n return this._renderSubMenu(menuItemData.subMenu, menuItemData.id, false);\n }\n\n return (\n <>\n {this._renderButtonMenuItem(menuItemData)}\n {this._renderSubMenu(menuItemData.subMenu, menuItemData.id)}\n \n );\n } else if (menuItemData.linkURL && !StringExtensions.isNullOrWhitespace(menuItemData.linkURL)) {\n return this._renderLinkMenuItem(menuItemData, menuItemData.id);\n } else if (!menuItemData.linkURL && !(this.state.isOnlyMobile && this.state.activeMenu !== undefined)) {\n return this._renderSpanMenuItem(menuItemData);\n }\n\n return null;\n }\n\n private _renderSubMenu(subMenuArray?: IMenuItemData[], activeMenu?: number, isSubMenu?: boolean): JSX.Element | null {\n let subMenus: IMenuItemData[] | undefined = subMenuArray;\n if (activeMenu === NavMenuConstants.rootMenu) {\n subMenus = subMenuArray!.filter(subMenuItem => subMenuItem.id && subMenuItem.id >= MenuTypeIndexId.Retail);\n }\n\n const { ListItem } = this.props.navProps;\n const isEnableMultiSupportMenu = this.props.navProps.config.enableMultilevelMenu ?? false;\n const multiLevelSupportedMenu = this.props.navProps.config.menuLevelSupport ?? NavMenuConstants.three;\n\n if (activeMenu && this.state.activeMenu !== activeMenu) {\n this.props.navProps.context.telemetry.error('Navigation Active menu content is empty, module wont render.');\n return null;\n }\n\n if (!subMenus || !ArrayExtensions.hasElements(subMenus)) {\n this.props.navProps.context.telemetry.error('Navigation Submenu content is empty, module wont render.');\n return null;\n }\n\n let levelClassName: string = '';\n const menuOptions = subMenus.map((option: IMenuItemData, index: number) => {\n const hasOptions = option.subMenu && ArrayExtensions.hasElements(option.subMenu);\n let menuItem: JSX.Element | null;\n if (hasOptions && this.state.isOnlyMobile) {\n menuItem = this._renderButtonMenuItem(option, activeMenu, index);\n } else if (this.currentLevel === NavMenuConstants.one || !hasOptions) {\n menuItem = this.getMenuItem(option, index);\n } else {\n menuItem = null;\n }\n let subMenu;\n const isHavingSubmenu =\n hasOptions && isEnableMultiSupportMenu && this.currentLevel <= Math.round(multiLevelSupportedMenu) - NavMenuConstants.one;\n\n if (hasOptions && !this.state.isOnlyMobile) {\n if (this.currentLevel >= NavMenuConstants.two) {\n subMenu = this._renderSubMenuDrawer(option);\n } else if (this.currentLevel <= this.supportedLevel) {\n this.currentLevel++;\n levelClassName = `level-${this.currentLevel.toString()}`;\n subMenu = this._renderSubMenu(option.subMenu, undefined, true);\n }\n }\n\n if (isHavingSubmenu && this.state.isOnlyMobile) {\n this.currentLevel++;\n levelClassName = isEnableMultiSupportMenu ? `level-${this.currentLevel.toString()}` : '';\n subMenu = this._renderSubMenu(option.subMenu, option.id, true);\n }\n const imagesource = option.imageSource ? option.imageSource : '';\n return (\n \n {menuItem}\n {subMenu}\n \n );\n });\n return this._renderMenu(levelClassName, menuOptions, isSubMenu);\n }\n\n private getMenuItem(option: IMenuItemData, index: number): JSX.Element | null {\n let menuItem: JSX.Element | null;\n if (this.currentLevel === NavMenuConstants.one) {\n menuItem = option.linkURL ? this._renderLinkMenuItemLevelOne(option, index) : this._renderSpanMenuItem(option);\n } else {\n menuItem = option.linkURL ? this._renderLinkMenuItem(option, index) : this._renderSpanMenuItem(option);\n }\n return menuItem;\n }\n\n private _renderSubMenuDrawer(menuItem: IMenuItemData): JSX.Element | null {\n const levelClassName = `level-${this.currentLevel.toString()}`;\n const toggleButtonText = menuItem.linkText;\n const keyValue = this.state.drawerKeyValue;\n const buttonText = toggleButtonText !== undefined ? toggleButtonText : '';\n const keys = keyValue;\n const multiLevelSupportedMenu = this.props.navProps.config.menuLevelSupport ?? NavMenuConstants.three;\n\n let isDrawerOpen = false;\n if (keys[menuItem.id!]) {\n isDrawerOpen = true;\n }\n const colProps: ICollapseProps = { timeout: 0, isOpen: isDrawerOpen };\n\n return (\n \n \n {menuItem.subMenu!.map((menuSubItem: IMenuItemData) => {\n if (ArrayExtensions.hasElements(menuSubItem.subMenu)) {\n this.currentLevel++;\n if (this.currentLevel < multiLevelSupportedMenu) {\n return this._renderSubMenuDrawer(menuSubItem);\n }\n }\n return this._renderDrawerLink(menuSubItem);\n })}\n
\n \n );\n }\n\n /**\n * Method to handle escape key event.\n * @param menuId -Number.\n * @param isDrawerOpen -Boolean.\n * @returns Void.\n */\n private readonly _bindDesktopCategoryClick = (menuId: number | undefined, isDrawerOpen: boolean) => (): void => {\n const { drawerKeyValue } = this.state;\n const newPair = { [menuId!]: !isDrawerOpen };\n this.setState({ drawerKeyValue: { ...drawerKeyValue, ...newPair } });\n };\n\n private _renderButtonMenuItem(option: IMenuItemData, activeMenu?: number, index?: number): JSX.Element | null {\n return (\n \n {option.linkText}\n \n );\n }\n\n private _renderLinkMenuItem(option: IMenuItemData, index?: number): JSX.Element | null {\n const { Link } = this.props.navProps;\n const linkText = option.linkText ? option.linkText : '';\n this.payLoad.contentAction.etext = linkText;\n const attributes = getTelemetryAttributes(this.telemetryContent, this.payLoad);\n return (\n \n {option.linkText}\n \n );\n }\n\n private _renderLinkMenuItemLevelOne(option: IMenuItemData, index?: number, isHoverEffect: boolean = true): JSX.Element | null {\n const { Link } = this.props.navProps;\n const linkText = option.linkText ? option.linkText : '';\n const imagesource = option.imageSource ? option.imageSource : '';\n this.payLoad.contentAction.etext = linkText;\n const attributes = getTelemetryAttributes(this.telemetryContent, this.payLoad);\n return (\n \n {option.linkText}\n \n );\n }\n\n private _renderPromotionalLink(linkText?: string, linkUrl?: string): JSX.Element | null {\n const { Link } = this.props.navProps;\n this.payLoad.contentAction.etext = linkText;\n const attributes = getTelemetryAttributes(this.telemetryContent, this.payLoad);\n if (linkText && linkUrl) {\n return (\n \n {linkText}\n \n );\n }\n return null;\n }\n\n private _renderSpanMenuItem(option: IMenuItemData, index?: number): JSX.Element | null {\n const { Span } = this.props.navProps;\n return (\n \n {option.linkText}\n \n );\n }\n\n private _renderMenu(level: string, menuOptions: JSX.Element[], isSubmenu?: boolean): JSX.Element | null {\n const { DivContainer, MenuList, ImageDivContainer, showCategoryImage, showPromotionalContent } = this.props.navProps;\n const isCategoryImageDisplay =\n !this.state.isOnlyMobile &&\n showCategoryImage &&\n this.state.categoryImage !== null &&\n this.state.categoryImage !== undefined &&\n !isSubmenu;\n const isPromotionalContentDisplay =\n !this.state.isOnlyMobile && showPromotionalContent && ArrayExtensions.hasElements(this.state.categoryImage) && !isSubmenu;\n const divContainerClass =\n this.currentLevel > NavMenuConstants.two || isCategoryImageDisplay ? DivContainer!.className : 'ms-nav__deafult';\n this.currentLevel = NavMenuConstants.one;\n const menuLevelSupportClassName =\n isCategoryImageDisplay &&\n this.props.navProps.config.menuLevelSupport &&\n this.props.navProps.config.menuLevelSupport > NavMenuConstants.two &&\n 'navmenu-multi-level';\n\n const categoryImages = this.state.categoryImage?.filter(image => !StringExtensions.isNullOrWhitespace(image.src));\n const imagesContainerKey = categoryImages?.map(item => item.src).join('-');\n return (\n \n \n {menuOptions}\n \n \n {isCategoryImageDisplay &&\n ArrayExtensions.hasElements(categoryImages) &&\n categoryImages.map(item => (\n \n {getCategoryImage(this.props, item.src ?? '', item.altText!.toString())}\n {isPromotionalContentDisplay &&\n this._renderPromotionalLink(item.altText, item.additionalProperties?.linkUrl)}\n \n ))}\n
\n \n );\n }\n\n /**\n * Handle Category image update.\n * @param categoryImageSource - Image source.\n * @param option - Menu Item data.\n * @returns Returns empty.\n */\n private readonly _updateCategoryImage = (categoryImageSource: string, option: IMenuItemData) => () => {\n const linkText = option.linkText ? option.linkText : '';\n const promotionalImage: Msdyn365.IImageData[] = [{ src: categoryImageSource, altText: linkText }];\n\n // Read category and promotional image in one array\n if (ArrayExtensions.hasElements(option.promotionalContent)) {\n for (const item of option.promotionalContent) {\n const imageSource = item.image.src;\n promotionalImage.push({\n src: imageSource,\n altText: item.text,\n additionalProperties: { linkUrl: item.linkUrl.destinationUrl }\n });\n }\n }\n this.setState({\n categoryImage: ArrayExtensions.hasElements(promotionalImage) ? promotionalImage : [{ src: 'empty' }]\n });\n };\n\n /**\n * Handle dropdown toggle.\n * @param data - Menu Item data.\n * @param parentId - Number.\n * @returns Returns empty.\n */\n private readonly _handleDropdownToggle = (data: IMenuItemData, parentId?: number) => () => {\n if (!this.state.isOnlyMobile) {\n this.setState({\n activeMenu: data.id,\n parentMenu: parentId\n });\n if (this.props.navProps.showCategoryImage) {\n this._updateCategoryImage(data.imageSource!, data)();\n }\n } else {\n NavigationMenuRootDisabled.isBackTrack = false;\n this.setState({\n activeMenu: data.id,\n mobileViewLabelText: data.linkText!,\n parentMenu: parentId\n });\n }\n };\n\n /**\n * Handle back navigation for menu items for mobile view.\n * @returns Returns empty.\n */\n private readonly _handleGoBack = () => () => {\n NavigationMenuRootDisabled.isBackTrack = true;\n this.setState(previousState => ({ activeMenu: previousState.parentMenu }));\n };\n\n /**\n * Function to close the nav menu on click on body.\n * @param event - MouseEvent.\n */\n private readonly _handleClickOutside = (event: MouseEvent) => {\n if (this.menuNode.current && !this.menuNode.current.contains(event.target as Node)) {\n if (!this.state.isOnlyMobile) {\n this.setState({ activeMenu: 1, mobileViewLabelText: '', isNavOpen: false });\n } else {\n this.setState({ activeMenu: undefined, mobileViewLabelText: '', isNavOpen: false });\n }\n }\n };\n\n /**\n * Checks to assign a ref for focus.\n * @param index -Sub menu list index.\n * @param mobileViewLabelText -Mobile view label text.\n * @param optionLinkText -Sub menu item link text.\n * @returns Boolean.\n */\n private readonly _shouldAddFocusMenuRef = (index: number, mobileViewLabelText?: string, optionLinkText?: string) => {\n const firstIndex: number = 0;\n if (!NavigationMenuRootDisabled.isBackTrack && index === firstIndex) {\n return true;\n }\n if (!optionLinkText || !mobileViewLabelText) {\n return false;\n }\n return mobileViewLabelText === optionLinkText;\n };\n\n /**\n * Function to handle nav menu close.\n */\n private readonly _closeNavMenu = (): void => {\n if (!this.state.isOnlyMobile) {\n this.setState({ activeMenu: 1, mobileViewLabelText: '', isNavOpen: false });\n } else {\n this.setState({ activeMenu: undefined, mobileViewLabelText: '', isNavOpen: false });\n }\n (this.menuNode.current?.children[0] as HTMLElement).focus();\n };\n\n /**\n * Function to close the nav menu on esc key.\n * @param event - Event.\n */\n private readonly _escFunction = (event: React.KeyboardEvent) => {\n if (event.keyCode === this.escapeKey && !this.state.isOnlyMobile && this.state.isNavOpen) {\n this.setState({ activeMenu: 1, mobileViewLabelText: '', isNavOpen: false });\n (this.menuNode.current?.children[0] as HTMLElement).focus();\n }\n };\n\n /**\n * Custom update viewport.\n */\n private readonly _customUpdateViewport = (): void => {\n this.setState({ isOnlyMobile: this.isOnlyMobile });\n };\n}\n\nexport default NavigationMenuRootDisabled;\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 { IMenuItemData, MenuSource, MenuTypeIndexId } from '@msdyn365-commerce-modules/navigation-menu';\nimport { ArrayExtensions, StringExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport {\n addThrottledEvent,\n Button,\n Collapse,\n Drawer,\n getPayloadObject,\n getTelemetryAttributes,\n getTelemetryObject,\n ICollapseProps,\n IPayLoad,\n isMobile,\n ITelemetryContent,\n Module,\n Node,\n onTelemetryClick,\n VariantType\n} from '@msdyn365-commerce-modules/utilities';\nimport classnames from 'classnames';\nimport { computed } from 'mobx';\nimport * as React from 'react';\n\nimport { getCategoryImage, INavigationMenuViewRootProps, INavigationState, NavMenuConstants } from './navigation-menu-utilities';\n\n/**\n *\n * NavigationMenuRootEnabled component.\n * @extends {React.PureComponent}\n */\nexport class NavigationMenuRootEnabled extends React.PureComponent {\n private static isBackTrack: boolean = false;\n\n private readonly supportedLevel: number = NavMenuConstants.four;\n\n private currentLevel: number = NavMenuConstants.zero;\n\n private readonly menuNode: React.RefObject;\n\n private readonly menuItemRef: React.RefObject;\n\n private readonly escapeKey: number = NavMenuConstants.escapeKey;\n\n private readonly telemetryContent: ITelemetryContent;\n\n private readonly promotionalImage: Msdyn365.IImageData[] = [];\n\n private menuItemData: IMenuItemData[] = [];\n\n private readonly payLoad: IPayLoad;\n\n private readonly attributes?: Msdyn365.IDictionary;\n\n private customResizeThrottledEventHandler?: (event: Event) => void;\n\n public constructor(props: INavigationMenuViewRootProps) {\n super(props);\n this.menuNode = React.createRef();\n this.menuItemRef = React.createRef();\n const { menuItemData } = this.props.navProps;\n if (ArrayExtensions.hasElements(menuItemData) && ArrayExtensions.hasElements(menuItemData[0].subMenu)) {\n const imagesource = menuItemData[0].subMenu[0].imageSource ? menuItemData[0].subMenu[0].imageSource : '';\n const linkText = menuItemData[0].subMenu[0].linkText ? menuItemData[0].subMenu[0].linkText : '';\n this.promotionalImage = [{ src: imagesource, altText: linkText }];\n\n // Read category and promotional image in one array\n if (ArrayExtensions.hasElements(menuItemData[0].subMenu[0].promotionalContent)) {\n menuItemData[0].subMenu[0].promotionalContent.map(item => {\n const imageSource = item.image.src;\n this.promotionalImage.push({\n src: imageSource,\n altText: item.text,\n additionalProperties: { linkUrl: item.linkUrl.destinationUrl }\n });\n return null;\n });\n }\n }\n this.state = {\n activeMenu: NavMenuConstants.rootMenu,\n mobileViewLabelText: '',\n parentMenu: undefined,\n drawerKeyValue: {},\n isOnlyMobile: this.isOnlyMobile,\n categoryImage: this.promotionalImage,\n isNavOpen: false\n };\n\n this.telemetryContent = getTelemetryObject(\n this.props.navProps.context.request.telemetryPageName!,\n this.props.navProps.friendlyName,\n this.props.navProps.telemetry\n );\n this.payLoad = getPayloadObject('click', this.telemetryContent, '', '');\n this.attributes = getTelemetryAttributes(this.telemetryContent, this.payLoad);\n }\n\n @computed public get isOnlyMobile(): boolean {\n return isMobile({ variant: VariantType.Browser, context: this.props.navProps.context.request }) === 'xs';\n }\n\n public componentDidMount(): void {\n this.customResizeThrottledEventHandler = addThrottledEvent(window, 'resize', this._customUpdateViewport as EventListener);\n document.addEventListener('keydown', (this._escFunction as unknown) as EventListener, false);\n this._customUpdateViewport();\n document.body.addEventListener('mousedown', this._handleClickOutside);\n this._addShopAllLink();\n }\n\n public componentDidUpdate(): void {\n if (this.menuItemRef.current?.children[0] && this.props.navProps.isMobileView) {\n (this.menuItemRef.current.children[0] as HTMLElement).focus();\n }\n }\n\n public componentWillUnmount(): void {\n window.removeEventListener('resize', this.customResizeThrottledEventHandler!, false);\n document.body.removeEventListener('mousedown', this._handleClickOutside, false);\n }\n\n public render(): JSX.Element | null {\n this.currentLevel = NavMenuConstants.one;\n const navbarKey = 'header-nav-mobile';\n return (\n \n {this.state.isOnlyMobile ? (\n this._renderMobileMenu()\n ) : (\n <>\n \n {this._renderCollapseMenu()}\n \n )}\n \n );\n }\n\n /**\n * Function to handle nav bar toggle.\n */\n private readonly _toggleNavBar = (): void => {\n this.setState(previousState => ({\n activeMenu: NavMenuConstants.rootMenu,\n isNavOpen: !previousState.isNavOpen\n }));\n };\n\n private _renderCollapseMenu(): JSX.Element | null {\n return (\n \n {this.state.isOnlyMobile ? this._renderMobileMenu() : this._renderDesktopMenu()}\n \n );\n }\n\n private _renderMobileMenu(): JSX.Element {\n const { MobileBackButton, MobileDescriptionContainer, MobileDescriptionLabel, Navigation } = this.props.navProps;\n\n this.currentLevel = NavMenuConstants.one;\n return (\n \n \n {this.state.isOnlyMobile && this.state.activeMenu !== undefined && (\n \n \n {this.state.mobileViewLabelText}\n \n )}\n {this._renderDisplay()}\n \n \n );\n }\n\n private _renderDesktopMenu(): JSX.Element {\n const { Navigation } = this.props.navProps;\n return (\n \n \n {this._renderDisplay()}\n \n \n
\n \n \n );\n }\n\n private _renderDrawerLink(item: IMenuItemData): JSX.Element | null {\n if (item.linkURL && !StringExtensions.isNullOrWhitespace(item.linkURL)) {\n return this._renderLinkMenuItem(item);\n } else if (!item.linkURL) {\n return this._renderSpanMenuItem(item);\n }\n return null;\n }\n\n private _renderDisplay(): JSX.Element[] {\n const { ListItem } = this.props.navProps;\n let menuItemData: IMenuItemData[] = [];\n if (this.state.isOnlyMobile) {\n menuItemData = this.menuItemData;\n } else {\n menuItemData = this.props.navProps.menuItemData;\n }\n const { activeMenu } = this.state;\n const menuItemList: JSX.Element[] = [];\n let cmsMenuData: IMenuItemData[] | undefined = [];\n let retailMenuItemData: IMenuItemData[] | undefined = [];\n const retailMenuData = JSON.parse(JSON.stringify(menuItemData)) as IMenuItemData[];\n\n for (const item of retailMenuData) {\n retailMenuItemData = item.subMenu!.filter(subMenuItem => subMenuItem.id && subMenuItem.id >= MenuTypeIndexId.Retail);\n item.subMenu = retailMenuItemData;\n }\n\n for (const item of menuItemData) {\n cmsMenuData = item.subMenu!.filter(subMenuItem => subMenuItem.id && subMenuItem.id < MenuTypeIndexId.Retail);\n }\n\n if (this.state.isOnlyMobile && activeMenu !== undefined && ArrayExtensions.hasElements(menuItemData)) {\n let menuItem: IMenuItemData | null = {};\n for (const menuItemDatum of menuItemData) {\n if (menuItemDatum.id === activeMenu) {\n menuItem = menuItemDatum;\n if (!NavigationMenuRootEnabled.isBackTrack) {\n this.setState({\n parentMenu: undefined\n });\n } else {\n this.setState({\n parentMenu: undefined,\n mobileViewLabelText: menuItemDatum.linkText\n });\n }\n break;\n }\n menuItem = this._getFromSubMenu(menuItemDatum);\n if (menuItem && menuItem.id === activeMenu) {\n break;\n }\n }\n\n if (menuItem) {\n menuItemList.push(\n \n {` `}\n {this._createMenuItemList(menuItem)} {` `}\n \n );\n }\n } else {\n for (const [index, item] of retailMenuData.entries()) {\n menuItemList.push(\n \n {this._createMenuItemList(item)}\n \n );\n }\n\n for (const [index, item] of cmsMenuData.entries()) {\n menuItemList.push(\n \n {this._createMenuItemList(item)}\n \n );\n }\n }\n\n return menuItemList;\n }\n\n private _getFromSubMenu(item?: IMenuItemData): IMenuItemData | null {\n const subMenus = item?.subMenu;\n if (subMenus && ArrayExtensions.hasElements(subMenus)) {\n for (let index = 0; index <= subMenus.length - NavMenuConstants.one; index++) {\n const subMenu: IMenuItemData = subMenus[Number(index)];\n let parentMenuId = item?.id;\n\n if (subMenu.id === this.state.activeMenu) {\n if (parentMenuId === NavMenuConstants.rootMenu && subMenu.id! < MenuTypeIndexId.Retail) {\n parentMenuId = undefined;\n }\n\n if (!NavigationMenuRootEnabled.isBackTrack) {\n this.setState({ parentMenu: parentMenuId });\n } else {\n this.setState({ parentMenu: parentMenuId, mobileViewLabelText: subMenu.linkText });\n }\n return subMenu;\n }\n const found = this._getFromSubMenu(subMenu);\n if (found) {\n return found;\n }\n }\n }\n return null;\n }\n\n private _createMenuItemList(menuItemData: IMenuItemData): JSX.Element | null {\n if (ArrayExtensions.hasElements(menuItemData.subMenu)) {\n if (this.state.isOnlyMobile && this.state.activeMenu !== undefined) {\n return this._renderSubMenu(menuItemData.subMenu, menuItemData.id, false);\n }\n return (\n <>\n {this._renderButtonMenuItem(menuItemData)}\n {this._renderSubMenu(menuItemData.subMenu, menuItemData.id)}\n \n );\n } else if (menuItemData.linkURL && !StringExtensions.isNullOrWhitespace(menuItemData.linkURL)) {\n return this._renderLinkMenuItem(menuItemData, menuItemData.id);\n } else if (!menuItemData.linkURL) {\n return this._renderSpanMenuItem(menuItemData);\n }\n\n return null;\n }\n\n private _renderSubMenu(subMenuArray?: IMenuItemData[], activeMenu?: number, isSubMenu?: boolean): JSX.Element | null {\n let subMenus: IMenuItemData[] | undefined = subMenuArray;\n if (activeMenu === NavMenuConstants.rootMenu) {\n subMenus = subMenuArray!.filter(subMenuItem => subMenuItem.id && subMenuItem.id >= MenuTypeIndexId.Retail);\n }\n\n const { ListItem } = this.props.navProps;\n const isEnableMultiSupportMenu = this.props.navProps.config.enableMultilevelMenu ?? false;\n const multiLevelSupportedMenu = this.props.navProps.config.menuLevelSupport ?? NavMenuConstants.three;\n\n if (activeMenu && this.state.activeMenu !== activeMenu) {\n this.props.navProps.context.telemetry.error('Navigation Active menu content is empty, module wont render.');\n return null;\n }\n\n if (!subMenus || !ArrayExtensions.hasElements(subMenus)) {\n this.props.navProps.context.telemetry.error('Navigation Submenu content is empty, module wont render.');\n return null;\n }\n\n let levelClassName: string = '';\n const menuOptions = subMenus.map((option: IMenuItemData, index: number) => {\n const hasOptions = option.subMenu && ArrayExtensions.hasElements(option.subMenu);\n let menuItem: JSX.Element | null;\n if (hasOptions && this.state.isOnlyMobile) {\n menuItem = this._renderButtonMenuItem(option, activeMenu, index);\n } else if (this.currentLevel === NavMenuConstants.one || !hasOptions) {\n menuItem = this.getMenuItem(option, index);\n } else {\n menuItem = null;\n }\n let subMenu;\n const isHavingSubmenu =\n hasOptions && isEnableMultiSupportMenu && this.currentLevel <= Math.round(multiLevelSupportedMenu) - NavMenuConstants.one;\n\n if (hasOptions && !this.state.isOnlyMobile) {\n if (this.currentLevel >= NavMenuConstants.two) {\n subMenu = this._renderSubMenuDrawer(option);\n } else if (this.currentLevel <= this.supportedLevel - NavMenuConstants.one) {\n this.currentLevel++;\n levelClassName = `level-${this.currentLevel.toString()}`;\n subMenu = this._renderSubMenu(option.subMenu, undefined, true);\n }\n }\n if (isHavingSubmenu && this.state.isOnlyMobile) {\n this.currentLevel++;\n levelClassName = isEnableMultiSupportMenu ? `level-${this.currentLevel.toString()}` : '';\n subMenu = this._renderSubMenu(option.subMenu, option.id, true);\n }\n const imagesource = option.imageSource ? option.imageSource : '';\n return (\n \n {menuItem}\n {subMenu}\n \n );\n });\n return this._renderMenu(levelClassName, menuOptions, isSubMenu);\n }\n\n private getMenuItem(option: IMenuItemData, index: number): JSX.Element | null {\n let menuItem: JSX.Element | null;\n if (this.currentLevel === NavMenuConstants.one) {\n menuItem = option.linkURL ? this._renderLinkMenuItemLevelOne(option, index) : this._renderSpanMenuItem(option);\n } else {\n menuItem = option.linkURL ? this._renderLinkMenuItem(option, index) : this._renderSpanMenuItem(option);\n }\n return menuItem;\n }\n\n private _renderSubMenuDrawer(menuItem: IMenuItemData): JSX.Element | null {\n const levelClassName = `level-${this.currentLevel.toString()}`;\n const toggleButtonText = menuItem.linkText;\n const keyValue = this.state.drawerKeyValue;\n const buttonText = toggleButtonText !== undefined ? toggleButtonText : '';\n const keys = keyValue;\n const multiLevelSupportedMenu = this.props.navProps.config.menuLevelSupport ?? NavMenuConstants.three;\n\n let isDrawerOpen = false;\n if (keys[menuItem.id!]) {\n isDrawerOpen = true;\n }\n const colProps: ICollapseProps = { timeout: 0, isOpen: isDrawerOpen };\n return (\n \n \n {menuItem.subMenu!.map((menuSubItem: IMenuItemData) => {\n if (ArrayExtensions.hasElements(menuSubItem.subMenu)) {\n this.currentLevel++;\n if (this.currentLevel < multiLevelSupportedMenu) {\n return this._renderSubMenuDrawer(menuSubItem);\n }\n }\n return this._renderDrawerLink(menuSubItem);\n })}\n
\n \n );\n }\n\n /**\n * Method to handle escape key event.\n * @param menuId -Number.\n * @param isDrawerOpen -Boolean.\n * @returns Void.\n */\n private readonly _bindDesktopCategoryClick = (menuId: number | undefined, isDrawerOpen: boolean) => (): void => {\n const { drawerKeyValue } = this.state;\n const newPair = { [menuId!]: !isDrawerOpen };\n this.setState({ drawerKeyValue: { ...drawerKeyValue, ...newPair } });\n };\n\n private _renderButtonMenuItem(option: IMenuItemData, activeMenu?: number, index?: number): JSX.Element | null {\n return (\n \n {option.linkText}\n \n );\n }\n\n private _renderLinkMenuItem(option: IMenuItemData, index?: number): JSX.Element | null {\n const { Link } = this.props.navProps;\n const linkText = option.linkText ? option.linkText : '';\n this.payLoad.contentAction.etext = linkText;\n const attributes = getTelemetryAttributes(this.telemetryContent, this.payLoad);\n return (\n \n {option.linkText}\n \n );\n }\n\n private _renderLinkMenuItemLevelOne(option: IMenuItemData, index?: number, isHoverEffect: boolean = true): JSX.Element | null {\n const { Link } = this.props.navProps;\n const linkText = option.linkText ? option.linkText : '';\n const imagesource = option.imageSource ? option.imageSource : '';\n this.payLoad.contentAction.etext = linkText;\n const attributes = getTelemetryAttributes(this.telemetryContent, this.payLoad);\n return (\n \n {option.linkText}\n \n );\n }\n\n private _renderPromotionalLink(linkText?: string, linkUrl?: string): JSX.Element | null {\n const { Link } = this.props.navProps;\n this.payLoad.contentAction.etext = linkText;\n const attributes = getTelemetryAttributes(this.telemetryContent, this.payLoad);\n if (linkText && linkUrl) {\n return (\n \n {linkText}\n \n );\n }\n return null;\n }\n\n private _renderSpanMenuItem(option: IMenuItemData, index?: number): JSX.Element | null {\n const { Span } = this.props.navProps;\n return (\n \n {option.linkText}\n \n );\n }\n\n private _renderMenu(level: string, menuOptions: JSX.Element[], isSubmenu?: boolean): JSX.Element | null {\n const { DivContainer, ImageDivContainer, showCategoryImage, showPromotionalContent } = this.props.navProps;\n const isCategoryImageDisplay =\n !this.state.isOnlyMobile &&\n showCategoryImage &&\n this.state.categoryImage !== null &&\n this.state.categoryImage !== undefined &&\n !isSubmenu;\n const isPromotionalContentDisplay =\n !this.state.isOnlyMobile && showPromotionalContent && ArrayExtensions.hasElements(this.state.categoryImage) && !isSubmenu;\n const divContainerClass =\n this.currentLevel > NavMenuConstants.two || isCategoryImageDisplay ? DivContainer!.className : 'ms-nav__deafult';\n this.currentLevel = NavMenuConstants.one;\n const menuLevelSupportClassName =\n isCategoryImageDisplay &&\n this.props.navProps.config.menuLevelSupport &&\n this.props.navProps.config.menuLevelSupport > NavMenuConstants.two &&\n 'navmenu-multi-level';\n\n const categoryImages = this.state.categoryImage?.filter(image => !StringExtensions.isNullOrWhitespace(image.src));\n const imagesContainerKey = categoryImages?.map(item => item.src).join('-');\n return (\n \n \n {menuOptions}\n \n \n {isCategoryImageDisplay &&\n ArrayExtensions.hasElements(categoryImages) &&\n categoryImages.map(item => (\n \n {getCategoryImage(this.props, item.src ?? '', item.altText!.toString())}\n {isPromotionalContentDisplay &&\n this._renderPromotionalLink(item.altText, item.additionalProperties?.linkUrl)}\n \n ))}\n
\n \n );\n }\n\n /**\n * Handle Category image update.\n * @param categoryImageSource - Image source.\n * @param option - Menu Item data.\n * @returns Returns empty.\n */\n private readonly _updateCategoryImage = (categoryImageSource: string, option: IMenuItemData) => () => {\n const linkText = option.linkText ? option.linkText : '';\n const promotionalImage: Msdyn365.IImageData[] = [{ src: categoryImageSource, altText: linkText }];\n\n // Read category and promotional image in one array\n if (ArrayExtensions.hasElements(option.promotionalContent)) {\n for (const item of option.promotionalContent) {\n const imageSource = item.image.src;\n promotionalImage.push({\n src: imageSource,\n altText: item.text,\n additionalProperties: { linkUrl: item.linkUrl.destinationUrl }\n });\n }\n }\n this.setState({\n categoryImage: ArrayExtensions.hasElements(promotionalImage) ? promotionalImage : [{ src: 'empty' }]\n });\n };\n\n /**\n * Handle dropdown toggle.\n * @param data - Menu Item data.\n * @param parentId - Number.\n * @returns Returns empty.\n */\n private readonly _handleDropdownToggle = (data: IMenuItemData, parentId?: number) => () => {\n if (!this.state.isOnlyMobile) {\n this.setState({\n activeMenu: data.id,\n parentMenu: parentId\n });\n if (this.props.navProps.showCategoryImage) {\n this._updateCategoryImage(data.imageSource!, data)();\n }\n } else {\n NavigationMenuRootEnabled.isBackTrack = false;\n this.setState({\n activeMenu: data.id,\n mobileViewLabelText: data.linkText!,\n parentMenu: parentId\n });\n }\n };\n\n /**\n * Handle back navigation for menu items for mobile view.\n * @returns Returns empty.\n */\n private readonly _handleGoBack = () => () => {\n NavigationMenuRootEnabled.isBackTrack = true;\n this.setState(previousState => ({ activeMenu: previousState.parentMenu }));\n };\n\n /**\n * Function to close the nav menu on click on body.\n * @param event - MouseEvent.\n */\n private readonly _handleClickOutside = (event: MouseEvent) => {\n if (this.menuNode.current && !this.menuNode.current.contains(event.target as Node)) {\n if (!this.state.isOnlyMobile) {\n this.setState({ activeMenu: NavMenuConstants.rootMenu, mobileViewLabelText: '', isNavOpen: false });\n } else {\n this.setState({ activeMenu: undefined, mobileViewLabelText: '', isNavOpen: false });\n }\n }\n };\n\n /**\n * Add shop all link for Mobile submenu.\n */\n private readonly _addShopAllLink = (): void => {\n const { menuItemData } = this.props.navProps;\n this.menuItemData = menuItemData;\n if (ArrayExtensions.hasElements(menuItemData) && ArrayExtensions.hasElements(menuItemData[0].subMenu)) {\n this.menuItemData[0].subMenu?.map(item => {\n const shopAllObject = {};\n Object.assign(shopAllObject, { imageSource: item.imageSource });\n Object.assign(shopAllObject, { linkText: this.props.navProps.resources.allCategoryMenuText });\n Object.assign(shopAllObject, { linkURL: item.linkURL });\n if (ArrayExtensions.hasElements(item.subMenu) && item.menuSource === MenuSource.Retail) {\n item.subMenu.unshift(shopAllObject);\n }\n return item;\n });\n }\n };\n\n /**\n * Checks to assign a ref for focus.\n * @param index -Sub menu list index.\n * @param mobileViewLabelText -Mobile view label text.\n * @param optionLinkText -Sub menu item link text.\n * @returns Boolean.\n */\n private readonly _shouldAddFocusMenuRef = (index: number, mobileViewLabelText?: string, optionLinkText?: string) => {\n const firstIndex: number = 0;\n if (!NavigationMenuRootEnabled.isBackTrack && index === firstIndex) {\n return true;\n }\n if (!optionLinkText || !mobileViewLabelText) {\n return false;\n }\n return mobileViewLabelText === optionLinkText;\n };\n\n /**\n * Function to handle nav menu close.\n */\n private readonly _closeNavMenu = (): void => {\n if (!this.state.isOnlyMobile) {\n this.setState({ activeMenu: NavMenuConstants.rootMenu, mobileViewLabelText: '', isNavOpen: false });\n } else {\n this.setState({ activeMenu: undefined, mobileViewLabelText: '', isNavOpen: false });\n }\n };\n\n /**\n * Function to close the nav menu on esc key.\n * @param event - Event.\n */\n private readonly _escFunction = (event: React.KeyboardEvent) => {\n if (event.keyCode === this.escapeKey && !this.state.isOnlyMobile && this.state.isNavOpen) {\n this.setState({ activeMenu: NavMenuConstants.rootMenu, mobileViewLabelText: '', isNavOpen: false });\n }\n };\n\n /**\n * Custom update viewport.\n */\n private readonly _customUpdateViewport = (): void => {\n this.setState({ isOnlyMobile: this.isOnlyMobile });\n };\n}\n\nexport default NavigationMenuRootEnabled;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { INavigationMenuViewProps } from '@msdyn365-commerce-modules/navigation-menu';\nimport * as React from 'react';\n\nimport { INavigationMenuProps } from '../definition-extensions/navigation-menu.ext.props.autogenerated';\nimport NavigationMenuRootDisabled from './components/navigation-menu-root-disabled';\nimport NavigationMenuRootEnabled from './components/navigation-menu-root-enabled';\n\n/**\n * Render the Navigation menu.\n * @param props - The navigation menu view props.\n * @returns Return HTML having INavigationMenuViewProps props with navigation menu.\n */\nconst navigationMenuView = (props: INavigationMenuViewProps & INavigationMenuProps<{}>): JSX.Element => {\n if (props.config.enabletopMenu) {\n return ;\n }\n\n return ;\n};\n\nexport default navigationMenuView;\n"],"names":["_renderConfigureDropdown","dropdown","ContainerProps","LabelContainerProps","heading","errors","select","React","Node","Object","assign","_renderQuickViewPopup","props","ModalContainer","ModalHeaderContainer","ModalFooterContainer","ModalHeaderContent","ModalBodyContainer","addToWishlist","addToCart","addToOrderTemplate","cartContainerProps","Module","_renderBodyContent","className","errorBlock","button","_renderAddToCart","_renderAddToOrderTemplate","_renderAddToWishlist","title","price","rating","keyInPrice","quantity","configure","inventoryLabel","quantityLimitsMessages","seeDetailsbutton","loading","ProductInfoContainerProps","MediaGalleryContainerProps","CarouselProps","unitOfMeasure","dropdowns","map","_renderConfigure","input","_renderKeyInPrice","_renderQuantity","QuickViewFunctionalComponent","quickView","quickViewButton","isModalOpen","isMobileDevice","SignUpButton","_ref","id","text","ariaLabel","telemetryContent","disabled","link","onClick","payLoad","getPayloadObject","attributes","getTelemetryAttributes","Button","role","href","SignUpError","type","message","errorClassName","classnames","GetMaxLength","maxLength","parsedMaxLength","Number","parseInt","isNaN","SignUpInput","value","pattern","isRequired","onChange","fieldReference","InputType","TextArea","name","undefined","ref","SignUpLabel","forId","htmlFor","InputID","renderInputSection","inputs","needToReset","onInputChange","showErrors","addressForm","updateAddress","element","index","label","maxChars","customClass","baseSignUpItem","wrapper","errorMessage","Address","isAddressInput","updateForm","hasError","resetAddress","splice","BusinessSignUp","constructor","_this","super","this","BusinessSignUpDefaultInputs","FirstName","Text","resources","firstNameLabel","LastName","lastNameLabel","Email","emailAddressLabel","EmailRegex","defaultRegex","source","CompanyName","companyLabel","Department","departmentLabel","JobTitle","jobTitleLabel","Size","companySizeLabel","companyAddressLabel","Comment","commentLabel","formChildReference","moduleClassName","needsToReset","handleHeadingChange","event","config","target","_onInputChange","newForm","state","formItems","forEach","item","setState","isReady","_isFormReady","hasSubmitErrors","_onAddressChange","currentAddress","addressItem","find","address","addressHasErrors","showAddressErrors","currentInput","match","_onSubmit","preventDefault","context","firstName","_getItem","lastName","companyName","companyEmail","companyAddress","jobTitle","department","companySize","comments","newPartner","CompanySize","Comments","createProspectAsync","callerContext","actionContext","catch","_onCancel","cleanForm","isAddress","arguments","length","_addedReference","getTelemetryObject","request","telemetryPageName","friendlyName","telemetry","componentDidMount","_this$formChildRefere","current","focus","shouldComponentUpdate","nextProps","nextState","data","render","viewProps","_objectSpread","businessSignUp","moduleProps","ContainerWrapper","editProps","onEdit","requestContext","businessSignUpForm","_renderForm","renderView","slots","signUpButtonArialabel","signUpButtonText","cancelButtonArialabel","cancelButtonText","partialAddressErrorMessage","addressSlot","successPageURL","confirmationLink","linkUrl","destinationUrl","getUrlSync","form","FormWrapper","items","buttons","key","disclaimer","RichTextComponent","newFormFields","BusinessSignUpItem","error","SearchBar","onSearchTextChange","ev","searchText","onSearch","handleKeyUp","keyCode","KeyCodes","Enter","searchPlaceholderLabel","placeholder","onKeyUp","DataGrid","renderGridHeader","rowClassName","columns","column","reactKey","renderGridRow","_column$onRender","fieldName","_column$onClick","call","onRender","loadDataInternal","async","user","isAuthenticated","result","loadData","isLoading","e","_e$data","LocalizedMessage","genericErrorMessage","paging","filter","loadMore","sortData","sorting","ascending","sort","item1","item2","value1","value2","toLowerCase","compareResult","filterData","c","isSearchable","columnValue","indexOf","trim","getDataToDisplay","itemsCount","pageSize","slice","hasMore","defaultSorting","Alert","color","loadingLabel","ArrayExtensions","hasElements","businessPartnerLoadMore","noDataMessage","BusinessPartnerUsersTable","getColumns","businessUserTableNameHeadingText","onSelect","businessUserTableEmailHeadingText","businessUserTableSpendingLimitHeadingText","getBusinessPartnerUsers","BusinessPartnersDataActions","bypassCache","queryResultSettings","businessPartner","BusinessPartnerId","StatusValue","spendingLimitStr","ObjectExtensions","isNullOrUndefined","SpendingLimit","cultureFormatter","formatCurrency","toString","businessPartnerSearchCustomer","BusinessPartnersTable","businessPartnerName","getBusinessPartners","businessPartnerSearchCompany","BusinessPartners","onSelectBusinessPartner","selectedBusinessPartner","onSelectBusinessPartnerUser","businessPartnerUser","AccountNumber","selectedBusinessPartnerUser","cookies","setAccountSelectionCookie","catalogId","getCustomerDefaultCatalogId","homeUrl","Msdyn365","isBrowser","fullUrl","URL","window","location","searchParams","set","removeAccountSelectionCookie","isLoadingCatalog","channelId","apiSettings","_productCatalogs$","productCatalogs","CatalogsDataActions","RecordId","loadCatalogErrorMessage","businessPartnersHeading","businessPartnersProps","classname","tag","businessPartnersTable","businessPartnerUsersTable","backToBusinessPartnersLink","catalogLoadingIndicator","catalogLoadingErrorMessage","cookieConsentNotGivenErrorMessage","isConsentGiven","cookieConsentRequiredMessage","createSearchResultModal","modalProps","refineMenu","sortByDropDown","isRecoSearchPage","modal","modalHeader","createModalBody","modalFooter","modalBody","renderSort","renderRefiner","refiners","RefineMenuContainer","RefinerSectionContainer","submenu","SortingContainer","renderCategoryHierarchy","CategoryHierarchyContainer","categoryHierarchyList","categoryHierarchySeparator","category","renderTitle","TitleContainer","titlePrefix","titleText","titleCount","_props$context$action","SearchResultContainer","products","pagination","ProductsContainer","ProductSectionContainer","choiceSummary","isMobile","modalToggle","searchResultModal","TitleViewProps","categoryHierarchy","sortByOptions","CategoryNavContainer","RefineAndProductSectionContainer","FeatureSearchContainer","similarLookProduct","query","recommendation","InvoiceDetailsHeaderComponent","msdyn365Commerce","createComponent","component","invoiceDetails","onError","invoiceNumberText","invoiceIdLabel","replace","invoiceOrderItemsText","lines","invoiceOrderItem","invoiceOrderItems","invoiceInfoContainerClassName","orderInfoContainerClassName","orderInfoClassName","orderMainInfoClassName","orderDetailsClassName","actionsClassName","amountSummaryClassName","orderDate","date","invoiceDate","formatDate","year","month","day","formatShortDate","dueDate","formatLongDate","dueDateText","invoicePaymentDueDateText","isOnBehalfOfRequest","isOboRequest","invoicePlacedByLabel","customerName","invoiceAmountDueText","formatAmount","amount","currencyCode","amountDue","PayInvoiceComponent","typeName","invoice","InvoiceDetailsPaymentDetailsComponent","invoicePaymentDetails","lineClassName","totalDiscount","push","invoicePaymentDiscounts","subtotal","invoicePaymentSubtotal","totalCharges","invoicePaymentCharges","totalTax","invoicePaymentTax","totalAmount","invoicePaymentInvoiceTotal","line","InvoiceDetailsProductsComponent","productLineClass","productLineInfoContainerClass","productLineDetailsClass","productLineSmallDetailsClass","product","Quantity","productUrl","ProductName","ProductId","getProductPageUrlSync","_renderProductImage","imageSettings","cropFocalRegion","fallbackImage","getFallbackImageUrl","ItemId","Image","altText","src","primaryImageUrl","fallBackSrc","gridSettings","viewports","xs","q","w","h","lg","xl","lazyload","loadFailureBehavior","_renderProductDimensions","StringExtensions","isNullOrWhitespace","ColorName","invoiceProductColor","SizeName","invoiceProductSize","StyleName","invoiceProductStyle","Price","invoiceQuantity","NetAmount","InvoiceDetailsModel","Id","InvoiceDate","Date","CustomerName","InvoiceDueDate","AmountBalance","status","InvoicePaidStatusValue","SalesInvoiceLine","_products$find","PrimaryImageUrl","TotalDiscount","InvoiceSubtotal","TotalCharges","TotalTaxAmount","TotalAmount","CurrencyCode","canBePaid","InvoicePaidStatus","Paid","InvoiceDetails","_onAddToCartFailed","bind","_setPayInvoiceErrorModalClose","_getProducts","ChannelId","invoiceDetailsModel","payInvoiceErrorModalOpen","header","_renderHeader","_renderProducts","paymentDetails","_renderPaymentDetails","payInvoiceError","_renderInvoiceErrors","_className","productInputs","ProductInput","getSimpleProductsAction","payInvoiceErrorDialogHeader","payInvoiceErrorDialogBodyErrorTitle","payInvoiceErrorDialogBodyErrorDescription","payInvoiceErrorDialogFooterGoToCartButtonText","payInvoiceErrorDialogFooterCancelButtonText","cartUrl","InvoiceErrorComponent","showError","errorDialogHeader","errorDialogBodyErrorTitle","errorDialogBodyErrorDescription","errorDialogFooterGoToCartButtonText","errorDialogFooterCancelButtonText","setPayInvoiceErrorModalClose","InvoiceDetailsView","messageHeader","otherError","errorMessages","isOpen","assertive","Modal","toggle","ModalHeader","ModalBody","ModalFooter","InvoicesFilterState","getInvoicesFilterStateResources","filterState","ShowAll","invoicesFilterShowAll","invoiceStatusPaid","PartiallyPaid","invoiceStatusPartiallyPaid","Unpaid","invoiceStatusUnpaid","Error","onClickHandler","onStateClick","InvoicesFilterComponent","popoverRef","popoverState","setPopoverState","togglePopover","setFilterState","currentState","onFilterStateClick","clickedState","onFilterStateChanged","innerRef","Popover","placement","EnumExtensions","getEnumValues","renderFilterStateItem","stateStringRepresentation","InvoicesTableHeaderComponent","switchCheckedState","onSelectAll","isSelectedAll","headerCells","getMobileHeaderCells","invoiceListSelectAllRadioAriaLabelText","checked","invoicesText","invoiceDateMobileText","getDesktopHeaderCells","invoiceDateText","invoiceUsersText","invoiceAmountText","invoiceDueDateText","invoiceStatusText","invoiceActionsText","onRequestSpecificInvoice","requestInvoiceButtonReference","onRequestInvoice","setShowPreviousActions","onClickViewDetails","linkToInvoiceDetails","MsDyn365","isShowActions","setShowActions","shouldShowActions","extraActionsPopup","invoiceViewDetailsButtonAriaLabel","invoiceViewDetailsButtonText","invoiceActionsButtonTextAriaLabel","invoiceActionsButtonIsOnBehalfOfTextAriaLabel","showActions","useState","getInvoiceDetailsPageUrlSync","actionsContainerClassName","payInvoiceClassName","reference","payInvoiceReferences","RequestInvoiceButton","innerReference","invoiceReferences","requestInvoiceButtonLabel","invoiceRequestButtonLabel","onClicked","InvoicesTableRowComponent","onSelectLine","isSelected","rowCells","getMobileRowCells","invoiceRowArialabel","format","invoiceListSelectRadioAriaLabelText","getInvoiceStatusText","getDesktopRowCells","customer","isCurrentUser","customerAccountNumber","invoiceCurrentUser","isMobileView","viewport","_window","device","Type","innerWidth","sm","md","getViewport","onSelectAllHandler","invoices","InvoicesTableComponent","setIsMobile","updateViewport","addEventListener","headerClassName","all","isAdmin","IsB2bAdmin","invoiceButtonReferences","payInvoiceButtonReferences","MakePaymentComponentActions","_event","setDisabled","payInvoices","errorState","buttonReferences","MakePaymentComponent","hasInvoices","makePaymentButtonAriaLabel","makePaymentButtonText","PayInvoiceComponentActions","payInvoiceButtonAriaLabel","payInvoiceButtonText","InvoiceModel","CustomerAccountNumber","invoiceStatus","None","invoiceStatusNone","invoicesToAdd","errorReason","failureReason","cartState","getCartState","addInvoicesToCart","invoiceIds","_result$errorDetails","_result$errorDetails2","errorDetails","errorCode","ErrorResourceId","onSubmitRequestClick","onClosing","filteredInvoices","onSubmitRequest","checkboxRef","closingFlag","_inputInvoice$current","searchInputChangedHandler","setSearchInput","onCancelHandler","renderInvoiceOptions","setSelectedInvoiceIndex","_invoice","i","_checkboxRef$current$","onInvoiceSelect","onInvoiceSelectHandler","checkboxId","checkboxName","RequestInvoiceModal","email","modalHeaderLabel","sendToEmailLabel","submitRequestLabel","cancelLabel","invoicesFoundString","singleInvoiceFoundString","searchButtonAltText","selectedInvoiceIndex","setFilteredInvoices","searchInput","shouldShowSearchResults","setShouldShowSearchResults","invoiceOptionsData","invoiceOptions","setInvoiceOptions","focusElement","setTimeout","_focusElement$current","searchEntered","searchEnteredHandler","updatedInvoices","isNullOrEmpty","toLocaleUpperCase","includes","searchResultString","invoicesFoundReplaceIndex","horizontalPosition","verticalPosition","autoFocus","fade","onOpened","setFilteredInvoicesToSelectedInvoices","selectedInvoices","requestInvoiceDialogAriaLabel","substring","InvoicesList","buttonChildReference","buttonChildPayButtonReference","_onToggleInvoiceRequestParentModal","selectedButtonElement","payInvoiceRequestReference","_onToggleInvoiceRequestModal","_queryResultSettings","QueryResultSettingsProxy","fromModuleData","QueryResultSettings","makePaymentReference","_updateInvoicesState","_handleFilterStateChange","_loadMoreInvoices","_requestInvoice","_requestSpecificInvoice","invoicesFilterState","isPageLoaded","isInvoiceRequestModalOpen","_customerBalance$resu","_customerBalance$resu2","_heading$text","channel","customerBalance","invoicesListTitle","invoicesListDescTitle","invoicesListDescCount","amountText","OpenInvoiceBalance","toFixed","Currency","totalCount","OpenInvoiceCount","countText","invoicesListTitleHeading","Heading","invoiceRequestModal","_renderInvoiceRequestModal","_renderInvoicesFilter","_renderPagination","content","_renderListContainer","_renderEmptyInvoiceLinesPageContent","invoicesData","_initializeWithInvoices","_addInvoices","newInvoices","concat","containerClass","actionsContainerClass","invoiceEmptyInvoiceLinesTitle","invoiceEmptyInvoiceLinesDescription","invoiceEmptyInvoiceLinesContinueShoppingButtonAriaLabel","invoiceEmptyInvoiceLinesContinueShoppingButtonText","containerHeaderClass","containerContentClass","_renderMakePayment","_renderInvoiceRequestButton","_renderInvoicesList","searchCriteria","getCurrentAsync","getCustomer","GetCustomerInput","CustomerId","InvoicePaidStatusValues","_getInvoicesSearchCriteria","Paging","Skip","getInvoices","GetInvoicesInput","filterClassName","tableClassName","newErrorState","_newErrorState$errorR","errorHost","invoiceErrorInvoiceIdNotExist","invoiceErrorFailedAddInvoiceToCart","shouldShowAdditionalInfoInPopup","makePaymentResources","_getSelectedInvoices","moduleId","moduleTypeName","navigationUrl","_this$state$selectedB","invoiceErrorMessageHeader","_data$invoices","Top","invoicesLoadMore","invoiceRequestModalCancelLabel","invoiceRequestModalSubmitLabel","invoiceRequestModalHeaderLabel","invoiceRequestModalSendToEmailLabel","invoiceRequestModalSearch","invoiceRequestModalInvoiceSearchDisplay","invoiceRequestModalSingleInvoiceSearchDisplay","invoiceRequestModalSearchButton","_this$state$selectedB2","invoiceId","_this$props$data$b2bU","_this$props$data$b2bU2","b2bUserId","b2bUserInformation","B2BUserId","BusinessPartnerUsersDataActions","BusinessPartnerOperationDeliveryType","specificInvoice","InvoiceListView","MenuTypeIndexId","MenuSource","NavigationMenu","isRetail","isCMS","_setNavigationSource","sourceType","_updateViewport","navigationMenuSource","menuItemList","static","locale","nameTranslations","nameTranslation","Language","resizeThrottledEventHandler","addThrottledEvent","componentWillUnmount","removeEventListener","_this$props$config$di","_this$props$config$di2","_mapData","isEmptyOrNullObject","Navigation","MenuList","ListItem","showCategoryImage","displayCategoryImage","showPromotionalContent","displayPromotionalImage","Link","DivContainer","ImageDivContainer","ImageContainer","Span","MobileDescriptionContainer","MobileBackButton","backButtonAriaLabel","MobileDescriptionLabel","menuItemData","mergedData","categories","_constructMenuItemData","cmsNavItems","idx","_constructTopMenuItemData","_this$props$config$en","_this$props$config$ro","enabletopMenu","mergedRootMenuData","topMenu","linkText","rootMenuNavigation","linkURL","imageSource","subMenu","retailItem","cmsItem","addedAllMenu","categoryPromotionalContent","cmsItemText","menuAriaLabel","promotionalData","promoItem","_promoItem$categoryNa","_retailItem$Name","categoryName","Name","_NavigationMenu$getFr","_NavigationMenu$getFr2","Images","Uri","RSItemIdInit","getFriendlyName","NameTranslations","Url","_getNestedChildren","promotionalContent","menuSource","Retail","CMSItemIdInit","imageDestinationURL","imageLink","image","_getCMSNestedChildren","Cms","shouldOpenNewTab","openInNewTab","imageSourceUrl","nestedChildren","Children","allCategoryMenuText","getCategoryUrl","subMenus","_getViewport","__decorate","observable","computed","NavigationMenuView","currentLevel","_updateCategoryImage","categoryImageSrc","option","promotionalImage","imageSrc","promotionalItemImageSettings","additionalProperties","categoryImage","categoryImageAltText","_handleDropdownToggle","parentId","isBackTrack","activeMenu","mobileViewLabelText","parentMenu","_handleGoBack","_handleClickOutside","menuNode","contains","_handleFocusOutside","relatedTarget","_closeSubmenu","_shouldAddFocusMenuRef","optionLinkText","_getCategoryImage","defaultImageSettings","_categoryImage$imageS","generateImageUrl","categoryImageSettings","menuItemRef","document","body","componentDidUpdate","_this$menuItemRef$cur","children","tabIndex","_renderDisplay","menuItem","menuItemDatum","_getFromSubMenu","_createMenuItemList","found","_renderSubMenu","_renderButtonMenuItem","_renderLinkMenuItem","_renderSpanMenuItem","IsSubMenu","enableMultiSupportMenu","enableMultilevelMenu","multiLevelSupportedMenu","menuLevelSupport","levelClassName","menuOptions","hasOptions","haveSubmenu","Math","round","_renderMenu","onFocus","hoverEffect","isParent","imagesource","contentAction","etext","onMouseOver","onTelemetryClick","_renderPromotionalLink","level","currentItem","categoryImageDisplay","promotionalContentDisplay","DivContainerClass","_item$additionalPrope","TabItemType","TabItem","moduleContentClassName","moduleHeaderClassName","_renderTabHeader","itemIndex","contentID","getContentID","tabId","activeContentIDResult","activeTabState","shown","activeContentIndex","TabContentContainer","TabHeaderContainer","TabItemContent","tabHeader","tabSlots","tabItemTitle","observer","_renderTabItemContent","tabItemType","TabContent","tabItemContent","TabHeader","Tab","tabIndexQuery","_refHandler","activeLink","_onClick","update","createTabStateInput","currentTabIndex","newUrl","_setGetParameter","String","history","pushState","path","_onKeyDown","slotLength","tabItems","defaultTabIndex","initialIndex","queryString","activeTab","queryTabIndex","arr","split","_getTabHeader","_getTabContent","headingComponent","tabViewProps","TabContainer","headerSection","tabsSection","tabItemContainer","tabContents","tabHeaders","params","isEditor","dataActionTabId","selected","onKeyDown","paramName","paramValue","url","requestUrl","URLSearchParams","search","decodeURIComponent","CartIcon","cartLabel","cartQtyLabel","cart","cartItem","totalItemsInCart","qtyLabel","style","visibility","CartIconComponent","createComponentOverride","PromoCode","_onInputChangeHandler","promoCodeInputValue","canApply","_applyPromotion","appliedPromo","addPromoCode","promoCode","then","substatus","duplicatePromoCodeErrorText","invalidPromoCodeErrorText","failedToAddPromoCodeErrorText","_onSubmitHandler","applyPromotionHandler","promoPlaceholderText","promoCodeApplyButtonText","onSubmit","_removePromotion","_event$currentTarget$","code","currentTarget","getAttribute","removePromoCodes","promoCodes","failedToRemovePromoCodeErrorText","_renderAppliedPromoCode","Coupons","removePromotionHandler","coupon","removePromoAriaLabelFormat","removePromoText","Code","TelemetryConstant","ApplyPromoCode","promoCodeHeadingText","renderAdditionalContent","additionalContent","_additionalContent$ad","additionalContentNode","additionalContentItems","additionalContentItemContainer","additionalContentItemLinks","links","contentBlockContainer","imageContainer","detailsContainer","contentBlockAnchorTag","imageAriaLabel","imageClass","NavMenuConstants","getCategoryImage","alttext","categoryImageUrl","navProps","_props$navProps$confi","imageData","NavigationMenuRootDisabled","supportedLevel","four","zero","escapeKey","_toggleNavBar","previousState","isNavOpen","_bindDesktopCategoryClick","menuId","isDrawerOpen","drawerKeyValue","newPair","categoryImageSource","isOnlyMobile","_closeNavMenu","_this$menuNode$curren","_escFunction","_this$menuNode$curren2","_customUpdateViewport","variant","VariantType","Browser","customResizeThrottledEventHandler","_renderMobileMenu","hamburgerAriaLabel","_renderCollapseMenu","Collapse","_renderDesktopMenu","_renderDrawerLink","entries","parentMenuId","menu","one","subMenuArray","isSubMenu","_this$props$navProps$","_this$props$navProps$2","rootMenu","subMenuItem","isEnableMultiSupportMenu","three","getMenuItem","isHavingSubmenu","two","_renderSubMenuDrawer","_renderLinkMenuItemLevelOne","_this$props$navProps$3","toggleButtonText","buttonText","keys","colProps","timeout","Drawer","collapseProps","openGlyph","closeGlyph","glyphPlacement","onToggle","menuSubItem","isHoverEffect","isSubmenu","_this$state$categoryI","isCategoryImageDisplay","isPromotionalContentDisplay","divContainerClass","menuLevelSupportClassName","categoryImages","imagesContainerKey","join","_item$src","NavigationMenuRootEnabled","_addShopAllLink","_this$menuItemData$0$","shopAllObject","unshift","cmsMenuData","retailMenuItemData","retailMenuData","JSON","parse","stringify"],"sourceRoot":""}