= (props: ICartViewProps) => (\n \n {props.title}\n {props.promotionOptions && _renderPromotions(props.promotionOptions)}\n {props.multiplePickUpEnabled ? _renderCartLinesGroup(props, props.resources) : \n {_renderCartlines(props.cartlines, props.resources, props.storeSelector, props.backToShoppingButton, props.waitingComponent, props.cartLoadingStatus,\n props.cartDataResult, props.telemetryContent, props.multiplePickUpEnabled, props.context.actionContext.requestContext.channel?.EmailDeliveryModeCode)}\n }\n {props.orderSummaryHeading &&\n \n {props.orderSummaryHeading}\n {props.cart?.hasInvoiceLine ? _renderInvoiceSummarylines(props.invoiceSummaryLineitems, props.OrderSummaryItems, props) : _renderOrderSummarylines(props.orderSummaryLineitems, props.OrderSummaryItems, props)}\n {_renderErrorBlock(props.OrderSummaryErrors)}\n {props.checkoutAsSignInUserButton}\n {props.checkoutAsGuestButton}\n {props.backToShoppingButton}\n {props.createTemplateFromCartButton}\n }\n {props.storeSelector}\n
\n);\n\nconst _renderPromotions = (promotions: ICartLineItemViewProps): JSX.Element | undefined => {\n return (\n <>\n \n {promotions.promotionMessage}\n {promotions.promotionSeeAllLink}\n {promotions.promotionDialog}\n \n\n \n );\n\n};\n\nconst _renderCartlines = (cartLines: ICartlinesViewProps[] | undefined, resources: ICartResources, storeSelector: React.ReactNode | undefined,\n backToShoppingButton: React.ReactNode, waitingComponent: React.ReactNode, cartLoadingStatus: string, cartDataResult: boolean,\n telemetryContent?: ITelemetryContent, mulitplePickUp?: boolean, emailDeliveryModeCode?: string): JSX.Element[] | JSX.Element => {\n\n const { emptyCartText } = resources;\n\n if (cartLoadingStatus) {\n return (<>\n {cartLoadingStatus}\n );\n }\n if (cartLines) {\n return cartLines.map((cartLine, index) => {\n return (\n \n {cartLine.cartline}\n {mulitplePickUp ? null : _renderBOPISBlock(cartLine, resources, storeSelector, telemetryContent, emailDeliveryModeCode)}\n {\n mulitplePickUp ? (\n \n {_renderGroupBOPISBlock(cartLine, resources, storeSelector, telemetryContent, emailDeliveryModeCode)}\n {cartLine.addToOrderTemplate}\n {cartLine.addToWishlist}\n {cartLine.remove}\n \n ) : (cartLine.addToOrderTemplate ? (\n \n {cartLine.addToOrderTemplate}\n {cartLine.addToWishlist}\n {cartLine.remove}\n \n ) : (\n <>\n {cartLine.addToWishlist}\n {cartLine.remove}\n \n ))\n }\n
\n );\n });\n }\n return (cartDataResult ? (\n \n
\n {emptyCartText}\n
\n {backToShoppingButton}\n
\n {isBopisSelected ? \n {pickUpAtStoreWithLocationText}\n : \n {shipToAddressDisplayText}\n }\n
\n {\n isBopisSelected &&\n \n \n {cartLine.pickUpInStore.orgUnitName}\n \n \n {changeStoreDisplayText}\n \n
\n }\n \n \n );\n};\n\nconst _renderErrorBlock = (errorData: IOrderSummaryErrors | undefined): JSX.Element | null => {\n if (!errorData || errorData.errors.length === 0) {\n return null;\n }\n return (\n \n {errorData.header}\n {errorData.errors}\n \n );\n};\n\nconst _renderOrderSummarylines = (orderSummaryLines: IOrderSummaryLines | undefined, OrderSummaryItems: INodeProps, props: ICartViewProps): JSX.Element | null => {\n if (!orderSummaryLines) {\n return null;\n }\n return (\n \n {props.promoCode}\n {orderSummaryLines.subtotal}\n {orderSummaryLines.shipping}\n {orderSummaryLines.otherCharge}\n {orderSummaryLines.tax}\n {orderSummaryLines.totalDiscounts ? orderSummaryLines.totalDiscounts : null}\n {orderSummaryLines.orderTotal}\n \n );\n};\n\nconst _renderInvoiceSummarylines = (invoiceSummaryLines: IInvoiceSummaryLines | undefined, OrderSummaryItems: INodeProps, props: ICartViewProps): JSX.Element | null => {\n if (!invoiceSummaryLines) {\n props.context.telemetry.error('InvoiceSummary content is empty, module wont render');\n return null;\n }\n return (\n \n {invoiceSummaryLines.invoices}\n {invoiceSummaryLines.giftCard}\n {invoiceSummaryLines.loyalty}\n {invoiceSummaryLines.orderTotal}\n \n );\n};\n\nconst _renderCartLinesGroup = (props: ICartViewProps, resources: ICartResources): JSX.Element | undefined => {\n if (props.cartLinesGroup && props.cartLinesGroup.length > 0) {\n return (\n \n { props.cartLinesGroup.map(cartlines => {\n return (
\n {_renderCartLinesGroupHeader(cartlines[0], props.storeSelector, resources, _countItems(cartlines), props.context.actionContext.requestContext.channel?.EmailDeliveryModeCode)}\n {_renderCartlines(cartlines, props.resources, props.storeSelector, props.backToShoppingButton, props.waitingComponent, props.cartLoadingStatus, props.cartDataResult,\n props.telemetryContent, props.multiplePickUpEnabled, props.context.actionContext.requestContext.channel?.EmailDeliveryModeCode)}\n
);\n })}\n
\n
\n
\n {props.resources.emptyCartText}\n
\n {props.backToShoppingButton}\n
\n
\n
\n
\n {groupTitle}\n
\n {_renderCartLinesGroupTitle(cartLine, resources, count)}\n
\n {cartLine.pickUpInStore?.deliveryOption}\n {', '}\n {cartLine.pickUpInStore?.orgUnitName}\n
: null}\n \n (\n {count}\n {' '}\n {suffix}\n )\n
\n \n \n );\n};\n\nexport default CartView;\n","/*--------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * See License.txt in the project root for license information.\n *--------------------------------------------------------------*/\n\nimport { CartLinePriceEditor, ICartLinePriceEditorResources, PriceComponent } from '@msdyn365-commerce/components';\nimport { IComponentProps, IGridSettings, IImageSettings, Image } from '@msdyn365-commerce/core';\nimport { ICartState } from '@msdyn365-commerce/global-state';\nimport { ChannelDeliveryOptionConfiguration, SimpleProduct } from '@msdyn365-commerce/retail-proxy';\nimport { CartLine, SalesLine } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\nimport { ArrayExtensions, getFallbackImageUrl } from '@msdyn365-commerce-modules/retail-actions';\nimport { getPayloadObject, getTelemetryAttributes, IncrementalQuantity, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\nimport classNames from 'classnames';\nimport * as React from 'react';\n\n/**\n * ICartlineResourceString: Interface for specifying the\n * resource strings that the component needs.\n */\nexport interface ICartlineResourceString {\n\n /**\n * Display string for discount label\n */\n discountStringText: string;\n\n /**\n * String for size key\n */\n sizeString: string;\n\n /**\n * String for color key\n */\n colorString: string;\n\n /**\n * String associated with the configuration product dimension\n */\n configString: string;\n\n /**\n * String for style key\n */\n styleString: string;\n\n /**\n * String for amount key\n */\n amountString?: string;\n\n /**\n * Display string for quantity label\n */\n quantityDisplayString: string;\n\n /**\n * Display string for quantity label\n */\n inputQuantityAriaLabel: string;\n\n /**\n * Aria label for the decrement button in quantity component\n */\n decrementButtonAriaLabel: string;\n\n /**\n * Aria label for the increment button in quantity component\n */\n incrementButtonAriaLabel: string;\n\n /**\n * Original text screenreader\n */\n originalPriceText: string;\n\n /**\n * Current text screenreader\n */\n currentPriceText: string;\n\n /**\n * Shipping Charges Text\n */\n shippingChargesText: string;\n\n priceEditorResources?: ICartLinePriceEditorResources;\n}\n\ninterface ICartLineData {\n cartLine: CartLine | SalesLine;\n cartState?: ICartState;\n product?: SimpleProduct;\n}\n\n/**\n * ICartLineProps: The props required to render cartLineitem.\n */\nexport interface ICartLineProps extends IComponentProps {\n\n /**\n * The flag to change the quantity component from intractable to static.\n */\n disableQuantityInteractivity?: boolean;\n\n /**\n * The primary image url.\n */\n primaryImageUrl?: string;\n\n /**\n * The product url.\n */\n productUrl?: string;\n\n /**\n * GridSettings for the product image in cartLine.\n */\n gridSettings: IGridSettings;\n\n /**\n * ImageSettings for the product image in cartLine.\n */\n imageSettings: IImageSettings;\n\n /**\n * Boolean flag to indicate if the item is out of stock.\n */\n isOutOfStock?: boolean;\n\n /**\n * Flag to make quantity section editable.\n */\n isQuantityEditable?: boolean;\n\n /**\n * Max quantity for line item.\n */\n maxQuantity?: number;\n\n /**\n * Current quantity for line item.\n */\n currentQuantity?: number;\n\n /**\n * Resource string for the component.\n */\n resources: ICartlineResourceString;\n\n /**\n * SalesLine flag.\n */\n isSalesLine?: boolean;\n\n /**\n * Error message to show in place of quantity.\n */\n errorMessage?: string;\n\n /**\n * Inventory information label.\n */\n inventoryInformationLabel?: string;\n\n /**\n * Inventory information class name.\n */\n inventoryLabelClassName?: string;\n\n /**\n * Flag to show/hide shipping charges for line items.\n */\n showShippingChargesForLineItems?: boolean;\n\n /**\n * Boolean flag to indicate if cart state status is ready.\n */\n isCartStateReady?: boolean;\n\n /**\n * Chanel Delivery Option configuration is from api.\n */\n channelDeliveryOptionConfig?: ChannelDeliveryOptionConfiguration;\n\n /**\n * The telemetry content.\n */\n telemetryContent?: ITelemetryContent;\n\n /**\n * The cart line index.\n */\n lineIndex?: number;\n\n /**\n * Quantity onChange callback.\n */\n quantityOnChange?(cartLine: CartLine, newQuantity: number, lineIndex?: number): boolean;\n}\n\ninterface IDimensionStrings {\n\n /**\n * String for size key.\n */\n sizeString: string;\n\n /**\n * String for color key.\n */\n colorString: string;\n\n /**\n * String associated with the configuration product dimension.\n */\n configString: string;\n\n /**\n * String for style key.\n */\n styleString: string;\n\n /**\n * String for amount key.\n */\n amountString?: string;\n}\n\nconst CartLineItemFunctions = {\n renderProductDimensions: (Product: SimpleProduct, DimensionStrings: IDimensionStrings) => {\n if (!Product || !Product.Dimensions) {\n return [];\n }\n\n return Product.Dimensions.map(productDimension => {\n\n if (productDimension.DimensionTypeValue === 1) {\n return (\n \n \n {DimensionStrings.colorString}\n :\n \n {productDimension.DimensionValue && productDimension.DimensionValue.Value}\n \n \n
\n );\n }\n\n if (productDimension.DimensionTypeValue === 2) {\n return (\n \n \n {DimensionStrings.configString}\n :\n \n {productDimension.DimensionValue && productDimension.DimensionValue.Value}\n \n \n
\n );\n }\n\n if (productDimension.DimensionTypeValue === 3) {\n return (\n \n \n {DimensionStrings.sizeString}\n :\n \n {productDimension.DimensionValue && productDimension.DimensionValue.Value}\n \n \n
\n );\n }\n\n if (productDimension.DimensionTypeValue === 4) {\n return (\n \n \n {Product.IsGiftCard ? DimensionStrings.amountString : DimensionStrings.styleString}\n :\n \n {productDimension.DimensionValue && productDimension.DimensionValue.Value}\n \n \n
\n );\n }\n return null;\n });\n },\n\n renderDiscountLines: (props: ICartLineProps) => {\n\n if (!props.data.cartLine.DiscountLines || props.data.cartLine.DiscountLines.length === 0) {\n return null;\n }\n\n return props.data.cartLine.DiscountLines.map((discountLine, index) => {\n return (\n \n
\n {discountLine.OfferName ? discountLine.OfferName : ''}\n :\n {` ${props.resources.discountStringText || 'Discount'} `}\n \n
\n \n \n
\n {` (${discountLine.EffectivePercentage !== undefined ? discountLine.EffectivePercentage : ''}%)`}\n \n
\n \n {product.DefaultUnitOfMeasure}\n \n
\n );\n },\n renderShippingLabel: (props: ICartLineProps) => {\n const pickupDeliveryModeCode = props.context.request.channel?.PickupDeliveryModeCode;\n const channelDeliveryOptionConfig = props.channelDeliveryOptionConfig;\n const cartline = props.data.cartLine;\n let hasShippingMethod = false;\n if (channelDeliveryOptionConfig !== undefined) {\n hasShippingMethod = !!(cartline.DeliveryMode &&\n channelDeliveryOptionConfig.PickupDeliveryModeCodes?.some(deliveryMode => deliveryMode !== cartline.DeliveryMode));\n } else {\n hasShippingMethod = !!(cartline.DeliveryMode && cartline.DeliveryMode !== pickupDeliveryModeCode);\n }\n if (!hasShippingMethod) {\n return undefined;\n }\n\n const shippingChargeLines = (cartline.ChargeLines || []).filter(chargeLine => chargeLine.IsShipping);\n\n if (shippingChargeLines.length === 0) {\n return undefined;\n }\n\n const freightFee = shippingChargeLines.reduce((chargeTotal, chargeLine) => {\n return chargeTotal + (chargeLine.CalculatedAmount || 0);\n }, 0);\n\n const priceComponent = (\n \n );\n return (\n <>\n \n \n {priceComponent}\n \n \n );\n },\n renderOtherCharges: (props: ICartLineProps) => {\n const cartline = props.data.cartLine;\n const otherCharges = cartline.ChargeLines?.filter((chargeline) => !chargeline.IsShipping);\n\n return otherCharges && otherCharges.map((otherCharge, key) => {\n return otherCharge && otherCharge.CalculatedAmount ? (\n \n
\n
\n \n \n
\n \n \n {props.errorMessage}\n \n
\n );\n }\n\n return null;\n };\n\n const _generateQuantityandPrice = (): JSX.Element[] | null => {\n const nodes = [];\n if (props.isOutOfStock) {\n return null;\n }\n\n // No quantity selector for invoice line\n if (!props.data.cartLine.IsInvoiceLine) {\n if (props.data.product && props.isQuantityEditable) {\n nodes.push(\n \n
\n {resources.quantityDisplayString}\n
\n
\n
\n \n \n {props.data.cartLine.Quantity}\n \n
\n );\n }\n }\n\n nodes.push(\n \n
\n {\n props.data.cartLine.DiscountAmount && props.data.cartLine.DiscountAmount > 0 &&\n <>\n
\n {` ${props.resources.discountStringText || 'Discount'} `}\n \n
\n ||\n null\n }\n
\n
\n \n
\n
\n
\n
\n {productName}\n \n {ArrayExtensions.hasElements(productDimensions) ?
\n {productDimensions}\n
: ''}\n {renderUnitOfMeasure}\n
\n {renderDisountLines}\n {renderInventoryLabel}\n {props.showShippingChargesForLineItems &&
\n {renderShippingLabel}\n
}\n {renderOtherCharges}\n
\n {\n _generateQuantityandPrice()\n }\n {\n props.data.cartLine.IsInvoiceLine && props.data.cartState && props.resources.priceEditorResources &&
\n }\n
\n
\n
\n {this.props.promoCodeHeadingText}\n
\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 {this.props.appliedPromoCodeHeadingText}\n
\n
\n
\n
\n {coupon.Code}\n {' '}\n (\n
\n )\n
\n
\n {props.removePromoText}\n \n \n { accountLinks ? accountLinks.map((link: React.ReactNode) => link) : false }\n {signOutLink}\n
\n \n );\n } else if (signInLink) {\n return (\n \n {signInLink}\n \n );\n }\n }\n return null;\n}\n\nfunction _renderAccountBlock(props: IHeaderViewProps, renderForMobile: boolean): JSX.Element | null {\n const {\n AccountInfoDropdownParentContainer,\n AccountInfoDropdownPopoverConentContainer,\n accountInfoDropdownButton,\n signOutLink,\n signInLink,\n accountLinks\n } = props;\n\n if (AccountInfoDropdownParentContainer) {\n const accountClassName = classnames(AccountInfoDropdownParentContainer.className, renderForMobile ? 'account-mobile' : 'account-desktop');\n if (AccountInfoDropdownPopoverConentContainer) {\n return (\n \n {accountInfoDropdownButton}\n \n { accountLinks ? accountLinks.map((link: React.ReactNode) => link) : false }\n {signOutLink}\n \n \n );\n } else if (signInLink) {\n return (\n \n {signInLink}\n \n );\n }\n }\n\n return null;\n}\n\nfunction _renderReactFragment(items: React.ReactNode[]): JSX.Element | null {\n return (\n <>\n {items && items.length > 0 ? items.map((slot: React.ReactNode, index: number) => {\n return (\n {slot}\n );\n }) : null}\n \n );\n}\n\nexport default headerView;\n","/*--------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * See License.txt in the project root for license information.\n *--------------------------------------------------------------*/\n\nimport MsDyn365, { IDictionary, IImageData, IImageSettings, Image } from '@msdyn365-commerce/core';\nimport { IMenuItemData, INavigationMenuViewProps } from '@msdyn365-commerce-modules/navigation-menu';\nimport { ArrayExtensions, generateImageUrl } from '@msdyn365-commerce-modules/retail-actions';\nimport {\n Drawer,\n getPayloadObject,\n getTelemetryAttributes,\n getTelemetryObject,\n ICollapseProps,\n IDrawerState,\n IPayLoad,\n ITelemetryContent,\n Module,\n Node,\n onTelemetryClick } from '@msdyn365-commerce-modules/utilities';\nimport classnames from 'classnames';\nimport * as React from 'react';\n\ninterface INavigationState {\n parentMenu?: number;\n activeMenu?: number;\n categoryImage?: IImageData[] | null;\n categoryImageAltText: string;\n drawerKeyValue: IDictionary;\n}\n\n/**\n *\n * NavigationMenuView component.\n * @extends {React.PureComponent}\n */\nexport class NavigationMenuView extends React.PureComponent {\n private currentLevel: number = 0;\n\n private readonly _positionInSetOffset: number = 1;\n\n private readonly escapeKey: number = 27;\n\n private readonly menuNode: React.RefObject;\n\n private readonly telemetryContent: ITelemetryContent;\n\n private readonly payLoad: IPayLoad;\n\n constructor(props: INavigationMenuViewProps) {\n super(props);\n this.menuNode = React.createRef();\n this.state = { activeMenu: undefined, parentMenu: undefined, categoryImageAltText: '', drawerKeyValue: {} };\n this._closeSubmenu = this._closeSubmenu.bind(this);\n this._escFunction = this._escFunction.bind(this);\n this.telemetryContent = getTelemetryObject(this.props.context.request.telemetryPageName!,\n this.props.friendlyName,\n this.props.telemetry);\n this.payLoad = getPayloadObject('click', this.telemetryContent, '', '');\n }\n\n public componentDidMount(): void {\n if (MsDyn365.isBrowser) {\n document.body.addEventListener('keydown', (this._escFunction as unknown) as EventListener, false);\n document.body.addEventListener('mousedown', this._handleClickOutside);\n document.body.addEventListener('focusout', this._handleFocusOutside);\n }\n\n }\n\n public componentWillUnmount(): void {\n if (MsDyn365.isBrowser) {\n document.removeEventListener('keydown', (this._escFunction as unknown) as EventListener, false);\n document.body.removeEventListener('mousedown', this._handleClickOutside, false);\n document.body.removeEventListener('focusout', this._handleFocusOutside, false);\n }\n }\n\n public render(): JSX.Element | null {\n const { isMobileView } = this.props;\n\n this.currentLevel = 1;\n return (\n <>\n {isMobileView ? this._renderMobileMenu() : this._renderDesktopMenu()}\n \n );\n }\n\n /**\n * Method to render mobile menu.\n * @returns Jsx element.\n */\n private _renderMobileMenu(): JSX.Element {\n const { isMobileView, menuItemData, Navigation } = this.props;\n return (\n \n {menuItemData.map((menuItem: IMenuItemData, posinset: number) => {\n return this._renderDrawerMenu(menuItem, menuItemData.length, posinset + this._positionInSetOffset);\n })}\n \n );\n }\n\n /**\n * Method to render desktop menu.\n * @returns Jsx element.\n */\n private _renderDesktopMenu(): JSX.Element {\n const { MenuList, Navigation } = this.props;\n return (\n \n \n {this._renderDisplay()}\n \n \n );\n }\n\n /**\n * Method to render drawer menu.\n * @param menuItem -Menuitem data.\n * @param setSize -Setsize data.\n * @param posinset -Current position.\n * @returns Jsx element.\n */\n private _renderDrawerMenu(menuItem: IMenuItemData, setSize: number, posinset: number): JSX.Element | null {\n if (menuItem && menuItem.subMenu && ArrayExtensions.hasElements(menuItem.subMenu)) {\n return (this._renderDrawer(menuItem, setSize, posinset));\n }\n return (this._renderLinkMenuItem(menuItem, undefined, true, false, setSize, posinset));\n\n }\n\n /**\n * Method to render drawer component.\n * @param menuItem -Menuitem data.\n * @param setSize -Setsize data.\n * @param posinset -Current position.\n * @returns Jsx element.\n */\n private _renderDrawer(menuItem: IMenuItemData, setSize?: number, posinset?: number): JSX.Element | null {\n const toggleButtonText = menuItem.linkText;\n const keyValue = this.state.drawerKeyValue;\n const buttonText = toggleButtonText !== undefined ? toggleButtonText : '';\n const keys = keyValue !== undefined ? keyValue : {};\n\n let isDrawerOpen = false;\n if (keys[buttonText]) {\n isDrawerOpen = true;\n }\n const colProps: ICollapseProps = { isOpen: isDrawerOpen };\n return (\n \n \n {menuItem.subMenu!.map((menuSubItem: IMenuItemData, currentPos: number) => {\n if (ArrayExtensions.hasElements(menuSubItem.subMenu)) {\n return (this._renderDrawer(menuSubItem, menuItem.subMenu?.length, currentPos + this._positionInSetOffset));\n }\n return this._renderDrawerLink(menuSubItem, menuItem.subMenu?.length, currentPos + this._positionInSetOffset);\n })}\n
\n \n );\n }\n\n /**\n * Method to render link.\n * @param linkText -Text on Menu link.\n * @param setSize -Setsize data.\n * @param posinset -Current position.\n * @returns Jsx element.\n */\n private _renderLinkText(linkText: string | undefined, setSize: number | undefined, posinset: number | undefined): JSX.Element {\n return (\n \n {linkText}\n \n );\n }\n\n /**\n * Method to render drawer link.\n * @param item -Single Menuitem.\n * @param setSize -Setsize data.\n * @param posinset -Current position.\n * @returns Jsx element.\n */\n private _renderDrawerLink(item: IMenuItemData, setSize: number | undefined, posinset: number): JSX.Element | null {\n if (item && item.linkText && item.linkURL && item.linkURL.length > 0) {\n return (\n this._renderLinkMenuItem(item, undefined, true, false, setSize, posinset)\n );\n } else if (item && item.linkText && !item.linkURL) {\n return (\n this._renderSpanMenuItem(item)\n );\n }\n return null;\n }\n\n /**\n * Method to generate menu.\n * @returns Jsx element.\n */\n private _renderDisplay(): JSX.Element[] {\n const { ListItem, menuItemData, isMobileView } = this.props;\n const { activeMenu } = this.state;\n const menuItemList: JSX.Element[] = [];\n\n if (isMobileView && activeMenu !== undefined && menuItemData.length > 0) {\n let menuItem: IMenuItemData = {};\n for (const menuItemDatum of menuItemData) {\n if (menuItemDatum && menuItemDatum.id === activeMenu) {\n menuItem = menuItemDatum;\n this.setState({ parentMenu: undefined });\n break;\n }\n menuItem = this._getFromSubMenu(menuItemDatum) as IMenuItemData;\n if (menuItem && menuItem.id === activeMenu) {\n break;\n }\n }\n\n menuItem && menuItemList.push(\n \n {' '}\n {this._createMenuItemList(menuItem)}\n {' '}\n \n );\n } else {\n menuItemData.forEach((item: IMenuItemData, index: number) => {\n menuItemList.push(\n \n {this._createMenuItemList(item)}\n \n );\n });\n }\n\n return menuItemList;\n }\n\n /**\n * Method to get data for submenu.\n * @param item -Single Menuitem.\n * @returns IMenuItemData.\n */\n private _getFromSubMenu(item?: IMenuItemData): IMenuItemData | null {\n const subMenus = item && item.subMenu;\n if (subMenus && subMenus.length > 0) {\n for (let i = 0; i <= subMenus.length - 1; i++) {\n if (subMenus[i].id === this.state.activeMenu) {\n this.setState({ parentMenu: item?.id });\n return subMenus[i];\n }\n const found = this._getFromSubMenu(subMenus[i]);\n if (found) {\n return found;\n }\n }\n }\n return null;\n }\n\n /**\n * Method to create item list.\n * @param menuItemData -Single Menuitem.\n * @returns Jsx element.\n */\n private _createMenuItemList(menuItemData: IMenuItemData): JSX.Element | null {\n if (menuItemData && menuItemData.subMenu && menuItemData.subMenu.length > 0) {\n if (this.props.isMobileView && this.state.activeMenu !== undefined) {\n return (this._renderSubMenu(menuItemData.subMenu, menuItemData.id));\n }\n return (\n <>\n {this._renderButtonMenuItem(menuItemData)}\n {this._renderSubMenu(menuItemData.subMenu, menuItemData.id)}\n \n );\n\n } else if (menuItemData && menuItemData.linkText && menuItemData.linkURL && menuItemData.linkURL.length > 0) {\n return (this._renderLinkMenuItem(menuItemData, menuItemData.id, false, true));\n } else if (menuItemData && menuItemData.linkText && !menuItemData.linkURL) {\n return (this._renderSpanMenuItem(menuItemData, menuItemData.id, true));\n }\n\n return null;\n }\n\n private _renderSubMenu(subMenus?: IMenuItemData[], activeMenu?: number, IsSubMenu?: boolean): JSX.Element | null {\n const { isMobileView, ListItem } = this.props;\n const enableMultiSupportMenu = this.props.config.enableMultilevelMenu || false;\n const subMenuLevel = 3;\n const multiLevelSupportedMenu = this.props.config.menuLevelSupport || subMenuLevel;\n\n // Const isParentMenu:boolean= false;\n if (activeMenu && this.state.activeMenu !== activeMenu) {\n this.props.context.telemetry.error('Navigation Active menu content is empty, module wont render.');\n return null;\n }\n\n if (!subMenus || subMenus.length === 0) {\n this.props.context.telemetry.error('Navigation Submenu content is empty, module wont render.');\n return null;\n }\n\n let levelClassName: string = '';\n const menuOptions = subMenus && subMenus.map((option: IMenuItemData, idx: number) => {\n const hasOptions = (option.subMenu && option.subMenu.length > 0);\n let menuItem: JSX.Element | null;\n if (hasOptions && isMobileView) {\n menuItem = this._renderButtonMenuItem(option, activeMenu, idx);\n } else {\n menuItem = (option.linkURL ? this._renderLinkMenuItem(option, idx) : this._renderSpanMenuItem(option)\n );\n }\n let subMenu;\n const haveSubmenu = hasOptions && enableMultiSupportMenu && (this.currentLevel <= Math.round(multiLevelSupportedMenu) - 1);\n if (haveSubmenu) {\n this.currentLevel++;\n levelClassName = enableMultiSupportMenu ? `level-${this.currentLevel.toString()}` : '';\n subMenu = this._renderSubMenu(option.subMenu, isMobileView ? option.id : undefined, true);\n }\n return (\n \n { menuItem }\n { subMenu }\n \n );\n });\n return (this._renderMenu(levelClassName, menuOptions, activeMenu, IsSubMenu));\n }\n\n /**\n * Method to render button menu item.\n * @param option -Single Menuitem.\n * @param activeMenu -Active menu number.\n * @param index -Active menu index.\n * @returns Jsx element.\n */\n private _renderButtonMenuItem(option: IMenuItemData, activeMenu?: number, index?: number): JSX.Element | null {\n const { Button } = this.props;\n return (\n \n { option.linkText }\n \n );\n }\n\n /**\n * Method to render link menu item.\n * @param option -Single Menuitem.\n * @param index -Active menu index.\n * @param hoverEffect -Active menu effect.\n * @param isParent -Is parent menu.\n * @param setSize -Setsize data.\n * @param posinset -Current position.\n * @returns Jsx element.\n */\n private _renderLinkMenuItem(option: IMenuItemData, index?: number, hoverEffect: boolean = true, isParent: boolean = false,\n setSize?: number, posinset?: number): JSX.Element | null {\n const { Link, isMobileView } = this.props;\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 /**\n * Method to render promotional link.\n * @param linkText -Link text.\n * @param linkUrl -Link url.\n * @returns Jsx element.\n */\n private _renderPromotionalLink(linkText?: string, linkUrl?: string): JSX.Element | null {\n const { Link } = this.props;\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\n /**\n * Method to render span menu item.\n * @param option -Single Menu Item.\n * @param index -Index.\n * @param isParent -Is parent menu.\n * @returns Jsx element.\n */\n private _renderSpanMenuItem(option: IMenuItemData, index?: number, isParent: boolean = false): JSX.Element | null {\n const { Span } = this.props;\n return (\n \n { option.linkText }\n \n );\n }\n\n /**\n * Method to render menu.\n * @param level -Menu level.\n * @param menuOptions -Menu lists.\n * @param currentItem -Menu current.\n * @param submenu -Mneu has submenu or not.\n * @returns Jsx element.\n */\n private _renderMenu(level: string, menuOptions: JSX.Element[], currentItem?: number, submenu?: boolean): JSX.Element | null {\n\n const { DivContainer, MenuList, ImageDivContainer, showCategoryImage, isMobileView, showPromotionalContent } = this.props;\n const categoryImageDisplay = !isMobileView && showCategoryImage && this.state.categoryImage !== null && this.state.categoryImage !== undefined && !submenu;\n const promotionalContentDisplay = !isMobileView && showPromotionalContent && ArrayExtensions.hasElements(this.state.categoryImage) && !submenu;\n const DivContainerClass = this.currentLevel > 2 || categoryImageDisplay ? DivContainer!.className : 'ms-nav__deafult';\n this.currentLevel = 1;\n return (\n \n 2 && 'navmenu-multi-level')}>\n { menuOptions }\n \n \n {\n categoryImageDisplay && this.state.categoryImage && this.state.categoryImage.map(item => (\n \n { this.state.categoryImage && this._getCategoryImage(item) }\n { promotionalContentDisplay && this._renderPromotionalLink(item.altText, item.additionalProperties?.linkUrl)}\n ))\n }\n
\n \n );\n }\n\n private readonly _updateCategoryImage = (categoryImageSrc: string, option: IMenuItemData) => () => {\n const linkText = option && option.linkText ? option.linkText : '';\n const promotionalImage: IImageData[] = [{ src: categoryImageSrc, altText: linkText }];\n\n // Read category and promotional image in one array\n if (ArrayExtensions.hasElements(option.promotionalContent)) {\n option.promotionalContent.map(item => {\n if (item && item.image) {\n const imageSrc = item.image.src;\n const promotionalItemImageSettings = item.image.imageSettings;\n promotionalImage.push({ src: imageSrc, altText: item.text, imageSettings: promotionalItemImageSettings,\n additionalProperties: { linkUrl: item.linkUrl.destinationUrl } });\n }\n });\n }\n this.setState({\n categoryImage: promotionalImage.length > 0 ? promotionalImage : [{ src: 'empty' }],\n categoryImageAltText: linkText\n });\n };\n\n /**\n * Method to handle dropdwon change.\n * @param data -Menuitem data.\n * @param parentId -Menu parent.\n * @returns Jsx element.\n */\n private readonly _handleDropdownToggle = (data: IMenuItemData, parentId?: number) => () => {\n if (!this.props.isMobileView) {\n this.setState({\n activeMenu: (this.state.activeMenu && this.state.activeMenu === data.id!) ? undefined : data.id!,\n parentMenu: parentId\n });\n if (this.props.showCategoryImage) {\n this._updateCategoryImage(data.imageSource!, data)();\n }\n } else {\n this.setState({\n activeMenu: data.id,\n parentMenu: parentId\n });\n }\n\n this._resetFocus();\n };\n\n /**\n * Method to call when focus lost from menu.\n */\n private readonly _resetFocus = () => {\n if (this.props.isMobileView) {\n setTimeout(() => {\n this.menuNode && this.menuNode.current && this.menuNode.current.focus();\n }, 0);\n }\n };\n\n /**\n * Method to handle click outside of menu.\n * @param event -HTML event.\n */\n private readonly _handleClickOutside = (event: MouseEvent) => {\n if (this.menuNode.current && !this.menuNode.current.contains(event.target as Node)) {\n this.setState(\n {\n activeMenu: undefined,\n categoryImage: null\n }\n );\n }\n };\n\n /**\n * Method to handle click outside of menu.\n * @param event -HTML event.\n */\n private readonly _handleFocusOutside = (event: FocusEvent) => {\n if (this.menuNode.current && !this.menuNode.current.contains(event.relatedTarget as Node)) {\n this._closeSubmenu();\n }\n };\n\n /**\n * Method to handle close submenu event.\n */\n private _closeSubmenu(): void {\n if (!this.props.isMobileView) {\n this.setState({ activeMenu: undefined });\n }\n }\n\n /**\n * Method to handle escape key event.\n * @param event -HTML event.\n */\n private readonly _escFunction = (event: React.KeyboardEvent) => {\n\n if (event.keyCode === this.escapeKey) {\n if (!this.props.isMobileView) {\n const navDrawerList = Array.from(this.menuNode.current!.childNodes);\n for (const item of navDrawerList) {\n const navDrawerButton = item.firstChild as HTMLButtonElement;\n if (navDrawerButton.getAttribute('aria-expanded') === 'true') {\n navDrawerButton.focus();\n }\n }\n }\n this._closeSubmenu();\n }\n };\n\n private readonly _getCategoryImage = (categoryImage?: IImageData): React.ReactNode | null => {\n\n if (!categoryImage || !categoryImage.src) {\n return null;\n }\n\n const categoryImageUrl = generateImageUrl(categoryImage.src, this.props.context.actionContext.requestContext.apiSettings);\n const defaultImageSettings: IImageSettings = {\n viewports: {\n xs: { q: 'w=300&h=250&m=8', w: 0, h: 0 },\n sm: { q: 'w=300&h=250&m=8', w: 0, h: 0 },\n md: { q: 'w=300&h=250&m=8', w: 0, h: 0 },\n lg: { q: 'w=300&h=250&m=8', w: 0, h: 0 }\n },\n lazyload: true\n };\n if (categoryImageUrl !== undefined) {\n const ImageData: IImageData = { src: categoryImageUrl };\n return (\n \n );\n }\n return null;\n };\n\n /**\n * Method to handle escape key event.\n * @param drawerState -HTML event.\n */\n private readonly _onDrawerChange = (drawerState: IDrawerState) => {\n const { drawerKeyValue } = this.state;\n const drawerText: string = drawerState.buttonText !== undefined ? drawerState.buttonText : '';\n const newPair = { [drawerText]: drawerState.isOpen };\n this.setState({ drawerKeyValue: { ...drawerKeyValue, ...newPair } });\n };\n}\n\nexport default NavigationMenuView;\n","/*--------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * See License.txt in the project root for license information.\n *--------------------------------------------------------------*/\n\nimport {\n IGroup,\n IGroupDelivery,\n IGroups,\n IHelp,\n IOrderDetailsViewProps,\n IOrderInformation,\n IOrderSummary,\n IPaymentMethods,\n ISalesLine\n} from '@msdyn365-commerce-modules/order-management';\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nexport const OrderInfomation: React.FC = ({\n orderInformationProps,\n salesId,\n receiptId,\n createdDate,\n count,\n amount,\n channelReferenceId,\n channelName,\n channelAddress\n}) => (\n \n {channelName}\n {channelAddress}\n {salesId}\n {receiptId}\n {createdDate}\n {count}\n {amount}\n {channelReferenceId}\n \n);\n\nexport const SalesLine: React.FC = ({ salesLineProps, salesLine, buyAgainButton, errors }) => (\n \n {salesLine}\n {buyAgainButton}\n {errors}\n \n);\n\nexport const GroupDelivery: React.FC = ({ deliveryProps, heading, count }) => (\n \n {heading}\n {count}\n \n);\n\nexport const Group: React.FC = ({ groupProps, delivery, address, salesLinesProps, salesLines, isCashAndCarryTransaction }) => (\n \n {delivery && }\n \n {salesLines && (\n \n {salesLines.map(salesLine => (\n \n {salesLine.data.deliveryType === 'ship' && salesLine.data.shipment ? salesLine.trackingInfo : null}\n \n {!isCashAndCarryTransaction && salesLine.salesStatus}\n \n ))}\n \n )}\n {!delivery.showTimeslot && address}\n {delivery.showTimeslot && (\n \n {address}\n {delivery.pickupDateTimeslot}\n \n )}\n \n \n);\n\nexport const Groups: React.FC = ({ groupsProps, groups }) => (\n \n {groups.map((group, index) => (\n \n ))}\n \n);\n\nexport const OrderSummary: React.FC = ({ orderSummaryProps, heading, subtotal, shipping, tax, totalAmount, earnedPoints }) => (\n \n {heading}\n {subtotal}\n {shipping}\n {tax}\n {totalAmount}\n {earnedPoints}\n \n);\n\nexport const Payment: React.FC = ({ paymentMethodsProps, title, methods }) => (\n \n {title}\n {methods}\n \n);\n\nexport const Help: React.FC = ({ helpProps, needHelpLabel, helpLineNumberLabel, contactNumber }) => (\n \n {needHelpLabel}\n {helpLineNumberLabel}\n {contactNumber}\n \n);\n\nconst OrderDetailsView: React.FC = ({\n moduleProps,\n viewModes,\n tableViewActions,\n table,\n heading,\n alert,\n loading,\n orderInfomation,\n orderSummary,\n payment,\n help,\n groups\n}) => {\n return (\n \n {heading}\n {alert}\n {loading}\n {orderInfomation && }\n {tableViewActions}\n {viewModes}\n {table}\n {groups && }\n \n {orderSummary && }\n {payment && }\n \n {help && }\n \n );\n};\n\nexport default OrderDetailsView;\n","/*--------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * See License.txt in the project root for license information.\n *--------------------------------------------------------------*/\n\nimport { IGroup, IGroupDelivery, IGroups, IHeader, IList, IOrderHistoryViewProps, IOrderInformation, ISalesOrder } 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 = ({ deliveryProps, heading, count, processing, address, trackingInfo }) => (\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 \n {salesLine.salesLine}\n \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 = ({ salesOrderProps, orderInfomation, groups, orderDetailsLink, expandProductsButton }) => (\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. All rights reserved.\n * See License.txt in the project root for license information.\n *--------------------------------------------------------------*/\n\nimport { IHistogramItemViewProps, IRatingsHistogramViewProps } from '@msdyn365-commerce-modules/ratings-reviews';\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nconst RatingsHistogramView: React.FC = props => {\n const { heading, histogramItems, histogramProps, moduleProps } = props;\n return (\n \n {heading}\n \n {histogramItems.map(item => {\n return histogramItem(item);\n })}\n \n \n );\n};\n\nconst histogramItem = (props: IHistogramItemViewProps) => {\n return (\n \n {props.starLabel}\n {props.bar}\n {props.percentage}\n \n );\n};\n\nexport default RatingsHistogramView;\n","/*--------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * See License.txt in the project root for license information.\n *--------------------------------------------------------------*/\n\nimport { IReviewModalViewProps } from '@msdyn365-commerce-modules/ratings-reviews';\nimport { IReportReviewModalViewProps, IReviewCardViewProps, IReviewsListState, IReviewsListViewProps } from '@msdyn365-commerce-modules/ratings-reviews/src/modules/reviews-list';\nimport { IModuleProps, Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nconst ReviewsListview: React.FC = props => {\n const {\n averageRating,\n filterByDropdown,\n moduleProps,\n noReviewsMessage,\n noReviewsWithFilterMessage,\n pageControls,\n refineReviewsProps,\n reportReviewModal,\n reviewsListProps,\n reviewCards,\n reviewCount,\n reviewModal,\n sortByDropdown,\n state,\n userReview\n } = props;\n\n if (!userReview && reviewCards.length === 0 && !state.isFilterApplied) {\n return (\n {noReviewsMessage}\n );\n }\n\n return (\n \n {averageRating}\n {reviewCount}\n \n {sortByDropdown}\n {filterByDropdown}\n \n \n {userReview && buildReviewCard(userReview)}\n {reviewCards.map(review => {\n return buildReviewCard(review);\n })}\n \n { reviewCards.length === 0 && state.isFilterApplied && noReviewsWithFilterMessage}\n {pageControls}\n {createReviewModal(reviewModal, moduleProps)}\n {createReportModal(reportReviewModal, state)}\n \n );\n};\n\nconst buildReviewCard = (props: IReviewCardViewProps) => {\n return (\n \n \n {props.rating}\n {props.name}\n {props.date}\n \n \n \n {props.reviewTitle}\n {props.reviewText}\n \n \n {props.responseName}\n {props.responseDate}\n {props.responseText}\n \n \n {props.ratingHelpfulLabel}\n {props.like}\n {props.dislike}\n {props.edit}\n {props.report}\n \n \n \n );\n};\n\nconst createReviewModal = (props: IReviewModalViewProps, moduleProps: IModuleProps): JSX.Element => {\n return (\n \n {props.modalHeader}\n \n \n \n {props.rating}\n {props.ratingLabel}\n \n \n {props.titleLabel}\n {props.titleInput}\n \n \n {props.textLabel}\n {props.textInput}\n \n {props.privacyPolicyUrl}\n {props.error}\n \n \n \n {props.submitButton}\n {props.cancelButton}\n \n \n );\n};\n\nconst createReportModal = (props: IReportReviewModalViewProps, state: IReviewsListState): JSX.Element => {\n return (\n \n \n {state.reported ? props.headerSubmitted : props.header}\n \n \n {state.reported ? props.reportSubmittedMessage : [props.reportMessage, props.radioButtons, props.error]}\n \n \n {state.reported ? props.succesfulButton : [props.submitButton, props.cancelButton]}\n \n \n );\n};\n\nexport default ReviewsListview;\n","/*--------------------------------------------------------------\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * See License.txt in the project root for license information.\n *--------------------------------------------------------------*/\n\nimport { ICategoryHierarchyViewProps, IRefineMenuViewProps, ISearchResultContainerViewProps, ISearchResultModalViewProps, ISortByViewProps, ITitleViewProps } from '@msdyn365-commerce-modules/search-result-container';\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nconst SearchResultContainerView: React.FC = props => {\n const { SearchResultContainer, products, pagination, ProductsContainer, ProductSectionContainer, choiceSummary, isMobile, modalToggle, searchResultModal, TitleViewProps,\n refineMenu, categoryHierarchy, sortByOptions, CategoryNavContainer, RefineAndProductSectionContainer, errorMessage, FeatureSearchContainer, similarLookProduct } = props;\n const isRecoSearchPage = props.context.actionContext.requestContext.query?.recommendation;\n if (isMobile) {\n return (\n \n {categoryHierarchy && renderCategoryHierarchy(categoryHierarchy)}\n {renderTitle(TitleViewProps)}\n {choiceSummary}\n {modalToggle}\n {createSearchResultModal(searchResultModal, refineMenu, sortByOptions, isRecoSearchPage)}\n \n {similarLookProduct}\n \n \n {errorMessage}\n {products}\n \n {pagination}\n \n );\n }\n return (\n \n {categoryHierarchy &&\n \n {renderCategoryHierarchy(categoryHierarchy)}\n }\n \n {refineMenu && renderRefiner(refineMenu)}\n \n \n {similarLookProduct}\n \n \n {TitleViewProps && renderTitle(TitleViewProps)}\n {choiceSummary}\n
\n \n {sortByOptions && !isRecoSearchPage && renderSort(sortByOptions)}\n
\n \n {errorMessage}\n {products}\n \n {pagination}\n \n \n \n );\n\n};\n\nconst createSearchResultModal = (modalProps: ISearchResultModalViewProps, refineMenu: IRefineMenuViewProps, sortByDropDown: ISortByViewProps,\n isRecoSearchPage?: string): JSX.Element => {\n return React.cloneElement(modalProps.modal, {}, modalProps.modalHeader, createModalBody(modalProps, refineMenu, sortByDropDown, isRecoSearchPage),\n modalProps.modalFooter);\n};\n\nconst createModalBody = (props: ISearchResultModalViewProps, refineMenu: IRefineMenuViewProps,\n sortByDropDown: ISortByViewProps, isRecoSearchPage?: string): JSX.Element | null => {\n if (sortByDropDown) {\n return React.cloneElement(props.modalBody, {}, renderSort(sortByDropDown, isRecoSearchPage), renderRefiner(refineMenu));\n }\n return null;\n};\n\nconst renderRefiner = (props: IRefineMenuViewProps): JSX.Element | null => {\n const { refiners, RefineMenuContainer, RefinerSectionContainer } = props;\n if (refiners) {\n return (\n \n \n {refiners.map((submenu, index) => (\n \n {submenu}\n \n ))}\n \n \n );\n }\n return null;\n};\n\nconst renderSort = (props: ISortByViewProps, isRecoSearchPage?: string): JSX.Element | null => {\n const { SortingContainer, sortByDropDown } = props;\n if (sortByDropDown && !isRecoSearchPage) {\n return (\n \n {sortByDropDown}\n \n );\n }\n return null;\n};\n\nconst renderCategoryHierarchy = (props: ICategoryHierarchyViewProps): JSX.Element | null => {\n const { CategoryHierarchyContainer, categoryHierarchyList, categoryHierarchySeparator } = props;\n if (categoryHierarchyList) {\n return (\n \n {categoryHierarchyList.map((category, index) => (\n \n {category}\n {categoryHierarchyList && categoryHierarchyList[index + 1] && categoryHierarchySeparator}\n \n ))}\n \n );\n }\n\n return null;\n};\n\nconst renderTitle = (props: ITitleViewProps): JSX.Element | null => {\n const { title, TitleContainer } = props;\n if (title) {\n return (\n \n \n {title.titlePrefix}\n {title.titleText}\n (\n {title.titleCount}\n )\n
\n \n );\n }\n return null;\n};\n\nexport default SearchResultContainerView;\n"],"names":["_renderTextBlock","textBlocks","length","_renderSocialShare","socialShare","_renderCartAndActions","addToCart","addToOrderTemplate","addToWishlist","className","errorBlock","button","_renderConfigure","configure","ContainerProps","dropdowns","Node","map","_renderConfigureDropdown","dropdown","LabelContainerProps","heading","errors","select","_renderFindInStore","findInStore","storeSelector","description","modal","productPickupOptionList","onChangeHandler","callbacks","newValue","updateQuantity","_renderQuantity","quantityComponent","props","state","extentionResources","quantityLimitsMessages","max","telemetryContent","resources","quantity","id","currentCount","onChange","inputQuantityAriaLabel","decrementButtonAriaLabel","incrementButtonAriaLabel","minQuantityText","maxQuantityText","_renderKeyInPrice","keyInPrice","input","_renderShopSimilarItem","shopSimilarItem","ModuleProps","MediaGalleryContainerProps","ProductInfoContainerProps","price","title","rating","inventoryLabel","shopSimilarLook","shopSimilarDescription","unitOfMeasure","Module","mediaGallery","bulkPurchaseLink","slots","_renderPromotions","promotions","promotionMessageWrapper","promotionMessage","promotionSeeAllLink","promotionDialog","_renderCartlines","cartLines","backToShoppingButton","waitingComponent","cartLoadingStatus","cartDataResult","mulitplePickUp","emailDeliveryModeCode","emptyCartText","cartLine","index","key","cartline","_renderBOPISBlock","_renderGroupBOPISBlock","remove","onToggleBopisHandler","isBopisSelected","pickUpInStore","toggleBopis","onChangeStoreHandler","data","DeliveryMode","shipInsteadDisplayText","shipToAddressDisplayText","pickItUpDisplayText","pickUpAtStoreWithLocationText","changeStoreDisplayText","payLoad","puckUpinStoreAttribute","orgUnitName","role","onClick","_renderErrorBlock","errorData","Wrapper","header","_renderOrderSummarylines","orderSummaryLines","OrderSummaryItems","promoCode","subtotal","shipping","otherCharge","tax","totalDiscounts","orderTotal","_renderInvoiceSummarylines","invoiceSummaryLines","invoices","giftCard","loyalty","context","telemetry","error","_renderCartLinesGroup","cartLinesGroup","cartlines","_renderCartLinesGroupHeader","_countItems","actionContext","requestContext","channel","EmailDeliveryModeCode","multiplePickUpEnabled","count","pickUpText","shippingText","emailshippingText","groupTitle","toLowerCase","_renderCartLinesGroupTitle","countItem","reduce","item","Quantity","itemLabel","itemsLabel","suffix","deliveryOption","renderModuleAttributes","promotionOptions","CartlinesWrapper","orderSummaryHeading","OrderSummaryWrapper","cart","hasInvoiceLine","invoiceSummaryLineitems","orderSummaryLineitems","OrderSummaryErrors","checkoutAsSignInUserButton","checkoutAsGuestButton","createTemplateFromCartButton","CartLineItemFunctions","Product","DimensionStrings","Dimensions","productDimension","DimensionTypeValue","RecordId","colorString","DimensionValue","Value","configString","sizeString","IsGiftCard","amountString","styleString","DiscountLines","discountLine","OfferId","OfferName","discountStringText","PriceComponent","isSalesLine","CustomerContextualPrice","PeriodicDiscount","EffectiveAmount","BasePrice","typeName","undefined","EffectivePercentage","inventoryInformationLabel","inventoryCssName","inventoryLabelClassName","IsInvoiceLine","app","config","unitOfMeasureDisplayType","product","DefaultUnitOfMeasure","pickupDeliveryModeCode","request","PickupDeliveryModeCode","channelDeliveryOptionConfig","hasShippingMethod","PickupDeliveryModeCodes","some","deliveryMode","shippingChargeLines","ChargeLines","filter","chargeLine","IsShipping","freightFee","chargeTotal","CalculatedAmount","priceComponent","freePriceText","shippingChargesText","otherCharges","chargeline","Description","productUrl","destructDimensionStrings","fallbackImageUrl","getFallbackImageUrl","ItemId","apiSettings","productDimensions","imageSettings","cropFocalRegion","renderDisountLines","renderInventoryLabel","renderUnitOfMeasure","renderShippingLabel","renderOtherCharges","toString","productAttribute","productName","Name","imgeClassName","quantityOnChange","lineIndex","src","primaryImageUrl","fallBackSrc","altText","gridSettings","loadFailureBehavior","href","ArrayExtensions","NetAmount","Price","NetAmountWithoutTax","NetPrice","showShippingChargesForLineItems","nodes","isOutOfStock","isQuantityEditable","push","quantityDisplayString","LineId","maxQuantity","currentQuantity","disabled","isCartStateReady","isGiftCard","originalPriceText","currentPriceText","DiscountAmount","DiscountAmountWithoutTax","_generateQuantityandPrice","cartState","priceEditorResources","CartLinePriceEditor","errorMessage","PromoCode","super","_onInputChangeHandler","e","target","value","this","setState","promoCodeInputValue","canApply","_applyPromotion","appliedPromo","addPromoCode","then","result","status","substatus","duplicatePromoCodeErrorText","invalidPromoCodeErrorText","catch","failedToAddPromoCodeErrorText","_onSubmitHandler","event","preventDefault","_applyPromotionHandler","_renderForm","promoPlaceholderText","promoCodeApplyButtonText","attributes","onSubmit","placeholder","_removePromotion","code","currentTarget","getAttribute","removePromoCodes","promoCodes","failedToRemovePromoCodeErrorText","_calculateDiscount","CartLines","discountAmount","line","DiscountCode","DiscountCost","_renderAppliedPromoCode","Coupons","removePromotionHandler","promoCodTotalDiscount","coupon","Code","appliedPromoCodeHeadingText","ariaLabel","removePromoAriaLabelFormat","removePromoText","isCollapseOpen","nextProps","nextState","promoCodeHeadingText","renderCustomerName","accountInformation","customer","FirstName","_renderReactFragment","items","slot","HeaderTag","HeaderContainer","HeaderTopBarContainer","Divider","navIcon","logo","search","preferredStore","renderForMobile","AccountInfoDropdownParentContainer","AccountInfoDropdownPopoverConentContainer","accountInfoDropdownButton","signOutLink","signInLink","accountLinks","accountClassName","link","_renderAccountBlock","wishListIconDesktop","cartIcon","siteOptions","MobileMenuLinksContainer","mobileMenuCollapsed","isOpen","openGlyph","closeGlyph","glyphPlacement","toggleButtonText","_renderMobileAccountBlock","wishListIconMobile","menuBar","_renderCollapseMenu","NavigationMenuView","currentLevel","_positionInSetOffset","escapeKey","_updateCategoryImage","categoryImageSrc","option","linkText","promotionalImage","promotionalContent","image","imageSrc","promotionalItemImageSettings","text","additionalProperties","linkUrl","destinationUrl","categoryImage","categoryImageAltText","_handleDropdownToggle","parentId","isMobileView","activeMenu","parentMenu","showCategoryImage","imageSource","_resetFocus","setTimeout","menuNode","current","focus","_handleClickOutside","contains","_handleFocusOutside","relatedTarget","_closeSubmenu","_escFunction","keyCode","navDrawerList","Array","from","childNodes","navDrawerButton","firstChild","_getCategoryImage","categoryImageUrl","generateImageUrl","defaultImageSettings","viewports","xs","q","w","h","sm","md","lg","lazyload","ImageData","categoryImageSettings","_onDrawerChange","drawerState","drawerKeyValue","newPair","buttonText","bind","telemetryPageName","friendlyName","document","body","addEventListener","removeEventListener","_renderMobileMenu","_renderDesktopMenu","menuItemData","Navigation","menuItem","posinset","_renderDrawerMenu","MenuList","ref","tabIndex","_renderDisplay","setSize","subMenu","_renderDrawer","_renderLinkMenuItem","keyValue","isDrawerOpen","colProps","toggleButtonProps","onToggle","collapseProps","_renderLinkText","menuSubItem","currentPos","_renderDrawerLink","linkURL","_renderSpanMenuItem","ListItem","menuItemList","menuItemDatum","_getFromSubMenu","_createMenuItemList","forEach","subMenus","i","found","_renderSubMenu","_renderButtonMenuItem","IsSubMenu","enableMultiSupportMenu","enableMultilevelMenu","multiLevelSupportedMenu","menuLevelSupport","levelClassName","menuOptions","idx","hasOptions","haveSubmenu","Math","round","_renderMenu","Button","onFocus","hoverEffect","isParent","Link","imagesource","contentAction","etext","shouldOpenNewTab","onMouseOver","Span","level","currentItem","submenu","DivContainer","ImageDivContainer","showPromotionalContent","categoryImageDisplay","promotionalContentDisplay","DivContainerClass","_renderPromotionalLink","OrderInfomation","orderInformationProps","salesId","receiptId","createdDate","amount","channelReferenceId","channelName","channelAddress","SalesLine","salesLineProps","salesLine","buyAgainButton","GroupDelivery","deliveryProps","Group","groupProps","delivery","address","salesLinesProps","salesLines","isCashAndCarryTransaction","deliveryType","shipment","trackingInfo","salesStatus","showTimeslot","pickupProps","pickupDateTimeslot","Groups","groupsProps","groups","group","OrderSummary","orderSummaryProps","totalAmount","earnedPoints","Payment","paymentMethodsProps","methods","Help","helpProps","needHelpLabel","helpLineNumberLabel","contactNumber","moduleProps","viewModes","tableViewActions","table","alert","loading","orderInfomation","orderSummary","payment","help","OrderHistoryOrderInfomation","OrderHistoryGroupDelivery","processing","OrderHistoryGroup","OrderHistoryGroups","OrderHistoryHeader","headerProps","orderCountLabel","extraActions","OrderHistorySalesOder","salesOrderProps","orderDetailsLink","expandProductsButton","OrderHistoryList","listProps","salesOrders","salesOrder","orderHistoryProps","emptyMessage","backToShoppingLink","list","moreButton","histogramItem","buttonProps","starLabel","bar","percentage","histogramItems","histogramProps","buildReviewCard","cardProps","name","date","cardBodyProps","reviewProps","reviewTitle","reviewText","responseProps","responseName","responseDate","responseText","controlsProps","ratingHelpfulLabel","like","dislike","edit","report","createReviewModal","modalHeader","modalBody","form","inputRow","ratingLabel","titleLabel","titleInput","textLabel","textInput","privacyPolicyUrl","modalFooter","submitButton","cancelButton","createReportModal","reported","headerSubmitted","reportSubmittedMessage","reportMessage","radioButtons","succesfulButton","averageRating","filterByDropdown","noReviewsMessage","noReviewsWithFilterMessage","pageControls","refineReviewsProps","reportReviewModal","reviewsListProps","reviewCards","reviewCount","reviewModal","sortByDropdown","userReview","isFilterApplied","review","createSearchResultModal","modalProps","refineMenu","sortByDropDown","isRecoSearchPage","createModalBody","renderSort","renderRefiner","refiners","RefineMenuContainer","RefinerSectionContainer","SortingContainer","renderCategoryHierarchy","CategoryHierarchyContainer","categoryHierarchyList","categoryHierarchySeparator","category","renderTitle","TitleContainer","titlePrefix","titleText","titleCount","SearchResultContainer","products","pagination","ProductsContainer","ProductSectionContainer","choiceSummary","isMobile","modalToggle","searchResultModal","TitleViewProps","categoryHierarchy","sortByOptions","CategoryNavContainer","RefineAndProductSectionContainer","FeatureSearchContainer","similarLookProduct","query","recommendation"],"sourceRoot":""}