Current File : /home/opti/public_html/ezone-accounting.optisoft.com.ng/static/js/180.8dcd615a.chunk.js
(this["webpackJsonpfuse-react-app"]=this["webpackJsonpfuse-react-app"]||[]).push([[180],{2548:function(e,a,t){"use strict";t.r(a);var c=t(118),n=t(1098),s=t(194),i=t(6),o=t(45),r=t(1);a.default=function(e){const a=Object(i.b)();return Object(r.jsxs)(r.Fragment,{children:[Object(r.jsx)(s.a,{variant:"h4",className:"mb-24",children:"FuseMessage"}),Object(r.jsxs)(s.a,{className:"mb-16",component:"p",children:[Object(r.jsx)("code",{children:"FuseMessage"})," is a simple snackbar trigger for easily showing messages via redux action. It should be located in the theme layouts."]}),Object(r.jsx)(s.a,{className:"mt-32 mb-8",variant:"h5",children:"Usage"}),Object(r.jsx)(s.a,{className:"mb-16",component:"p",children:"You can show messages anywhere with dispatching the action showMessage, it is using Material-UI's snackbar so you can pass the props in the object:"}),Object(r.jsx)(c.a,{component:"pre",className:"language-jsx",children:"\n <Button \n onClick={()=> dispatch(\n showMessage({\n message : 'Hi, how are you?',//text or html\n autoHideDuration: 6000,//ms\n anchorOrigin: {\n vertical : 'top',//top bottom\n horizontal: 'right'//left center right\n },\n variant: 'success'//success error info warning null\n }))}\n >\n Top - Right\n </Button>\n "}),Object(r.jsx)(s.a,{className:"mt-32 mb-8",variant:"h5",children:"Example"}),Object(r.jsx)(s.a,{className:"mt-32 mb-8",variant:"h6",children:"Position"}),Object(r.jsxs)("div",{children:[Object(r.jsx)(n.a,{onClick:()=>a(Object(o.c)({message:"Hi, how are you?",anchorOrigin:{vertical:"top",horizontal:"right"}})),children:"Top - Right"}),Object(r.jsx)(n.a,{onClick:()=>a(Object(o.c)({message:"Hi, how are you?",anchorOrigin:{vertical:"top",horizontal:"center"}})),children:"Top-Center"}),Object(r.jsx)(n.a,{onClick:()=>a(Object(o.c)({message:"Hi, how are you?",anchorOrigin:{vertical:"top",horizontal:"left"}})),children:"Top-Left"}),Object(r.jsx)(n.a,{onClick:()=>a(Object(o.c)({message:"Hi, how are you?",anchorOrigin:{vertical:"bottom",horizontal:"right"}})),children:"Bottom-Right"}),Object(r.jsx)(n.a,{onClick:()=>a(Object(o.c)({message:"Hi, how are you?",anchorOrigin:{vertical:"bottom",horizontal:"center"}})),children:"Bottom-Center"}),Object(r.jsx)(n.a,{onClick:()=>a(Object(o.c)({message:"Hi, how are you?",anchorOrigin:{vertical:"bottom",horizontal:"left"}})),children:"Bottom-Left"})]}),Object(r.jsx)(s.a,{className:"mt-32 mb-8",variant:"h6",children:"Variants"}),Object(r.jsxs)("div",{children:[Object(r.jsx)(n.a,{onClick:()=>a(Object(o.c)({message:"Hi, how are you?"})),children:"Default"}),Object(r.jsx)(n.a,{onClick:()=>a(Object(o.c)({message:"Hi, how are you?",variant:"success"})),children:"Success"}),Object(r.jsx)(n.a,{onClick:()=>a(Object(o.c)({message:"Hi, how are you?",variant:"warning"})),children:"Warning"}),Object(r.jsx)(n.a,{onClick:()=>a(Object(o.c)({message:"Hi, how are you?",variant:"error"})),children:"Error"}),Object(r.jsx)(n.a,{onClick:()=>a(Object(o.c)({message:"Hi, how are you?",variant:"info"})),children:"Info"})]})]})}}}]);
Mini Shell