%PDF- %PDF-
Mini Shell

Mini Shell

Direktori : /home/opti/www/ezone-accounting.optisoft.com.ng/static/js/
Upload File :
Create Path :
Current File : /home/opti/www/ezone-accounting.optisoft.com.ng/static/js/28.10297f0b.chunk.js

(this["webpackJsonpfuse-react-app"]=this["webpackJsonpfuse-react-app"]||[]).push([[28],{1046:function(e,t,a){"use strict";function n(e,t,a,n,r){return null}a.d(t,"a",(function(){return n}))},1047:function(e,t,a){"use strict";a.r(t);var n=a(15);a.d(t,"capitalize",(function(){return n.a}));var r=a(78);a.d(t,"createChainedFunction",(function(){return r.a}));var o=a(85);a.d(t,"createSvgIcon",(function(){return o.a}));var s=a(97);a.d(t,"debounce",(function(){return s.a}));var c=a(130);a.d(t,"deprecatedPropType",(function(){return c.a}));var i=a(159);a.d(t,"isMuiElement",(function(){return i.a}));var l=a(47);a.d(t,"ownerDocument",(function(){return l.a}));var u=a(160);a.d(t,"ownerWindow",(function(){return u.a}));var d=a(1134);a.d(t,"requirePropFactory",(function(){return d.a}));var m=a(87);a.d(t,"setRef",(function(){return m.a}));var p=a(1046);a.d(t,"unsupportedProp",(function(){return p.a}));var f=a(104);a.d(t,"useControlled",(function(){return f.a}));var h=a(38);a.d(t,"useEventCallback",(function(){return h.a}));var j=a(25);a.d(t,"useForkRef",(function(){return j.a}));var v=a(224);a.d(t,"unstable_useId",(function(){return v.a}));var b=a(158);a.d(t,"useIsFocusVisible",(function(){return b.a}))},1127:function(e,t,a){var n=a(373).default;function r(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,a=new WeakMap;return(r=function(e){return e?a:t})(e)}e.exports=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=n(e)&&"function"!=typeof e)return{default:e};var a=r(t);if(a&&a.has(e))return a.get(e);var o={__proto__:null},s=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var c in e)if("default"!==c&&Object.prototype.hasOwnProperty.call(e,c)){var i=s?Object.getOwnPropertyDescriptor(e,c):null;i&&(i.get||i.set)?Object.defineProperty(o,c,i):o[c]=e[c]}return o.default=e,a&&a.set(e,o),o},e.exports.__esModule=!0,e.exports.default=e.exports},1128:function(e,t,a){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),Object.defineProperty(t,"default",{enumerable:!0,get:function(){return n.createSvgIcon}});var n=a(1047)},1129:function(e,t,a){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.FrameContextConsumer=t.FrameContextProvider=t.FrameContext=void 0;var n,r=a(0),o=(n=r)&&n.__esModule?n:{default:n};var s=void 0,c=void 0;"undefined"!==typeof document&&(s=document),"undefined"!==typeof window&&(c=window);var i=t.FrameContext=o.default.createContext({document:s,window:c}),l=i.Provider,u=i.Consumer;t.FrameContextProvider=l,t.FrameContextConsumer=u},1130:function(e,t,a){"use strict";a.d(t,"a",(function(){return C}));var n=a(118),r=a(1100),o=a(1109),s=a(1090),c=a(1117),i=a(1119),l=a(5),u=a(0),d=a(1024),m=a(551),p=a(1087),f=a(1099),h=a(11),j=a(370),v=a(371),b=a(1131),g=a.n(b),x=a(1);const y=Object(d.a)({productionPrefix:"iframe-"});class O extends u.Component{constructor(){super(...arguments),this.state={ready:!1},this.handleRef=e=>{this.contentDocument=e?e.node.contentDocument:null},this.onContentDidMount=()=>{this.setState({ready:!0,jss:Object(j.a)({...Object(m.a)(),plugins:[...Object(m.a)().plugins,Object(v.a)()],insertionPoint:this.contentDocument.querySelector("#jss-demo-insertion-point")}),sheetsManager:new Map,container:this.contentDocument.body})},this.onContentDidUpdate=()=>{this.contentDocument.body.dir=this.props.theme.direction},this.renderHead=()=>Object(x.jsxs)(x.Fragment,{children:[Object(x.jsx)("style",{dangerouslySetInnerHTML:{__html:"\n                    html {\n                    font-size: 62.5%;\n                    font-family: Poppins, Roboto, Helvetica Neue, Arial, sans-serif;\n                    }\n                "}}),Object(x.jsx)("noscript",{id:"jss-demo-insertion-point"})]})}render(){const{children:e,classes:t,theme:a}=this.props;return Object(x.jsx)(g.a,{head:this.renderHead(),ref:this.handleRef,className:Object(l.a)(t.root,"shadow"),contentDidMount:this.onContentDidMount,contentDidUpdate:this.onContentDidUpdate,children:this.state.ready?Object(x.jsx)(p.b,{jss:this.state.jss,generateClassName:y,sheetsManager:this.state.sheetsManager,children:Object(x.jsx)(f.a,{theme:a,children:Object(u.cloneElement)(e,{container:this.state.container})})}):null})}}var N=Object(h.a)((e=>({root:{backgroundColor:e.palette.background.default,flexGrow:1,height:400,border:"none"}})),{withTheme:!0})(O);function w(e){const[t,a]=Object(u.useState)(e.currentTabIndex),{component:d,raw:m,iframe:p,className:f}=e;return Object(x.jsxs)(o.a,{className:Object(l.a)(f,"shadow"),children:[Object(x.jsx)(r.a,{position:"static",color:"default",className:"shadow-0",children:Object(x.jsxs)(i.a,{classes:{root:"border-b-1",flexContainer:"justify-end"},value:t,onChange:function(e,t){a(t)},children:[d&&Object(x.jsx)(c.a,{classes:{root:"min-w-64"},icon:Object(x.jsx)(s.a,{children:"remove_red_eye"})}),m&&Object(x.jsx)(c.a,{classes:{root:"min-w-64"},icon:Object(x.jsx)(s.a,{children:"code"})})]})}),Object(x.jsxs)("div",{className:"flex justify-center max-w-full",children:[Object(x.jsx)("div",{className:0===t?"flex flex-1 max-w-full":"hidden",children:d&&(p?Object(x.jsx)(N,{children:Object(x.jsx)(d,{})}):Object(x.jsx)("div",{className:"p-24 flex flex-1 justify-center max-w-full",children:Object(x.jsx)(d,{})}))}),Object(x.jsx)("div",{className:1===t?"flex flex-1":"hidden",children:m&&Object(x.jsx)("div",{className:"flex flex-1",children:Object(x.jsx)(n.a,{component:"pre",className:"language-javascript w-full",children:m.default})})})]})]})}w.defaultProps={currentTabIndex:0};var C=w},1131:function(e,t,a){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.FrameContextConsumer=t.FrameContext=void 0;var n=a(1129);Object.defineProperty(t,"FrameContext",{enumerable:!0,get:function(){return n.FrameContext}}),Object.defineProperty(t,"FrameContextConsumer",{enumerable:!0,get:function(){return n.FrameContextConsumer}});var r,o=a(1132),s=(r=o)&&r.__esModule?r:{default:r};t.default=s.default},1132:function(e,t,a){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var n=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},r=function(){function e(e,t){for(var a=0;a<t.length;a++){var n=t[a];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,a,n){return a&&e(t.prototype,a),n&&e(t,n),t}}(),o=a(0),s=d(o),c=d(a(22)),i=d(a(553)),l=a(1129),u=d(a(1133));function d(e){return e&&e.__esModule?e:{default:e}}var m=function(e){function t(e,a){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);var n=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!==typeof t&&"function"!==typeof t?e:t}(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e,a));return n.handleLoad=function(){n.forceUpdate()},n._isMounted=!1,n}return function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,e),r(t,[{key:"componentDidMount",value:function(){this._isMounted=!0;var e=this.getDoc();e&&"complete"===e.readyState?this.forceUpdate():this.node.addEventListener("load",this.handleLoad)}},{key:"componentWillUnmount",value:function(){this._isMounted=!1,this.node.removeEventListener("load",this.handleLoad)}},{key:"getDoc",value:function(){return this.node?this.node.contentDocument:null}},{key:"getMountTarget",value:function(){var e=this.getDoc();return this.props.mountTarget?e.querySelector(this.props.mountTarget):e.body.children[0]}},{key:"renderFrameContents",value:function(){if(!this._isMounted)return null;var e=this.getDoc();if(!e)return null;var t=this.props.contentDidMount,a=this.props.contentDidUpdate,n=e.defaultView||e.parentView,r=s.default.createElement(u.default,{contentDidMount:t,contentDidUpdate:a},s.default.createElement(l.FrameContextProvider,{value:{document:e,window:n}},s.default.createElement("div",{className:"frame-content"},this.props.children)));e.body.children.length<1&&(e.open("text/html","replace"),e.write(this.props.initialContent),e.close());var o=this.getMountTarget();return[c.default.createPortal(this.props.head,this.getDoc().head),c.default.createPortal(r,o)]}},{key:"render",value:function(){var e=this,t=n({},this.props,{children:void 0});return delete t.head,delete t.initialContent,delete t.mountTarget,delete t.contentDidMount,delete t.contentDidUpdate,s.default.createElement("iframe",n({},t,{ref:function(t){e.node=t}}),this.renderFrameContents())}}]),t}(o.Component);m.propTypes={style:i.default.object,head:i.default.node,initialContent:i.default.string,mountTarget:i.default.string,contentDidMount:i.default.func,contentDidUpdate:i.default.func,children:i.default.oneOfType([i.default.element,i.default.arrayOf(i.default.element)])},m.defaultProps={style:{},head:null,children:void 0,mountTarget:void 0,contentDidMount:function(){},contentDidUpdate:function(){},initialContent:'<!DOCTYPE html><html><head></head><body><div class="frame-root"></div></body></html>'},t.default=m},1133:function(e,t,a){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var n=function(){function e(e,t){for(var a=0;a<t.length;a++){var n=t[a];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,a,n){return a&&e(t.prototype,a),n&&e(t,n),t}}(),r=a(0),o=(s(r),s(a(553)));function s(e){return e&&e.__esModule?e:{default:e}}var c=function(e){function t(){return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!==typeof t&&"function"!==typeof t?e:t}(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments))}return function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,e),n(t,[{key:"componentDidMount",value:function(){this.props.contentDidMount()}},{key:"componentDidUpdate",value:function(){this.props.contentDidUpdate()}},{key:"render",value:function(){return r.Children.only(this.props.children)}}]),t}(r.Component);c.propTypes={children:o.default.element.isRequired,contentDidMount:o.default.func.isRequired,contentDidUpdate:o.default.func.isRequired},t.default=c},1134:function(e,t,a){"use strict";function n(e){return function(){return null}}a.d(t,"a",(function(){return n}))},1150:function(e,t,a){"use strict";function n(e){var t,a,r="";if("string"==typeof e||"number"==typeof e)r+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(a=n(e[t]))&&(r&&(r+=" "),r+=a);else for(t in e)e[t]&&(r&&(r+=" "),r+=t);return r}t.a=function(){for(var e,t,a=0,r="";a<arguments.length;)(e=arguments[a++])&&(t=n(e))&&(r&&(r+=" "),r+=t);return r}},1267:function(e,t,a){"use strict";var n=a(552),r=a(1127);Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=r(a(0)),s=(0,n(a(1128)).default)(o.createElement("path",{d:"M10 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"}),"Folder");t.default=s},130:function(e,t,a){"use strict";function n(e,t){return function(){return null}}a.d(t,"a",(function(){return n}))},1437:function(e,t,a){"use strict";var n=a(552),r=a(1127);Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=r(a(0)),s=(0,n(a(1128)).default)(o.createElement("path",{d:"M19 3h-4.18C14.4 1.84 13.3 1 12 1c-1.3 0-2.4.84-2.82 2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-7 0c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm2 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z"}),"Assignment");t.default=s},1766:function(e,t,a){"use strict";a.r(t),a.d(t,"default",(function(){return c}));a(0);var n=a(1072),r=a(1124),o=a(1);const s=Object(n.a)((e=>({root:{display:"flex","& > *":{margin:e.spacing(1)}}})));function c(){const e=s();return Object(o.jsxs)("div",{className:e.root,children:[Object(o.jsx)(r.a,{alt:"Remy Sharp",src:"/material-ui-static/images/avatar/1.jpg"}),Object(o.jsx)(r.a,{alt:"Travis Howard",src:"/material-ui-static/images/avatar/2.jpg"}),Object(o.jsx)(r.a,{alt:"Cindy Baker",src:"/material-ui-static/images/avatar/3.jpg"})]})}},1767:function(e,t,a){"use strict";a.r(t),t.default='import React from \'react\';\nimport { makeStyles } from \'@material-ui/core/styles\';\nimport Avatar from \'@material-ui/core/Avatar\';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    display: \'flex\',\n    \'& > *\': {\n      margin: theme.spacing(1),\n    },\n  },\n}));\n\nexport default function ImageAvatars() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Avatar alt="Remy Sharp" src="/material-ui-static/images/avatar/1.jpg" />\n      <Avatar alt="Travis Howard" src="/material-ui-static/images/avatar/2.jpg" />\n      <Avatar alt="Cindy Baker" src="/material-ui-static/images/avatar/3.jpg" />\n    </div>\n  );\n}\n'},1768:function(e,t,a){"use strict";a.r(t),a.d(t,"default",(function(){return l}));a(0);var n=a(1072),r=a(1124),o=a(428),s=a(426),c=a(1);const i=Object(n.a)((e=>({root:{display:"flex","& > *":{margin:e.spacing(1)}},orange:{color:e.palette.getContrastText(o.a[500]),backgroundColor:o.a[500]},purple:{color:e.palette.getContrastText(s.a[500]),backgroundColor:s.a[500]}})));function l(){const e=i();return Object(c.jsxs)("div",{className:e.root,children:[Object(c.jsx)(r.a,{children:"H"}),Object(c.jsx)(r.a,{className:e.orange,children:"N"}),Object(c.jsx)(r.a,{className:e.purple,children:"OP"})]})}},1769:function(e,t,a){"use strict";a.r(t),t.default="import React from 'react';\nimport { makeStyles } from '@material-ui/core/styles';\nimport Avatar from '@material-ui/core/Avatar';\nimport { deepOrange, deepPurple } from '@material-ui/core/colors';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    display: 'flex',\n    '& > *': {\n      margin: theme.spacing(1),\n    },\n  },\n  orange: {\n    color: theme.palette.getContrastText(deepOrange[500]),\n    backgroundColor: deepOrange[500],\n  },\n  purple: {\n    color: theme.palette.getContrastText(deepPurple[500]),\n    backgroundColor: deepPurple[500],\n  },\n}));\n\nexport default function LetterAvatars() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Avatar>H</Avatar>\n      <Avatar className={classes.orange}>N</Avatar>\n      <Avatar className={classes.purple}>OP</Avatar>\n    </div>\n  );\n}\n"},1770:function(e,t,a){"use strict";a.r(t),a.d(t,"default",(function(){return c}));a(0);var n=a(1072),r=a(1124),o=a(1);const s=Object(n.a)((e=>({root:{display:"flex","& > *":{margin:e.spacing(1)}},small:{width:e.spacing(3),height:e.spacing(3)},large:{width:e.spacing(7),height:e.spacing(7)}})));function c(){const e=s();return Object(o.jsxs)("div",{className:e.root,children:[Object(o.jsx)(r.a,{alt:"Remy Sharp",src:"/material-ui-static/images/avatar/1.jpg",className:e.small}),Object(o.jsx)(r.a,{alt:"Remy Sharp",src:"/material-ui-static/images/avatar/1.jpg"}),Object(o.jsx)(r.a,{alt:"Remy Sharp",src:"/material-ui-static/images/avatar/1.jpg",className:e.large})]})}},1771:function(e,t,a){"use strict";a.r(t),t.default='import React from \'react\';\nimport { makeStyles } from \'@material-ui/core/styles\';\nimport Avatar from \'@material-ui/core/Avatar\';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    display: \'flex\',\n    \'& > *\': {\n      margin: theme.spacing(1),\n    },\n  },\n  small: {\n    width: theme.spacing(3),\n    height: theme.spacing(3),\n  },\n  large: {\n    width: theme.spacing(7),\n    height: theme.spacing(7),\n  },\n}));\n\nexport default function ImageAvatars() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Avatar alt="Remy Sharp" src="/material-ui-static/images/avatar/1.jpg" className={classes.small} />\n      <Avatar alt="Remy Sharp" src="/material-ui-static/images/avatar/1.jpg" />\n      <Avatar alt="Remy Sharp" src="/material-ui-static/images/avatar/1.jpg" className={classes.large} />\n    </div>\n  );\n}\n'},1772:function(e,t,a){"use strict";a.r(t),a.d(t,"default",(function(){return h}));a(0);var n=a(1072),r=a(181),o=a(149),s=a(1124),c=a(1267),i=a.n(c),l=a(1773),u=a.n(l),d=a(1437),m=a.n(d),p=a(1);const f=Object(n.a)((e=>({root:{display:"flex","& > *":{margin:e.spacing(1)}},pink:{color:e.palette.getContrastText(r.a[500]),backgroundColor:r.a[500]},green:{color:"#fff",backgroundColor:o.a[500]}})));function h(){const e=f();return Object(p.jsxs)("div",{className:e.root,children:[Object(p.jsx)(s.a,{children:Object(p.jsx)(i.a,{})}),Object(p.jsx)(s.a,{className:e.pink,children:Object(p.jsx)(u.a,{})}),Object(p.jsx)(s.a,{className:e.green,children:Object(p.jsx)(m.a,{})})]})}},1773:function(e,t,a){"use strict";var n=a(552),r=a(1127);Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=r(a(0)),s=(0,n(a(1128)).default)(o.createElement("path",{d:"M11.5 9C10.12 9 9 10.12 9 11.5s1.12 2.5 2.5 2.5 2.5-1.12 2.5-2.5S12.88 9 11.5 9zM20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-3.21 14.21l-2.91-2.91c-.69.44-1.51.7-2.39.7C9.01 16 7 13.99 7 11.5S9.01 7 11.5 7 16 9.01 16 11.5c0 .88-.26 1.69-.7 2.39l2.91 2.9-1.42 1.42z"}),"Pageview");t.default=s},1774:function(e,t,a){"use strict";a.r(t),t.default="import React from 'react';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { green, pink } from '@material-ui/core/colors';\nimport Avatar from '@material-ui/core/Avatar';\nimport FolderIcon from '@material-ui/icons/Folder';\nimport PageviewIcon from '@material-ui/icons/Pageview';\nimport AssignmentIcon from '@material-ui/icons/Assignment';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    display: 'flex',\n    '& > *': {\n      margin: theme.spacing(1),\n    },\n  },\n  pink: {\n    color: theme.palette.getContrastText(pink[500]),\n    backgroundColor: pink[500],\n  },\n  green: {\n    color: '#fff',\n    backgroundColor: green[500],\n  },\n}));\n\nexport default function IconAvatars() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Avatar>\n        <FolderIcon />\n      </Avatar>\n      <Avatar className={classes.pink}>\n        <PageviewIcon />\n      </Avatar>\n      <Avatar className={classes.green}>\n        <AssignmentIcon />\n      </Avatar>\n    </div>\n  );\n}\n"},1775:function(e,t,a){"use strict";a.r(t),a.d(t,"default",(function(){return d}));a(0);var n=a(1072),r=a(1124),o=a(428),s=a(149),c=a(1437),i=a.n(c),l=a(1);const u=Object(n.a)((e=>({root:{display:"flex","& > *":{margin:e.spacing(1)}},square:{color:e.palette.getContrastText(o.a[500]),backgroundColor:o.a[500]},rounded:{color:"#fff",backgroundColor:s.a[500]}})));function d(){const e=u();return Object(l.jsxs)("div",{className:e.root,children:[Object(l.jsx)(r.a,{variant:"square",className:e.square,children:"N"}),Object(l.jsx)(r.a,{variant:"rounded",className:e.rounded,children:Object(l.jsx)(i.a,{})})]})}},1776:function(e,t,a){"use strict";a.r(t),t.default="import React from 'react';\nimport { makeStyles } from '@material-ui/core/styles';\nimport Avatar from '@material-ui/core/Avatar';\nimport { deepOrange, green } from '@material-ui/core/colors';\nimport AssignmentIcon from '@material-ui/icons/Assignment';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    display: 'flex',\n    '& > *': {\n      margin: theme.spacing(1),\n    },\n  },\n  square: {\n    color: theme.palette.getContrastText(deepOrange[500]),\n    backgroundColor: deepOrange[500],\n  },\n  rounded: {\n    color: '#fff',\n    backgroundColor: green[500],\n  },\n}));\n\nexport default function VariantAvatars() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Avatar variant=\"square\" className={classes.square}>\n        N\n      </Avatar>\n      <Avatar variant=\"rounded\" className={classes.rounded}>\n        <AssignmentIcon />\n      </Avatar>\n    </div>\n  );\n}\n"},1777:function(e,t,a){"use strict";a.r(t),a.d(t,"default",(function(){return i}));a(0);var n=a(1072),r=a(1124),o=a(428),s=a(1);const c=Object(n.a)((e=>({root:{display:"flex","& > *":{margin:e.spacing(1)}},orange:{color:e.palette.getContrastText(o.a[500]),backgroundColor:o.a[500]}})));function i(){const e=c();return Object(s.jsxs)("div",{className:e.root,children:[Object(s.jsx)(r.a,{alt:"Remy Sharp",src:"/broken-image.jpg",className:e.orange,children:"B"}),Object(s.jsx)(r.a,{alt:"Remy Sharp",src:"/broken-image.jpg",className:e.orange}),Object(s.jsx)(r.a,{src:"/broken-image.jpg"})]})}},1778:function(e,t,a){"use strict";a.r(t),t.default="import React from 'react';\nimport { makeStyles } from '@material-ui/core/styles';\nimport Avatar from '@material-ui/core/Avatar';\nimport { deepOrange } from '@material-ui/core/colors';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    display: 'flex',\n    '& > *': {\n      margin: theme.spacing(1),\n    },\n  },\n  orange: {\n    color: theme.palette.getContrastText(deepOrange[500]),\n    backgroundColor: deepOrange[500],\n  },\n}));\n\nexport default function FallbackAvatars() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Avatar alt=\"Remy Sharp\" src=\"/broken-image.jpg\" className={classes.orange}>\n        B\n      </Avatar>\n      <Avatar alt=\"Remy Sharp\" src=\"/broken-image.jpg\" className={classes.orange} />\n      <Avatar src=\"/broken-image.jpg\" />\n    </div>\n  );\n}\n"},1779:function(e,t,a){"use strict";a.r(t),t.default='import React from \'react\';\nimport Avatar from \'@material-ui/core/Avatar\';\nimport AvatarGroup from \'@material-ui/lab/AvatarGroup\';\n\nexport default function GroupAvatars() {\n  return (\n    <AvatarGroup max={4}>\n      <Avatar alt="Remy Sharp" src="/material-ui-static/images/avatar/1.jpg" />\n      <Avatar alt="Travis Howard" src="/material-ui-static/images/avatar/2.jpg" />\n      <Avatar alt="Cindy Baker" src="/material-ui-static/images/avatar/3.jpg" />\n      <Avatar alt="Agnes Walker" src="/material-ui-static/images/avatar/4.jpg" />\n      <Avatar alt="Trevor Henderson" src="/material-ui-static/images/avatar/5.jpg" />\n    </AvatarGroup>\n  );\n}\n'},1780:function(e,t,a){"use strict";a.r(t),a.d(t,"default",(function(){return d}));a(0);var n=a(1114),r=a(1124),o=a(11),s=a(1072),c=a(1);const i=Object(o.a)((e=>({badge:{backgroundColor:"#44b700",color:"#44b700",boxShadow:"0 0 0 2px ".concat(e.palette.background.paper),"&::after":{position:"absolute",top:0,left:0,width:"100%",height:"100%",borderRadius:"50%",animation:"$ripple 1.2s infinite ease-in-out",border:"1px solid currentColor",content:'""'}},"@keyframes ripple":{"0%":{transform:"scale(.8)",opacity:1},"100%":{transform:"scale(2.4)",opacity:0}}})))(n.a),l=Object(o.a)((e=>({root:{width:22,height:22,border:"2px solid ".concat(e.palette.background.paper)}})))(r.a),u=Object(s.a)((e=>({root:{display:"flex","& > *":{margin:e.spacing(1)}}})));function d(){const e=u();return Object(c.jsxs)("div",{className:e.root,children:[Object(c.jsx)(i,{overlap:"circular",anchorOrigin:{vertical:"bottom",horizontal:"right"},variant:"dot",children:Object(c.jsx)(r.a,{alt:"Remy Sharp",src:"/material-ui-static/images/avatar/1.jpg"})}),Object(c.jsx)(n.a,{overlap:"circular",anchorOrigin:{vertical:"bottom",horizontal:"right"},badgeContent:Object(c.jsx)(l,{alt:"Remy Sharp",src:"/material-ui-static/images/avatar/1.jpg"}),children:Object(c.jsx)(r.a,{alt:"Travis Howard",src:"/material-ui-static/images/avatar/2.jpg"})})]})}},1781:function(e,t,a){"use strict";a.r(t),t.default="import React from 'react';\nimport Badge from '@material-ui/core/Badge';\nimport Avatar from '@material-ui/core/Avatar';\nimport { makeStyles, withStyles } from '@material-ui/core/styles';\n\nconst StyledBadge = withStyles((theme) => ({\n  badge: {\n    backgroundColor: '#44b700',\n    color: '#44b700',\n    boxShadow: `0 0 0 2px ${theme.palette.background.paper}`,\n    '&::after': {\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      width: '100%',\n      height: '100%',\n      borderRadius: '50%',\n      animation: '$ripple 1.2s infinite ease-in-out',\n      border: '1px solid currentColor',\n      content: '\"\"',\n    },\n  },\n  '@keyframes ripple': {\n    '0%': {\n      transform: 'scale(.8)',\n      opacity: 1,\n    },\n    '100%': {\n      transform: 'scale(2.4)',\n      opacity: 0,\n    },\n  },\n}))(Badge);\n\nconst SmallAvatar = withStyles((theme) => ({\n  root: {\n    width: 22,\n    height: 22,\n    border: `2px solid ${theme.palette.background.paper}`,\n  },\n}))(Avatar);\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    display: 'flex',\n    '& > *': {\n      margin: theme.spacing(1),\n    },\n  },\n}));\n\nexport default function BadgeAvatars() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <StyledBadge\n        overlap=\"circular\"\n        anchorOrigin={{\n          vertical: 'bottom',\n          horizontal: 'right',\n        }}\n        variant=\"dot\"\n      >\n        <Avatar alt=\"Remy Sharp\" src=\"/material-ui-static/images/avatar/1.jpg\" />\n      </StyledBadge>\n      <Badge\n        overlap=\"circular\"\n        anchorOrigin={{\n          vertical: 'bottom',\n          horizontal: 'right',\n        }}\n        badgeContent={<SmallAvatar alt=\"Remy Sharp\" src=\"/material-ui-static/images/avatar/1.jpg\" />}\n      >\n        <Avatar alt=\"Travis Howard\" src=\"/material-ui-static/images/avatar/2.jpg\" />\n      </Badge>\n    </div>\n  );\n}\n"},2509:function(e,t,a){"use strict";a.r(t),a.d(t,"default",(function(){return p}));var n=a(0),r=a(1124),o=a(2),s=a(7),c=(a(139),a(1150)),i=a(11),l={small:-16,medium:null},u=n.forwardRef((function(e,t){var a=e.children,i=e.classes,u=e.className,d=e.max,m=void 0===d?5:d,p=e.spacing,f=void 0===p?"medium":p,h=Object(s.a)(e,["children","classes","className","max","spacing"]),j=m<2?2:m,v=n.Children.toArray(a).filter((function(e){return n.isValidElement(e)})),b=v.length>j?v.length-j+1:0,g=f&&void 0!==l[f]?l[f]:-f;return n.createElement("div",Object(o.a)({className:Object(c.a)(i.root,u),ref:t},h),v.slice(0,v.length-b).map((function(e,t){return n.cloneElement(e,{className:Object(c.a)(e.props.className,i.avatar),style:Object(o.a)({zIndex:v.length-t,marginLeft:0===t?void 0:g},e.props.style)})})),b?n.createElement(r.a,{className:i.avatar,style:{zIndex:0,marginLeft:g}},"+",b):null)})),d=Object(i.a)((function(e){return{root:{display:"flex"},avatar:{border:"2px solid ".concat(e.palette.background.default),marginLeft:-8,"&:first-child":{marginLeft:0}}}}),{name:"MuiAvatarGroup"})(u),m=a(1);function p(){return Object(m.jsxs)(d,{max:4,children:[Object(m.jsx)(r.a,{alt:"Remy Sharp",src:"/material-ui-static/images/avatar/1.jpg"}),Object(m.jsx)(r.a,{alt:"Travis Howard",src:"/material-ui-static/images/avatar/2.jpg"}),Object(m.jsx)(r.a,{alt:"Cindy Baker",src:"/material-ui-static/images/avatar/3.jpg"}),Object(m.jsx)(r.a,{alt:"Agnes Walker",src:"/material-ui-static/images/avatar/4.jpg"}),Object(m.jsx)(r.a,{alt:"Trevor Henderson",src:"/material-ui-static/images/avatar/5.jpg"})]})}},2561:function(e,t,a){"use strict";a.r(t);var n=a(1130),r=a(1098),o=a(1090),s=a(194),c=a(1072),i=a(1);const l=Object(c.a)((e=>({layoutRoot:{"& .description":{marginBottom:16}}})));t.default=function(e){return l(),Object(i.jsxs)(i.Fragment,{children:[Object(i.jsx)("div",{className:"flex flex-1 flex-grow-0 items-center justify-end",children:Object(i.jsxs)(r.a,{className:"normal-case",variant:"outlined",component:"a",href:"https://material-ui.com/components/avatars",target:"_blank",role:"button",children:[Object(i.jsx)(o.a,{children:"link"}),Object(i.jsx)("span",{className:"mx-4",children:"Reference"})]})}),Object(i.jsx)(s.a,{className:"text-44 mt-32 mb-8",component:"h1",children:"Avatar"}),Object(i.jsx)(s.a,{className:"description",children:"Avatars are found throughout material design with uses in everything from tables to dialog menus."}),Object(i.jsx)(s.a,{className:"text-32 mt-32 mb-8",component:"h2",children:"Image avatars"}),Object(i.jsxs)(s.a,{className:"mb-16",component:"div",children:["Image avatars can be created by passing standard ",Object(i.jsx)("code",{children:"img"})," props ",Object(i.jsx)("code",{children:"src"})," or"," ",Object(i.jsx)("code",{children:"srcSet"})," to the component."]}),Object(i.jsx)(s.a,{className:"mb-16",component:"div",children:Object(i.jsx)(n.a,{className:"my-24",iframe:!1,component:a(1766).default,raw:a(1767)})}),Object(i.jsx)(s.a,{className:"text-32 mt-32 mb-8",component:"h2",children:"Letter avatars"}),Object(i.jsxs)(s.a,{className:"mb-16",component:"div",children:["Avatars containing simple characters can be created by passing a string as"," ",Object(i.jsx)("code",{children:"children"}),"."]}),Object(i.jsx)(s.a,{className:"mb-16",component:"div",children:Object(i.jsx)(n.a,{className:"my-24",iframe:!1,component:a(1768).default,raw:a(1769)})}),Object(i.jsx)(s.a,{className:"text-32 mt-32 mb-8",component:"h2",children:"Sizes"}),Object(i.jsxs)(s.a,{className:"mb-16",component:"div",children:["You can change the size of the avatar with the ",Object(i.jsx)("code",{children:"height"})," and ",Object(i.jsx)("code",{children:"width"})," ","CSS properties."]}),Object(i.jsx)(s.a,{className:"mb-16",component:"div",children:Object(i.jsx)(n.a,{className:"my-24",iframe:!1,component:a(1770).default,raw:a(1771)})}),Object(i.jsx)(s.a,{className:"text-32 mt-32 mb-8",component:"h2",children:"Icon avatars"}),Object(i.jsxs)(s.a,{className:"mb-16",component:"div",children:["Icon avatars are created by passing an icon as ",Object(i.jsx)("code",{children:"children"}),"."]}),Object(i.jsx)(s.a,{className:"mb-16",component:"div",children:Object(i.jsx)(n.a,{className:"my-24",iframe:!1,component:a(1772).default,raw:a(1774)})}),Object(i.jsx)(s.a,{className:"text-32 mt-32 mb-8",component:"h2",children:"Variants"}),Object(i.jsxs)(s.a,{className:"mb-16",component:"div",children:["If you need square or rounded avatars, use the ",Object(i.jsx)("code",{children:"variant"})," prop."]}),Object(i.jsx)(s.a,{className:"mb-16",component:"div",children:Object(i.jsx)(n.a,{className:"my-24",iframe:!1,component:a(1775).default,raw:a(1776)})}),Object(i.jsx)(s.a,{className:"text-32 mt-32 mb-8",component:"h2",children:"Fallbacks"}),Object(i.jsx)(s.a,{className:"mb-16",component:"div",children:"If there is an error loading the avatar image, the component falls back to an alternative in the following order:"}),Object(i.jsxs)("ul",{children:[Object(i.jsx)("li",{children:"the provided children"}),Object(i.jsxs)("li",{children:["the first letter of the ",Object(i.jsx)("code",{children:"alt"})," text"]}),Object(i.jsx)("li",{children:"a generic avatar icon"})]}),Object(i.jsx)(s.a,{className:"mb-16",component:"div",children:Object(i.jsx)(n.a,{className:"my-24",iframe:!1,component:a(1777).default,raw:a(1778)})}),Object(i.jsx)(s.a,{className:"text-32 mt-32 mb-8",component:"h2",children:"Grouped"}),Object(i.jsxs)(s.a,{className:"mb-16",component:"div",children:[Object(i.jsx)("code",{children:"AvatarGroup"})," renders its children as a stack."]}),Object(i.jsx)(s.a,{className:"mb-16",component:"div",children:Object(i.jsx)(n.a,{className:"my-24",iframe:!1,component:a(2509).default,raw:a(1779)})}),Object(i.jsx)(s.a,{className:"text-32 mt-32 mb-8",component:"h2",children:"With badge"}),Object(i.jsx)(s.a,{className:"mb-16",component:"div",children:Object(i.jsx)(n.a,{className:"my-24",iframe:!1,component:a(1780).default,raw:a(1781)})})]})}}}]);

Zerion Mini Shell 1.0