tbg-ecomm-nextjs/.next/cache/next-babel-loader/894ddf66df331714a8dd501ba2d75b25.json

{"ast":null,"code":"var _jsxFileName = \"E:\\\\Project\\\\tbg-ecomm-nextjs\\\\components\\\\Header\\\\Header.js\";\nvar __jsx = React.createElement;\nimport React from \"react\";\nimport Link from \"next/link\"; // nodejs library that concatenates classes\n\nimport classNames from \"classnames\"; // nodejs library to set properties for components\n\nimport PropTypes from \"prop-types\"; // @material-ui/core components\n\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport AppBar from \"@material-ui/core/AppBar\";\nimport Toolbar from \"@material-ui/core/Toolbar\";\nimport IconButton from \"@material-ui/core/IconButton\";\nimport Button from \"@material-ui/core/Button\";\nimport Hidden from \"@material-ui/core/Hidden\";\nimport Drawer from \"@material-ui/core/Drawer\"; // @material-ui/icons\n\nimport Menu from \"@material-ui/icons/Menu\"; // core components\n\nimport styles from \"assets/jss/nextjs-material-kit/components/headerStyle.js\";\nconst useStyles = makeStyles(styles);\nexport default function Header(props) {\n  const classes = useStyles();\n  const [mobileOpen, setMobileOpen] = React.useState(false);\n  React.useEffect(() => {\n    if (props.changeColorOnScroll) {\n      window.addEventListener(\"scroll\", headerColorChange);\n    }\n\n    return function cleanup() {\n      if (props.changeColorOnScroll) {\n        window.removeEventListener(\"scroll\", headerColorChange);\n      }\n    };\n  });\n\n  const handleDrawerToggle = () => {\n    setMobileOpen(!mobileOpen);\n  };\n\n  const headerColorChange = () => {\n    const {\n      color,\n      changeColorOnScroll\n    } = props;\n    const windowsScrollTop = window.pageYOffset;\n\n    if (windowsScrollTop > changeColorOnScroll.height) {\n      document.body.getElementsByTagName(\"header\")[0].classList.remove(classes[color]);\n      document.body.getElementsByTagName(\"header\")[0].classList.add(classes[changeColorOnScroll.color]);\n    } else {\n      document.body.getElementsByTagName(\"header\")[0].classList.add(classes[color]);\n      document.body.getElementsByTagName(\"header\")[0].classList.remove(classes[changeColorOnScroll.color]);\n    }\n  };\n\n  const {\n    color,\n    rightLinks,\n    leftLinks,\n    brand,\n    fixed,\n    absolute\n  } = props;\n  const appBarClasses = classNames({\n    [classes.appBar]: true,\n    [classes[color]]: color,\n    [classes.absolute]: absolute,\n    [classes.fixed]: fixed\n  });\n\n  const brandComponent = __jsx(Link, {\n    href: \"/components\",\n    as: \"/components\",\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 65,\n      columnNumber: 5\n    }\n  }, __jsx(Button, {\n    className: classes.title,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 66,\n      columnNumber: 7\n    }\n  }, brand));\n\n  return __jsx(AppBar, {\n    className: appBarClasses,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 71,\n      columnNumber: 5\n    }\n  }, __jsx(Toolbar, {\n    className: classes.container,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 72,\n      columnNumber: 7\n    }\n  }, leftLinks !== undefined ? brandComponent : null, __jsx(\"div\", {\n    className: classes.flex,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 74,\n      columnNumber: 9\n    }\n  }, leftLinks !== undefined ? __jsx(Hidden, {\n    smDown: true,\n    implementation: \"css\",\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 76,\n      columnNumber: 13\n    }\n  }, leftLinks) : brandComponent), __jsx(Hidden, {\n    smDown: true,\n    implementation: \"css\",\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 83,\n      columnNumber: 9\n    }\n  }, rightLinks), __jsx(Hidden, {\n    mdUp: true,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 86,\n      columnNumber: 9\n    }\n  }, __jsx(IconButton, {\n    color: \"inherit\",\n    \"aria-label\": \"open drawer\",\n    onClick: handleDrawerToggle,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 87,\n      columnNumber: 11\n    }\n  }, __jsx(Menu, {\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 92,\n      columnNumber: 13\n    }\n  })))), __jsx(Hidden, {\n    mdUp: true,\n    implementation: \"js\",\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 96,\n      columnNumber: 7\n    }\n  }, __jsx(Drawer, {\n    variant: \"temporary\",\n    anchor: \"right\",\n    open: mobileOpen,\n    classes: {\n      paper: classes.drawerPaper\n    },\n    onClose: handleDrawerToggle,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 97,\n      columnNumber: 9\n    }\n  }, __jsx(\"div\", {\n    className: classes.appResponsive,\n    __self: this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 106,\n      columnNumber: 11\n    }\n  }, leftLinks, rightLinks))));\n}\nHeader.defaultProp = {\n  color: \"black\"\n};\nHeader.propTypes = {\n  color: PropTypes.oneOf([\"primary\", \"info\", \"success\", \"warning\", \"danger\", \"transparent\", \"white\", \"rose\", \"dark\"]),\n  rightLinks: PropTypes.node,\n  leftLinks: PropTypes.node,\n  brand: PropTypes.string,\n  fixed: PropTypes.bool,\n  absolute: PropTypes.bool,\n  // this will cause the sidebar to change the color from\n  // props.color (see above) to changeColorOnScroll.color\n  // when the window.pageYOffset is heigher or equal to\n  // changeColorOnScroll.height and then when it is smaller than\n  // changeColorOnScroll.height change it back to\n  // props.color (see above)\n  changeColorOnScroll: PropTypes.shape({\n    height: PropTypes.number.isRequired,\n    color: PropTypes.oneOf([\"primary\", \"info\", \"success\", \"warning\", \"danger\", \"transparent\", \"white\", \"rose\", \"dark\"]).isRequired\n  })\n};","map":{"version":3,"sources":["E:/Project/tbg-ecomm-nextjs/components/Header/Header.js"],"names":["React","Link","classNames","PropTypes","makeStyles","AppBar","Toolbar","IconButton","Button","Hidden","Drawer","Menu","styles","useStyles","Header","props","classes","mobileOpen","setMobileOpen","useState","useEffect","changeColorOnScroll","window","addEventListener","headerColorChange","cleanup","removeEventListener","handleDrawerToggle","color","windowsScrollTop","pageYOffset","height","document","body","getElementsByTagName","classList","remove","add","rightLinks","leftLinks","brand","fixed","absolute","appBarClasses","appBar","brandComponent","title","container","undefined","flex","paper","drawerPaper","appResponsive","defaultProp","propTypes","oneOf","node","string","bool","shape","number","isRequired"],"mappings":"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","sourcesContent":["import React from \"react\";\r\nimport Link from \"next/link\";\r\n// nodejs library that concatenates classes\r\nimport classNames from \"classnames\";\r\n// nodejs library to set properties for components\r\nimport PropTypes from \"prop-types\";\r\n// @material-ui/core components\r\nimport { makeStyles } from \"@material-ui/core/styles\";\r\nimport AppBar from \"@material-ui/core/AppBar\";\r\nimport Toolbar from \"@material-ui/core/Toolbar\";\r\nimport IconButton from \"@material-ui/core/IconButton\";\r\nimport Button from \"@material-ui/core/Button\";\r\nimport Hidden from \"@material-ui/core/Hidden\";\r\nimport Drawer from \"@material-ui/core/Drawer\";\r\n// @material-ui/icons\r\nimport Menu from \"@material-ui/icons/Menu\";\r\n// core components\r\nimport styles from \"assets/jss/nextjs-material-kit/components/headerStyle.js\";\r\n\r\nconst useStyles = makeStyles(styles);\r\n\r\nexport default function Header(props) {\r\n  const classes = useStyles();\r\n  const [mobileOpen, setMobileOpen] = React.useState(false);\r\n  React.useEffect(() => {\r\n    if (props.changeColorOnScroll) {\r\n      window.addEventListener(\"scroll\", headerColorChange);\r\n    }\r\n    return function cleanup() {\r\n      if (props.changeColorOnScroll) {\r\n        window.removeEventListener(\"scroll\", headerColorChange);\r\n      }\r\n    };\r\n  });\r\n  const handleDrawerToggle = () => {\r\n    setMobileOpen(!mobileOpen);\r\n  };\r\n  const headerColorChange = () => {\r\n    const { color, changeColorOnScroll } = props;\r\n    const windowsScrollTop = window.pageYOffset;\r\n    if (windowsScrollTop > changeColorOnScroll.height) {\r\n      document.body\r\n        .getElementsByTagName(\"header\")[0]\r\n        .classList.remove(classes[color]);\r\n      document.body\r\n        .getElementsByTagName(\"header\")[0]\r\n        .classList.add(classes[changeColorOnScroll.color]);\r\n    } else {\r\n      document.body\r\n        .getElementsByTagName(\"header\")[0]\r\n        .classList.add(classes[color]);\r\n      document.body\r\n        .getElementsByTagName(\"header\")[0]\r\n        .classList.remove(classes[changeColorOnScroll.color]);\r\n    }\r\n  };\r\n  const { color, rightLinks, leftLinks, brand, fixed, absolute } = props;\r\n  const appBarClasses = classNames({\r\n    [classes.appBar]: true,\r\n    [classes[color]]: color,\r\n    [classes.absolute]: absolute,\r\n    [classes.fixed]: fixed,\r\n  });\r\n  const brandComponent = (\r\n    <Link href=\"/components\" as=\"/components\">\r\n      <Button className={classes.title}>{brand}</Button>\r\n      {/* <img src=\"assets/img/ymhthamrin.png\"/> */}\r\n    </Link>\r\n  );\r\n  return (\r\n    <AppBar className={appBarClasses}>\r\n      <Toolbar className={classes.container}>\r\n        {leftLinks !== undefined ? brandComponent : null}\r\n        <div className={classes.flex}>\r\n          {leftLinks !== undefined ? (\r\n            <Hidden smDown implementation=\"css\">\r\n              {leftLinks}\r\n            </Hidden>\r\n          ) : (\r\n            brandComponent\r\n          )}\r\n        </div>\r\n        <Hidden smDown implementation=\"css\">\r\n          {rightLinks}\r\n        </Hidden>\r\n        <Hidden mdUp>\r\n          <IconButton\r\n            color=\"inherit\"\r\n            aria-label=\"open drawer\"\r\n            onClick={handleDrawerToggle}\r\n          >\r\n            <Menu />\r\n          </IconButton>\r\n        </Hidden>\r\n      </Toolbar>\r\n      <Hidden mdUp implementation=\"js\">\r\n        <Drawer\r\n          variant=\"temporary\"\r\n          anchor={\"right\"}\r\n          open={mobileOpen}\r\n          classes={{\r\n            paper: classes.drawerPaper,\r\n          }}\r\n          onClose={handleDrawerToggle}\r\n        >\r\n          <div className={classes.appResponsive}>\r\n            {leftLinks}\r\n            {rightLinks}\r\n          </div>\r\n        </Drawer>\r\n      </Hidden>\r\n    </AppBar>\r\n  );\r\n}\r\n\r\nHeader.defaultProp = {\r\n  color: \"black\",\r\n};\r\n\r\nHeader.propTypes = {\r\n  color: PropTypes.oneOf([\r\n    \"primary\",\r\n    \"info\",\r\n    \"success\",\r\n    \"warning\",\r\n    \"danger\",\r\n    \"transparent\",\r\n    \"white\",\r\n    \"rose\",\r\n    \"dark\",\r\n  ]),\r\n  rightLinks: PropTypes.node,\r\n  leftLinks: PropTypes.node,\r\n  brand: PropTypes.string,\r\n  fixed: PropTypes.bool,\r\n  absolute: PropTypes.bool,\r\n  // this will cause the sidebar to change the color from\r\n  // props.color (see above) to changeColorOnScroll.color\r\n  // when the window.pageYOffset is heigher or equal to\r\n  // changeColorOnScroll.height and then when it is smaller than\r\n  // changeColorOnScroll.height change it back to\r\n  // props.color (see above)\r\n  changeColorOnScroll: PropTypes.shape({\r\n    height: PropTypes.number.isRequired,\r\n    color: PropTypes.oneOf([\r\n      \"primary\",\r\n      \"info\",\r\n      \"success\",\r\n      \"warning\",\r\n      \"danger\",\r\n      \"transparent\",\r\n      \"white\",\r\n      \"rose\",\r\n      \"dark\",\r\n    ]).isRequired,\r\n  }),\r\n};\r\n"]},"metadata":{},"sourceType":"module"}