| 1 |
- {"ast":null,"code":"var _jsxFileName = \"/Users/holunyeung/Documents/GitHub/Photo_React/photo/src/SearchBar.js\";\nimport React from 'react';\nimport clsx from 'clsx';\nimport { makeStyles, useTheme } from '@material-ui/core/styles';\nimport Drawer from '@material-ui/core/Drawer';\nimport AppBar from '@material-ui/core/AppBar';\nimport Toolbar from '@material-ui/core/Toolbar';\nimport List from '@material-ui/core/List';\nimport CssBaseline from '@material-ui/core/CssBaseline';\nimport Typography from '@material-ui/core/Typography';\nimport Divider from '@material-ui/core/Divider';\nimport IconButton from '@material-ui/core/IconButton';\nimport MenuIcon from '@material-ui/icons/Menu';\nimport ChevronLeftIcon from '@material-ui/icons/ChevronLeft';\nimport ChevronRightIcon from '@material-ui/icons/ChevronRight';\nimport ListItem from '@material-ui/core/ListItem';\nimport ListItemIcon from '@material-ui/core/ListItemIcon';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport InboxIcon from '@material-ui/icons/MoveToInbox';\nimport MailIcon from '@material-ui/icons/Mail';\nimport ImageList from './ImageList';\nimport PhotoIcon from '@material-ui/icons/Photo';\nimport ShareIcon from '@material-ui/icons/Share';\nimport PhotoAlbumIcon from '@material-ui/icons/PhotoAlbum';\nimport LibraryAddCheckIcon from '@material-ui/icons/LibraryAddCheck';\nimport Badge from '@material-ui/core/Badge';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport Menu from '@material-ui/core/Menu';\nimport NotificationsIcon from '@material-ui/icons/Notifications';\nconst drawerWidth = 240;\nconst useStyles = makeStyles(theme => ({\n root: {\n display: 'flex'\n },\n appBar: {\n zIndex: theme.zIndex.drawer + 1,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen\n })\n },\n appBarShift: {\n marginLeft: drawerWidth,\n width: `calc(100% - ${drawerWidth}px)`,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen\n })\n },\n menuButton: {\n marginRight: 36\n },\n hide: {\n display: 'none'\n },\n drawer: {\n width: drawerWidth,\n flexShrink: 0,\n whiteSpace: 'nowrap'\n },\n drawerOpen: {\n width: drawerWidth,\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen\n })\n },\n drawerClose: {\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen\n }),\n overflowX: 'hidden',\n width: theme.spacing(7) + 1,\n [theme.breakpoints.up('sm')]: {\n width: theme.spacing(9) + 1\n }\n },\n toolbar: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n padding: theme.spacing(0, 1),\n // necessary for content to be below app bar\n ...theme.mixins.toolbar\n },\n content: {\n flexGrow: 1,\n padding: theme.spacing(3)\n }\n}));\nconst [anchorEl, setAnchorEl] = React.useState(null);\nconst [mobileMoreAnchorEl, setMobileMoreAnchorEl] = React.useState(null);\nconst isMenuOpen = Boolean(anchorEl);\nconst isMobileMenuOpen = Boolean(mobileMoreAnchorEl);\n\nconst handleMobileMenuClose = () => {\n setMobileMoreAnchorEl(null);\n};\n\nconst handleMenuClose = () => {\n setAnchorEl(null);\n handleMobileMenuClose();\n};\n\nconst handleProfileMenuOpen = event => {\n setAnchorEl(event.currentTarget);\n};\n\nexport default function MiniDrawer() {\n const classes = useStyles();\n const theme = useTheme();\n const [open, setOpen] = React.useState(false);\n\n const handleDrawerOpen = () => {\n setOpen(true);\n };\n\n const handleDrawerClose = () => {\n setOpen(false);\n };\n\n const menuId = 'primary-search-account-menu';\n const renderMenu = /*#__PURE__*/React.createElement(Menu, {\n anchorEl: anchorEl,\n anchorOrigin: {\n vertical: 'top',\n horizontal: 'right'\n },\n id: menuId,\n keepMounted: true,\n transformOrigin: {\n vertical: 'top',\n horizontal: 'right'\n },\n open: isMenuOpen,\n onClose: handleMenuClose,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 129,\n columnNumber: 26\n }\n }, /*#__PURE__*/React.createElement(MenuItem, {\n onClick: handleMenuClose,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 140,\n columnNumber: 9\n }\n }, \" Profile \"), \" \", /*#__PURE__*/React.createElement(MenuItem, {\n onClick: handleMenuClose,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 141,\n columnNumber: 71\n }\n }, \" My account \"), \" \");\n const mobileMenuId = 'primary-search-account-menu-mobile';\n const renderMobileMenu = /*#__PURE__*/React.createElement(Menu, {\n anchorEl: mobileMoreAnchorEl,\n anchorOrigin: {\n vertical: 'top',\n horizontal: 'right'\n },\n id: mobileMenuId,\n keepMounted: true,\n transformOrigin: {\n vertical: 'top',\n horizontal: 'right'\n },\n open: isMobileMenuOpen,\n onClose: handleMobileMenuClose,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 147,\n columnNumber: 32\n }\n }, /*#__PURE__*/React.createElement(MenuItem, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 158,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(IconButton, {\n color: \"inherit\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 160,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(Badge, {\n badgeContent: 4,\n color: \"secondary\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 162,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(MailIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 165,\n columnNumber: 9\n }\n })), \" \"), \" \", /*#__PURE__*/React.createElement(\"p\", {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 169,\n columnNumber: 22\n }\n }, \" Messages \"), \" \"), \" \", /*#__PURE__*/React.createElement(MenuItem, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 171,\n columnNumber: 20\n }\n }, /*#__PURE__*/React.createElement(IconButton, {\n color: \"inherit\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 173,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(Badge, {\n badgeContent: 11,\n color: \"secondary\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 175,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(NotificationsIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 178,\n columnNumber: 9\n }\n })), \" \"), \" \", /*#__PURE__*/React.createElement(\"p\", {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 182,\n columnNumber: 22\n }\n }, \" Notifications \"), \" \"), \" \", /*#__PURE__*/React.createElement(MenuItem, {\n onClick: handleProfileMenuOpen,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 184,\n columnNumber: 20\n }\n }, /*#__PURE__*/React.createElement(IconButton, {\n color: \"inherit\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 186,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(AccountCircle, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 188,\n columnNumber: 9\n }\n })), \" \", /*#__PURE__*/React.createElement(\"p\", {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 191,\n columnNumber: 22\n }\n }, \" Profile \"), \" \"), \" \");\n return /*#__PURE__*/React.createElement(\"div\", {\n className: classes.root,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 197,\n columnNumber: 14\n }\n }, /*#__PURE__*/React.createElement(CssBaseline, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 199,\n columnNumber: 9\n }\n }), /*#__PURE__*/React.createElement(AppBar, {\n position: \"fixed\",\n className: clsx(classes.appBar, {\n [classes.appBarShift]: open\n }),\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 201,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(Toolbar, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 208,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(IconButton, {\n color: \"inherit\",\n onClick: handleDrawerOpen,\n edge: \"start\",\n className: clsx(classes.menuButton, {\n [classes.hide]: open\n }),\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 210,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(MenuIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 219,\n columnNumber: 9\n }\n })), \" \", /*#__PURE__*/React.createElement(Typography, {\n variant: \"h6\",\n noWrap: true,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 222,\n columnNumber: 22\n }\n }, \"\\u8C37\\u72D7\\u76F8\\u8584 \"), \" \", /*#__PURE__*/React.createElement(IconButton, {\n \"aria-label\": \"show 4 new mails\",\n color: \"inherit\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 226,\n columnNumber: 22\n }\n }, \" \", /*#__PURE__*/React.createElement(Badge, {\n badgeContent: 4,\n color: \"secondary\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 226,\n columnNumber: 81\n }\n }, /*#__PURE__*/React.createElement(MailIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 229,\n columnNumber: 9\n }\n })), \" \"), \" \"), \" \"), \" \", renderMobileMenu, \" \", renderMenu, \" \", /*#__PURE__*/React.createElement(Drawer, {\n variant: \"permanent\",\n className: clsx(classes.drawer, {\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open\n }),\n classes: {\n paper: clsx({\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open\n })\n },\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 235,\n columnNumber: 52\n }\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: classes.toolbar,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 251,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(IconButton, {\n onClick: handleDrawerClose,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 253,\n columnNumber: 9\n }\n }, \" \", theme.direction === 'rtl' ? /*#__PURE__*/React.createElement(ChevronRightIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 254,\n columnNumber: 84\n }\n }) : /*#__PURE__*/React.createElement(ChevronLeftIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 254,\n columnNumber: 109\n }\n }), \" \"), \" \"), \" \", /*#__PURE__*/React.createElement(Divider, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 256,\n columnNumber: 15\n }\n }), /*#__PURE__*/React.createElement(List, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 258,\n columnNumber: 9\n }\n }, \" \", ['相片', '共享', '相簿', '實用工具'].map((text, index) => /*#__PURE__*/React.createElement(ListItem, {\n button: true,\n key: text,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 260,\n columnNumber: 63\n }\n }, /*#__PURE__*/React.createElement(ListItemIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 262,\n columnNumber: 17\n }\n }, \" \", index == 0 ? /*#__PURE__*/React.createElement(PhotoIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 263,\n columnNumber: 47\n }\n }) : index == 1 ? /*#__PURE__*/React.createElement(ShareIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 263,\n columnNumber: 78\n }\n }) : index == 2 ? /*#__PURE__*/React.createElement(PhotoAlbumIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 263,\n columnNumber: 109\n }\n }) : /*#__PURE__*/React.createElement(LibraryAddCheckIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 263,\n columnNumber: 132\n }\n }), \" \"), \" \", /*#__PURE__*/React.createElement(ListItemText, {\n primary: text,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 263,\n columnNumber: 177\n }\n }), \" \")), \" \"), \" \"), \" \", /*#__PURE__*/React.createElement(\"main\", {\n className: classes.content,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 270,\n columnNumber: 18\n }\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: classes.toolbar,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 272,\n columnNumber: 9\n }\n }), \" \", /*#__PURE__*/React.createElement(ImageList, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 274,\n columnNumber: 12\n }\n }), \" \"), \" \");\n}","map":{"version":3,"sources":["/Users/holunyeung/Documents/GitHub/Photo_React/photo/src/SearchBar.js"],"names":["React","clsx","makeStyles","useTheme","Drawer","AppBar","Toolbar","List","CssBaseline","Typography","Divider","IconButton","MenuIcon","ChevronLeftIcon","ChevronRightIcon","ListItem","ListItemIcon","ListItemText","InboxIcon","MailIcon","ImageList","PhotoIcon","ShareIcon","PhotoAlbumIcon","LibraryAddCheckIcon","Badge","MenuItem","Menu","NotificationsIcon","drawerWidth","useStyles","theme","root","display","appBar","zIndex","drawer","transition","transitions","create","easing","sharp","duration","leavingScreen","appBarShift","marginLeft","width","enteringScreen","menuButton","marginRight","hide","flexShrink","whiteSpace","drawerOpen","drawerClose","overflowX","spacing","breakpoints","up","toolbar","alignItems","justifyContent","padding","mixins","content","flexGrow","anchorEl","setAnchorEl","useState","mobileMoreAnchorEl","setMobileMoreAnchorEl","isMenuOpen","Boolean","isMobileMenuOpen","handleMobileMenuClose","handleMenuClose","handleProfileMenuOpen","event","currentTarget","MiniDrawer","classes","open","setOpen","handleDrawerOpen","handleDrawerClose","menuId","renderMenu","vertical","horizontal","mobileMenuId","renderMobileMenu","paper","direction","map","text","index"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,IAAP,MAAiB,MAAjB;AACA,SAASC,UAAT,EAAqBC,QAArB,QAAqC,0BAArC;AACA,OAAOC,MAAP,MAAmB,0BAAnB;AACA,OAAOC,MAAP,MAAmB,0BAAnB;AACA,OAAOC,OAAP,MAAoB,2BAApB;AACA,OAAOC,IAAP,MAAiB,wBAAjB;AACA,OAAOC,WAAP,MAAwB,+BAAxB;AACA,OAAOC,UAAP,MAAuB,8BAAvB;AACA,OAAOC,OAAP,MAAoB,2BAApB;AACA,OAAOC,UAAP,MAAuB,8BAAvB;AACA,OAAOC,QAAP,MAAqB,yBAArB;AACA,OAAOC,eAAP,MAA4B,gCAA5B;AACA,OAAOC,gBAAP,MAA6B,iCAA7B;AACA,OAAOC,QAAP,MAAqB,4BAArB;AACA,OAAOC,YAAP,MAAyB,gCAAzB;AACA,OAAOC,YAAP,MAAyB,gCAAzB;AACA,OAAOC,SAAP,MAAsB,gCAAtB;AACA,OAAOC,QAAP,MAAqB,yBAArB;AACA,OAAOC,SAAP,MAAsB,aAAtB;AACA,OAAOC,SAAP,MAAsB,0BAAtB;AACA,OAAOC,SAAP,MAAsB,0BAAtB;AACA,OAAOC,cAAP,MAA2B,+BAA3B;AACA,OAAOC,mBAAP,MAAgC,oCAAhC;AACA,OAAOC,KAAP,MAAkB,yBAAlB;AACA,OAAOC,QAAP,MAAqB,4BAArB;AACA,OAAOC,IAAP,MAAiB,wBAAjB;AACA,OAAOC,iBAAP,MAA8B,kCAA9B;AAGA,MAAMC,WAAW,GAAG,GAApB;AAEA,MAAMC,SAAS,GAAG5B,UAAU,CAAE6B,KAAD,KAAY;AACrCC,EAAAA,IAAI,EAAE;AACFC,IAAAA,OAAO,EAAE;AADP,GAD+B;AAIrCC,EAAAA,MAAM,EAAE;AACJC,IAAAA,MAAM,EAAEJ,KAAK,CAACI,MAAN,CAAaC,MAAb,GAAsB,CAD1B;AAEJC,IAAAA,UAAU,EAAEN,KAAK,CAACO,WAAN,CAAkBC,MAAlB,CAAyB,CAAC,OAAD,EAAU,QAAV,CAAzB,EAA8C;AACtDC,MAAAA,MAAM,EAAET,KAAK,CAACO,WAAN,CAAkBE,MAAlB,CAAyBC,KADqB;AAEtDC,MAAAA,QAAQ,EAAEX,KAAK,CAACO,WAAN,CAAkBI,QAAlB,CAA2BC;AAFiB,KAA9C;AAFR,GAJ6B;AAWrCC,EAAAA,WAAW,EAAE;AACTC,IAAAA,UAAU,EAAEhB,WADH;AAETiB,IAAAA,KAAK,EAAG,eAAcjB,WAAY,KAFzB;AAGTQ,IAAAA,UAAU,EAAEN,KAAK,CAACO,WAAN,CAAkBC,MAAlB,CAAyB,CAAC,OAAD,EAAU,QAAV,CAAzB,EAA8C;AACtDC,MAAAA,MAAM,EAAET,KAAK,CAACO,WAAN,CAAkBE,MAAlB,CAAyBC,KADqB;AAEtDC,MAAAA,QAAQ,EAAEX,KAAK,CAACO,WAAN,CAAkBI,QAAlB,CAA2BK;AAFiB,KAA9C;AAHH,GAXwB;AAmBrCC,EAAAA,UAAU,EAAE;AACRC,IAAAA,WAAW,EAAE;AADL,GAnByB;AAsBrCC,EAAAA,IAAI,EAAE;AACFjB,IAAAA,OAAO,EAAE;AADP,GAtB+B;AAyBrCG,EAAAA,MAAM,EAAE;AACJU,IAAAA,KAAK,EAAEjB,WADH;AAEJsB,IAAAA,UAAU,EAAE,CAFR;AAGJC,IAAAA,UAAU,EAAE;AAHR,GAzB6B;AA8BrCC,EAAAA,UAAU,EAAE;AACRP,IAAAA,KAAK,EAAEjB,WADC;AAERQ,IAAAA,UAAU,EAAEN,KAAK,CAACO,WAAN,CAAkBC,MAAlB,CAAyB,OAAzB,EAAkC;AAC1CC,MAAAA,MAAM,EAAET,KAAK,CAACO,WAAN,CAAkBE,MAAlB,CAAyBC,KADS;AAE1CC,MAAAA,QAAQ,EAAEX,KAAK,CAACO,WAAN,CAAkBI,QAAlB,CAA2BK;AAFK,KAAlC;AAFJ,GA9ByB;AAqCrCO,EAAAA,WAAW,EAAE;AACTjB,IAAAA,UAAU,EAAEN,KAAK,CAACO,WAAN,CAAkBC,MAAlB,CAAyB,OAAzB,EAAkC;AAC1CC,MAAAA,MAAM,EAAET,KAAK,CAACO,WAAN,CAAkBE,MAAlB,CAAyBC,KADS;AAE1CC,MAAAA,QAAQ,EAAEX,KAAK,CAACO,WAAN,CAAkBI,QAAlB,CAA2BC;AAFK,KAAlC,CADH;AAKTY,IAAAA,SAAS,EAAE,QALF;AAMTT,IAAAA,KAAK,EAAEf,KAAK,CAACyB,OAAN,CAAc,CAAd,IAAmB,CANjB;AAOT,KAACzB,KAAK,CAAC0B,WAAN,CAAkBC,EAAlB,CAAqB,IAArB,CAAD,GAA8B;AAC1BZ,MAAAA,KAAK,EAAEf,KAAK,CAACyB,OAAN,CAAc,CAAd,IAAmB;AADA;AAPrB,GArCwB;AAgDrCG,EAAAA,OAAO,EAAE;AACL1B,IAAAA,OAAO,EAAE,MADJ;AAEL2B,IAAAA,UAAU,EAAE,QAFP;AAGLC,IAAAA,cAAc,EAAE,UAHX;AAILC,IAAAA,OAAO,EAAE/B,KAAK,CAACyB,OAAN,CAAc,CAAd,EAAiB,CAAjB,CAJJ;AAKL;AACA,OAAGzB,KAAK,CAACgC,MAAN,CAAaJ;AANX,GAhD4B;AAwDrCK,EAAAA,OAAO,EAAE;AACLC,IAAAA,QAAQ,EAAE,CADL;AAELH,IAAAA,OAAO,EAAE/B,KAAK,CAACyB,OAAN,CAAc,CAAd;AAFJ;AAxD4B,CAAZ,CAAD,CAA5B;AA6DA,MAAM,CAACU,QAAD,EAAWC,WAAX,IAA0BnE,KAAK,CAACoE,QAAN,CAAe,IAAf,CAAhC;AACA,MAAM,CAACC,kBAAD,EAAqBC,qBAArB,IAA8CtE,KAAK,CAACoE,QAAN,CAAe,IAAf,CAApD;AAEA,MAAMG,UAAU,GAAGC,OAAO,CAACN,QAAD,CAA1B;AACA,MAAMO,gBAAgB,GAAGD,OAAO,CAACH,kBAAD,CAAhC;;AACA,MAAMK,qBAAqB,GAAG,MAAM;AAChCJ,EAAAA,qBAAqB,CAAC,IAAD,CAArB;AACH,CAFD;;AAIA,MAAMK,eAAe,GAAG,MAAM;AAC1BR,EAAAA,WAAW,CAAC,IAAD,CAAX;AACAO,EAAAA,qBAAqB;AACxB,CAHD;;AAKA,MAAME,qBAAqB,GAAIC,KAAD,IAAW;AACrCV,EAAAA,WAAW,CAACU,KAAK,CAACC,aAAP,CAAX;AACH,CAFD;;AAMA,eAAe,SAASC,UAAT,GAAsB;AACjC,QAAMC,OAAO,GAAGlD,SAAS,EAAzB;AACA,QAAMC,KAAK,GAAG5B,QAAQ,EAAtB;AACA,QAAM,CAAC8E,IAAD,EAAOC,OAAP,IAAkBlF,KAAK,CAACoE,QAAN,CAAe,KAAf,CAAxB;;AAEA,QAAMe,gBAAgB,GAAG,MAAM;AAC3BD,IAAAA,OAAO,CAAC,IAAD,CAAP;AACH,GAFD;;AAIA,QAAME,iBAAiB,GAAG,MAAM;AAC5BF,IAAAA,OAAO,CAAC,KAAD,CAAP;AACH,GAFD;;AAKA,QAAMG,MAAM,GAAG,6BAAf;AACA,QAAMC,UAAU,gBAAK,oBACjB,IADiB;AACZ,IAAA,QAAQ,EAAKpB,QADD;AAEjB,IAAA,YAAY,EACR;AAAEqB,MAAAA,QAAQ,EAAE,KAAZ;AAAmBC,MAAAA,UAAU,EAAE;AAA/B,KAHa;AAKjB,IAAA,EAAE,EAAKH,MALU;AAMjB,IAAA,WAAW,MANM;AAML,IAAA,eAAe,EACvB;AAAEE,MAAAA,QAAQ,EAAE,KAAZ;AAAmBC,MAAAA,UAAU,EAAE;AAA/B,KAPa;AASjB,IAAA,IAAI,EAAKjB,UATQ;AAUjB,IAAA,OAAO,EAAKI,eAVK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAWjB,oBACA,QADA;AACS,IAAA,OAAO,EAAKA,eADrB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAXiB,oBAY6C,oBAC9D,QAD8D;AACrD,IAAA,OAAO,EAAKA,eADyC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAZ7C,MAArB;AAiBA,QAAMc,YAAY,GAAG,oCAArB;AACA,QAAMC,gBAAgB,gBAAK,oBACvB,IADuB;AAClB,IAAA,QAAQ,EAAKrB,kBADK;AAEvB,IAAA,YAAY,EACR;AAAEkB,MAAAA,QAAQ,EAAE,KAAZ;AAAmBC,MAAAA,UAAU,EAAE;AAA/B,KAHmB;AAKvB,IAAA,EAAE,EAAKC,YALgB;AAMvB,IAAA,WAAW,MANY;AAMX,IAAA,eAAe,EACvB;AAAEF,MAAAA,QAAQ,EAAE,KAAZ;AAAmBC,MAAAA,UAAU,EAAE;AAA/B,KAPmB;AASvB,IAAA,IAAI,EAAKf,gBATc;AAUvB,IAAA,OAAO,EAAKC,qBAVW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAWvB,oBACA,QADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAEA,oBACA,UADA;AACW,IAAA,KAAK,EAAG,SADnB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAEA,oBACA,KADA;AACM,IAAA,YAAY,EAAK,CADvB;AAEA,IAAA,KAAK,EAAG,WAFR;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAGA,oBACA,QADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAHA,CAFA,MAFA,oBAWa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAXb,MAXuB,oBAwBZ,oBACX,QADW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAEX,oBACA,UADA;AACW,IAAA,KAAK,EAAG,SADnB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAEA,oBACA,KADA;AACM,IAAA,YAAY,EAAK,EADvB;AAEA,IAAA,KAAK,EAAG,WAFR;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAGA,oBACA,iBADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAHA,CAFA,MAFW,oBAWE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAXF,MAxBY,oBAqCZ,oBACX,QADW;AACF,IAAA,OAAO,EAAKE,qBADV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAEX,oBACA,UADA;AACW,IAAA,KAAK,EAAG,SADnB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAEA,oBACA,aADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAFA,CAFW,oBAOE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAPF,MArCY,MAA3B;AAkDA,sBAAS;AACD,IAAA,SAAS,EAAKI,OAAO,CAAChD,IADrB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAEL,oBACA,WADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAFK,eAIL,oBACA,MADA;AACO,IAAA,QAAQ,EAAG,OADlB;AAEA,IAAA,SAAS,EACL/B,IAAI,CAAC+E,OAAO,CAAC9C,MAAT,EAAiB;AACjB,OAAC8C,OAAO,CAACpC,WAAT,GAAuBqC;AADN,KAAjB,CAHR;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAOA,oBACA,OADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAEA,oBACA,UADA;AACW,IAAA,KAAK,EAAG,SADnB;AAEA,IAAA,OAAO,EAAKE,gBAFZ;AAGA,IAAA,IAAI,EAAG,OAHP;AAIA,IAAA,SAAS,EACLlF,IAAI,CAAC+E,OAAO,CAAChC,UAAT,EAAqB;AACrB,OAACgC,OAAO,CAAC9B,IAAT,GAAgB+B;AADK,KAArB,CALR;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBASA,oBACA,QADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IATA,CAFA,oBAca,oBACb,UADa;AACF,IAAA,OAAO,EAAG,IADR;AAEb,IAAA,MAAM,MAFO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCAdb,oBAkBa,oBAAC,UAAD;AAAY,kBAAW,kBAAvB;AAA0C,IAAA,KAAK,EAAC,SAAhD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAA2D,oBACxE,KADwE;AAClE,IAAA,YAAY,EAAK,CADiD;AAExE,IAAA,KAAK,EAAG,WAFgE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAGxE,oBACA,QADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAHwE,CAA3D,MAlBb,MAPA,MAJK,OAsCKS,gBAtCL,OAsCyBJ,UAtCzB,oBAsCsC,oBAC3C,MAD2C;AACpC,IAAA,OAAO,EAAG,WAD0B;AAE3C,IAAA,SAAS,EACLrF,IAAI,CAAC+E,OAAO,CAAC5C,MAAT,EAAiB;AACjB,OAAC4C,OAAO,CAAC3B,UAAT,GAAsB4B,IADL;AAEjB,OAACD,OAAO,CAAC1B,WAAT,GAAuB,CAAC2B;AAFP,KAAjB,CAHmC;AAQ3C,IAAA,OAAO,EACH;AACIU,MAAAA,KAAK,EAAE1F,IAAI,CAAC;AACR,SAAC+E,OAAO,CAAC3B,UAAT,GAAsB4B,IADd;AAER,SAACD,OAAO,CAAC1B,WAAT,GAAuB,CAAC2B;AAFhB,OAAD;AADf,KATuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAgB3C;AACI,IAAA,SAAS,EAAKD,OAAO,CAACrB,OAD1B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAEA,oBACA,UADA;AACW,IAAA,OAAO,EAAKyB,iBADvB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAC+CrD,KAAK,CAAC6D,SAAN,KAAoB,KAApB,gBAA4B,oBAAE,gBAAF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAA5B,gBAAqD,oBAAE,eAAF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IADpG,MAFA,MAhB2C,oBAqBrC,oBACN,OADM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IArBqC,eAuB3C,oBACA,IADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAEI,CAAC,IAAD,EAAO,IAAP,EAAa,IAAb,EAAmB,MAAnB,EAA2BC,GAA3B,CAA+B,CAACC,IAAD,EAAOC,KAAP,kBAAmB,oBAC9C,QAD8C;AACrC,IAAA,MAAM,MAD+B;AAC9B,IAAA,GAAG,EAAKD,IADsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAE9C,oBACA,YADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UACiBC,KAAK,IAAI,CAAT,gBAAa,oBAAE,SAAF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAb,GAA+BA,KAAK,IAAI,CAAT,gBAAa,oBAAE,SAAF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAb,GAA+BA,KAAK,IAAI,CAAT,gBAAa,oBAAE,cAAF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAb,gBAAoC,oBAAE,mBAAF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IADnH,MAF8C,oBAGkH,oBAChK,YADgK;AACnJ,IAAA,OAAO,EAAKD,IADuI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAHlH,MAAlD,CAFJ,MAvB2C,MAtCtC,oBAyEI;AACJ,IAAA,SAAS,EAAKd,OAAO,CAAChB,OADlB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAET;AACI,IAAA,SAAS,EAAKgB,OAAO,CAACrB,OAD1B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAFS,oBAIN,oBACH,SADG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAJM,MAzEJ,MAAT;AAkFH","sourcesContent":["import React from 'react';\nimport clsx from 'clsx';\nimport { makeStyles, useTheme } from '@material-ui/core/styles';\nimport Drawer from '@material-ui/core/Drawer';\nimport AppBar from '@material-ui/core/AppBar';\nimport Toolbar from '@material-ui/core/Toolbar';\nimport List from '@material-ui/core/List';\nimport CssBaseline from '@material-ui/core/CssBaseline';\nimport Typography from '@material-ui/core/Typography';\nimport Divider from '@material-ui/core/Divider';\nimport IconButton from '@material-ui/core/IconButton';\nimport MenuIcon from '@material-ui/icons/Menu';\nimport ChevronLeftIcon from '@material-ui/icons/ChevronLeft';\nimport ChevronRightIcon from '@material-ui/icons/ChevronRight';\nimport ListItem from '@material-ui/core/ListItem';\nimport ListItemIcon from '@material-ui/core/ListItemIcon';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport InboxIcon from '@material-ui/icons/MoveToInbox';\nimport MailIcon from '@material-ui/icons/Mail';\nimport ImageList from './ImageList';\nimport PhotoIcon from '@material-ui/icons/Photo';\nimport ShareIcon from '@material-ui/icons/Share';\nimport PhotoAlbumIcon from '@material-ui/icons/PhotoAlbum';\nimport LibraryAddCheckIcon from '@material-ui/icons/LibraryAddCheck';\nimport Badge from '@material-ui/core/Badge';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport Menu from '@material-ui/core/Menu';\nimport NotificationsIcon from '@material-ui/icons/Notifications';\n\n\nconst drawerWidth = 240;\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n display: 'flex',\n },\n appBar: {\n zIndex: theme.zIndex.drawer + 1,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen,\n }),\n },\n appBarShift: {\n marginLeft: drawerWidth,\n width: `calc(100% - ${drawerWidth}px)`,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen,\n }),\n },\n menuButton: {\n marginRight: 36,\n },\n hide: {\n display: 'none',\n },\n drawer: {\n width: drawerWidth,\n flexShrink: 0,\n whiteSpace: 'nowrap',\n },\n drawerOpen: {\n width: drawerWidth,\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen,\n }),\n },\n drawerClose: {\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen,\n }),\n overflowX: 'hidden',\n width: theme.spacing(7) + 1,\n [theme.breakpoints.up('sm')]: {\n width: theme.spacing(9) + 1,\n },\n },\n toolbar: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n padding: theme.spacing(0, 1),\n // necessary for content to be below app bar\n ...theme.mixins.toolbar,\n },\n content: {\n flexGrow: 1,\n padding: theme.spacing(3),\n },\n}));\nconst [anchorEl, setAnchorEl] = React.useState(null);\nconst [mobileMoreAnchorEl, setMobileMoreAnchorEl] = React.useState(null);\n\nconst isMenuOpen = Boolean(anchorEl);\nconst isMobileMenuOpen = Boolean(mobileMoreAnchorEl);\nconst handleMobileMenuClose = () => {\n setMobileMoreAnchorEl(null);\n};\n\nconst handleMenuClose = () => {\n setAnchorEl(null);\n handleMobileMenuClose();\n};\n\nconst handleProfileMenuOpen = (event) => {\n setAnchorEl(event.currentTarget);\n};\n\n\n\nexport default function MiniDrawer() {\n const classes = useStyles();\n const theme = useTheme();\n const [open, setOpen] = React.useState(false);\n\n const handleDrawerOpen = () => {\n setOpen(true);\n };\n\n const handleDrawerClose = () => {\n setOpen(false);\n };\n\n\n const menuId = 'primary-search-account-menu';\n const renderMenu = ( <\n Menu anchorEl = { anchorEl }\n anchorOrigin = {\n { vertical: 'top', horizontal: 'right' }\n }\n id = { menuId }\n keepMounted transformOrigin = {\n { vertical: 'top', horizontal: 'right' }\n }\n open = { isMenuOpen }\n onClose = { handleMenuClose } >\n <\n MenuItem onClick = { handleMenuClose } > Profile < /MenuItem> <\n MenuItem onClick = { handleMenuClose } > My account < /MenuItem> < /\n Menu >\n );\n\n const mobileMenuId = 'primary-search-account-menu-mobile';\n const renderMobileMenu = ( <\n Menu anchorEl = { mobileMoreAnchorEl }\n anchorOrigin = {\n { vertical: 'top', horizontal: 'right' }\n }\n id = { mobileMenuId }\n keepMounted transformOrigin = {\n { vertical: 'top', horizontal: 'right' }\n }\n open = { isMobileMenuOpen }\n onClose = { handleMobileMenuClose } >\n <\n MenuItem >\n <\n IconButton color = \"inherit\" >\n <\n Badge badgeContent = { 4 }\n color = \"secondary\" >\n <\n MailIcon / >\n <\n /Badge> < /\n IconButton > <\n p > Messages < /p> < /\n MenuItem > <\n MenuItem >\n <\n IconButton color = \"inherit\" >\n <\n Badge badgeContent = { 11 }\n color = \"secondary\" >\n <\n NotificationsIcon / >\n <\n /Badge> < /\n IconButton > <\n p > Notifications < /p> < /\n MenuItem > <\n MenuItem onClick = { handleProfileMenuOpen } >\n <\n IconButton color = \"inherit\" >\n <\n AccountCircle / >\n <\n /IconButton> <\n p > Profile < /p> < /\n MenuItem > <\n /Menu>\n );\n\n return ( <\n div className = { classes.root } >\n <\n CssBaseline / >\n <\n AppBar position = \"fixed\"\n className = {\n clsx(classes.appBar, {\n [classes.appBarShift]: open,\n })\n } >\n <\n Toolbar >\n <\n IconButton color = \"inherit\"\n onClick = { handleDrawerOpen }\n edge = \"start\"\n className = {\n clsx(classes.menuButton, {\n [classes.hide]: open,\n })\n } >\n <\n MenuIcon / >\n <\n /IconButton> <\n Typography variant = \"h6\"\n noWrap >\n 谷狗相薄 <\n /Typography> <IconButton aria-label=\"show 4 new mails\" color=\"inherit\"> <\n Badge badgeContent = { 4 }\n color = \"secondary\" >\n <\n MailIcon / >\n <\n /Badge> < /\n IconButton > < /\n Toolbar > <\n /AppBar> {renderMobileMenu} { renderMenu } <\n Drawer variant = \"permanent\"\n className = {\n clsx(classes.drawer, {\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open,\n })\n }\n classes = {\n {\n paper: clsx({\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open,\n }),\n }\n } >\n <\n div className = { classes.toolbar } >\n <\n IconButton onClick = { handleDrawerClose } > { theme.direction === 'rtl' ? < ChevronRightIcon / > : < ChevronLeftIcon / > } <\n /IconButton> < /\n div > <\n Divider / >\n <\n List > {\n ['相片', '共享', '相簿', '實用工具'].map((text, index) => ( <\n ListItem button key = { text } >\n <\n ListItemIcon > { index == 0 ? < PhotoIcon / > : index == 1 ? < ShareIcon / > : index == 2 ? < PhotoAlbumIcon / > : < LibraryAddCheckIcon / > } < /ListItemIcon> <\n ListItemText primary = { text }\n /> < /\n ListItem >\n ))\n } <\n /List> < /\n Drawer > <\n main className = { classes.content } >\n <\n div className = { classes.toolbar }\n /> <\n ImageList / > < /\n main > <\n /div>\n );\n}"]},"metadata":{},"sourceType":"module"}
|
