1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[9702],{3946:function(e,s,a){(window.__NEXT_P=window.__NEXT_P||[]).push(["/components/bootstrap/alerts",function(){return a(36544)}])},36544:function(e,s,a){"use strict";a.r(s),a.d(s,{default:function(){return A}});var t=a(85893),i=a(67294),n=a(34051),l=a(31555),r=a(51852),c=a(52686),d=a(34289),o=a(9966);let m=[{id:"1",variant:"primary",text:"Primary alertâAt vero eos et accusamus praesentium!"},{id:"2",variant:"secondary",text:" Secondary alertâAt vero eos et accusamus praesentium!"},{id:"3",variant:"success",text:" Success alertâAt vero eos et accusamus praesentium!"},{id:"4",variant:"info",text:"Info alertâAt vero eos et accusamus praesentium!"},{id:"5",variant:"warning",text:"Warning alertâAt vero eos et accusamus praesentium!"},{id:"6",variant:"danger",text:"Danger alertâAt vero eos et accusamus praesentium!"}],h=[{id:"1",show:"Well done!",variant:"primary",text1:" You successfully read",text2:"this important alert message."},{id:"2",show:"Well done!",variant:"secondary",text1:" You successfully read",text2:"this important alert message."},{id:"3",show:"Well done!",variant:"success",text1:" You successfully read",text2:"this important alert message."},{id:"4",show:"Heads up!",variant:"info",text:"This",text2:"alert needs your attention,",text3:"but its not super important."},{id:"5",show:"Warning!",variant:"warning",text:"Better check yourself, youre",text2:"not looking too good."},{id:"6",show:"Oh snap!",variant:"danger",text:"Change a few things up",text2:"and try submitting again."}],x=[{id:"1",icon:(0,t.jsx)("i",{className:"fa fa-check-circle-o me-2","aria-hidden":"true"}),variant:"success",text:" Well done! You successfully read this important alert message."},{id:"2",icon:(0,t.jsx)("i",{className:"fa fa-bell-o me-2","aria-hidden":"true"}),variant:"info",text:" Heads up! This alert needs your attention, but it's not super important."},{id:"3",icon:(0,t.jsx)("i",{className:"fa fa-exclamation me-2","aria-hidden":"true"}),variant:"warning",text:" Warning! Better check yourself, you're not looking too good."},{id:"4",icon:(0,t.jsx)("i",{className:"fa fa-frown-o me-2","aria-hidden":"true"}),variant:"danger",text:"Oh snap!Change a few things up and try submitting again."}],j=[{id:"1",classname:"alert-avatar alert-primary alert-dismissible",variant:"primary",pic:"../../../assets/images/users/14.jpg"},{id:"2",classname:"alert-avatar alert-success alert-dismissible",variant:"success",pic:"../../../assets/images/users/5.jpg"},{id:"3",classname:"alert-avatar alert-warning alert-dismissible",variant:"warning",pic:"../../../assets/images/users/15.jpg"},{id:"4",classname:"alert-avatar alert-danger alert-dismissible",variant:"danger",pic:"../../../assets/images/users/6.jpg"}],u=[{id:"1",classname:"alert-default",variant:"default",icon:(0,t.jsx)("i",{className:"fe fe-download"}),show:"Default!"},{id:"2",classname:"alert-primary",variant:"primary",icon:(0,t.jsx)("i",{className:"fe fe-check-square"}),show:"Primary!"},{id:"3",classname:"alert-success",variant:"success",icon:(0,t.jsx)("i",{className:"fe fe-thumbs-up"}),show:"Success!"},{id:"4",classname:"alert-info",variant:"info",icon:(0,t.jsx)("i",{className:"fe fe-bell"}),show:"Info!"},{id:"5",classname:"alert-warning",variant:"warning",icon:(0,t.jsx)("i",{className:"fe fe-info"}),show:"Warning!"},{id:"6",classname:"alert-danger mb-0",variant:"danger",icon:(0,t.jsx)("i",{className:"fe fe-slash"}),show:"Danger!"}],p=[{id:"1",classname:"alert-default",variant:"default",icon:(0,t.jsx)("i",{className:"fe fe-download"}),show:"Default!"},{id:"2",classname:"alert-primary",variant:"primary",icon:(0,t.jsx)("i",{className:"fe fe-check-square"}),show:"Primary!"},{id:"3",classname:"alert-success",variant:"success",icon:(0,t.jsx)("i",{className:"fe fe-thumbs-up"}),show:"Success!"},{id:"4",classname:"alert-info",variant:"info",icon:(0,t.jsx)("i",{className:"fe fe-bell"}),show:"Info!"},{id:"5",classname:"alert-warning",variant:"warning",icon:(0,t.jsx)("i",{className:"fe fe-info"}),show:"Warning!"},{id:"6",classname:"alert-danger mb-0",variant:"danger",icon:(0,t.jsx)("i",{className:"fe fe-slash"}),show:"Danger!"}],f=[{id:1,color:"success",className:"icon-dimiss",icon:(0,t.jsxs)("svg",{xmlns:"http:www.w3.org/2000/svg",height:"40",width:"40",viewBox:"0 0 24 24",children:[(0,t.jsx)("path",{fill:"#13bfa6",d:"M10.3125,16.09375a.99676.99676,0,0,1-.707-.293L6.793,12.98828A.99989.99989,0,0,1,8.207,11.57422l2.10547,2.10547L15.793,8.19922A.99989.99989,0,0,1,17.207,9.61328l-6.1875,6.1875A.99676.99676,0,0,1,10.3125,16.09375Z",opacity:".99"}),(0,t.jsx)("path",{fill:"#71d8c9",d:"M12,2A10,10,0,1,0,22,12,10.01146,10.01146,0,0,0,12,2Zm5.207,7.61328-6.1875,6.1875a.99963.99963,0,0,1-1.41406,0L6.793,12.98828A.99989.99989,0,0,1,8.207,11.57422l2.10547,2.10547L15.793,8.19922A.99989.99989,0,0,1,17.207,9.61328Z"})]}),Title:"Success message",description:"You successfully read this important alert message."},{id:2,color:"info",className:"icon-dimiss",icon:(0,t.jsxs)("svg",{xmlns:"http:www.w3.org/2000/svg",height:"40",width:"40",viewBox:"0 0 24 24",children:[(0,t.jsx)("path",{fill:"#70a9ee",d:"M20.05713,22H3.94287A3.02288,3.02288,0,0,1,1.3252,17.46631L9.38232,3.51123a3.02272,3.02272,0,0,1,5.23536,0L22.6748,17.46631A3.02288,3.02288,0,0,1,20.05713,22Z"}),(0,t.jsx)("circle",{cx:"12",cy:"17",r:"1",fill:"#1170e4"}),(0,t.jsx)("path",{fill:"#1170e4",d:"M12,14a1,1,0,0,1-1-1V9a1,1,0,0,1,2,0v4A1,1,0,0,1,12,14Z"})]}),Title:"Info message",description:"This alert needs your attention, but it's not super important."},{id:3,color:"warning",className:"icon-dimiss",icon:(0,t.jsxs)("svg",{xmlns:"http:www.w3.org/2000/svg",height:"40",width:"40",viewBox:"0 0 24 24",children:[(0,t.jsx)("path",{fill:"#fad383",d:"M15.728,22H8.272a1.00014,1.00014,0,0,1-.707-.293l-5.272-5.272A1.00014,1.00014,0,0,1,2,15.728V8.272a1.00014,1.00014,0,0,1,.293-.707l5.272-5.272A1.00014,1.00014,0,0,1,8.272,2H15.728a1.00014,1.00014,0,0,1,.707.293l5.272,5.272A1.00014,1.00014,0,0,1,22,8.272V15.728a1.00014,1.00014,0,0,1-.293.707l-5.272,5.272A1.00014,1.00014,0,0,1,15.728,22Z"}),(0,t.jsx)("circle",{cx:"12",cy:"16",r:"1",fill:"#f7b731"}),(0,t.jsx)("path",{fill:"#f7b731",d:"M12,13a1,1,0,0,1-1-1V8a1,1,0,0,1,2,0v4A1,1,0,0,1,12,13Z"})]}),Title:"Warning message",description:"Best check yo self, you're not looking too good"},{id:4,color:"danger",className:"icon-dimiss",icon:(0,t.jsxs)("svg",{xmlns:"http:www.w3.org/2000/svg",height:"40",width:"40",viewBox:"0 0 24 24",children:[(0,t.jsx)("path",{fill:"#f07f8f",d:"M20.05713,22H3.94287A3.02288,3.02288,0,0,1,1.3252,17.46631L9.38232,3.51123a3.02272,3.02272,0,0,1,5.23536,0L22.6748,17.46631A3.02288,3.02288,0,0,1,20.05713,22Z"}
1),(0,t.jsx)("circle",{cx:"12",cy:"17",r:"1",fill:"#e62a45"}),(0,t.jsx)("path",{fill:"#e62a45",d:"M12,14a1,1,0,0,1-1-1V9a1,1,0,0,1,2,0v4A1,1,0,0,1,12,14Z"})]}),Title:"Danger message",description:"Change a few things up and try submitting again."}],g=[{id:1,icon:(0,t.jsx)("span",{className:"",children:(0,t.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",height:"60",width:"60",viewBox:"0 0 24 24",children:[(0,t.jsx)("path",{fill:"#f07f8f",d:"M20.05713,22H3.94287A3.02288,3.02288,0,0,1,1.3252,17.46631L9.38232,3.51123a3.02272,3.02272,0,0,1,5.23536,0L22.6748,17.46631A3.02288,3.02288,0,0,1,20.05713,22Z"}),(0,t.jsx)("circle",{cx:"12",cy:"17",r:"1",fill:"#e62a45"}),(0,t.jsx)("path",{fill:"#e62a45",d:"M12,14a1,1,0,0,1-1-1V9a1,1,0,0,1,2,0v4A1,1,0,0,1,12,14Z"})]})}),title:"Warning",text:"Are you sure you want to delete 20 items",color:"danger",buttonName:"Delete"},{id:2,icon:(0,t.jsx)("span",{className:"",children:(0,t.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",height:"60",width:"60",viewBox:"0 0 24 24",children:[(0,t.jsx)("path",{fill:"#fad383",d:"M15.728,22H8.272a1.00014,1.00014,0,0,1-.707-.293l-5.272-5.272A1.00014,1.00014,0,0,1,2,15.728V8.272a1.00014,1.00014,0,0,1,.293-.707l5.272-5.272A1.00014,1.00014,0,0,1,8.272,2H15.728a1.00014,1.00014,0,0,1,.707.293l5.272,5.272A1.00014,1.00014,0,0,1,22,8.272V15.728a1.00014,1.00014,0,0,1-.293.707l-5.272,5.272A1.00014,1.00014,0,0,1,15.728,22Z"}),(0,t.jsx)("circle",{cx:"12",cy:"16",r:"1",fill:"#f7b731"}),(0,t.jsx)("path",{fill:"#f7b731",d:"M12,13a1,1,0,0,1-1-1V8a1,1,0,0,1,2,0v4A1,1,0,0,1,12,13Z"})]})}),title:"Alert",text:"Are you sure you want to end current services",color:"warning",buttonName:"End"},{id:3,icon:(0,t.jsx)("span",{className:"",children:(0,t.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",height:"60",width:"60",viewBox:"0 0 24 24",children:[(0,t.jsx)("path",{fill:"#13bfa6",d:"M10.3125,16.09375a.99676.99676,0,0,1-.707-.293L6.793,12.98828A.99989.99989,0,0,1,8.207,11.57422l2.10547,2.10547L15.793,8.19922A.99989.99989,0,0,1,17.207,9.61328l-6.1875,6.1875A.99676.99676,0,0,1,10.3125,16.09375Z",opacity:".99"}),(0,t.jsx)("path",{fill:"#71d8c9",d:"M12,2A10,10,0,1,0,22,12,10.01146,10.01146,0,0,0,12,2Zm5.207,7.61328-6.1875,6.1875a.99963.99963,0,0,1-1.41406,0L6.793,12.98828A.99989.99989,0,0,1,8.207,11.57422l2.10547,2.10547L15.793,8.19922A.99989.99989,0,0,1,17.207,9.61328Z"})]})}),title:"Success",text:"Sent successfully",color:"success",buttonName:"close"},{id:4,icon:(0,t.jsx)("span",{className:"",children:(0,t.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",height:"60",width:"60","data-name":"Layer 1",viewBox:"0 0 24 24",children:(0,t.jsx)("path",{fill:"#05c3fb",d:"M12 1.99951a.99974.99974 0 0 0-1 1v2a1 1 0 1 0 2 0v-2A.99974.99974 0 0 0 12 1.99951zM12 17.99951a.99974.99974 0 0 0-1 1v2a1 1 0 0 0 2 0v-2A.99974.99974 0 0 0 12 17.99951zM21 10.99951H19a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2zM6 11.99951a.99974.99974 0 0 0-1-1H3a1 1 0 0 0 0 2H5A.99974.99974 0 0 0 6 11.99951zM17.19629 8.99951a1.0001 1.0001 0 0 0 .86719.5.99007.99007 0 0 0 .499-.13428l1.73145-1a.99974.99974 0 1 0-1-1.73144l-1.73145 1A.9993.9993 0 0 0 17.19629 8.99951zM6.80371 14.99951a.99936.99936 0 0 0-1.36621-.36572l-1.73145 1a.99974.99974 0 1 0 1 1.73144l1.73145-1A.9993.9993 0 0 0 6.80371 14.99951zM15 6.80371a1.0006 1.0006 0 0 0 1.36621-.36621l1-1.73193a1.00016 1.00016 0 1 0-1.73242-1l-1 1.73193A1 1 0 0 0 15 6.80371zM3.70605 8.36523l1.73145 1a.99007.99007 0 0 0 .499.13428.99977.99977 0 0 0 .501-1.86572l-1.73145-1a.99974.99974 0 1 0-1 1.73144zM9 17.1958a.99946.99946 0 0 0-1.36621.36621l-1 1.73194a1.00016 1.00016 0 0 0 1.73242 1l1-1.73194A1 1 0 0 0 9 17.1958zM20.294 15.63379l-1.73145-1a.99974.99974 0 1 0-1 1.73144l1.73145 1a.99.99 0 0 0 .499.13428.99977.99977 0 0 0 .501-1.86572zM16.36621 17.562a1.00016 1.00016 0 1 0-1.73242 1l1 1.73194a1.00016 1.00016 0 1 0 1.73242-1z"})})}),title:"Processing",text:"Your process currently in progress",color:"info",buttonName:"Stop"}];var v=a(72867),w=a(41664),N=a.n(w),Z=a(33272);let k=()=>{let[e,s]=(0,i.useState)(g),[a,w]=(0,i.useState)(!1),[k,A]=(0,i.useState)(!1),[b,y]=(0,i.useState)(!1),[L,R]=(0,i.useState)(h),C=e=>{let s=L.filter(s=>s.id!==e);R(s)}
1,[S,F]=(0,i.useState)(!1),[M,T]=(0,i.useState)(x),H=e=>{let s=M.filter(s=>s.id!==e);T(s)},[B,W]=(0,i.useState)(!1),[O,_]=(0,i.useState)(j),E=e=>{let s=O.filter(s=>s.id!==e);_(s)},[z,D]=(0,i.useState)(f),[I,V]=(0,i.useState)(!1);function P(e){let s=z.filter(s=>s.id!==e);D(s)}let[Y,q]=(0,i.useState)(!1),[$,X]=(0,i.useState)(p),G=e=>{let s=$.filter(s=>s.id!==e);X(s)};return(0,t.jsxs)("div",{children:[(0,t.jsx)(Z.Z,{title:"Alerts"}),(0,t.jsx)(v.Z,{titles:"Alerts",active:"Alerts",items:["Componets"]}),(0,t.jsx)(n.Z,{children:e.map(a=>(0,t.jsx)(l.Z,{xl:3,sm:6,children:(0,t.jsxs)(r.Z,{className:"bg-white border p-0 pb-3 mb-5",children:[(0,t.jsx)(c.Z.Header,{className:"border-0 pt-3",children:(0,t.jsx)("div",{className:"card-options",children:(0,t.jsx)(N(),{href:"#!",onClick:()=>{!function(a){let t=e.filter(e=>e.id!==a);s(t)}(a.id)},children:(0,t.jsx)("i",{className:"fe fe-x icon-dimiss"})})})}),(0,t.jsxs)(c.Z.Body,{className:"text-center",children:[a.icon,(0,t.jsx)("h4",{className:"mb-0 mt-3 text-dark",children:a.title}),(0,t.jsx)(c.Z.Text,{className:"text-dark",children:a.title})]}),(0,t.jsx)(c.Z.Footer,{className:"text-center border-0 pt-0",children:(0,t.jsx)(n.Z,{children:(0,t.jsxs)("div",{className:"text-center",children:[(0,t.jsx)(N(),{href:"#!",className:"btn btn-white me-2",children:"cancel"}),(0,t.jsx)(N(),{href:"#!",className:"btn btn-".concat(a.color),children:a.buttonName})]})})})]})},Math.random()))}),(0,t.jsxs)(n.Z,{children:[(0,t.jsx)(l.Z,{md:6,children:(0,t.jsxs)(c.Z,{children:[(0,t.jsx)(c.Z.Header,{children:(0,t.jsx)(c.Z.Title,{children:"Default alerts"})}),(0,t.jsx)(c.Z.Body,{children:(0,t.jsxs)("div",{className:"text-wrap",children:[(0,t.jsxs)("p",{children:["Add ",(0,t.jsx)("code",{className:"highlighter-rouge",children:'className="alert alert-primary|secondary|success|info|warning|danger"'})," use one of the ",(0,t.jsx)("b",{children:"required"})," className."]}),(0,t.jsxs)("div",{className:"example",children:[(0,t.jsx)(d.Z,{className:"mb-3 d-flex ms-auto",children:(0,t.jsx)(d.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>w(!a),className:"showcode d-flex ms-auto "})}),m.map((e,s)=>(0,t.jsx)(i.Fragment,{children:(0,t.jsxs)(r.Z,{className:"",variant:e.variant,children:[" ",e.text]})},s)),(0,t.jsx)(o.Z,{in:a,className:"",children:(0,t.jsx)("div",{id:"example-collapse-text",children:(0,t.jsx)("pre",{children:(0,t.jsx)("code",{children:'\n <React.Fragment>\n {list.map((item, k) => (\n <React.Fragment key={k}>\n <Alert\n className=""\n variant={item.variant}\n >\n {" "}\n {item.text}\n </Alert>\n </React.Fragment>\n ))}\n</React.Fragment>\n'})})})})]})]})})]})}),(0,t.jsx)(l.Z,{md:6,children:(0,t.jsxs)(c.Z,{children:[(0,t.jsx)(c.Z.Header,{children:(0,t.jsx)(c.Z.Title,{children:"Links in alerts"})}),(0,t.jsx)(c.Z.Body,{children:(0,t.jsxs)("div",{className:"text-wrap",children:[(0,t.jsxs)("p",{children:["Add ",(0,t.jsx)("code",{className:"highlighter-rouge",children:".alert-link"})," className to quickly provide matching colored links within any alert"]}),(0,t.jsxs)("div",{className:"example",children:[(0,t.jsx)(d.Z,{className:"mb-3 d-flex ms-auto",children:(0,t.jsx)(d.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>y(!b),className:"showcode d-flex ms-auto "})}),L.map((e,s)=>(0,t.jsx)(i.Fragment,{children:(0,t.jsxs)(r.Z,{variant:e.variant,className:"alert-dismissible",children:[(0,t.jsx)("span",{children:(0,t.jsx)("i",{className:"fe fe-x icon-dimiss",onClick:()=>C(e.id)})}),(0,t.jsx)("strong",{children:e.show})," ",e.text," ",(0,t.jsx)(r.Z.Link,{href:"#!",className:"alert-link",children:e.text2})]})},s)),(0,t.jsx)(o.Z,{in:b,className:"",children:(0,t.jsx)("div",{id:"example-collapse-text",children:(0,t.jsx)("pre",{children:(0,t.jsx)("code",{children:'\nexport const LinkAlert = () => {\n const [open, setOpen] = useState(false);\n const [list, setList] = useState(LinkAlertList);\n const handleRemove =(id)=> {\n const newList = list.filter((lit) => lit.id !== id);\n setList(newList);\n }\n return (\n <React.Fragment>\n {list.map((item, k) => (\n <React.Fragment key={k}>\n <Alert variant={item.variant} className="alert-dismissible">\n <strong>{item.show}</strong> {item.text} <Alert.Link href="#!" className="alert-link">{item.text2}</Alert.Link>
1\n <span><i className="fe fe-x icon-dimiss" onClick={() => handleRemove(item.id)}></i></span>\n </Alert>\n </React.Fragment>\n ))}\n </React.Fragment>\n );\n};\n'})})})})]})]})})]})})]}),(0,t.jsxs)(n.Z,{children:[(0,t.jsx)(l.Z,{md:6,children:(0,t.jsxs)(c.Z,{children:[(0,t.jsx)(c.Z.Header,{children:(0,t.jsx)(c.Z.Title,{children:"Alert with icon"})}),(0,t.jsx)(c.Z.Body,{children:(0,t.jsxs)("div",{className:"text-wrap",children:[(0,t.jsxs)("p",{children:["Add ",(0,t.jsx)("code",{className:"highlighter-rouge",children:".alert-icon"})," className."]}),(0,t.jsxs)("div",{className:"example",children:[(0,t.jsx)(d.Z,{className:"mb-3 d-flex ms-auto",children:(0,t.jsx)(d.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>F(!S),className:"showcode d-flex ms-auto "})}),M.map((e,s)=>(0,t.jsx)(i.Fragment,{children:(0,t.jsxs)(r.Z,{variant:e.variant,className:"alert-dismissible",children:[(0,t.jsx)("span",{children:(0,t.jsx)("i",{className:"fe fe-x icon-dimiss",onClick:()=>H(e.id)})}),e.icon,e.text]})},s)),(0,t.jsx)(o.Z,{in:S,className:"",children:(0,t.jsx)("div",{id:"example-collapse-text",children:(0,t.jsx)("pre",{children:(0,t.jsx)("code",{children:'\n export const LinkAlert = () => {\n const [open, setOpen] = useState(false);\n const [list, setList] = useState(LinkAlertList);\n const handleRemove =(id)=> {\n const newList = list.filter((lit) => lit.id !== id);\n setList(newList);\n }\n return (\n <React.Fragment>\n {list.map((item, k) => (\n <React.Fragment key={k}>\n <Alert variant={item.variant} className="alert-dismissible">\n <strong>{item.show}</strong> {item.text} <Alert.Link href="#!" className="alert-link">{item.text2}</Alert.Link>\n <span><i className="fe fe-x icon-dimiss" onClick={() => handleRemove(item.id)}></i></span>\n </Alert>\n </React.Fragment>\n ))}\n </React.Fragment>\n );\n };\n '})})})})]})]})})]})}),(0,t.jsx)(l.Z,{md:6,children:(0,t.jsxs)(c.Z,{children:[(0,t.jsx)(c.Z.Header,{children:(0,t.jsx)(c.Z.Title,{children:"Alert with avatar"})}),(0,t.jsx)(c.Z.Body,{children:(0,t.jsxs)("div",{className:"text-wrap",children:[(0,t.jsxs)("p",{children:["Add ",(0,t.jsx)("code",{className:"highlighter-rouge",children:".alert-avatar"})," className."]}),(0,t.jsxs)("div",{className:"example",children:[(0,t.jsx)(d.Z,{className:"mb-3 d-flex ms-auto",children:(0,t.jsx)(d.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>W(!B),className:"showcode d-flex ms-auto "})}),O.map((e,s)=>(0,t.jsx)(i.Fragment,{children:(0,t.jsxs)(r.Z,{variant:e.variant,className:e.classname,children:[(0,t.jsx)("span",{children:(0,t.jsx)("i",{className:"fe fe-x icon-dimiss",onClick:()=>E(e.id)})}),(0,t.jsx)("img",{className:"avatar brround cover-image",alt:"",src:e.pic})," Lorem ipsum dolor sit amet, consectetur adipisicing elit."]})},s)),(0,t.jsx)(o.Z,{in:B,className:"",children:(0,t.jsx)("div",{id:"example-collapse-text",children:(0,t.jsx)("pre",{children:(0,t.jsx)("code",{children:'\nexport const LinkAlert = () => {\n const [open, setOpen] = useState(false);\n const [list, setList] = useState(AvatarList);\n const handleRemove =(id)=> {\n const newList = list.filter((lit) => lit.id !== id);\n setList(newList);\n }\n return (\n <React.Fragment>\n {list.map((item, k) => (\n <React.Fragment key={k}>\n <Alert variant={item.variant} className={item.classname}>\n <img className="avatar brround cover-image" alt=\'\' src={item.pic} /> Lorem ipsum dolor sit amet, consectetur adipisicing elit.\n <span><i className="fe fe-x icon-dimiss" onClick={() => handleRemove(item.id)}></i></span>\n </Alert>\n </React.Fragment>\n ))}\n </React.Fragment>\n );\n};\n'})})})})]})]})})]})})]}),(0,t.jsxs)(n.Z,{children:[(0,t.jsx)(l.Z,{xl:6,children:(0,t.jsxs)(c.Z,{children:[(0,t.jsx)(c.Z.Header,{children:(0,t.jsx)(c.Z.Title,{children:"Alerts With Icons"})}),(0,t.jsx)(c.Z.Body,{children:(0,t.jsxs)("div",{className:"text-wrap",children:[(0,t.jsxs)("p",{children:["Add ",(0,t.jsx)("code",{className:"highlighter-rouge",children:".alert-avatar"})," className."]}),(0,t.jsxs)("div",{className:"example",children:[(0,t.jsx)(d.Z,{className:"mb-3 d-flex ms-auto",children:(0,t.jsx)(d.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>A(!k),className:"showcode d-flex ms-auto"})}),u.map((e,s)=>(0,t.jsx)(i.Fragment,{children:(0,t.jsxs)(r.Z,{variant:e.variant,className:e.classname,role:"alert",children:[(0,t.jsx)("span",{className:"alert-inner--icon mx-2",children:e.icon}),(0,t.jsxs)("span",{className:"alert-inner--text",children:[(0,t.jsx)("strong",{children:e.show})," This is a warning alertâcheck it out that has an icon too!"]})]})},s)),(0,t.jsx)(o.Z,{in:k,className:"",children:(0,t.jsx)("div",{id:"example-collapse-text",children:(0,t.jsx)("pre",{children:(0,t.jsx)("code",{children:'\nexport const LinkAlert = () => {\n const [open, setOpen] = useState(false);\n const [list, setList] = useState(AlertList);\n const handleRemove =(id)=> {\n const newList = list.filter((lit) => lit.id !== id);
1\n setList(newList);\n }\n return (\n <React.Fragment>\n {list.map((item, k) => (\n <React.Fragment key={k}>\n <Alert className={item.classname} variant={item.variant} >\n <span className="alert-inner--icon">{item.icon}</span>\n <span className="alert-inner--text"><strong>{item.show}</strong> This is a default alertâcheck it out!</span>\n <span><i className="fe fe-x icon-dimiss" onClick={() => handleRemove(item.id)}></i></span>\n </Alert>\n </React.Fragment>\n ))}\n </React.Fragment>\n );\n};\n'})})})})]})]})})]})}),(0,t.jsx)(l.Z,{xl:6,children:(0,t.jsxs)(c.Z,{children:[(0,t.jsx)(c.Z.Header,{children:(0,t.jsx)(c.Z.Title,{className:"mb-0",children:"Alerts With Icons Dismissing"})}),(0,t.jsx)(c.Z.Body,{children:(0,t.jsxs)("div",{className:"text-wrap",children:[(0,t.jsxs)("p",{children:["Add ",(0,t.jsx)("code",{className:"highlighter-rouge",children:".alert-dismissible"})," className."]}),(0,t.jsxs)("div",{className:"example",children:[(0,t.jsx)(d.Z,{className:"mb-3 d-flex ms-auto",children:(0,t.jsx)(d.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>q(!Y),className:"showcode d-flex ms-auto "})}),$.map((e,s)=>(0,t.jsx)(i.Fragment,{children:(0,t.jsxs)(r.Z,{className:e.classname,variant:e.variant,children:[(0,t.jsx)("span",{children:(0,t.jsx)("i",{className:"fe fe-x icon-dimiss",onClick:()=>G(e.id)})}),(0,t.jsx)("span",{className:"alert-inner--icon mx-2",children:e.icon}),(0,t.jsxs)("span",{className:"alert-inner--text",children:[(0,t.jsx)("strong",{children:e.show})," This is a default alertâcheck it out!"]})]})},s)),(0,t.jsx)(o.Z,{in:Y,className:"",children:(0,t.jsx)("div",{id:"example-collapse-text",children:(0,t.jsx)("pre",{children:(0,t.jsx)("code",{children:'\nexport const LinkAlert = () => {\n const [open, setOpen] = useState(false);\n const [list, setList] = useState(AlertList);\n const handleRemove =(id)=> {\n const newList = list.filter((lit) => lit.id !== id);\n setList(newList);\n }\n return (\n <React.Fragment>\n {list.map((item, k) => (\n <React.Fragment key={k}>\n <Alert className={item.classname} variant={item.variant} >\n <span className="alert-inner--icon">{item.icon}</span>\n <span className="alert-inner--text"><strong>{item.show}</strong> This is a default alertâcheck it out!</span>\n <span><i className="fe fe-x icon-dimiss" onClick={() => handleRemove(item.id)}></i></span>\n </Alert>\n </React.Fragment>\n ))}\n </React.Fragment>\n );\n};\n'})})})})]})]})})]})})]}),(0,t.jsx)(n.Z,{children:(0,t.jsx)(l.Z,{md:12,children:(0,t.jsxs)(c.Z,{children:[(0,t.jsx)(c.Z.Header,{children:(0,t.jsx)(c.Z.Title,{children:"Alerts style"})}),(0,t.jsx)(c.Z.Body,{children:(0,t.jsx)("div",{className:"text-wrap mb-4",children:(0,t.jsxs)("div",{className:"users",children:[(0,t.jsx)(d.Z,{className:"mb-3 d-flex ms-auto",children:(0,t.jsx)(d.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>V(!I),className:"showcode d-flex ms-auto "})}),z.map(e=>(0,t.jsxs)(r.Z,{variant:"".concat(e.color),onClick:()=>P(e.id),children:[(0,t.jsx)("span",{className:"ms-auto float-end",onClick:()=>P(e.id),children:(0,t.jsx)("i",{className:"".concat(e.color," fe fe-x ms-auto")})}),e.icon,(0,t.jsx)("strong",{className:"ps-3",children:e.Title}),(0,t.jsx)("hr",{}),(0,t.jsx)("p",{children:e.description})]},e.id)),(0,t.jsx)(o.Z,{in:I,className:"",children:(0,t.jsx)("div",{id:"example-collapse-text",children:(0,t.jsx)("pre",{children:(0,t.jsx)("code",{children:'\nexport const LinkAlert = () => {\n const [open, setOpen] = useState(false);\n const [list, setList] = useState(AlertList);\n const handleRemove =(id)=> {\n const newList = list.filter((lit) => lit.id !== id);\n setList(newList);\n }\n return (\n <React.Fragment>\n {list.map((item, k) => (\n <React.Fragment key={k}>\n <Alert key={item.id} variant={{item.color}} onClick={() => handleRemove(item.id)} show={show}>\n {item.icon}\n <strong>{item.Title}</strong>\n <span className="d-flex ms-auto" onClick={() => handleRemove(item.id)} ><i className={{item.color} fe fe-x ms-auto} ></i></span>\n <hr />\n <p>{item.description}</p>\n </Alert>\n </React.Fragment>\n ))}\n </React.Fragment>\n );\n};\n'})})})})]})})})]})})})]})};k.layout="Contentlayout";var A=k},72867:function(e,s,a){"use strict";var t=a(85893);a(67294);var i=a(26699);let n=e=>(0,t.jsx)("div",{children:(0,t.jsxs)("div",{className:"page-header",children:[(0,t.jsx)("h1",{className:"page-title",children:e.titles}),(0,t.jsx)("div",{children:(0,t.jsxs)(i.Z,{children:[e.items.map((e,s)=>(0,t.jsx)(i.Z.Item,{href:"#!",children:e},s)),(0,t.jsx)(i.Z.Item,{href:"#!",active:!0,children:e.active})]})})]})});s.Z=n},33272:function(e,s,a){"use strict";a.d(s,{Z:function(){return c}});var t=a(85893);a(67294);var i=a(9008),n=a.n(i),l={src:"/_next/static/media/favicon.00e6795d.ico",height:16,width:16,blurWidth:0,blurHeight:0};let r=e=>{let{title:s}=e;return(0,t.jsxs)(n(),{children:[(0,t.jsx)("title",{children:" Fandoro Technologies
1- Making Businesses Responsible"}),(0,t.jsx)("link",{rel:"icon",href:l.src}),(0,t.jsx)("meta",{name:"description",content:"Fandoro Technologies - making businesses responsible"}),(0,t.jsx)("meta",{name:"author",content:"Fandoro Technologies Private Limited"}),(0,t.jsx)("meta",{name:"keywords",content:"next js dashboard template, admin dashboard nextjs, next js admin template, next js admin panel, admin dashboard, nextjs react bootstrap, react bootstrap with next js, next js admin dashboard, nextjs admin dashboard template, admin panel template, admin template react bootstrap, nextjs dashboard,next js react bootstrap"})]})};var c=r},9008:function(e,s,a){e.exports=a(42636)},51852:function(e,s,a){"use strict";a.d(s,{Z:function(){return g}});var t=a(93967),i=a.n(t),n=a(67294),l=a(47150),r=a(78146),c=a(76792),d=a(39602),o=a(85893);let m=(0,d.Z)("h4");m.displayName="DivStyledAsH4";let h=n.forwardRef(({className:e,bsPrefix:s,as:a=m,...t},n)=>(s=(0,c.vE)(s,"alert-heading"),(0,o.jsx)(a,{ref:n,className:i()(e,s),...t})));h.displayName="AlertHeading";var x=a(13551);let j=n.forwardRef(({className:e,bsPrefix:s,as:a=x.Z,...t},n)=>(s=(0,c.vE)(s,"alert-link"),(0,o.jsx)(a,{ref:n,className:i()(e,s),...t})));j.displayName="AlertLink";var u=a(41068),p=a(41485);let f=n.forwardRef((e,s)=>{let{bsPrefix:a,show:t=!0,closeLabel:n="Close alert",closeVariant:d,className:m,children:h,variant:x="primary",onClose:j,dismissible:f,transition:g=u.Z,...v}=(0,l.Ch)(e,{show:"onClose"}),w=(0,c.vE)(a,"alert"),N=(0,r.Z)(e=>{j&&j(!1,e)}),Z=!0===g?u.Z:g,k=(0,o.jsxs)("div",{role:"alert",...Z?void 0:v,ref:s,className:i()(m,w,x&&`${w}-${x}`,f&&`${w}-dismissible`),children:[f&&(0,o.jsx)(p.Z,{onClick:N,"aria-label":n,variant:d}),h]});return Z?(0,o.jsx)(Z,{unmountOnExit:!0,...v,ref:void 0,in:t,children:k}):t?k:null});f.displayName="Alert";var g=Object.assign(f,{Link:j,Heading:h})},26699:function(e,s,a){"use strict";a.d(s,{Z:function(){return m}});var t=a(93967),i=a.n(t),n=a(67294),l=a(76792),r=a(13551),c=a(85893);let d=n.forwardRef(({bsPrefix:e,active:s=!1,children:a,className:t,as:n="li",linkAs:d=r.Z,linkProps:o={},href:m,title:h,target:x,...j},u)=>{let p=(0,l.vE)(e,"breadcrumb-item");return(0,c.jsx)(n,{ref:u,...j,className:i()(p,t,{active:s}),"aria-current":s?"page":void 0,children:s?a:(0,c.jsx)(d,{...o,href:m,title:h,target:x,children:a})})});d.displayName="BreadcrumbItem";let o=n.forwardRef(({bsPrefix:e,className:s,listProps:a={},children:t,label:n="breadcrumb",as:r="nav",...d},o)=>{let m=(0,l.vE)(e,"breadcrumb");return(0,c.jsx)(r,{"aria-label":n,className:s,ref:o,...d,children:(0,c.jsx)("ol",{...a,className:i()(m,null==a?void 0:a.className),children:t})})});o.displayName="Breadcrumb";var m=Object.assign(o,{Item:d})}},function(e){e.O(0,[9774,2888,179],function(){return e(e.s=3946)}),_N_E=e.O()}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.