{"version":3,"sources":["webpack:///./Scripts/Components/ProductInformationTabs.js","webpack:///./Scripts/Components/ProductInformationAccordion.js","webpack:///./Scripts/Containers/ProductPageTabsContainer.js"],"names":["props","productInformation","longdescription","technical","accessories","spareparts","manuals","media","isLoncin","value","setValue","React","showGeneralInformation","ariaProps","index","id","TabPanel","children","other","_extends","role","hidden","Box","sx","p","cleanHtml","dirtyHTML","DOMPurify","ADD_TAGS","ADD_ATTR","USE_PROFILES","html","columnClass","length","useEffect","placeholder","document","querySelector","remove","width","borderBottom","borderColor","Tabs","TabIndicatorProps","style","background","onChange","handleChange","event","newValue","Tab","icon","className","label","translate","dangerouslySetInnerHTML","__html","map","info","Title","Text","spec","i","key","ViewName","Value","video","accessory","sparepart","manual","href","Url","target","Filename","Accordion","AccordionSummary","expandIcon","ExpandMoreIcon","AccordionDetails","IsLargeScreen","useMediaQuery","ProductInformationTabs","ProductInformationAccordion"],"mappings":"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","file":"842.ffb9f5bf56afbca3529b.js","sourcesContent":["import React, { useEffect } from 'react';\nimport Tabs from '@mui/material/Tabs';\nimport Tab from '@mui/material/Tab';\nimport Typography from '@mui/material/Typography';\nimport Box from '@mui/material/Box';\nimport DOMPurify from 'dompurify';\nimport { translate } from '../Services/translation';\n\nconst ProductInformationTabs = (props) => {\n  const {\n    productInformation,\n    longdescription,\n    technical,\n    accessories,\n    spareparts,\n    manuals,\n    media,\n    isLoncin\n  } = props;\n  const [value, setValue] = React.useState(0);\n\n  const handleChange = (event, newValue) => {\n    setValue(newValue);\n  };\n\n  const showGeneralInformation = productInformation || longdescription;\n\n  const ariaProps = (index) => {\n    return {\n      id: `simple-tab-${index}`,\n      'aria-controls': `simple-tabpanel-${index}`,\n    };\n  };\n\n  function TabPanel(props) {\n    const { children, value, index, ...other } = props;\n    return (\n      <div\n        role=\"tabpanel\"\n        hidden={value !== index}\n        id={`simple-tabpanel-${index}`}\n        aria-labelledby={`simple-tab-${index}`}\n        {...other}\n      >\n        {value === index && <Box sx={{ p: 3 }}>{children}</Box>}\n      </div>\n    );\n  }\n\n  const cleanHtml = (dirtyHTML) => {\n    var cleaned = DOMPurify.sanitize(dirtyHTML, { ADD_TAGS: [\"iframe\"], ADD_ATTR: ['allow', 'allowfullscreen', 'frameborder', 'scrolling'] }, {\n      USE_PROFILES: { html: true, },\n    });\n    return cleaned;\n  };\n\n  const columnClass = media.length > 2 ? 'small-12' : 'small-12 large-6';\n\n  useEffect(() => {\n    const placeholder = document?.querySelector(\".product-information__tabs-placeholder\");\n    if(placeholder){\n        placeholder.remove();\n    }\n},[])\n\n  return (\n    <Box sx={{ width: '100%' }}>\n      <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>\n        <Tabs\n          TabIndicatorProps={{ style: { background: `${isLoncin ? '#E94F25' : '#F9BD08'}`} }}\n          value={value}\n          onChange={handleChange}\n          aria-label=\"Product Information\"\n        >\n          {showGeneralInformation && (\n            <Tab\n              value={0}\n              icon={<div className=\"icon-information\"></div>}\n              label={translate('productpage.info')}\n              {...ariaProps(0)}\n            />\n          )}\n          {technical && technical.length > 0 && (\n            <Tab\n              value={1}\n              icon={<div className=\"icon-technical\"></div>}\n              label={translate('productpage.technical')}\n              {...ariaProps(1)}\n            />\n          )}\n          {media &&  media.length > 0 && (\n            <Tab\n              value={2}\n              icon={<div className=\"icon-videos\"></div>}\n              label={translate('productpage.videos')}\n              {...ariaProps(2)}\n            />\n          )}\n          {accessories && accessories.length > 0 && (\n            <Tab\n              value={3}\n              icon={<div className=\"icon-package\"></div>}\n              label={translate('productpage.accessories')}\n              {...ariaProps(3)}\n            />\n          )}\n          {spareparts && spareparts.length > 0 && (\n            <Tab\n              value={4}\n              icon={<div className=\"icon-spare-parts\"></div>}\n              label={translate('productpage.spareparts')}\n              {...ariaProps(4)}\n            />\n          )}         \n          {manuals && manuals.length > 0 && (\n            <Tab\n              value={5}\n              icon={<div className=\"icon-pdf\"></div>}\n              label={translate('productpage.manuals')}\n              {...ariaProps(5)}\n            />\n          )}\n        </Tabs>\n      </Box>\n      {showGeneralInformation && (\n        <TabPanel value={value} index={0}>\n          {longdescription && (\n            <div\n              className=\"filter-modal__long-description\"\n              dangerouslySetInnerHTML={{ __html: cleanHtml(longdescription) }}\n            ></div>\n          )}\n          {productInformation &&\n            productInformation.map((info) => (\n              <>\n                {info.Title && info.Text && (\n                  <div\n                    className=\"faq-block__item\"\n                    data-title={info.Title}\n                    data-text={info.Text}\n                  ></div>\n                )}\n              </>\n            ))}\n        </TabPanel>\n      )}\n      {technical && (\n        <TabPanel value={value} index={1}>\n          <div className=\"product-page__tabs__field-list\">\n            {technical.map((spec, i) => (\n              <div key={'tech-' + i} className=\"small-12\">\n                <span className=\"small-6 caption-4\">{spec.ViewName}</span>\n                <span className=\"small-6\" dangerouslySetInnerHTML={{__html: cleanHtml(spec.Value)}}></span>\n              </div>\n            ))}\n          </div>\n        </TabPanel>\n      )}\n      {media && (\n        <TabPanel value={value} index={2}>\n          <div className=\"product-page__videos-container\">\n            <div className=\"product-page__videos-wrapper\">\n              {media.map((video, i) => (\n                <div\n                  key={'video-' + i}\n                  className={\n                    'product-page__videos-wrapper--videos ' +\n                    columnClass +\n                    ' columns'\n                  }\n                >\n                  <div\n                    className=\"video__embeded\"\n                    dangerouslySetInnerHTML={{ __html: video }}\n                  ></div>\n                </div>\n              ))}\n            </div>\n          </div>\n        </TabPanel>\n      )}\n      {accessories && (\n        <TabPanel value={value} index={3}>\n          {accessories.length > 0 && (\n            <ul className=\"row-products\">\n              {accessories.map((accessory, i) => (\n                <li\n                  key={'accessory-' + i}\n                  className=\"columns small-6 medium-4 large-3 product__container\"\n                  dangerouslySetInnerHTML={{\n                    __html: cleanHtml(accessory.children[0]),\n                  }}\n                ></li>\n              ))}\n            </ul>\n          )}\n        </TabPanel>\n      )}\n      {spareparts && (\n        <TabPanel value={value} index={4}>\n          {spareparts.length > 0 && (\n            <ul className=\"row-products\">\n              {spareparts.map((sparepart, i) => (\n                <li\n                  key={'spare-' + i}\n                  className=\"columns small-6 medium-4 large-3 product__container\"\n                  dangerouslySetInnerHTML={{\n                    __html: cleanHtml(sparepart.children[0]),\n                  }}\n                ></li>\n              ))}\n            </ul>\n          )}\n        </TabPanel>\n      )}\n      {manuals && (\n        <TabPanel value={value} index={5}>\n          <div className=\"product-page__tabs__manual-container\">\n            {manuals.map((manual, i) => (\n              <div\n                key={'tabmanual-' + i}\n                className=\"product-page__tabs__manual\"\n              >\n                <div className=\"icon-pdf\"></div>\n                <a href={manual.Url} target=\"_blank\">\n                  {manual.Filename}\n                </a>\n              </div>\n            ))}\n          </div>\n        </TabPanel>\n      )}\n    </Box>\n  );\n};\n\nexport default ProductInformationTabs;\n","import React, { useEffect } from 'react';\nimport Accordion from '@mui/material/Accordion';\nimport AccordionSummary from '@mui/material/AccordionSummary';\nimport AccordionDetails from '@mui/material/AccordionDetails';\nimport Typography from '@mui/material/Typography';\nimport Box from '@mui/material/Box';\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\nimport DOMPurify from 'dompurify';\nimport { translate } from '../Services/translation';\n\nconst ProductInformationAccordion = (props) => {\n  const {\n    productInformation,\n    longdescription,\n    technical,\n    manuals,\n    media,\n    accessories,\n    spareparts,\n  } = props;\n\n  const showGeneralInformation = productInformation || longdescription;\n\n  const cleanHtml = (dirtyHTML) => {\n    var cleaned = DOMPurify.sanitize(dirtyHTML, {\n      USE_PROFILES: { html: true },\n    });\n    return cleaned;\n  };\n\n  const columnClass = media.length > 2 ? 'small-12' : 'small-12 large-6';\n\n  useEffect(() => {\n    const placeholder = document?.querySelector(\n      '.product-information__tabs-placeholder'\n    );\n    if (placeholder) {\n      placeholder.remove();\n    }\n  }, []);\n\n  return (\n    <div className=\"product-page__accordion-wrapper\">\n      {showGeneralInformation && (\n        <Accordion>\n          <AccordionSummary\n            expandIcon={<ExpandMoreIcon />}\n            aria-controls=\"panel1a-content\"\n            id=\"panel1\"\n          >\n            <Box>\n              <div className=\"product-page__accordion__accordion-header\">\n                <div className=\"icon-information\"></div>\n                {translate('productpage.info')}\n              </div>\n            </Box>\n          </AccordionSummary>\n          <AccordionDetails>\n            <Box>\n              {longdescription && (\n                <div\n                  className=\"filter-modal__long-description\"\n                  dangerouslySetInnerHTML={{\n                    __html: cleanHtml(longdescription),\n                  }}\n                ></div>\n              )}\n              {productInformation &&\n                productInformation.map((info, i) => (\n                  <>\n                    {info.Title && info.Text && (\n                      <div\n                        className=\"faq-block__item\"\n                        data-title={info.Title}\n                        data-text={info.Text}\n                      ></div>\n                    )}\n                  </>\n                ))}\n            </Box>\n          </AccordionDetails>\n        </Accordion>\n      )}\n      {technical && technical.length > 0 && (\n        <Accordion>\n          <AccordionSummary\n            expandIcon={<ExpandMoreIcon />}\n            aria-controls=\"panel2-technical\"\n            id=\"panel2\"\n          >\n            <Box>\n              <div className=\"product-page__accordion__accordion-header\">\n                <div className=\"icon-technical\"></div>\n                {translate('productpage.technical')}\n              </div>\n            </Box>\n          </AccordionSummary>\n          <AccordionDetails>\n            <Box>\n              <div className=\"product-page__tabs__field-list\">\n                {technical.map((spec, i) => (\n                  <div className=\"small-12\">\n                    <span className=\"small-6 caption-4\">{spec.ViewName}</span>\n                    <span className=\"small-6\" dangerouslySetInnerHTML={{__html: cleanHtml(spec.Value)}}></span>\n                  </div>\n                ))}\n              </div>\n            </Box>\n          </AccordionDetails>\n        </Accordion>\n      )}\n      {media && media.length > 0 && (\n        <Accordion>\n          <AccordionSummary\n            expandIcon={<ExpandMoreIcon />}\n            aria-controls=\"panel3-media\"\n            id=\"panel3\"\n          >\n            <Box>\n              <div className=\"product-page__accordion__accordion-header\">\n                <div className=\"icon-videos\"></div>\n                {translate('productpage.videos')}\n              </div>\n            </Box>\n          </AccordionSummary>\n          <AccordionDetails>\n            <Box>\n              <div className=\"product-page__videos-container\">\n                <div className=\"product-page__videos-wrapper\">\n                  {media.map((video, i) => (\n                    <div\n                      className={\n                        'product-page__videos-wrapper--videos ' +\n                        columnClass +\n                        ' columns'\n                      }\n                    >\n                      <div\n                        className=\"video__embeded\"\n                        dangerouslySetInnerHTML={{ __html: video }}\n                      ></div>\n                    </div>\n                  ))}\n                </div>\n              </div>\n            </Box>\n          </AccordionDetails>\n        </Accordion>\n      )}\n      {accessories && accessories.length > 0 && (\n        <Accordion>\n          <AccordionSummary\n            expandIcon={<ExpandMoreIcon />}\n            aria-controls=\"panel4-accessories\"\n            id=\"panel4\"\n          >\n            <Box>\n              <div className=\"product-page__accordion__accordion-header\">\n                <div className=\"icon-package\"></div>\n                {translate('productpage.accessories')}\n              </div>\n            </Box>\n          </AccordionSummary>\n          <AccordionDetails>\n            <Box>\n              <ul className=\"row-products\">\n                {accessories.map((accessory, i) => (\n                  <li\n                    className=\"columns small-6 medium-4 large-3 product__container\"\n                    dangerouslySetInnerHTML={{\n                      __html: cleanHtml(accessory.children[0]),\n                    }}\n                  ></li>\n                ))}\n              </ul>\n            </Box>\n          </AccordionDetails>\n        </Accordion>\n      )}\n      {spareparts && spareparts.length > 0 && (\n        <Accordion>\n          <AccordionSummary\n            expandIcon={<ExpandMoreIcon />}\n            aria-controls=\"panel5-spareparts\"\n            id=\"panel5\"\n          >\n            <Box>\n              <div className=\"product-page__accordion__accordion-header\">\n                <div className=\"icon-spare-parts\"></div>\n                {translate('productpage.spareparts')}\n              </div>\n            </Box>\n          </AccordionSummary>\n          <AccordionDetails>\n            <Box>\n              <ul className=\"row-products\">\n                {spareparts.map((sparepart, i) => (\n                  <li\n                    className=\"columns small-6 medium-4 large-3 product__container\"\n                    dangerouslySetInnerHTML={{\n                      __html: cleanHtml(sparepart.children[0]),\n                    }}\n                  ></li>\n                ))}\n              </ul>\n            </Box>\n          </AccordionDetails>\n        </Accordion>\n      )}\n      {manuals && manuals.length > 0 && (\n        <Accordion>\n          <AccordionSummary\n            expandIcon={<ExpandMoreIcon />}\n            aria-controls=\"panel6-manuals\"\n            id=\"panel6\"\n          >\n            <Box>\n              <div className=\"product-page__accordion__accordion-header\">\n                <div className=\"icon-pdf\"></div>\n                {translate('productpage.manuals')}\n              </div>\n            </Box>\n          </AccordionSummary>\n          <AccordionDetails>\n            <Box>\n              <div className=\"product-page__tabs__manual-container\">\n                {manuals &&\n                  manuals.map((manual) => (\n                    <div className=\"product-page__tabs__manual\">\n                      <div className=\"icon-pdf\"></div>\n                      <a href={manual.Url} target=\"_blank\">\n                        {manual.Filename}\n                      </a>\n                    </div>\n                  ))}\n              </div>\n            </Box>\n          </AccordionDetails>\n        </Accordion>\n      )}\n    </div>\n  );\n};\n\nexport default ProductInformationAccordion;\n","import React from 'react';\nimport useMediaQuery from '@mui/material/useMediaQuery';\nimport ProductInformationTabs from '../Components/ProductInformationTabs';\nimport ProductInformationAccordion from '../Components/ProductInformationAccordion';\n\nconst ProductPageTabsContainer = (props) => {\n  const IsLargeScreen = useMediaQuery('(min-width:1024px)'); //Accordion for 1024 and smaller, tabs for larger\n\n  return (\n    <>\n      {IsLargeScreen ? (\n        <ProductInformationTabs {...props} />\n      ) : (\n        <ProductInformationAccordion {...props} />\n      )}\n    </>\n  );\n};\n\nexport default ProductPageTabsContainer;\n"],"sourceRoot":""}