{"version":3,"file":"static/js/31faad0877558b7577b2.bundle.js","mappings":"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","sources":["webpack://henrys-ecommerce/./src/modules/custom-content-block/components/links.tsx?f46e","webpack://henrys-ecommerce/./src/modules/custom-content-block/custom-content-block.props.autogenerated.ts?b734","webpack://henrys-ecommerce/./src/modules/custom-content-block/custom-content-block.tsx?b211","webpack://henrys-ecommerce/./src/modules/custom-content-block/custom-content-block.view.tsx?d545","webpack://henrys-ecommerce/./lib/custom-content-block/module-registration.js?b6ad","webpack://henrys-ecommerce/external var \"React\"?0d3b","webpack://henrys-ecommerce/external var \"ReactDOM\"?853b"],"sourcesContent":["import { getPayloadObject, getTelemetryAttributes, ITelemetryContent, onTelemetryClick } from '@msdyn365-commerce-modules/utilities';\r\nimport * as Msdyn365 from '@msdyn365-commerce/core';\r\nimport * as React from 'react';\r\nimport { ILinksData } from '../custom-content-block.props.autogenerated';\r\n\r\nexport interface IContentCardLinks {\r\n    links: ILinksData[];\r\n    requestContext: Msdyn365.IRequestContext;\r\n    telemetryContent: ITelemetryContent;\r\n    onTextChange?(index: number): (event: Msdyn365.ContentEditableEvent) => void;\r\n}\r\n\r\n/**\r\n *\r\n * ContentCardLinks component\r\n * @extends {React.PureComponent<IContentCardLinks>}\r\n */\r\nexport class ContentCardLinks extends React.PureComponent<IContentCardLinks> {\r\n    public render(): JSX.Element {\r\n        const editableLinks = this._mapEditableLinks(this.props.links);\r\n        return (\r\n            <div className='ms-content-block__cta'>\r\n                {editableLinks && editableLinks.length ? (\r\n                    <Msdyn365.Links\r\n                        links={editableLinks}\r\n                        editProps={{ onTextChange: this.props.onTextChange, requestContext: this.props.requestContext }}\r\n                    />\r\n                ) : null}\r\n            </div>\r\n        );\r\n    }\r\n\r\n    private _mapEditableLinks = (linkdata: ILinksData[]): Msdyn365.ILinksData[] | null => {\r\n        if (!linkdata || linkdata.length === 0) {\r\n            return null;\r\n        }\r\n        const editableLinks: Msdyn365.ILinksData[] = [];\r\n        linkdata.forEach((link, index) => {\r\n            // Construct telemetry attribute to render\r\n            const payLoad = getPayloadObject('click', this.props.telemetryContent, '', '');\r\n            const linkText = link.linkText ? link.linkText : '';\r\n            payLoad.contentAction.etext = linkText;\r\n            const attributes = getTelemetryAttributes(this.props.telemetryContent, payLoad);\r\n            const btnClass = index === 0 ? 'msc-cta__primary' : 'msc-cta__secondary';\r\n            const editableLink: Msdyn365.ILinksData = {\r\n                ariaLabel: link.ariaLabel,\r\n                className: btnClass,\r\n                linkText: link.linkText,\r\n                linkUrl: link.linkUrl.destinationUrl,\r\n                openInNewTab: link.openInNewTab,\r\n                role: 'button',\r\n                additionalProperties: attributes,\r\n                onClick: onTelemetryClick(this.props.telemetryContent, payLoad, linkText)\r\n            };\r\n            editableLinks.push(editableLink);\r\n        });\r\n\r\n        return editableLinks;\r\n    };\r\n}\r\nexport default ContentCardLinks;\r\n","/**\r\n * Copyright (c) Microsoft Corporation\r\n * All rights reserved. See License.txt in the project root for license information.\r\n * ICustomContentBlock contentModule Interface Properties\r\n * THIS FILE IS AUTO-GENERATED - MANUAL MODIFICATIONS WILL BE LOST\r\n */\r\n\r\nimport * as Msdyn365 from '@msdyn365-commerce/core';\r\n\r\nexport const enum actionableRegion {\r\n    imageAndLinks = 'imageAndLinks',\r\n    linksOnly = 'linksOnly'\r\n}\r\n\r\nexport interface ICustomContentBlockConfig extends Msdyn365.IModuleConfig {\r\n    heading?: IHeadingData;\r\n    paragraph?: Msdyn365.RichText;\r\n    breakpoint_sm: number;\r\n    breakpoint_lg: number;\r\n    image_sm?: Msdyn365.IImageData;\r\n    image_md?: Msdyn365.IImageData;\r\n    image_lg?: Msdyn365.IImageData;\r\n    links?: ILinksData[];\r\n    actionableRegion?: actionableRegion;\r\n    imageLink?: Msdyn365.ILinkData;\r\n    imageAriaLabel?: string;\r\n    className?: string;\r\n}\r\n\r\nexport const enum HeadingTag {\r\n    h1 = 'h1',\r\n    h2 = 'h2',\r\n    h3 = 'h3',\r\n    h4 = 'h4',\r\n    h5 = 'h5',\r\n    h6 = 'h6'\r\n}\r\n\r\nexport interface IHeadingData {\r\n    text: string;\r\n    tag?: HeadingTag;\r\n}\r\n\r\nexport interface ILinksData {\r\n    linkText?: string;\r\n    linkUrl: Msdyn365.ILinkData;\r\n    ariaLabel?: string;\r\n    openInNewTab?: boolean;\r\n}\r\n\r\nexport interface ICustomContentBlockProps<T> extends Msdyn365.IModule<T> {\r\n    config: ICustomContentBlockConfig;\r\n}\r\n","/*---------------------------------------------------------------------------------------------\r\n *  Copyright (c) Microsoft Corporation. All rights reserved.\r\n *  Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport { getTelemetryObject, IModuleProps, INodeProps, ITelemetryContent } from '@msdyn365-commerce-modules/utilities';\r\nimport * as Msdyn365 from '@msdyn365-commerce/core';\r\nimport classnames from 'classnames';\r\nimport * as React from 'react';\r\nimport LinksComponent from './components/links';\r\nimport { actionableRegion as region, ICustomContentBlockProps } from './custom-content-block.props.autogenerated';\r\n\r\nexport interface IContentBlockViewProps extends ICustomContentBlockProps<{}> {\r\n    title?: React.ReactNode;\r\n    text?: React.ReactNode;\r\n    image_sm?: React.ReactNode;\r\n    image_md?: React.ReactNode;\r\n    image_lg?: React.ReactNode;\r\n    breakpoint_sm?: number;\r\n    breakpoint_lg?: number;\r\n    links?: React.ReactNode;\r\n    className?: string;\r\n    contentBlockContainer: IModuleProps;\r\n    imageContainer: INodeProps;\r\n    detailsContainer: INodeProps;\r\n    contentBlockAnchorTag?: INodeProps;\r\n    imageLink?: string;\r\n    imageAriaLabel?: string;\r\n}\r\n/**\r\n *\r\n * ContentCard component\r\n * @extends {React.PureComponent<ICustomContentBlockProps{}>}\r\n */\r\n\r\nclass ContentBlock extends React.PureComponent<ICustomContentBlockProps<{}>> {\r\n    private telemetryContent: ITelemetryContent = getTelemetryObject(\r\n        this.props.context.request.telemetryPageName!,\r\n        this.props.friendlyName,\r\n        this.props.telemetry\r\n    );\r\n    public render(): JSX.Element | null {\r\n        const {\r\n            heading,\r\n            paragraph,\r\n            image_sm,\r\n            image_md,\r\n            image_lg,\r\n            breakpoint_sm,\r\n            breakpoint_lg,\r\n            links,\r\n            className,\r\n            imageAriaLabel\r\n        } = this.props.config;\r\n        const contentBlockTitle = heading && (\r\n            <Msdyn365.Text\r\n                className='ms-content-block__title'\r\n                tag={heading.tag || 'h1'}\r\n                text={heading.text}\r\n                editProps={{ onEdit: this.handleTextChange, requestContext: this.props.context.request }}\r\n            />\r\n        );\r\n        const imageProps = {\r\n            gridSettings: this.props.context.request.gridSettings || {},\r\n            imageSettings: image_sm && image_sm.imageSettings\r\n        };\r\n        const contentBlockLinks = links && links.length > 0 && (\r\n            <LinksComponent\r\n                {...{\r\n                    links: links,\r\n                    onTextChange: this.handleLinkTextChange,\r\n                    requestContext: this.props.context.request,\r\n                    telemetryContent: this.telemetryContent\r\n                }}\r\n            />\r\n        );\r\n        const contentBlockText = paragraph && (\r\n            <Msdyn365.RichTextComponent\r\n                text={paragraph}\r\n                className='ms-content-block__text'\r\n                editProps={{ onEdit: this.handleParagraphChange, requestContext: this.props.context.request }}\r\n            />\r\n        );\r\n\r\n        const contentBlockImageSm = image_sm && (\r\n            <Msdyn365.Image\r\n                {...image_sm}\r\n                {...imageProps}\r\n                className={classnames(className, 'SHEA_sm-img')}\r\n                editProps={{ key: this.props.config.image_sm || {}, requestContext: this.props.context.request }}\r\n            />\r\n        );\r\n\r\n        const contentBlockImageMd = image_md && (\r\n            <Msdyn365.Image\r\n                {...image_md}\r\n                {...imageProps}\r\n                className={classnames(className, 'SHEA_md-img')}\r\n                editProps={{ key: this.props.config.image_md || {}, requestContext: this.props.context.request }}\r\n            />\r\n        );\r\n\r\n        const contentBlockImageLg = image_lg && (\r\n            <Msdyn365.Image\r\n                {...image_lg}\r\n                {...imageProps}\r\n                className={classnames(className, 'SHEA_lg-img')}\r\n                editProps={{ key: this.props.config.image_lg || {}, requestContext: this.props.context.request }}\r\n            />\r\n        );\r\n\r\n        if (\r\n            !contentBlockTitle &&\r\n            !contentBlockText &&\r\n            !contentBlockImageSm &&\r\n            !contentBlockImageMd &&\r\n            !contentBlockImageLg &&\r\n            !contentBlockLinks\r\n        ) {\r\n            this.props.context.telemetry.error('Content block content is empty, module wont render.');\r\n            return null;\r\n        }\r\n\r\n        const contentBlockviewProps = {\r\n            ...this.props,\r\n            title: contentBlockTitle,\r\n            text: contentBlockText,\r\n            image_sm: contentBlockImageSm,\r\n            image_md: contentBlockImageMd,\r\n            image_lg: contentBlockImageLg,\r\n            breakpoint_sm: breakpoint_sm,\r\n            breakpoint_lg: breakpoint_lg,\r\n            links: contentBlockLinks,\r\n            moduleClass: this.props.config.className,\r\n            contentBlockContainer: {\r\n                moduleProps: this.props,\r\n                className: classnames('ms-content-block', className)\r\n            },\r\n            imageContainer: { className: 'ms-content-block__image' },\r\n            detailsContainer: { className: 'ms-content-block__details' },\r\n            contentBlockAnchorTag: {\r\n                tag: 'a',\r\n                className: 'ms-content-block__link',\r\n                role: 'link'\r\n            },\r\n            imageLink: this._getImageLink(),\r\n            imageAriaLabel\r\n        };\r\n\r\n        return this.props.renderView(contentBlockviewProps) as React.ReactElement;\r\n    }\r\n    public handleTextChange = (event: Msdyn365.ContentEditableEvent) => (this.props.config.heading!.text = event.target.value);\r\n    public handleParagraphChange = (event: Msdyn365.ContentEditableEvent) => (this.props.config.paragraph = event.target.value);\r\n    /* Handle link text change*/\r\n    public handleLinkTextChange = (linkIndex: number) => (event: Msdyn365.ContentEditableEvent) => {\r\n        if (this.props.config.links && this.props.config.links[linkIndex]) {\r\n            this.props.config.links[linkIndex].linkText = event.target.value;\r\n        }\r\n    };\r\n    private _getImageLink(): string | null {\r\n        const { imageLink, links, actionableRegion } = this.props.config;\r\n        if (actionableRegion === region.imageAndLinks) {\r\n            if (imageLink && imageLink.destinationUrl) {\r\n                return imageLink.destinationUrl;\r\n            } else if (links && links.length && links[0].linkUrl) {\r\n                return links[0].linkUrl.destinationUrl;\r\n            } else {\r\n                return null;\r\n            }\r\n        } else if (actionableRegion === region.linksOnly && imageLink?.destinationUrl) {\r\n            return imageLink?.destinationUrl;\r\n        } else {\r\n            return null;\r\n        }\r\n    }\r\n}\r\n\r\nexport default ContentBlock;\r\n","/*---------------------------------------------------------------------------------------------\r\n *  Copyright (c) Microsoft Corporation. All rights reserved.\r\n *  Licensed under the MIT License. See License.txt in the project root for license information.\r\n *--------------------------------------------------------------------------------------------*/\r\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\r\nimport * as React from 'react';\r\nimport { useMediaQuery } from 'react-responsive';\r\nimport { IContentBlockViewProps } from './custom-content-block';\r\nimport { msdyn365Commerce } from '@msdyn365-commerce/core';\r\ntype imageBreakpoint = 'sm' | 'md' | 'lg';\r\nconst ContentBlockView: React.FC<IContentBlockViewProps> = props => {\r\n    const {\r\n        contentBlockContainer,\r\n        imageContainer,\r\n        image_sm,\r\n        image_md,\r\n        image_lg,\r\n        breakpoint_sm,\r\n        breakpoint_lg,\r\n        contentBlockAnchorTag,\r\n        imageLink,\r\n        imageAriaLabel\r\n    } = props;\r\n\r\n    const imageBreakpointMap: Record<imageBreakpoint, React.ReactNode | null> = {\r\n        sm: image_sm,\r\n        md: image_md,\r\n        lg: image_lg\r\n    };\r\n\r\n    const getImageBreakpoint = () => {\r\n        if (msdyn365Commerce.isBrowser) {\r\n            const isLarge = useMediaQuery({ query: `(min-width: ${breakpoint_lg}px)` });\r\n            const isMed = useMediaQuery({ query: `(max-width: ${breakpoint_lg || 0 - 1}px) and (min-width: ${breakpoint_sm}px)` });\r\n            if (isLarge) {\r\n                return 'lg';\r\n            } else if (isMed) {\r\n                return 'md';\r\n            } else {\r\n                return 'sm';\r\n            }\r\n        }\r\n        return 'lg';\r\n    };\r\n\r\n    const getImage = (breakpoint: imageBreakpoint): React.ReactNode | null => {\r\n        if (imageBreakpointMap[breakpoint]) {\r\n            return imageBreakpointMap[breakpoint];\r\n        } else {\r\n            const keys = Object.keys(imageBreakpointMap);\r\n            let idx = keys.findIndex(k => k === breakpoint);\r\n\r\n            while (idx < keys.length) {\r\n                const image = imageBreakpointMap[keys[idx]];\r\n                if (image) {\r\n                    return image;\r\n                } else {\r\n                    idx++;\r\n                }\r\n            }\r\n            return null;\r\n        }\r\n    };\r\n    if (!msdyn365Commerce.isBrowser) {\r\n        return <div />;\r\n    }\r\n    if (imageLink) {\r\n        return (\r\n            <Module {...contentBlockContainer}>\r\n                <Node\r\n                    {...contentBlockAnchorTag}\r\n                    href={imageLink}\r\n                    className={contentBlockAnchorTag ? contentBlockAnchorTag.className : ''}\r\n                    aria-label={imageAriaLabel}\r\n                >\r\n                    <Node {...imageContainer}>{getImage(getImageBreakpoint())}</Node>\r\n                    {/*    /!* Responsive component renderring, using MediaQuery from react-responsive, render small, medium or large image based on breakpoint_sm and breakpoint_lg fields *!/*/}\r\n                    {/*    <MediaQuery maxDeviceWidth={breakpoint_sm}>*/}\r\n                    {/*        {' '}*/}\r\n                    {/*        <Node {...imageContainer}>{getImage('sm')}</Node>*/}\r\n                    {/*    </MediaQuery>*/}\r\n                    {/*    <MediaQuery maxDeviceWidth={breakpoint_lg! - 1} minDeviceWidth={breakpoint_sm! + 1}>*/}\r\n                    {/*        {' '}*/}\r\n                    {/*        <Node {...imageContainer}>{getImage('md')}</Node>*/}\r\n                    {/*    </MediaQuery>*/}\r\n                    {/*    <MediaQuery minDeviceWidth={breakpoint_lg}>*/}\r\n                    {/*        {' '}*/}\r\n                    {/*        <Node {...imageContainer}>{getImage('lg')}</Node>*/}\r\n                    {/*    </MediaQuery>*/}\r\n                </Node>\r\n            </Module>\r\n        );\r\n    } else {\r\n        return (\r\n            <Module {...contentBlockContainer}>\r\n                <Node {...imageContainer}>{getImage(getImageBreakpoint())}</Node>\r\n                {/* Responsive component renderring, using MediaQuery from react-responsive, render small, medium or large image based on breakpoint_sm and breakpoint_lg fields */}\r\n                {/*<MediaQuery maxDeviceWidth={breakpoint_sm}>*/}\r\n                {/*    {' '}*/}\r\n                {/*    <Node {...imageContainer}>{getImage('sm')}</Node>*/}\r\n                {/*</MediaQuery>*/}\r\n                {/*<MediaQuery maxDeviceWidth={breakpoint_lg! - 1} minDeviceWidth={breakpoint_sm! + 1}>*/}\r\n                {/*    {' '}*/}\r\n                {/*    <Node {...imageContainer}>{getImage('md')}</Node>*/}\r\n                {/*</MediaQuery>*/}\r\n                {/*<MediaQuery minDeviceWidth={breakpoint_lg}>*/}\r\n                {/*    {' '}*/}\r\n                {/*    <Node {...imageContainer}>{getImage('lg')}</Node>*/}\r\n                {/*</MediaQuery>*/}\r\n            </Module>\r\n        );\r\n    }\r\n};\r\n\r\nexport default ContentBlockView;\r\n","const binding = { modules: {}, dataActions: {} };\n\n    (binding.modules['custom-content-block'] = {\n        c: () => require('partner/modules/custom-content-block/custom-content-block.tsx'),\n        $type: 'contentModule',\n        da: [],\n        \n        iNM: false,\n        ns: '__local__',\n        n: 'custom-content-block',\n        p: '__local__',\n        \n        pdp: '',\n        \n        \n        md: 'src/modules/custom-content-block'\n    });\n        \n\n        \n    window.__bindings__ = window.__bindings__ || {};\n    window.__bindings__.modules = {\n        ...window.__bindings__.modules || {},\n        ...binding.modules\n    };\n    \n        window.__bindings__.dataActions = {\n        ...window.__bindings__.dataActions || {},\n        ...binding.dataActions\n    };\n                        export const viewDictionary = {};\n                        viewDictionary['__local__|__local__|modules|custom-content-block|custom-content-block'] = {\n                c: () => require('partner/modules/custom-content-block/custom-content-block.view.tsx'),\n                cn: '__local__-__local__-custom-content-block'\n            };\nwindow.__bindings__ = window.__bindings__ || {};\nwindow.__bindings__.viewDictionary = {\n                        ...window.__bindings__.viewDictionary || {},\n                        ...viewDictionary\n                    };","module.exports = React;","module.exports = ReactDOM;"],"names":["ContentCardLinks","React","constructor","_mapEditableLinks","linkdata","length","editableLinks","forEach","link","index","payLoad","getPayloadObject","this","props","telemetryContent","linkText","contentAction","etext","attributes","getTelemetryAttributes","btnClass","editableLink","ariaLabel","className","linkUrl","destinationUrl","openInNewTab","role","additionalProperties","onClick","onTelemetryClick","push","render","links","Msdyn365","editProps","onTextChange","requestContext","actionableRegion","HeadingTag","ContentBlock","getTelemetryObject","context","request","telemetryPageName","friendlyName","telemetry","handleTextChange","event","config","heading","text","target","value","handleParagraphChange","paragraph","handleLinkTextChange","linkIndex","image_sm","image_md","image_lg","breakpoint_sm","breakpoint_lg","imageAriaLabel","contentBlockTitle","tag","onEdit","imageProps","gridSettings","imageSettings","contentBlockLinks","LinksComponent","Object","assign","contentBlockText","contentBlockImageSm","classnames","key","contentBlockImageMd","contentBlockImageLg","error","contentBlockviewProps","_objectSpread","title","moduleClass","contentBlockContainer","moduleProps","imageContainer","detailsContainer","contentBlockAnchorTag","imageLink","_getImageLink","renderView","region","imageAndLinks","linksOnly","imageBreakpointMap","sm","md","lg","getImageBreakpoint","msdyn365Commerce","isBrowser","isLarge","useMediaQuery","query","isMed","getImage","breakpoint","keys","idx","findIndex","k","image","Module","Node","href","binding","modules","dataActions","c","require","$type","da","iNM","ns","n","p","pdp","window","__bindings__","viewDictionary","cn","module","exports","ReactDOM"],"sourceRoot":""}