{"version":3,"sources":["webpack:///./Scripts/Components/withReactiveStyleBuyButton.js","webpack:///./Scripts/Components/BuyButton.js","webpack:///./Scripts/Containers/withReactiveStyleBuyButton.js","webpack:///./Scripts/Containers/BuyButton.container.js"],"names":["StateStyles","LOADING","SUCCESS","ERROR","withReactiveStyleBuyButton","WrappedComponent","onClick","stylePrefix","props","stateClass","setStateClass","useState","startTime","useRef","useEffect","changeState","complete","autoReset","setTimeout","current","resetTimeout","async","onButtonClick","params","Date","now","loadingDuration","minimumLoadingTime","onComplete","className","BuyButton","label","articleNumber","quantityFieldId","href","cssClass","Fragment","e","preventDefault","rel","dispatch","useDispatch","Button","quantity","document","getElementById","value","cart","addToCartService","receive","ex","catchError","error","loadError","BuyButtonContainer","Component","constructor","super","render","this","connect","state","isToggleCart","onSuccess","onError","toggleCart","toggle","onNeutralState","setState","onLoadingState","onCompleteState","success","querySelector","active","click","data","waitForMetaPixelInitAndTrack","err","window","scrollTo","top","left","behavior"],"mappings":"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","file":"501.ae612361c263c82a66af.js","sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\n\nconst StateStyles = {\n    LOADING: '--loading',\n    SUCCESS: '--success',\n    ERROR: '--error',\n};\n\n/**\n * Represents a HOC which wraps a BuyButton or ReorderButton and applies diffrent styles to it\n * depending on its click state.\n * @param {*} WrappedComponent The button component.\n * @param {*} onClick The async button's onClick event. It should return true if everything is OK, or false if there is any error.\n * @param {*} stylePrefix The style prefix to append state's modifiers. For\n * example, 'button' will result as 'button--loading'.\n *\n * Some available props that the HOC component supports:\n * autoReset : it is true by default. Not its value, but the behaviour is like that. Unless people set it as false, by default, button is always reset to neutral state after the request is completed.\n * resetTimeout: Number milisecond after the complete state, the style of button will be reset. If don't set, it is 2000\n * minimumLoadingTime: Mininum milisecond to display the loading state. If don't set, it is 1000\n */\nexport default function withReactiveStyleBuyButton(\n    WrappedComponent,\n    onClick,\n    stylePrefix\n) {\n    return (props) => {\n        const [stateClass, setStateClass] = useState('');\n        const startTime = useRef(0);\n\n        useEffect(() => {\n            return () => {\n                setStateClass('');\n            };\n        }, []);\n\n        function onNeutralState() {\n            setStateClass('');\n            startTime.current = 0;\n        }\n\n        function onLoadingState() {\n            setStateClass(`${stylePrefix}${StateStyles.LOADING}`);\n            startTime.current = Date.now();\n        }\n\n        const changeState = (complete) => {\n            setStateClass(\n                `${stylePrefix}${\n                    complete ? StateStyles.SUCCESS : StateStyles.ERROR\n                }`\n            );\n\n            // if `autoReset` is true, which is default, the style will be changed\n            // to neutral after a `resetTimeout` amount of time (2 seconds by default).\n            props.autoReset !== false &&\n                setTimeout(() => {\n                    onNeutralState();\n                }, props.resetTimeout || 2000);\n        };\n\n        function onComplete(complete) {\n            const loadingDuration = Date.now() - startTime.current;\n            const minimumLoadingTime = props.minimumLoadingTime || 1000;\n            // ensure the loading indicator is displayed at least a `minimumLoadingTime`\n            // amount of time before changing it to Success or Error.\n            if (loadingDuration >= minimumLoadingTime) {\n                changeState(complete);\n            } else {\n                setTimeout(() => {\n                    changeState(complete);\n                }, minimumLoadingTime - loadingDuration);\n            }\n        }\n\n        async function onButtonClick(params) {\n            onLoadingState();\n            const data = await onClick(params);\n            onComplete(data);\n        }\n\n        return (\n            <span className={stateClass}>\n                <WrappedComponent\n                    onClick={(params) => onButtonClick(params)}\n                    {...props}\n                />\n            </span>\n        );\n    };\n}\n","import React, { Fragment } from 'react';\nimport { add as addToCartService } from '../Services/Cart.service';\nimport withReactiveStyleBuyButton from './withReactiveStyleBuyButton';\nimport { receive, loadError } from '../Actions/Cart.action';\nimport { catchError } from '../Actions/Error.action';\nimport { useDispatch } from 'react-redux';\n\nconst BuyButton = ({\n    label,\n    articleNumber,\n    quantityFieldId,\n    href,\n    cssClass,\n    onClick,\n}) => {\n        return (\n        <Fragment>\n            {articleNumber ? (\n                <a\n                    className={cssClass}\n                    onClick={(e) => {\n                        e.preventDefault();\n                        onClick({ articleNumber, quantityFieldId });\n                    }}\n                    href={href || '#'}\n                    rel=\"nofollow\"\n                >\n                    <span className='button__text'>{label} </span>\n                </a>\n            ) : (\n                <a className={cssClass} href={href}>\n                    <span className='button__text'>{label}</span>\n                </a>\n            )}\n        </Fragment>\n    );\n};\n\nconst StyledButton = (props) => {\n    const dispatch = useDispatch();\n    const onClick = async ({ articleNumber, quantityFieldId }) => {\n        try {\n            const quantity = quantityFieldId\n                ? document.getElementById(quantityFieldId).value\n                : 1;\n            const cart = await addToCartService({ articleNumber, quantity });\n            dispatch(receive(cart));\n            return true;\n        } catch (ex) {\n            dispatch(catchError(ex, (error) => loadError(error)));\n            return false;\n        }\n    };\n    const Button = withReactiveStyleBuyButton(BuyButton, onClick, 'buy-button');\n    return <Button {...props} />;\n};\n\nexport default StyledButton;\n","import React, { Component } from 'react';\nimport { waitForMetaPixelInitAndTrack } from '../utils';\n\nconst StateStyles = {\n    LOADING: \"--loading\",\n    SUCCESS: \"--success\",\n    ERROR: \"--error\",\n};\n\n/**\n * Represents a HOC which wraps a BuyButton or ReorderButton and applies diffrent styles to it\n * depending on its click state.\n * @param {*} WrappedComponent The button component.\n * @param {*} onClick The button's onClick event.\n * @param {*} stylePrefix The style prefix to append state's modifiers. For\n * example, 'button' will result as 'button--loading'.\n * \n * Some available props that the HOC component supports:\n * autoReset : it is true by default. Not its value, but the behaviour is like that. Unless people set it as false, by default, button is always reset to neutral state after the request is completed.\n * resetTimeout: Number milisecond after the complete state, the style of button will be reset. If don't set, it is 2000\n * minimumLoadingTime: Mininum milisecond to display the loading state. If don't set, it is 1000\n * onSuccess: callback if onClick method returns data\n * onError: callback if onClick method throws an exception\n */\nexport default function withReactiveStyleBuyButton(WrappedComponent, onClick, stylePrefix) {\n    return class extends Component {\n        constructor(props) {\n            super(props);\n            this.state = {\n                stateClass: '',\n                startTime: 0,\n            }\n        }\n\n        onNeutralState() {\n            this.setState({\n                stateClass: '',\n                startTime: 0,\n            });\n        }\n    \n        onLoadingState() {\n            this.setState({\n                stateClass: `${stylePrefix}${StateStyles.LOADING}`,\n                startTime: Date.now(),\n            });\n        }\n    \n        onCompleteState(success) {\n            const changeState = () => {\n                this.setState({\n                    stateClass: `${stylePrefix}${success ? StateStyles.SUCCESS : StateStyles.ERROR}`,\n                });\n                \n                if(success){\n                    setTimeout(() => {\n                        var cart = document.querySelector('#miniCart .icon');\n                        var active = document.querySelector('.cart__info.cart__info--hidden');\n                        if(cart != null){\n                            if(active){\n                            cart.click();\n                            }\n                        }\n                    }, 500);\n                }\n                // if `autoReset` is true, which is default, the style will be changed\n                // to neutral after a `resetTimeout` amount of time (2 seconds by default).\n                this.props.autoReset !== false && setTimeout(() => {\n                    this.onNeutralState();\n                }, this.props.resetTimeout || 2000);\n            }\n\n            const loadingDuration = Date.now() - this.state.startTime;\n            const minimumLoadingTime = this.props.minimumLoadingTime || 1000;\n            // ensure the loading indicator is displayed at least a `minimumLoadingTime`\n            // amount of time before changing it to Success or Error.\n            if (loadingDuration >= minimumLoadingTime) {\n                changeState();\n            } else {\n                setTimeout(() => {\n                    changeState();\n                }, minimumLoadingTime - loadingDuration);\n            }\n        }\n\n        async onButtonClick(params) {\n            try {\n                this.onLoadingState();\n                const data = await onClick(params);\n                if(data) {\n                    this.onCompleteState(true);\n                    this.props.onSuccess(data);\n                    if (this.props.isToggleCart) {\n                        this.props.toggleCart();\n                    }\n                    waitForMetaPixelInitAndTrack('AddToCart');\n                } else {\n                    this.onNeutralState();\n                }\n            } catch(err) {\n                this.onCompleteState(false);\n                this.props.onError(err);\n            }\n        }\n    \n        render() {\n            return (\n                <span className={this.state.stateClass}>\n                    <WrappedComponent onClick={(params) => this.onButtonClick(params)} {...this.props} />\n                </span>\n            );\n        }\n    }\n}","import React, { Component } from 'react';\nimport { connect } from 'react-redux';\nimport BuyButton from '../Components/BuyButton';\nimport { receive, loadError } from '../Actions/Cart.action';\nimport { catchError } from '../Actions/Error.action';\nimport { add as addToCartService} from '../Services/Cart.service';\nimport withReactiveStyleBuyButton from './withReactiveStyleBuyButton';\nimport { toggle } from '../Actions/Cart.action';\nclass BuyButtonContainer extends Component {\n    constructor(props) {\n        super(props);\n    }\n\n    render() {\n        return (\n            <BuyButton {...this.props}\n                onClick={(articleNumber, quantityFieldId) => this.props.onClick({ articleNumber, quantityFieldId })} />\n        );\n    }\n}\n\nconst mapStateToProps = state => {\n    return {\n        isToggleCart:true\n     }\n}\n\nconst mapDispatchToProps = dispatch => {\n    return {\n        onSuccess: (cart) => dispatch(receive(cart)),\n        onError: (ex) => dispatch(catchError(ex, error => loadError(error))),\n        toggleCart: () => dispatch(toggle())\n        \n    }\n}\n\nconst onClick = ({ articleNumber, quantityFieldId }) => {\n    const quantity = quantityFieldId ? document.getElementById(quantityFieldId).value : 1;\n    window.scrollTo({top: 0, left: 0, behavior: 'smooth'});\n    return addToCartService({ articleNumber, quantity });\n}\nexport default connect(mapStateToProps, mapDispatchToProps)(\n            withReactiveStyleBuyButton(BuyButtonContainer, onClick, 'button-container'));"],"sourceRoot":""}