1"use strict";(self.webpackChunkweb_frontend_reactjs=self.webpackChunkweb_frontend_reactjs||[]).push([[6008],{1802:(e,n,t)=>{t.r(n),t.d(n,{default:()=>so});var r=t(57528),i=t(9950),a=t(67079),l=t(63565);var o,s,d,c=t(46167),x=t(45774),p=t(66615),h=t(76088),m=t(44414);const u=e=>{let{stateName:n,size:t,prefix:r="Size",dotted:i=!0}=e;const a=e=>e.charAt(0).toUpperCase()+e.slice(1);return(0,m.jsxs)(g,{children:[(0,m.jsx)(b,{children:n?a(n):null}),(0,m.jsxs)(j,{children:[(0,m.jsx)("span",{className:"prefixSpan",children:r}),(0,m.jsx)("span",{className:"prefixSpan",children:i?":":null})," ",(0,m.jsx)("span",{className:"sizeSpan",children:t?a(t):null})]})]})},g=a.Ay.div(o||(o=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),b=a.Ay.h4(s||(s=(0,r.A)(["\n margin-bottom: 4px;\n font-weight: 600;\n color: #2665ec;\n font-size: 24px;\n"]))),j=a.Ay.p(d||(d=(0,r.A)(["\n margin-bottom: 12px;\n font-size: 16px;\n color: #555;\n\n .sizeSpan {\n color: #2665ec;\n font-size: 16px;\n }\n\n .prefixSpan {\n color: var(--theme-text);\n }\n"])));var A,f=t(47454),v=t(74946);const y=e=>{let{content:n,tooltip:t,duration:r=2e3}=e;const[a,l]=(0,i.useState)(!1);return(0,m.jsx)(w,{onClick:()=>{navigator.clipboard.writeText(n),l(!0),setTimeout(()=>l(!1),r)},title:t,children:a?(0,m.jsx)(v.A,{fontSize:"small"}):(0,m.jsx)(f.A,{fontSize:"small"})})},w=a.Ay.button(A||(A=(0,r.A)(["\n background: none;\n border: none;\n cursor: pointer;\n margin-left: 6px;\n color: #2665ec;\n display: inline-flex;\n align-items: center;\n transition: color 0.2s ease-in;\n\n &:hover {\n color: #1e51bd;\n }\n"])));var _,C,k,S=t(58273),z=t(7356);const I=["Enabled","Hover","Focused","Pressed","Disabled"],B=["contained","outlined","text"],T=(e,n,t,r)=>{const i="start"===r?" startIcon={<StarIcon />}":"end"===r?" endIcon={<StarIcon />}":"";return'<ButtonWrapper fullWidth variant="'.concat(t,'" size="').concat(n,'" color="').concat(e,'"').concat(i,">Label</ButtonWrapper>")},L=(e,n,t,r)=>{const i=e.palette[n];let a,l,o;if("contained"===t)switch(r){case"Enabled":a=i.main,l=e.palette.getContrastText(a);break;case"Hover":a=i.dark,l=e.palette.getContrastText(a);break;case"Focused":a=(0,S.X4)(i.main,.85),l=e.palette.getContrastText(a);break;case"Pressed":a=(0,S.X4)(i.main,.7),l=e.palette.getContrastText(a);break;case"Disabled":a=e.palette.action.disabledBackground,l=e.palette.action.disabled}else if("outlined"===t)switch(l=i.main,o="1px solid ".concat(i.main),r){case"Enabled":a="transparent";break;case"Hover":a=(0,S.X4)(i.main,.08);break;case"Focused":a=(0,S.X4)(i.main,.15);break;case"Pressed":a=(0,S.X4)(i.main,.3);break;case"Disabled":l=e.palette.action.disabled,o="1px solid ".concat(e.palette.action.disabledBackground),a="transparent"}else switch(l=i.main,r){case"Enabled":a="transparent";break;case"Hover":a=(0,S.X4)(i.main,.08);break;case"Focused":a=(0,S.X4)(i.main,.15);break;case"Pressed":a=(0,S.X4)(i.main,.3);break;case"Disabled":l=e.palette.action.disabled,a="transparent"}return{bg:a,text:l,border:o}},M=e=>{let{size:n}=e;const t=(0,z.A)(),r=["Enabled","Disabled"];return(0,m.jsx)(P,{className:"alignmentButtonsSection",children:["start","end"].map(e=>(0,m.jsxs)(N,{children:[(0,m.jsx)(u,{stateName:"Primary - ".concat(e,"Icon"),size:n.charAt(0).toUpperCase()+n.slice(1)}),(0,m.jsxs)(F,{children:[(0,m.jsx)("thead",{children:(0,m.jsxs)("tr",{children:[(0,m.jsx)("th",{}),B.map(t=>(0,m.jsxs)("th",{children:[t.charAt(0).toUpperCase()+t.slice(1),(0,m.jsx)(y,{content:T("primary",n,t,e)})]},t))]})}),(0,m.jsx)("tbody",{children:r.map(r=>(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:r}),B.map(i=>{const{bg:a,text:l}=L(t,"primary",i,r);return(0,m.jsx)("td",{children:(0,m.jsx)(p.A,{variant:i,color:"primary",size:n,startIcon:"start"===e?(0,m.jsx)(h.A,{}):void 0,endIcon:"end"===e?(0,m.jsx)(h.A,{}):void 0,disabled:"Disabled"===r,sx:{pointerEvents:"none",backgroundColor:a,color:l},children:"Label"})},i)})]},r))})]})]},e))})},D=e=>{let{color:n,size:t}=e;const r=(0,z.A)();return(0,m.jsxs)(N,{children:[(0,m.jsx)(u,{stateName:n.charAt(0).toUpperCase()+n.slice(1),size:t.charAt(0).toUpperCase()+t.slice(1)}),(0,m.jsxs)(F,{children:[(0,m.jsx)("thead",{children:(0,m.jsxs)("tr",{children:[(0,m.jsx)("th",{}),B.map(e=>(0,m.jsxs)("th",{children:[e.charAt(0).toUpperCase()+e.slice(1),(0,m.jsx)(y,{content:T(n,t,e)})]},e))]})}),(0,m.jsx)("tbody",{children:I.map(e=>(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:e}),B.map(i=>{const{bg:a,text:l,border:o}=L(r,n,i,e);return(0,m.jsx)("td",{children:(0,m.jsx)(p.A,{variant:i,size:t,disabled:"Disabled"===e,sx:{pointerEvents:"none",backgroundColor:a,color:l,border:o},children:"Label"})},i)})]},e))})]})]})},N=a.Ay.div(_||(_=(0,r.A)(["\n flex: 1;\n min-width: 280px;\n padding: 0 8px;\n\n h4 {\n margin-bottom: 4px;\n font-weight: 600;\n color: #2665ec;\n font-size: 24px;\n }\n p {\n margin-bottom: 12px;\n font-size: 16px;\n color: #555;\n\n .sizeSpan {\n color: #2665ec;\n font-size: 16px;\n }\n }\n"]))),P=a.Ay.div(C||(C=(0,r.A)(["\n display: flex;\n flex-wrap: wrap;\n gap: 16px;\n\n &.alignmentButtonsSection {\n flex-direction: column;\n\n overflow-x: scroll;\n\n @media screen and (min-width: ","px) {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n width: 100%;\n overflow-x: auto;\n }\n }\n"])),l.f.tablet),F=a.Ay.table(k||(k=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n\n thead th {\n font-size: 14px;\n font-weight: 500;\n text-align: center;\n padding: 6px 0;\n position: relative;\n }\n\n tbody td {\n text-align: center;\n padding: 8px 0;\n }\n\n tbody td:first-child {\n text-align: left;\n font-weight: 500;\n width: 100px;\n }\n"])));var E,R,W,O,H,Q,U,G,Y,J,V,X,q,Z,$,K,ee,ne,te,re,ie,ae,le,oe,se,de,ce,xe,pe,he,me,ue,ge,be,je,Ae,fe,ve,ye,we,_e,Ce,ke,Se,ze,Ie,Be,Te,Le,Me,De=t(89379),Ne=t(91651),Pe=t(94837),Fe=t(31022),Ee=t(99807),Re=t(89737);const We=(0,a.Ay)(p.A)(E||(E=(0,r.A)(["\n && {\n background-color: rgba(38, 101, 236, 0.1) !important;\n border: 1px dotted #2665ec !important;\n color: #2665ec !important;\n min-width: 40px;\n height: 32px;\n padding: 0 8px;\n border-radius: 4px;\n text-transform: none;\n box-shadow: none !important;\n }\n"]))),Oe=(0,a.Ay)(p.A)(R||(R=(0,r.A)(["\n && {\n background-color: rgba(38, 101, 236, 0.1) !important;\n border: 1px dotted #2665ec !important;\n color: #2665ec !important;\n width: 250px;\n height: 32px;\n padding: 0 8px;\n border-radius: 4px;\n text-transform: none;\n box-shadow: none !important;\n }\n"]))),He=(0,a.Ay)(p.A)(W||(W=(0,r.A)(["\n && {\n background-color: rgba(38, 101, 236, 0.1) !important;\n border: 1px dotted #2665ec !important;\n color: #2665ec !important;\n width: 100%;\n height: 32px;\n padding: 0 8px;\n border-radius: 4px;\n text-transform: none;\n box-shadow: none !important;\n }\n"]))),Qe=((0,a.Ay)(p.A)(O||(O=(0,r.A)(["\n && {\n background-color: rgba(38, 101, 236, 0.1) !important;\n border: 1px dotted #2665ec !important;\n color: #2665ec !important;\n width: 440px;\n height: 32px;\n padding: 0 8px;\n border-radius: 4px;\n text-transform: none;\n box-shadow: none !important;\n }\n"]))),a.Ay.div(H||(H=(0,r.A)(["\n flex: 1;\n min-width: 280px;\n padding: 0 8px;\n\n h4 {\n margin-bottom: 4px;\n font-weight: 600;\n color: #2665ec;\n font-size: 24px;\n }\n p {\n margin-bottom: 12px;\n font-size: 16px;\n color: #555;\n\n .sizeSpan {\n color: #2665ec;\n font-size: 16px;\n }\n }\n"])))),Ue=a.Ay.table(Q||(Q=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n\n thead th {\n font-size: 14px;\n font-weight: 500;\n text-align: center;\n padding: 6px 0;\n position: relative;\n }\n\n tbody td {\n text-align: center;\n padding: 8px 0;\n }\n\n tbody td:first-child {\n text-align: left;\n font-weight: 500;\n width: 120px;\n }\n"]))),Ge=a.Ay.div(U||(U=(0,r.A)(["\n display: flex;
1\n align-items: center;\n gap: 12px;\n"]))),Ye=a.Ay.div(G||(G=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),Je=a.Ay.div(Y||(Y=(0,r.A)(["\n font-weight: 600;\n"]))),Ve=a.Ay.div(J||(J=(0,r.A)(["\n font-size: 14px;\n color: #666;\n"]))),Xe=a.Ay.div(V||(V=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 8px;\n"]))),qe=a.Ay.div(X||(X=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 12px;\n"]))),Ze=(a.Ay.div(q||(q=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n"]))),a.Ay.div(Z||(Z=(0,r.A)(["\n display: flex;\n gap: 16px;\n align-items: center;\n"]))),a.Ay.div($||($=(0,r.A)(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n"]))),a.Ay.div(K||(K=(0,r.A)(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n"]))),a.Ay.div(ee||(ee=(0,r.A)(["\n display: flex;\n align-items: flex-start;\n gap: 16px;\n"])))),$e=a.Ay.div(ne||(ne=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n"]))),Ke=a.Ay.div(te||(te=(0,r.A)(["\n display: flex;\n gap: 16px;\n align-items: center;
1\n"]))),en=a.Ay.div(re||(re=(0,r.A)(["\n width: 120px;\n"]))),nn=a.Ay.div(ie||(ie=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),tn=a.Ay.div(ae||(ae=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n margin-bottom: 50px;\n"]))),rn=a.Ay.div(le||(le=(0,r.A)(["\n flex: 1;\n"]))),an=a.Ay.div(oe||(oe=(0,r.A)(["\n display: flex;\n align-items: center;\n gap: 8px;\n"]))),ln=a.Ay.div(se||(se=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 8px;\n"]))),on=(a.Ay.div(de||(de=(0,r.A)(["\n overflow-x: auto;\n"]))),a.Ay.table(ce||(ce=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n margin-top: 8px;\n"]))),a.Ay.tr(xe||(xe=(0,r.A)([""]))),a.Ay.td(pe||(pe=(0,r.A)(["\n padding: 8px 16px;\n vertical-align: middle;\n\n &:first-child {\n font-weight: 500;\n white-space: nowrap;\n width: 120px;\n }\n"]))),a.Ay.table(he||(he=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n margin-top: 8px;\n\n tbody td:first-child {\n width: 160px;\n font-weight: 500;\n padding: 8px 0;\n vertical-align: middle;\n white-space: nowrap;\n }\n\n tbody .bossTR {\n display: flex;\n flex-direction: column;\n }\n\n tbody td {\n padding: 8px 50px;\n vertical-align: middle;\n\n &.noPaddTD {\n padding: 0 16px 8px 0 !important;\n }\n\n &.adjustedTD {\n padding: 8px 50px 8px 0 !important;\n }\n }\n"])))),sn=a.Ay.div(me||(me=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n\n @media (min-width: 1024px) {\n flex-direction: row;\n gap: 241px;\n }\n\n .left-column,\n .right-column {\n width: 100%;\n }\n\n @media (min-width: 1024px) {\n .left-column {\n width: 50%;\n }\n\n .right-column {\n width: 50%;\n }\n }\n"]))),dn=a.Ay.div(ue||(ue=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),cn=a.Ay.div(ge||(ge=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 24px;\n margin-bottom: 30px;\n"]))),xn=a.Ay.div(be||(be=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 24px;\n\n @media (min-width: 1024px) {\n flex-direction: row;\n }\n"]))),pn=a.Ay.div(je||(je=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 24px;\n\n @media (min-width: 1024px) {\n display: grid;\n grid-template-columns: 1fr 1fr;\n }\n\n @media (min-width: 1600px) {\n grid-template-columns: 1fr 1fr 1fr;\n }\n"]))),hn=a.Ay.div(Ae||(Ae=(0,r.A)(["\n flex: 1;\n"]))),mn=a.Ay.table(fe||(fe=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n"]))),un=a.Ay.table(ve||(ve=(0,r.A)(["\n width: 100%;\n border-collapse: separate;\n border-spacing: 0 16px;\n\n @media screen and (min-width: 1024px) {\n border-spacing: 0 33px;\n }\n"]))),gn=a.Ay.div(ye||(ye=(0,r.A)(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"]))),bn=a.Ay.div(we||(we=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n\n @media (min-width: 1600px) {\n flex-direction: row;\n gap: 80px;\n margin-bottom: 30px;\n }\n"]))),jn=a.Ay.div(_e||(_e=(0,r.A)(["\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 16px;\n"]))),An=a.Ay.div(Ce||(Ce=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 24px;\n margin-bottom: 30px;\n"]))),fn=a.Ay.div(ke||(ke=(0,r.A)(["\n display: flex;\n gap: 16px;\n align-items: center;\n\n & > :first-child {\n flex: 0 0 150px;\n }\n\n & > :nth-child(2) {\n flex: 1;\n }\n\n & > :nth-child(3) {\n flex: 0 0 auto;\n }\n"]))),vn=a.Ay.div(Se||(Se=(0,r.A)(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px 0;\n color: #555;\n"]))),yn=a.Ay.p(ze||(ze=(0,r.A)(["\n margin-top: 12px;\n font-size: 16px;\n color: #555;\n"]))),wn=(0,a.Ay)(Re.A)(Ie||(Ie=(0,r.A)(["\n font-size: 40px !important;\n color: #ccc;\n"]))),_n=a.Ay.div(Be||(Be=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 16px;\n border: 1px solid #e0e0e0;\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);\n border-radius: 5px;\n"]))),Cn=a.Ay.div(Te||(Te=(0,r.A)(["\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n"]))),kn=(0,a.Ay)(He)(Le||(Le=(0,r.A)(["\n width: 100%;\n"]))),Sn=a.Ay.div(Me||(Me=(0,r.A)(["\n display: flex;\n gap: 8px;
1\n align-items: center;\n"])));var zn,In;const Bn=e=>{let{smallText:n="component name",bigText:t,inlineText:r}=e;return(0,m.jsxs)(m.Fragment,{children:[(0,m.jsx)(Tn,{children:n}),(0,m.jsxs)(Ln,{children:[(0,m.jsx)("span",{className:"bigText",children:t})," ",r]})]})},Tn=a.Ay.h4(zn||(zn=(0,r.A)(["\n font-size: 14px;\n color: #2665ec;\n"]))),Ln=a.Ay.h2(In||(In=(0,r.A)(["\n font-size: 28px;\n margin-bottom: 8px;\n color: var(--theme-text);\n\n .bigText {\n font-size: 50px;\n }\n"])));var Mn,Dn,Nn,Pn;const Fn=["standard","filled","outlined"],En=(e,n,t)=>{const r="disabled"===t,i="error"===t,a="active"===t?"1":"";return'<TextField\n select\n label="Select"\n size="'.concat(n,'"\n variant="').concat(e,'"\n ').concat(r?"disabled":"","\n ").concat(i?"error":"",'\n value="').concat(a,'"\n>\n <MenuItem value="1">Option 1</MenuItem>\n <MenuItem value="2">Option 2</MenuItem>\n <MenuItem value="3">Option 3</MenuItem>\n</TextField>')},Rn=e=>{switch(e){case"Basic autocomplete":return'<SelectSearchWrapper\n options={[{ label: "Option 1" }, { label: "Option 2" }, { label: "Option 3" }]}\n getOptionLabel={(option) => option.label}\n renderInput={(params) => <TextField {...params} label="Basic" />}\n/>';case"Multiple select":return'<SelectSearchWrapper\n multiple\n options={[{ label: "Option 1" }, { label: "Option 2" }, { label: "Option 3" }]}\n getOptionLabel={(option) => option.label}\n renderInput={(params) => <TextField {...params} label="Multiple" />}\n/>';case"Free solo / creatable":return'<SelectSearchWrapper\n freeSolo\n options={["Option 1", "Option 2", "Option 3"]}\n renderInput={(params) => <TextField {...params} label="Free Solo" />}\n/>';case"Grouped options":return'<SelectSearchWrapper\n options={[\n { group: "Group A", label: "Option 1" },\n { group: "Group A", label: "Option 2" },\n { group: "Group B", label: "Option 3" }\n ]}\n groupBy={(option) => option.group}\n getOptionLabel={(option) => option.label}\n renderInput={(params) => <TextField {...params} label="Grouped" />}\n/>';case"With icons / adornments":return'<SelectSearchWrapper\n options={[{ label: "Option 1" }, { label: "Option 2" }]}\n getOptionLabel={(option) => option.label}\n renderInput={(params) => (\n <TextField\n {...params}\n label="With Icons"\n InputProps={{\n ...params.InputProps,\n startAdornment: <span>\ud83c\udf1f</span>,\n }}\n />\n )}\n/>';default:return""}},Wn=e=>{let{size:n,state:t}=e;return(0,m.jsxs)("div",{children:[(0,m.jsx)(u,{stateName:t.charAt(0).toUpperCase()+t.slice(1),size:n.charAt(0).toUpperCase()+n.slice(1)}),(0,m.jsx)(Ue,{children:(0,m.jsx)("tbody",{children:Fn.map(e=>(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:e.charAt(0).toUpperCase()+e.slice(1)}),(0,m.jsx)("td",{children:(0,m.jsxs)(Ne.A,{select:!0,label:"Select",size:n,variant:e,disabled:"disabled"===t,error:"error"===t,value:"active"===t?"1":"",sx:{minWidth:140},children:[(0,m.jsx)(Pe.A,{value:"1",children:"Option 1"}),(0,m.jsx)(Pe.A,{value:"2",children:"Option 2"}),(0,m.jsx)(Pe.A,{value:"3",children:"Option 3"})]})}),"enabled"===t&&(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:En(e,n,t)})})]},e))})})]})},On=a.Ay.div(Mn||(Mn=(0,r.A)(["\n margin-bottom: 0;\n"]))),Hn=a.Ay.div(Dn||(Dn=(0,r.A)(["\n display: grid;\n grid-template-columns: 1fr;\n gap: 16px;\n margin-bottom: 30px;\n\n @media screen and (min-width: ","px) {\n grid-template-columns: 1fr 1fr;\n }\n\n @media screen and (min-width: ","px) {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n gap: 20px;\n }\n"])),l.f.mobileL+180,l.f.laptop),Qn=a.Ay.div(Nn||(Nn=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),Un=a.Ay.div(Pn||(Pn=(0,r.A)(["\n display: grid;\n grid-template-columns: 1fr auto;\n gap: 8px;\n align-items: center;
1\n"]))),Gn=()=>{const e=[{group:"Group A",label:"Option 1"},{group:"Group A",label:"Option 2"},{group:"Group B",label:"Option 3"},{group:"Group B",label:"Option 4"}],n=(0,Fe.Z)(),[t,r]=(0,i.useState)(e[0]),[a,l]=(0,i.useState)([]),[o,s]=(0,i.useState)(""),[d,c]=(0,i.useState)(e[0]),[x,p]=(0,i.useState)(e[0]);return(0,m.jsxs)(Qe,{children:[(0,m.jsx)(Bn,{bigText:"Select",inlineText:"<Select>"}),(0,m.jsxs)(Hn,{children:[["enabled","active","disabled","error"].flatMap(e=>[(0,m.jsx)(Wn,{state:e,size:"medium"},"".concat(e,"-medium"))]),["enabled","active","disabled","error"].flatMap(e=>[(0,m.jsx)(Wn,{state:e,size:"small"},"".concat(e,"-small"))])]}),(0,m.jsx)(Bn,{bigText:"Autocomplete",inlineText:"<Autocomplete>"}),(0,m.jsxs)(Hn,{children:[(0,m.jsxs)(Qn,{children:[(0,m.jsx)(u,{stateName:"Basic autocomplete",size:"",prefix:"",dotted:!1}),(0,m.jsxs)(Un,{children:[(0,m.jsx)(On,{children:(0,m.jsx)(Ee.A,{options:e,getOptionLabel:e=>e.label,value:t,onChange:(e,n)=>r(n),renderInput:e=>(0,m.jsx)(Ne.A,(0,De.A)((0,De.A)({},e),{},{label:"Basic"}))})}),(0,m.jsx)(y,{content:Rn("Basic autocomplete")}
1)]})]}),(0,m.jsxs)(Qn,{children:[(0,m.jsx)(u,{stateName:"Multiple select",size:"",prefix:"",dotted:!1}),(0,m.jsxs)(Un,{children:[(0,m.jsx)(On,{children:(0,m.jsx)(Ee.A,{multiple:!0,options:e,getOptionLabel:e=>e.label,value:a,onChange:(e,n)=>l(n),renderInput:e=>(0,m.jsx)(Ne.A,(0,De.A)((0,De.A)({},e),{},{label:"Multiple"}))})}),(0,m.jsx)(y,{content:Rn("Multiple select")})]})]}),(0,m.jsxs)(Qn,{children:[(0,m.jsx)(u,{stateName:"Free solo / creatable",size:"",prefix:"",dotted:!1}),(0,m.jsxs)(Un,{children:[(0,m.jsx)(On,{children:(0,m.jsx)(Ee.A,{freeSolo:!0,options:e.map(e=>e.label),filterOptions:(e,t)=>{const r=n(e,t);return""===t.inputValue||r.includes(t.inputValue)||r.push(t.inputValue),r},value:o,onChange:(e,n)=>s(null!==n&&void 0!==n?n:""),renderInput:e=>(0,m.jsx)(Ne.A,(0,De.A)((0,De.A)({},e),{},{label:"Free Solo"}))})}),(0,m.jsx)(y,{content:Rn("Free solo / creatable")})]})]}),(0,m.jsxs)(Qn,{children:[(0,m.jsx)(u,{stateName:"Grouped options",size:"",prefix:"",dotted:!1}),(0,m.jsxs)(Un,{children:[(0,m.jsx)(On,{children:(0,m.jsx)(Ee.A,{options:e,groupBy:e=>e.group,getOptionLabel:e=>e.label,value:d,onChange:(e,n)=>c(n),renderInput:e=>(0,m.jsx)(Ne.A,(0,De.A)((0,De.A)({},e),{},{label:"Grouped"}))})}),(0,m.jsx)(y,{content:Rn("Grouped options")})]})]}),(0,m.jsxs)(Qn,{children:[(0,m.jsx)(u,{stateName:"With icons / adornments",size:"",prefix:"",dotted:!1}),(0,m.jsxs)(Un,{children:[(0,m.jsx)(On,{children:(0,m.jsx)(Ee.A,{options:e,getOptionLabel:e=>e.label,value:x,onChange:(e,n)=>p(n),renderInput:e=>(0,m.jsx)(Ne.A,(0,De.A)((0,De.A)({},e),{},{label:"With Icons",InputProps:(0,De.A)((0,De.A)({},e.InputProps),{},{startAdornment:(0,m.jsx)("span",{children:"\ud83c\udf1f"})})}))})}),(0,m.jsx)(y,{content:Rn("With icons / adornments")})]})]})]})]})};var Yn,Jn,Vn,Xn,qn,Zn,$n,Kn=t(21146);const et=["standard","filled","outlined"],nt=function(e,n,t){let r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"text",i=arguments.length>4?arguments[4]:void 0,a=arguments.length>5?arguments[5]:void 0,l=arguments.length>6?arguments[6]:void 0;const o="disabled"===t,s="error"===t,d="focused"===t||"hover"===t||"enabled"===t?"Example":"",c=i?" multiline {...".concat(JSON.stringify(i),"}"):"";let x="";if(a||l){const e=a?'<InputAdornment position="start"><span>'.concat(a,"</span></InputAdornment>"):"",n=l?'<InputAdornment position="end"><span>'.concat(l,"</span></InputAdornment>"):"";x="\n InputProps={{\n ".concat(e?"startAdornment: ".concat(e,","):"","\n ").concat(n?"endAdornment: ".concat(n,","):"","\n }}")}return'<TextField\n variant="'.concat(e,'"\n size="').concat(n,'"\n type="').concat(r,'"\n label="Text"\n value="').concat(d,'"\n ').concat(o?"disabled":"","\n ").concat(s?"error":"").concat(c).concat(x,"\n InputProps={{\n style: {\n color: 'var(--theme-text)', // text color\n },\n }}\n InputLabelProps={{\n style: {\n color: 'var(--text-dark-gray)', // label color\n },\n }}\n sx={{\n '& .MuiOutlinedInput-root': {\n '& fieldset': {\n borderColor: 'gray', // default outline color\n },\n '&:hover fieldset': {\n borderColor: '#2665EC', // hover outline color\n },\n '&.Mui-focused fieldset': {\n borderColor: '#2665EC', // focused outline color\n },\n '&.Mui-error fieldset': {\n borderColor: 'var(--palette-error-main)', // error outline\n },\n },\n }}\n />")},tt=(e,n,t)=>{const r="disabled"===n,i="error"===n,a="focused"===n,l="hover"===n;if("outlined"===e){const e={"& .MuiOutlinedInput-root":{},"& .MuiInputLabel-root":{}};return i&&(e["& .MuiOutlinedInput-root"]={"& fieldset":{borderColor:t.palette.error.main}},e["& .MuiInputLabel-root"]={color:t.palette.error.main},e["& .MuiFormHelperText-root"]={color:t.palette.error.main}),r&&(e["& .MuiOutlinedInput-root"]={"& fieldset":{borderColor:t.palette.action.disabled}},e["& .MuiInputLabel-root"]={color:t.palette.text.disabled}),a&&(e["& .MuiOutlinedInput-root"]={"& fieldset":{borderColor:i?t.palette.error.main:t.palette.primary.main,borderWidth:"2px"}},e["& .MuiInputLabel-root"]={color:i?t.palette.error.main:t.palette.primary.main,transform:"translate(14px, -9px) scale(0.75)",backgroundColor:t.palette.background.paper,padding:"0 4px",zIndex:1}),l&&(e["& .MuiOutlinedInput-root"]={"& fieldset":{borderColor:i?t.palette.error.main:t.palette.text.primary,border:"1px solid ".concat(i?t.palette.error.main:t.palette.text.primary)}}),e}if("filled"===e){const e={"& .MuiFilledInput-root":{},"& .MuiInputLabel-root":{}};return e["& .MuiFilledInput-root"]={backgroundColor:t.palette.action.hover,"&:before":{borderBottom:"1px solid ".concat(t.palette.divider)}
1,"&:after":{borderBottom:"2px solid ".concat(t.palette.primary.main),transform:"scaleX(0)"}},i&&(e["& .MuiFilledInput-root"]["&:before"]={borderBottom:"1px solid ".concat(t.palette.error.main)},e["& .MuiFilledInput-root"]["&:after"]={borderBottom:"2px solid ".concat(t.palette.error.main),transform:"scaleX(0)"},e["& .MuiInputLabel-root"]={color:t.palette.error.main}),r&&(e["& .MuiFilledInput-root"]={backgroundColor:t.palette.action.disabledBackground,"&:before":{borderBottom:"1px dotted ".concat(t.palette.text.disabled)},"&:after":{display:"none"}},e["& .MuiInputLabel-root"]={color:t.palette.text.disabled}),a&&(e["& .MuiFilledInput-root"]["&:after"]={borderBottom:"2px solid ".concat(i?t.palette.error.main:t.palette.primary.main),transform:"scaleX(1)"},e["& .MuiInputLabel-root"]={color:i?t.palette.error.main:t.palette.primary.main,transform:"translate(12px, -9px) scale(0.75)"}),l&&(e["& .MuiFilledInput-root"]=(0,De.A)((0,De.A)({},e["& .MuiFilledInput-root"]),{},{backgroundColor:t.palette.action.selected,"&:before":{borderBottom:"1px solid ".concat(i?t.palette.error.main:t.palette.text.primary)}})),e}if("standard"===e){const e={"& .MuiInput-root":{"&:before":{borderBottom:"1px solid ".concat(t.palette.divider)},"&:after":{borderBottom:"2px solid ".concat(t.palette.primary.main),transform:"scaleX(0)"}},"& .MuiInputLabel-root":{}};return i&&(e["& .MuiInput-root"]["&:before"]={borderBottom:"1px solid ".concat(t.palette.error.main)},e["& .MuiInput-root"]["&:after"]={borderBottom:"2px solid ".concat(t.palette.error.main),transform:"scaleX(0)"},e["& .MuiInputLabel-root"]={color:t.palette.error.main}),r&&(e["& .MuiInput-root"]["&:before"]={borderBottom:"1px dotted ".concat(t.palette.text.disabled)},e["& .MuiInput-root"]["&:after"]={display:"none"},e["& .MuiInputLabel-root"]={color:t.palette.text.disabled}),a&&(e["& .MuiInput-root"]["&:after"]={borderBottom:"2px solid ".concat(i?t.palette.error.main:t.palette.primary.main),transform:"scaleX(1)"},e["& .MuiInputLabel-root"]={color:i?t.palette.error.main:t.palette.primary.main,transform:"translate(0, -1.5px) scale(0.75)"}),l&&(e["& .MuiInput-root"]["&:before"]={borderBottom:"2px solid ".concat(i?t.palette.error.main:t.palette.text.primary)}),e}return{}},rt=e=>{let{state:n}=e;const t=(0,z.A)(),r="disabled"===n,i="error"===n;return(0,m.jsxs)(xt,{children:[(0,m.jsxs)(dt,{children:[(0,m.jsx)(u,{stateName:n,size:"Medium"}),(0,m.jsx)(ct,{children:(0,m.jsx)("tbody",{children:et.map(e=>(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:e.charAt(0).toUpperCase()+e.slice(1)}),(0,m.jsx)("td",{children:(0,m.jsxs)("div",{className:"cellContent",children:[(0,m.jsx)(Ne.A,{variant:e,size:"medium",disabled:r,error:i,label:"Text",sx:tt(e,n,t)}),"enabled"===n?(0,m.jsx)(y,{content:nt(e,"medium",n)}):null]})})]},e))})})]}),(0,m.jsxs)(dt,{children:[(0,m.jsx)(u,{stateName:n,size:"Small"}),(0,m.jsx)(ct,{children:(0,m.jsx)("tbody",{children:et.map(e=>(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:e.charAt(0).toUpperCase()+e.slice(1)}),(0,m.jsx)("td",{children:(0,m.jsxs)("div",{className:"cellContent",children:[(0,m.jsx)(Ne.A,{variant:e,size:"small",disabled:r,error:i,label:"Text",sx:tt(e,n,t)}),"enabled"===n?(0,m.jsx)(y,{content:nt(e,"small",n)}):null]})})]},e))})})]})]})},it=()=>{const e=(0,z.A)();return(0,m.jsxs)(at,{children:[(0,m.jsx)(Bn,{bigText:"Text field",inlineText:"<TextField>"}),(0,m.jsx)(lt,{children:["enabled","focused","hover","disabled","error"].map(e=>(0,m.jsx)(rt,{state:e},e))}),(0,m.jsx)(Bn,{smallText:"",bigText:"Inputs with icons"}),(0,m.jsx)(lt,{className:"inputWithIconsRow",children:["enabled","disabled","focused","error"].map(n=>(0,m.jsx)(ot,{children:(0,m.jsx)(st,{children:(0,m.jsxs)(dt,{children:[(0,m.jsx)(u,{stateName:n,size:"Medium"}),(0,m.jsx)(ct,{children:(0,m.jsx)("tbody",{children:et.map(t=>(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:t.charAt(0).toUpperCase()+t.slice(1)}),(0,m.jsx)("td",{children:(0,m.jsxs)("div",{className:"cellContent",children:[(0,m.jsx)(Ne.A,{variant:t,size:"medium",disabled:"disabled"===n,error:"error"===n,label:"Text",InputProps:{startAdornment:(0,m.jsx)("span",{children:"\ud83c\udf1f"})},sx:tt(t,n,e)}),"enabled"===n?(0,m.jsx)(y,{content:nt(t,"medium",n,"text",void 0,"\ud83c\udf1f")}):null]})})]},t))})})]})})},n))}),(0,m.jsx)(Bn,{smallText:"",bigText:"Password"}),(0,m.jsx)(lt,{className:"inputWithIconsRow",children:["enabled","disabled","focused","error"].map(n=>(0,m.jsx)(ot,{children:(0,m.jsx)(st,{children:(0,m.jsxs)(dt,{children:[(0,m.jsx)(u,{stateName:n,size:"Medium"}),(0,m.jsx)(ct,{children:(0,m.jsx)("tbody",{children:et.map(t=>(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:t.charAt(0).toUpperCase()+t.slice(1)}),(0,m.jsx)("td",{children:(0,m.jsxs)("div",{className:"cellContent",children:[(0,m.jsx)(Kn.A,{variant:t,size:"medium",disabled:"disabled"===n,error:"error"===n,sx:tt(t,n,e)}),"enabled"===n?(0,m.jsx)(y,{content:nt(t,"medium",n,"password",void 0,void 0,"\ud83d\udc41\ufe0f")}):null]})})]},t))})})]})})},n))}),(0,m.jsx)(Bn,{smallText:"",bigText:"Multiline"}),(0,m.jsx)(lt,{className:"inputWithIconsRow",children:["Flexible","Min rows: 4","Max rows: 4"].map(n=>{let t="";const r={};return"Flexible"===n?t="It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.":"Min rows: 4"===n?(t="It is a long stablished fact that a reader will be distracted.",r.minRows=4):"Max rows: 4"===n&&(t="It is a long established fact that a reader will be distracted by the readable content of a page.",r.maxRows=4),(0,m.jsx)(ot,{children:(0,m.jsx)(st,{children:(0,m.jsxs)(dt,{children:[(0,m.jsx)(u,{stateName:n,size:"Medium"}),(0,m.jsx)(ct,{children:(0,m.jsx)("tbody",{children:et.map(n=>(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:n.charAt(0).toUpperCase()+n.slice(1)}),(0,m.jsx)("td",{children:(0,m.jsxs)("div",{className:"cellContent",children:[(0,m.jsx)(Ne.A,(0,De.A)((0,De.A)({variant:n,size:"medium",label:"Text",multiline:!0,defaultValue:t,InputLabelProps:{shrink:!0}},r),{},{sx:tt(n,"enabled",e)})),(0,m.jsx)(y,{content:nt(n,"medium","enabled","text",r)})]})})]},n))})})]})})},n)})})]})},at=a.Ay.div(Yn||(Yn=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),lt=a.Ay.div(Jn||(Jn=(0,r.A)(["\n display: flex;\n flex-direction: column;\n @media screen and (min-width: ","px) {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr 1fr 1fr;\n gap: 25px;\n }\n\n &.inputWithIconsRow {\n display: flex;\n flex-direction: column;\n\n @media screen and (min-width: ","px) {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 16px;\n }\n\n @media screen and (min-width: ","px) {\n grid-template-columns: 1fr 1fr 1fr 1fr 1fr;\n }\n }\n"])),l.f.laptop,l.f.mobileL+180,l.f.laptop),ot=a.Ay.div(Vn||(Vn=(0,r.A)(["\n flex: 1;\n min-width: 280px;\n"]))),st=a.Ay.div(Xn||(Xn=(0,r.A)(["\n display: flex;\n gap: 25px;\n flex-wrap: wrap;\n"]))),dt=a.Ay.div(qn||(qn=(0,r.A)(["\n flex: 1;\n min-width: 140px;\n"]))),ct=a.Ay.table(Zn||(Zn=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n margin-bottom: 16px;\n\n tbody td:first-child {\n width: 120px;\n font-weight: 500;\n text-align: left;\n padding: 8px 0;\n vertical-align: middle;\n }\n\n tbody td {\n text-align: center;\n padding: 8px 0;\n vertical-align: middle;\n\n .cellContent {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n min-height: 56px;\n }\n }
1\n\n tbody td .cellContent {\n display: flex;\n align-items: center;\n justify-content: space-between; // ensures input on left, copy button on right\n gap: 8px;\n min-height: 56px;\n }\n"]))),xt=a.Ay.div($n||($n=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 25px;\n\n @media screen and (min-width: ","px) {\n display: grid;\n grid-template-rows: repeat(auto-fit, minmax(280px, 1fr));\n gap: 40px;\n align-items: start;\n }\n"])),l.f.laptop);var pt,ht,mt,ut,gt,bt=t(81995),jt=t(81415);const At=["standard","scrollable","fullWidth"],ft=e=>{let{orientation:n,hasIcons:t}=e;return(0,m.jsxs)(_t,{children:[(0,m.jsx)(u,{stateName:"".concat("horizontal"===n?"Horizontal":"Vertical"," tabs"),prefix:"Icon",size:t?"Yes":"No"}),(0,m.jsx)(Ct,{children:(0,m.jsx)(kt,{children:(0,m.jsx)("tbody",{children:At.map(e=>{const r="scrollable"===e,i=r?10:3;return(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:e.charAt(0).toUpperCase()+e.slice(1)}),(0,m.jsx)("td",{children:(0,m.jsxs)("div",{className:"cellContent ".concat(r?"scrollable":""," ").concat("horizontal"===n?"horizontal":"vertical"),children:[(0,m.jsx)("div",{className:"tabsWrapper",children:(0,m.jsx)(bt.A,(0,De.A)((0,De.A)({value:0,orientation:n,variant:e,"aria-label":"".concat(n," Tabs ").concat(t?"with":"without"," Icons")},r?{scrollButtons:"auto",allowScrollButtonsMobile:!0}:{}),{},{children:Array.from({length:i}).map((e,n)=>(0,m.jsx)(jt.A,{label:"Tab ".concat(n+1),icon:t?(0,m.jsx)("span",{children:"\u2b50"}):void 0},n))}))}),(0,m.jsx)("div",{className:"copyButtonWrapper",children:(0,m.jsx)(y,{content:(()=>{const a=Array.from({length:i}).map((e,n)=>'<Tab label="Tab '.concat(n+1,'"').concat(t?" icon={<YourIcon />}":""," />")).join("\n ");return'<Tabs\n value={0}\n orientation="'.concat(n,'"\n variant="').concat(e,'"').concat(r?'\n scrollButtons="auto"\n allowScrollButtonsMobile={true}':"",'\n aria-label="').concat(n," Tabs ").concat(t?"with":"without",' Icons"\n >\n ').concat(a,"\n </Tabs>")})()})})]})})]},e)})})})})]})},vt=()=>(0,m.jsxs)(yt,{children:[(0,m.jsx)(Bn,{bigText:"Tabs",inlineText:"<TabList>"}),(0,m.jsxs)(wt,{children:[(0,m.jsx)(ft,{orientation:"horizontal",hasIcons:!0}),(0,m.jsx)(ft,{orientation:"horizontal",hasIcons:!1}),(0,m.jsx)(ft,{orientation:"vertical",hasIcons:!0}),(0,m.jsx)(ft,{orientation:"vertical",hasIcons:!1})]})]}),yt=a.Ay.div(pt||(pt=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),wt=a.Ay.div(ht||(ht=(0,r.A)(["\n display: flex;\n flex-wrap: wrap;\n gap: 16px;\n\n @media screen and (min-width: 1024px) {\n flex-wrap: nowrap;\n gap: 20px;\n\n & > div {\n flex: 1; // make all children equal width\n }\n }\n"]))),_t=a.Ay.div(mt||(mt=(0,r.A)(["\n display: flex;\n flex-direction: column;\n min-width: 280px;\n"]))),Ct=a.Ay.div(ut||(ut=(0,r.A)(["\n flex: 1;\n min-width: 140px;\n\n .cellContent {\n display: flex;\n align-items: center;\n justify-content: flex-start; // Tabs left-aligned\n min-height: 56px;\n\n .tabsWrapper {\n flex: 1;\n overflow-x: auto;\n max-width: 220px; // moderate width to avoid pushing copy button too far\n }\n\n .copyButtonWrapper {\n flex-shrink: 0;\n margin-left: 8px; // moderate right spacing\n display: flex;\n align-items: center;\n }\n }\n"]))),kt=a.Ay.table(gt||(gt=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n margin-bottom: 16px;\n\n tbody td:first-child {\n width: 120px;\n font-weight: 500;\n text-align: left;\n padding: 8px 0;\n vertical-align: middle;\n }\n\n tbody td {\n text-align: center;\n padding: 8px 0;\n vertical-align: middle;\n\n .cellContent.scrollable.horizontal {\n .MuiTabs-root {\n min-width: auto;\n }\n }\n\n .cellContent.scrollable.vertical {\n .MuiTabs-root {\n min-height: auto;\n }\n }\n }\n"])));var St,zt,It,Bt,Tt,Lt,Mt,Dt=t(29920),Nt=t(18643),Pt=t(13852);const Ft=["enabled","hover","focused","pressed","disabled"],Et=()=>(0,m.jsxs)(Ot,{children:[(0,m.jsx)(Bn,{bigText:"Checkbox",inlineText:"<Checkbox>"}),(0,m.jsx)(Ht,{children:Ft.map(e=>(0,m.jsxs)(Qt,{children:[(0,m.jsxs)(Ut,{children:[(0,m.jsx)(u,{stateName:Rt(e),prefix:"Selected",size:"Yes"}),(0,m.jsxs)("div",{className:"cellContent",children:[(0,m.jsx)(Dt.A,{defaultChecked:!0,disabled:"disabled"===e,sx:(0,De.A)((0,De.A)((0,De.A)({},"hover"===e&&{bgcolor:"rgba(0,0,0,0.04)"}),"focused"===e&&{boxShadow:"0 0 0 4px rgba(25,118,210,0.3)",borderRadius:"50%"}),"pressed"===e&&{bgcolor:"rgba(25,118,210,0.08)",borderRadius:"50%"})}),"enabled"===e?(0,m.jsx)(y,{content:"<Checkbox defaultChecked".concat(" />")}):null]})]}),(0,m.jsxs)(Ut,{children:[(0,m.jsx)(u,{stateName:Rt(e),prefix:"Selected",size:"No"}),(0,m.jsxs)("div",{className:"cellContent",children:[(0,m.jsx)(Dt.A,{disabled:"disabled"===e,sx:(0,De.A)((0,De.A)((0,De.A)({},"hover"===e&&{bgcolor:"rgba(0,0,0,0.04)"}),"focused"===e&&{boxShadow:"0 0 0 4px rgba(25,118,210,0.3)",borderRadius:"50%"}),"pressed"===e&&{bgcolor:"rgba(25,118,210,0.08)",borderRadius:"50%"})}),"enabled"===e?(0,m.jsx)(y,{content:"<Checkbox".concat(" />")}):""]})]})]},e))}),(0,m.jsx)(Bn,{bigText:"Radio",inlineText:"<Radio>"}),(0,m.jsx)(Ht,{children:Ft.map(e=>(0,m.jsxs)(Qt,{children:[(0,m.jsxs)(Ut,{children:[(0,m.jsx)(u,{stateName:Rt(e),prefix:"Selected",size:"Yes"}),(0,m.jsxs)("div",{className:"cellContent",children:[(0,m.jsx)(Nt.A,{checked:!0,disabled:"disabled"===e,sx:(0,De.A)((0,De.A)((0,De.A)({},"hover"===e&&{bgcolor:"rgba(0,0,0,0.04)",borderRadius:"50%"}),"focused"===e&&{boxShadow:"0 0 0 4px rgba(25,118,210,0.3)",borderRadius:"50%"}),"pressed"===e&&{bgcolor:"rgba(25,118,210,0.08)",borderRadius:"50%"})}),"enabled"===e?(0,m.jsx)(y,{content:"<Radio checked".concat(" />")}):null]})]}),(0,m.jsxs)(Ut,{children:[(0,m.jsx)(u,{stateName:Rt(e),prefix:"Selected",size:"No"}),(0,m.jsxs)("div",{className:"cellContent",children:[(0,m.jsx)(Nt.A,{disabled:"disabled"===e,sx:(0,De.A)((0,De.A)((0,De.A)({},"hover"===e&&{bgcolor:"rgba(0,0,0,0.04)",borderRadius:"50%"}),"focused"===e&&{boxShadow:"0 0 0 4px rgba(25,118,210,0.3)",borderRadius:"50%"}),"pressed"===e&&{bgcolor:"rgba(25,118,210,0.08)",borderRadius:"50%"})}),"enabled"===e?(0,m.jsx)(y,{content:"<Radio".concat(" />")}):null]})]})]},e))}),(0,m.jsx)(Bn,{bigText:"Switch",inlineText:"<Switch>"}),["medium","small"].map(e=>{const n="small"===e;return(0,m.jsx)(Jt,{children:Wt.map(t=>{const r=null!==t&&void 0!==t&&t.toLowerCase().includes("secondary")?"secondary":null!==t&&void 0!==t&&t.toLowerCase().includes("error")?"error":"primary",i=null===t||void 0===t?void 0:t.toLowerCase().startsWith("checked"),a="Checked"===t||"Checked Secondary"===t||"Checked Error"===t;return(0,m.jsxs)(Gt,{children:[(0,m.jsx)(u,{stateName:t,size:n?"Small":"Medium"}),(0,m.jsx)(Yt,{children:(0,m.jsx)("tbody",{children:["Primary","Hover","Disabled"].map((t,l)=>{const o="Hover"===t;return(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:t}),(0,m.jsx)("td",{children:(0,m.jsxs)("div",{className:"cellContent",children:[(0,m.jsx)(Pt.A,{size:n?"small":"medium",checked:i,color:r,disabled:"Disabled"===t,sx:{"& .MuiSwitch-switchBase":(0,De.A)({},o&&{backgroundColor:"rgba(0,0,0,0.08)"}),"& .MuiSwitch-thumb":(0,De.A)({},o&&{boxShadow:"0 0 0 0px"})}}),a?(0,m.jsx)(y,{content:'<Switch size="'.concat(e,'" checked={').concat(i,'}
1 color="').concat(r,'"').concat("Disabled"===t?" disabled":""," />")}):null]})})]},l)})})})]},t)})},e)})]}),Rt=e=>e.charAt(0).toUpperCase()+e.slice(1),Wt=["Checked","Unchecked","Checked Default","Unchecked Default","Checked Secondary","Unchecked Secondary","Checked Error","Unchecked Error"],Ot=a.Ay.div(St||(St=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),Ht=a.Ay.div(zt||(zt=(0,r.A)(["\n display: grid;\n gap: 24px;\n grid-template-columns: 1fr;\n\n @media (min-width: ","px) {\n grid-template-columns: 1fr;\n }\n"])),l.f.laptop),Qt=a.Ay.div(It||(It=(0,r.A)(["\n display: grid;\n grid-template-columns: repeat(1, auto);\n gap: 16px;\n align-items: center;\n margin-bottom: 30px;\n\n @media screen and (min-width: ","px) {\n grid-template-columns: repeat(2, 0.2fr);\n }\n"])),l.f.laptop),Ut=a.Ay.div(Bt||(Bt=(0,r.A)(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 8px;\n border: 1px solid #d8d8d8;\n border-radius: 6px;\n\n .cellContent {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n"]))),Gt=a.Ay.div(Tt||(Tt=(0,r.A)(["\n flex: 1;\n min-width: 280px;\n"]))),Yt=a.Ay.table(Lt||(Lt=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n margin-bottom: 16px;\n\n tbody td:first-child {\n width: 120px;\n font-weight: 500;\n text-align: left;\n padding: 8px 0;\n vertical-align: middle;\n }\n\n tbody td {\n text-align: center;\n padding: 8px 0;\n vertical-align: middle;\n\n .cellContent {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n min-height: 56px;\n }\n }\n"]))),Jt=a.Ay.div(Mt||(Mt=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n\n @media (min-width: ","px) {\n display: grid;\n grid-template-columns: repeat(5, 1fr);\n gap: 16px;\n }\n"])),l.f.laptop);var Vt,Xt,qt,Zt,$t,Kt,er,nr,tr,rr,ir;const ar=()=>{const e=[{text:"subtitle1",size:"16px",lineHeight:"28px"},{text:"subtitle2",size:"14px",lineHeight:"22px"},{text:"body1",size:"16px",lineHeight:"24px"},{text:"body2",size:"14px",lineHeight:"20px"},{text:"BUTTON TEXT",size:"16px",lineHeight:"28px",letterSpacing:"0.4px"},{text:"caption text",size:"12px",lineHeight:"20px"},{text:"Overline",size:"10px",lineHeight:"32px",letterSpacing:"1.5px"}],n=(e,n,t)=>"font-size: ".concat(e,";\nline-height: ").concat(n,";").concat(t?"\nletter-spacing: ".concat(t,";"):"");return(0,m.jsxs)("div",{children:[(0,m.jsx)(Bn,{smallText:"",bigText:"Typography"}),(0,m.jsx)(lr,{children:[{text:"h1.Heading",size:"96px",lineHeight:"112px"},{text:"h2.Heading",size:"60px",lineHeight:"72px"},{text:"h3.Heading",size:"48px",lineHeight:"56px"},{text:"h4.Heading",size:"34px",lineHeight:"56px"},{text:"h5.Heading",size:"24px",lineHeight:"32px"},{text:"h6.Heading",size:"20px",lineHeight:"32px"}].map((t,r)=>(0,m.jsxs)(i.Fragment,{children:[(0,m.jsxs)(or,{children:[(0,m.jsx)(xr,(0,De.A)({},t)),(0,m.jsx)(y,{content:n(t.size,t.lineHeight,t.letterSpacing)})]}),e[r]&&(0,m.jsxs)(or,{children:[(0,m.jsx)(xr,(0,De.A)({},e[r])),(0,m.jsx)(y,{content:n(e[r].size,e[r].lineHeight,e[r].letterSpacing)})]})]},r))}),(0,m.jsx)(Bn,{smallText:"",bigText:"Colors"}),(0,m.jsx)(pr,{children:[{name:"Primary",colors:[{hex:"#5184F0",label:"palette.primary.light"},{hex:"#2665EC",label:"palette.primary.main"},{hex:"#1E51BD",label:"palette.primary.dark"}]},{name:"Secondary",colors:[{hex:"#BA68C8",label:"palette.secondary.light"},{hex:"#9C27B0",label:"palette.secondary.main"},{hex:"#7B1EA2",label:"palette.secondary.dark"}]},{name:"Error",colors:[{hex:"#EE534F",label:"palette.error.light"},{hex:"#D32F2F",label:"palette.error.main"},{hex:"#C62828",label:"palette.error.dark"}]},{name:"Warning",colors:[{hex:"#FF9800",label:"palette.warning.light"},{hex:"#ED6C03",label:"palette.warning.main"},{hex:"#C62828",label:"palette.warning.dark"}]},{name:"Primary",colors:[{hex:"#D1BCFF",label:"palette.primary.light"},{hex:"#8B57FF",label:"palette.primary.main"},{hex:"#382366",label:"palette.primary.dark"}]},{name:"Secondary",colors:[{hex:"#FFCA7A",label:"palette.secondary.light"},{hex:"#FFB443",label:"palette.secondary.main"},{hex:"#FF9F0E",label:"palette.secondary.dark"}]},{name:"Info",colors:[{hex:"#00A8F4",label:"palette.info.light"},{hex:"#0088D1",label:"palette.info.main"},{hex:"#00579B",label:"palette.info.dark"}]},{name:"Success",colors:[{hex:"#4CAF4F",label:"palette.success.light"},{hex:"#2F7C31",label:"palette.success.main"},{hex:"#1A5E20",label:"palette.success.dark"}]},{name:"Text",colors:[{hex:"#121926",label:"theme.text"},{hex:"#FFFFFF",label:"theme.text"},{hex:"#97989B",label:"text.dark-gray"},{hex:"#C6C6C7",label:"text.light.gray"},{hex:"#2665EC",label:"text.hover"}]}
1,{name:"Background",colors:[{hex:"#F8FBFC",label:"theme.bg"},{hex:"#111316",label:"theme.bg"}]},{name:"Card",colors:[{hex:"#FFFFFF",label:"card.bg"},{hex:"#202940",label:"card.bg"}]}].map(e=>(0,m.jsxs)(hr,{children:[(0,m.jsx)(u,{stateName:e.name,prefix:"",size:"",dotted:!1}),(0,m.jsx)(mr,{children:e.colors.map(e=>(0,m.jsxs)(ur,{children:[(0,m.jsx)(gr,{style:{backgroundColor:e.hex}}),(0,m.jsx)(br,{children:e.label}),(0,m.jsx)(y,{content:"var(--".concat(e.label.replace(/\./g,"-"),")")})]},e.hex))})]},e.name))})]})},lr=a.Ay.div(Vt||(Vt=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n\n @media (min-width: 1024px) {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 32px;\n }\n"]))),or=a.Ay.div(Xt||(Xt=(0,r.A)(["\n display: flex;\n align-items: center;\n gap: 16px;\n"]))),sr=a.Ay.div(qt||(qt=(0,r.A)(["\n display: flex;\n flex-direction: column;\n justify-content: center;\n gap: 8px;\n"]))),dr=a.Ay.div(Zt||(Zt=(0,r.A)(["\n display: flex;\n gap: 16px;\n\n @media (max-width: 1024px) {\n flex-direction: column;\n }\n"]))),cr=a.Ay.div($t||($t=(0,r.A)(["\n font-size: ",";\n line-height: ",";\n letter-spacing: ",";\n color: #000;\n"])),e=>{let{fontSize:n}=e;return n},e=>{let{lineHeight:n}=e;return n},e=>{let{letterSpacing:n}=e;return n||"normal"}),xr=e=>{let{text:n,size:t,lineHeight:r,letterSpacing:i}=e;return(0,m.jsxs)(sr,{children:[(0,m.jsx)(cr,{fontSize:t,lineHeight:r,letterSpacing:i,children:n}),(0,m.jsxs)(dr,{children:[(0,m.jsx)(u,{stateName:"",prefix:"Size",size:t}),(0,m.jsx)(u,{stateName:"",prefix:"Line height",size:r}),i&&(0,m.jsx)(u,{stateName:"",prefix:"Letter spacing",size:i})]})]})},pr=a.Ay.div(Kt||(Kt=(0,r.A)(["\n display: grid;\n grid-template-columns: 1fr;\n gap: 32px;\n\n @media (min-width: 1024px) {\n grid-template-columns: repeat(4, 1fr);\n }\n"]))),hr=a.Ay.div(er||(er=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n"]))),mr=a.Ay.div(nr||(nr=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 12px;\n"]))),ur=a.Ay.div(tr||(tr=(0,r.A)(["\n display: flex;\n align-items: center;\n gap: 12px;\n"]))),gr=a.Ay.div(rr||(rr=(0,r.A)(["\n width: 60px;\n height: 60px;\n border: 1px solid #ccc;\n"]))),br=a.Ay.span(ir||(ir=(0,r.A)(["\n font-size: 14px;\n color: #333;\n font-family: 'Poppins', sans-serif;\n"])));var jr,Ar,fr,vr,yr,wr,_r,Cr,kr,Sr,zr,Ir,Br,Tr,Lr,Mr,Dr,Nr,Pr=t(22768),Fr=t(98506),Er=t(6503);const Rr=()=>(0,m.jsxs)(Wr,{children:[(0,m.jsx)(Bn,{bigText:"Skeleton",inlineText:"<Skeleton>"}),(0,m.jsxs)(Or,{children:[(0,m.jsxs)(Hr,{children:[(0,m.jsxs)(Qr,{children:[(0,m.jsx)(Ur,{children:(0,m.jsx)(u,{stateName:"Text",prefix:"",size:"",dotted:!1})}),(0,m.jsxs)(Kr,{children:[(0,m.jsx)(Pr.A,{variant:"text",width:200,height:30}),(0,m.jsx)(y,{content:'<Skeleton variant="text" width={200} height={30} />'})]})]}),(0,m.jsxs)(Qr,{children:[(0,m.jsx)(Ur,{children:(0,m.jsx)(u,{stateName:"Circle",prefix:"",size:"",dotted:!1})}),(0,m.jsxs)(Kr,{children:[(0,m.jsx)(Pr.A,{variant:"circular",width:40,height:40}),(0,m.jsx)(y,{content:'<Skeleton variant="circular" width={40} height={40} />'})]})]}),(0,m.jsxs)(Qr,{children:[(0,m.jsx)(Ur,{children:(0,m.jsx)(u,{stateName:"Rectangle",prefix:"",size:"",dotted:!1})}),(0,m.jsxs)(Kr,{children:[(0,m.jsx)(Pr.A,{variant:"rectangular",width:200,height:50}),(0,m.jsx)(y,{content:'<Skeleton variant="rectangular" width={200} height={50} />'})]})]})]}),(0,m.jsx)(Hr,{children:(0,m.jsxs)(Ze,{children:[(0,m.jsx)(en,{children:(0,m.jsx)(u,{stateName:"Example",prefix:"",size:"",dotted:!1})}),(0,m.jsxs)($e,{children:[(0,m.jsxs)(Ke,{children:[(0,m.jsx)(Pr.A,{variant:"circular",width:40,height:40}),(0,m.jsx)(Pr.A,{variant:"text",width:200,height:30})]}),(0,m.jsx)(Pr.A,{variant:"rectangular",height:50})]}),(0,m.jsx)(y,{content:'<SkeletonShowcaseExampleRow>\n <SkeletonShowcaseExampleSkeletons>\n <SkeletonShowcaseTopRow>\n <Skeleton variant="circular" width={40} height={40} />\n <Skeleton variant="text" width={200} height={30} />\n </SkeletonShowcaseTopRow>\n <Skeleton variant="rectangular" height={50} />\n </SkeletonShowcaseExampleSkeletons>\n </SkeletonShowcaseExampleRow>'})]})})]}),(0,m.jsx)(Bn,{bigText:"Linear Progress",inlineText:"<LinearProgress>"}),(0,m.jsx)(Gr,{children:[{name:"Primary",values:[50,75]},{name:"Secondary",values:[40,80]}].flatMap(e=>e.values.map((n,t)=>{const r=0===t;return(0,m.jsxs)(Yr,{children:[(0,m.jsx)(u,{stateName:e.name,prefix:"Label",size:r?"Yes":"No"}),(0,m.jsx)(Jr,{children:(0,m.jsx)("tbody",{children:["Determinate","Buffer","Indeterminate"].map(t=>(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:t}),(0,m.jsx)("td",{children:(0,m.jsxs)(Zr,{children:[(0,m.jsx)(Fr.A,{variant:null===t||void 0===t?void 0:t.toLowerCase(),value:"Determinate"===t?n:void 0,valueBuffer:"Buffer"===t?n:void 0,sx:(0,De.A)({width:200},"Secondary"===e.name?{bgcolor:"#ccc","& .MuiLinearProgress-bar":{bgcolor:"#FFC107"}}:{})}),(0,m.jsx)(y,{content:'<LinearProgress variant="'.concat(null===t||void 0===t?void 0:t.toLowerCase(),'"').concat("Determinate"===t?" value={".concat(n,"}"):"").concat("Buffer"===t?" valueBuffer={".concat(n,"}
1"):"",' color="').concat("Secondary"===e.name?"secondary":"primary",'" /> ').concat(r&&"Determinate"===t?"<ProgressValue>50%</ProgressValue>":"")}),r&&"Determinate"===t&&(0,m.jsxs)($r,{children:[n,"%"]})]})})]},t))})})]},"".concat(e.name,"-").concat(t))}))}),(0,m.jsx)(Bn,{bigText:"Circular Progress",inlineText:"<CircularProgress>"}),(0,m.jsx)(Vr,{children:[32,16].map(e=>(0,m.jsxs)(Xr,{children:[(0,m.jsx)(u,{stateName:"",prefix:"Size",size:"".concat(e,"px"),dotted:!1}),(0,m.jsx)(qr,{children:(0,m.jsx)("tbody",{children:["Primary","Secondary","Inherit"].map(n=>(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{stateName:n,prefix:"",size:"",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsxs)(Zr,{children:[(0,m.jsx)(Er.A,{size:e,color:"Secondary"===n?"secondary":null===n||void 0===n?void 0:n.toLowerCase()}),(0,m.jsx)(y,{content:"<CircularProgress size={".concat(e,'} color="').concat("Secondary"===n?"secondary":null===n||void 0===n?void 0:n.toLowerCase(),'" />')})]})})]},n))})})]},e))})]}),Wr=a.Ay.div(jr||(jr=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),Or=a.Ay.div(Ar||(Ar=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n margin-bottom: 30px;\n\n @media (min-width: 1024px) {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n"]))),Hr=a.Ay.div(fr||(fr=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n"]))),Qr=a.Ay.div(vr||(vr=(0,r.A)(["\n display: flex;\n align-items: center;\n gap: 16px;\n"]))),Ur=a.Ay.div(yr||(yr=(0,r.A)(["\n width: 120px;\n"]))),Gr=(a.Ay.div(wr||(wr=(0,r.A)(["\n display: flex;\n gap: 16px;\n align-items: center;
1\n"]))),a.Ay.div(_r||(_r=(0,r.A)(["\n display: flex;\n align-items: flex-start;\n gap: 16px;\n"]))),a.Ay.div(Cr||(Cr=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n"]))),a.Ay.div(kr||(kr=(0,r.A)(["\n display: flex;\n gap: 16px;\n align-items: center;\n"]))),a.Ay.div(Sr||(Sr=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n margin-bottom: 50px;\n\n @media (min-width: 1024px) {\n flex-direction: row;\n gap: 50px;\n }\n"])))),Yr=a.Ay.div(zr||(zr=(0,r.A)(["\n flex: 1;\n min-width: 280px;\n"]))),Jr=a.Ay.table(Ir||(Ir=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n margin-top: 8px;\n\n tbody td:first-child {\n width: 120px;\n font-weight: 500;\n padding: 8px 0;\n vertical-align: middle;\n }\n\n tbody td {\n padding: 8px 0;\n }\n"]))),Vr=a.Ay.div(Br||(Br=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n margin-bottom: 50px;\n\n @media (min-width: 1024px) {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n"]))),Xr=a.Ay.div(Tr||(Tr=(0,r.A)(["\n flex: 1;\n min-width: 280px;\n"]))),qr=a.Ay.table(Lr||(Lr=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n margin-top: 8px;\n\n tbody td:first-child {\n width: 120px;\n font-weight: 500;\n padding: 8px 0;\n vertical-align: middle;\n }\n\n tbody td {\n padding: 8px 0;\n }\n"]))),Zr=a.Ay.div(Mr||(Mr=(0,r.A)(["\n display: flex;\n align-items: center;\n gap: 8px;\n padding-left: 20px;\n\n @media screen and (min-width: ","px) {\n padding-left: 30px;\n }\n"])),l.f.laptop),$r=a.Ay.span(Dr||(Dr=(0,r.A)(["\n font-size: 14px;\n font-weight: 500;\n"]))),Kr=a.Ay.div(Nr||(Nr=(0,r.A)(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n"])));var ei,ni,ti,ri,ii,ai,li,oi,si,di,ci,xi,pi,hi,mi,ui,gi,bi,ji,Ai,fi,vi,yi,wi,_i,Ci,ki,Si,zi,Ii,Bi=t(63577),Ti=t(32284),Li=t(38796);const Mi=()=>{const e=["Filled","Standard","Outline"],n=["Success","Info","Warning","Error"],t={success:"#4caf50",info:"#2196f3",warning:"#ff9800",error:"#f44336"},r={None:"bottom",Up:"top",Down:"bottom",Right:"right",Left:"left"};return(0,m.jsxs)(Di,{children:[(0,m.jsx)(Bn,{bigText:"Alert",inlineText:"<Alert>"}),(0,m.jsx)(Ni,{children:["Yes","No"].map(r=>e.map(e=>(0,m.jsxs)(Pi,{children:[(0,m.jsx)(u,{stateName:e,prefix:"Title",size:r,dotted:!1}),(0,m.jsx)(Fi,{children:(0,m.jsx)("tbody",{children:n.map(n=>{const i=null===n||void 0===n?void 0:n.toLowerCase(),a='<Alert variant="'.concat("outline"!==(null===e||void 0===e?void 0:e.toLowerCase())?null===e||void 0===e?void 0:e.toLowerCase():"outlined",'" severity="').concat(i,'">\n ').concat("Yes"===r?'<AlertTitle>{"{Title}"}</AlertTitle>':"",'\n {"{Description}"}\n </Alert>');return(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{stateName:n,prefix:"",size:"",dotted:!1})}),(0,m.jsxs)("td",{style:{display:"flex"},children:[(0,m.jsx)(Ei,{outline:"Outline"===e,outlineColor:t[i],children:(0,m.jsxs)(Ri,{variant:null===e||void 0===e?void 0:e.toLowerCase(),severity:i,children:["Yes"===r&&(0,m.jsx)(Bi.A,{children:"{Title}"}),"{Description}"]})}),(0,m.jsx)(y,{content:a})]})]},n)})})})]},"".concat(e,"-").concat(r))))}),(0,m.jsx)(Bn,{bigText:"Snackbar",inlineText:"<Snackbar>"}),(0,m.jsx)(Wi,{children:(0,m.jsx)(Oi,{children:(0,m.jsx)(Hi,{children:(0,m.jsx)("tbody",{children:["Outline","Elevation"].map(e=>{const n='<Snackbar variant="'.concat("outline"===(null===e||void 0===e?void 0:e.toLowerCase())?"outlined":"elevation",'">\n {Message}\n <Label>Label</Label>\n </Snackbar>');return(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{stateName:e,prefix:"",size:"",dotted:!1})}),(0,m.jsxs)("td",{style:{display:"flex"},children:[(0,m.jsx)(Qi,{children:(0,m.jsx)(Ui,{variant:"Outline"===e?"outlined":"elevation",children:(0,m.jsxs)(Gi,{children:[(0,m.jsx)(Yi,{children:"{Message}"}),(0,m.jsxs)(Ji,{children:[(0,m.jsx)(Vi,{children:"Label"}),(0,m.jsx)(Xi,{children:"x"})]})]})})}),(0,m.jsx)(y,{content:n})]})]},e)})})})})}),(0,m.jsx)(Bn,{bigText:"Tooltip",inlineText:"<Tooltip>"}),(0,m.jsx)(qi,{children:(0,m.jsx)(Zi,{children:(0,m.jsx)($i,{children:(0,m.jsx)("tbody",{children:["None","Up","Down","Right","Left"].map(e=>
1{const n='<Tooltip title="'.concat(e,'" placement="').concat(r[e],'" arrow>\n <span>Hover me</span>\n </Tooltip>');return(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsxs)(Ki,{children:[(0,m.jsx)("div",{children:"Direction"}),(0,m.jsx)(ea,{children:e})]})}),(0,m.jsxs)("td",{style:{display:"flex"},children:["None"===e?(0,m.jsx)(na,{placement:"bottom",children:(0,m.jsx)(ta,{children:"Tooltip ".concat(e)})}):(0,m.jsxs)(na,{placement:r[e],children:[(0,m.jsx)(ta,{children:"Tooltip ".concat(e)}),(0,m.jsx)(ra,{placement:r[e]})]}),(0,m.jsx)(y,{content:n})]})]},e)})})})})})]})},Di=a.Ay.div(ei||(ei=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),Ni=a.Ay.div(ni||(ni=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n margin-bottom: 30px;\n\n @media (min-width: 1024px) {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 50px;\n }\n"]))),Pi=a.Ay.div(ti||(ti=(0,r.A)(["\n flex: 1;\n"]))),Fi=a.Ay.table(ri||(ri=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n margin-top: 8px;\n\n tbody td:first-child {\n width: 120px;\n font-weight: 500;\n padding: 8px 0;\n vertical-align: middle;\n }\n\n tbody td {\n padding: 8px 0;\n }\n"]))),Ei=a.Ay.div(ii||(ii=(0,r.A)(["\n display: inline-block;\n width: 200px;\n ","\n @media screen and (min-width: ","px) {\n width: 250px;\n width: 100%;\n }\n"])),e=>{let{outline:n,outlineColor:t}=e;return n&&(0,a.AH)(ai||(ai=(0,r.A)(["\n border: 1px solid ",";\n border-radius: 4px;\n padding: 2px;\n "])),t)},l.f.laptop),Ri=(0,a.Ay)(Ti.A)(li||(li=(0,r.A)(["\n width: 100%;\n"]))),Wi=a.Ay.div(oi||(oi=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n margin-bottom: 50px;\n"]))),Oi=a.Ay.div(si||(si=(0,r.A)(["\n flex: 1;
1\n"]))),Hi=a.Ay.table(di||(di=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n margin-top: 8px;\n\n tbody td:first-child {\n width: 120px;\n font-weight: 500;\n padding: 8px 0;\n vertical-align: middle;\n }\n\n tbody td {\n padding: 8px 0;\n }\n"]))),Qi=a.Ay.div(ci||(ci=(0,r.A)(["\n display: inline-block;\n width: 250px;\n"]))),Ui=(0,a.Ay)(Li.A)(xi||(xi=(0,r.A)(["\n padding: 8px 12px;\n background-color: ",";\n color: ",";\n ","\n width: 100%;\n display: inline-block;\n"])),e=>{let{variant:n}=e;return"elevation"===n?"#323232":"transparent"},e=>{let{variant:n}=e;return"elevation"===n?"#fff":"#323232"},e=>{let{variant:n}=e;return"outlined"===n&&(0,a.AH)(pi||(pi=(0,r.A)(["\n border: 1px solid #323232;\n border-radius: 4px;\n "])))}),Gi=a.Ay.div(hi||(hi=(0,r.A)(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"]))),Yi=a.Ay.span(mi||(mi=(0,r.A)(["\n font-size: 14px;\n"]))),Ji=a.Ay.div(ui||(ui=(0,r.A)(["\n display: flex;\n gap: 8px;\n align-items: center;
1\n"]))),Vi=a.Ay.span(gi||(gi=(0,r.A)(["\n font-size: 14px;\n color: #2665ec;\n"]))),Xi=a.Ay.button(bi||(bi=(0,r.A)(["\n font-size: 14px;\n border: none;\n background: none;\n cursor: pointer;\n"]))),qi=a.Ay.div(ji||(ji=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n margin-bottom: 50px;\n"]))),Zi=a.Ay.div(Ai||(Ai=(0,r.A)(["\n flex: 1;\n"]))),$i=a.Ay.table(fi||(fi=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n margin-top: 8px;\n\n tbody td:first-child {\n width: 120px;\n font-weight: 500;\n padding: 8px 0;\n vertical-align: middle;\n }\n\n tbody td {\n padding: 8px 0;\n }\n"]))),Ki=a.Ay.div(vi||(vi=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),ea=a.Ay.span(yi||(yi=(0,r.A)(["\n color: #2665ec;\n"]))),na=a.Ay.div(wi||(wi=(0,r.A)(["\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n margin: 20px;\n"]))),ta=a.Ay.div(_i||(_i=(0,r.A)(["\n background-color: #616161;\n color: #fff;\n font-size: 12px;\n padding: 6px 8px;\n border-radius: 4px;\n width: 100px;\n text-align: center;\n white-space: nowrap;\n"]))),ra=a.Ay.div(Ci||(Ci=(0,r.A)(["\n position: absolute;\n width: 0;\n height: 0;\n border-style: solid;\n\n ","\n\n ","\n\n ","\n\n ","\n"])),e=>{let{placement:n}=e;return"top"===n&&(0,a.AH)(ki||(ki=(0,r.A)(["\n bottom: -4px;\n left: 50%;\n transform: translateX(-50%);\n border-width: 4px 4px 0 4px;\n border-color: #616161 transparent transparent transparent;\n "])))},e=>{let{placement:n}=e;return"bottom"===n&&(0,a.AH)(Si||(Si=(0,r.A)(["\n top: -4px;\n left: 50%;\n transform: translateX(-50%);\n border-width: 0 4px 4px 4px;\n border-color: transparent transparent #616161 transparent;\n "])))},e=>{let{placement:n}=e;return"left"===n&&(0,a.AH)(zi||(zi=(0,r.A)(["\n right: -4px;\n top: 50%;\n transform: translateY(-50%);\n border-width: 4px 0 4px 4px;\n border-color: transparent transparent transparent #616161;\n "])))},e=>{let{placement:n}=e;return"right"===n&&(0,a.AH)(Ii||(Ii=(0,r.A)(["\n left: -4px;\n top: 50%;\n transform: translateY(-50%);\n border-width: 4px 4px 4px 0;\n border-color: transparent #616161 transparent transparent;\n "])))});var ia=t(80218),aa=t(6732),la=t(65250),oa=t(27522),sa=t(47371),da=t(5310),ca=t(71500),xa=t(46349),pa=t(35775);const ha="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAUAAAAC0CAYAAADl5PURAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAVLSURBVHgB7d0xaFRZGIbhkzVBtEijwcKIiIWSThAJEgw2EogKC9tFULcQ1lYJCHbGTrHS1UpE0wqyBGQLZRsZMI2NjRgIWCxYCCkS7HZOIagkk2QzozN8zwMXhswtUr2Z/z9hbl8p5U4BCPRLAQglgEAsAQRiCSAQSwCBWAIIxBJAIJYAArEEEIglgEAsAQRiCSAQSwCBWAIIxBJAIJYAArEEEIglgEAsAQRiCSAQSwCBWAIIxBJAIJYAArEEEIglgEAsAQRiCSAQSwCBWAIIxBJAIJYAArEEEIglgEAsAQRiCSAQSwCBWAIIxBJAIJYAArEEEIglgEAsAQRiCSAQSwCBWAIIxBJAIJYAArEEEIglgEAsAQRiCSAQSwCBWAIIxBJAIJYAArEEEIglgEAsAQRiCSAQSwCBWAIIxBJAIJYAArEEEIjVX2ADJicnh27dujW+f//+oR07dmwvXWhlZeVzo9F4Pz093Zifn18qsI5tzWuiQAs3btwYuX///q+7d+8eHBgY6No/mvV3O3DgwNClS5eO9Pf3L718+fJjgRb6mtedAms4evTo4OvXr38vPej06dOzc3NzIsia7ABpqTn2jpYeVUf2Ai0IIC0dO3bsYOlRdV9ZoAWHILS02oFHc7f29tWrVx9KFxkbGxseHx8f+fpn3XpYQ/cQQDatxu/69etvSxeZmZkp3wcQ1mMEBmIJIBBLAIFYAgjEEkAglgACsQQQiCWAQCwBBGIJIBBLAIFYAgjEEkAglgACsQQQiCWAQCwBpOvs3bvXNznzQwggXaU+he7NmzdTd+/ePVKgwwSQrvL48eNTu3btGrx48eJojWGBDhJAukYzfqOHDx8erq/rA42eP3/+m3GYThJAOqaOsRsdZa9cuXLw3Llz3zyDuH4SvHfvXs8+l5juJ4B0RB1f6xh7+fLl8cnJyaH17r127dqqDzE/e/bsEftAOkUAabs6ttbx9ctzeR89enSm1T6v3ls/7a31vn0gnSKAtN3s7Oz410Grr58+fXpmtX3es2fPxlvFr7IPpFMEkLaqBxmrPaB83759Q833vhlz62hbR9yyAfaBdIIA0jbnz58f/v4g42snT54cqYGsr+tIW/eDZRPsA2m3/gJtUIN2+/btU+vdVwPZ19dXJiYmRsr/UPeBDx8+fD8/P79UYIt8AqQt6o5vvV3eF1NTU6Mbvfd79oG0kwCyZXWsrTu+8oPYB9IuAsiW1J1cq71fp9gH0g52gGzJwsLC0s2bN/8uP8GnT58+F9gCAWRLmgcf7wv0KCMwEEsAgVgCCMSyA2TTjh8/PjwzM1O6ydjY2HCBTeprXncKrGF5efmPL9/q0mtWVlY+79y5888CazAC09Li4uLH0qMajYYTaloSQFq6evXqP6VHTU9PNwq0sK15TRRYw7t375YHBgaWTpw4cbD0kPrP2U+ePPlQoAUBZF0vXrz4ODc39/bQoUPb9+zZM9gMYlcentWd38LCwr8XLlz468GDB4sF1uEQBIhlBwjEEkAglgACsQQQiCWAQCwBBGIJIBBLAIFYAgjEEkAglgACsQQQiCWAQCwBBGIJIBBLAIFYAgjEEkAglgACsQQQiCWAQCwBBGIJIBBLAIFYAgjEEkAglgACsQQQiCWAQCwBBGIJIBBLAIFYAgjEEkAglgACsQQQiCWAQCwBBGIJIBBLAIFYAgjEEkAglgACsQQQiCWAQCwBBGIJIBBLAIFYAgjEEkAglgACsQQQiCWAQCwBBGIJIBBLAIFYAgjEEkAglgACsQQQiCWAQCwBBGIJIBBLAIFYAgjE+g/Fx+gNt2w+EQAAAABJRU5ErkJggg==",ma={XSM:"xs",SM:"sm",MD:"md",LG:"lg",XL:"xl"},ua={XSM:700,SM:800,MD:900,LG:1e3,XL:1100},ga=e=>{let{size:n}=e;const[t,r]=(0,i.useState)(!1),a=ua[n]||400,l="<DialogPreviewCard style={{ width: ".concat(a,' }}>\n <HeaderText>{\'{Header}\'}</HeaderText>\n <DialogActionButtonWrapper>Instance Slot</DialogActionButtonWrapper>\n <DialogActionsRow>\n <Button variant="text">Action</Button>\n <Button variant="text">Action</Button>\n </DialogActionsRow>\n <Dialog open={false} fullWidth maxWidth="').concat(ma[n],'">\n <DialogTitle>Alert Dialog - ').concat(n,"</DialogTitle>\n <DialogContent>\n <DialogContentText>This is some text inside the dialog for ").concat(n,".</DialogContentText>\n </DialogContent>\n <DialogActions>\n <Button>Cancel</Button>\n <Button>Confirm</Button>\n </DialogActions>\n </Dialog>\n </DialogPreviewCard>");return(0,m.jsxs)(Sn,{children:[(0,m.jsxs)(_n,{style:{width:a},children:[(0,m.jsx)(Je,{children:"Title"}),(0,m.jsx)(kn,{onClick:()=>r(!0),children:"Instance Slot"}),(0,m.jsxs)(Cn,{children:[(0,m.jsx)(p.A,{variant:"text",children:"Action"}),(0,m.jsx)(p.A,{variant:"text",children:"Action"})]}),(0,m.jsxs)(ia.A,{open:t,onClose:()=>r(!1),fullWidth:!0,maxWidth:ma[n],children:[(0,m.jsxs)(aa.A,{children:["Alert Dialog - ",n]}),(0,m.jsx)(la.A,{children:(0,m.jsxs)(oa.A,{children:["This is some text inside the dialog for ",n,"."]})}),(0,m.jsxs)(sa.A,{children:[(0,m.jsx)(p.A,{onClick:()=>r(!1),children:"Cancel"}),(0,m.jsx)(p.A,{onClick:()=>r(!1),children:"Confirm"})]})]})]}),(0,m.jsx)(y,{content:l})]})},ba=e=>{let{size:n}=e;const[t,r]=(0,i.useState)(!1),a=ua[n]||400,l='<DialogPreviewCard style={{ width }}>\n <HeaderText>Title</HeaderText>\n <DialogActionButtonWrapper onClick={() => setOpen(true)}>Instance Slot</DialogActionButtonWrapper>\n <DialogActionsRow>\n <Button variant="text">Action</Button>\n <Button variant="text">Action</Button>\n </DialogActionsRow>\n <Dialog open={false} fullWidth maxWidth="'.concat(ma[n],'">\n <DialogTitle>Form Dialog - ').concat(n,"</DialogTitle>\n <DialogContent>\n <DialogContentText>This is a form dialog for ").concat(n,'.</DialogContentText>\n <TextField\n autoFocus\n margin="dense"\n id="email"\n label="Email"\n type="email"\n fullWidth\n variant="outlined"\n />\n </DialogContent>\n <DialogActions>\n <Button>Cancel</Button>\n <Button>Confirm</Button>\n </DialogActions>\n </Dialog>\n </DialogPreviewCard>');return(0,m.jsxs)(Sn,{children:[(0,m.jsxs)(_n,{style:{width:a},children:[(0,m.jsx)(Je,{children:"Title"}),(0,m.jsx)(kn,{onClick:()=>r(!0),children:"Instance Slot"}),(0,m.jsxs)(Cn,{children:[(0,m.jsx)(p.A,{variant:"text",children:"Action"}),(0,m.jsx)(p.A,{variant:"text",children:"Action"})]}),(0,m.jsxs)(ia.A,{open:t,onClose:()=>r(!1),fullWidth:!0,maxWidth:ma[n],children:[(0,m.jsxs)(aa.A,{children:["Form Dialog - ",n]}),(0,m.jsx)(la.A,{children:(0,m.jsx)(Ne.A,{autoFocus:!0,margin:"dense",id:"email",label:"Email",type:"email",fullWidth:!0,variant:"outlined"})}),(0,m.jsxs)(sa.A,{children:[(0,m.jsx)(p.A,{onClick:()=>r(!1),children:"Cancel"}),(0,m.jsx)(p.A,{onClick:()=>r(!1),children:"Confirm"})]})]})]}),(0,m.jsx)(y,{content:l})]})},ja=()=>(0,m.jsxs)(nn,{children:[(0,m.jsx)(Bn,{bigText:"CardHeader",inlineText:"<CardHeader>"}),(0,m.jsx)(tn,{children:(0,m.jsx)(rn,{children:(0,m.jsx)(on,{children:(0,m.jsx)("tbody",{children:["Default","Avatar","Avatar Subheader","Avatar Subheader Icon"].map(e=>{let n="";switch(e){case"Default":n="<CardRowContent>\n <HeaderText>{'{Header}'}</HeaderText>\n</CardRowContent>";break;case"Avatar":n="<CardRowContent>\n <Avatar>{'A'}</Avatar>\n <HeaderText>{'{Header}'}</HeaderText>\n</CardRowContent>";break;case"Avatar Subheader":n="<CardRowContent>\n <Avatar>{'A'}</Avatar>\n <HeaderSubContent>\n <HeaderText>{'{Header}'}</HeaderText>\n <SubheaderText>{'{Subheader}'}</SubheaderText>\n </HeaderSubContent>\n</CardRowContent>";break;case"Avatar Subheader Icon":n="<CardRowContent>\n <Avatar>{'A'}</Avatar>\n <HeaderSubContent>\n <HeaderText>{'{Header}'}</HeaderText>\n <SubheaderText>{'{Subheader}'}</SubheaderText>\n </HeaderSubContent>\n <IconButton size=\"small\">\n <Star />\n </IconButton>\n</CardRowContent>";break;default:n=""}return(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{stateName:"",prefix:"",size:e,dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsxs)(Ge,{children:["Default"===e&&(0,m.jsx)(Je,{children:"{Header}"}),"Avatar"===e&&(0,m.jsxs)(m.Fragment,{children:[(0,m.jsx)(da.A,{children:"A"}),(0,m.jsx)(Je,{children:"{Header}"})]}),"Avatar Subheader"===e&&(0,m.jsxs)(m.Fragment,{children:[(0,m.jsx)(da.A,{children:"A"}),(0,m.jsxs)(Ye,{children:[(0,m.jsx)(Je,{children:"{Header}"}),(0,m.jsx)(Ve,{children:"{Subheader}"})]})]}),"Avatar Subheader Icon"===e&&(0,m.jsxs)(m.Fragment,{children:[(0,m.jsx)(da.A,{children:"A"}),(0,m.jsxs)(Ye,{children:[(0,m.jsx)(Je,{children:"{Header}"}),(0,m.jsx)(Ve,{children:"{Subheader}"})]}),(0,m.jsx)(ca.A,{size:"small",children:(0,m.jsx)(h.A,{})})]}),(0,m.jsx)(y,{content:n})]})})]},e)})})})})}),(0,m.jsx)(Bn,{bigText:"CardActions",inlineText:"<CardActions>"}),(0,m.jsx)(tn,{children:(0,m.jsx)(rn,{children:(0,m.jsx)(on,{children:(0,m.jsx)("tbody",{children:[{label:"Action 1",count:1},{label:"Action 1,2",count:2},{label:"Action 1,2,3",count:3}].map(e=>{const n="<MuiCardActions>\n".concat(Array.from({length:e.count}).map(()=>" <StorybookActionButton>Action</StorybookActionButton>").join("\n"),"\n</MuiCardActions>");return(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{stateName:"",prefix:"",size:e.label,dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsxs)(an,{children:[(0,m.jsx)(xa.A,{children:Array.from({length:e.count}).map((e,n)=>(0,m.jsx)(We,{children:"Action"},n))}),(0,m.jsx)(y,{content:n})]})})]},e.label)})})})})}),(0,m.jsx)(Bn,{bigText:"CardMedia",inlineText:"<CardMedia>"}),(0,m.jsx)(tn,{children:(0,m.jsx)(rn,{children:(0,m.jsxs)(sn,{children:[(0,m.jsx)(ln,{className:"left-column",children:(0,m.jsx)(on,{children:(0,m.jsxs)("tbody",{children:[(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{stateName:"",prefix:"",size:"1:9",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsx)(pa.A,{image:ha,title:"Media",sx:{width:320,height:180}})}),(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:'<CardMedia image={CardMediaImage} title="Media" sx={{ width: 320, height: 180 }} />'})})]}),(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{stateName:"",prefix:"",size:"4:3",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsx)(pa.A,{image:ha,title:"Media",sx:{width:320,height:240}})}),(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:'<CardMedia image={CardMediaImage} title="Media" sx={{ width: 320, height: 240 }} />'})})]})]})})}),(0,m.jsx)("div",{className:"right-column",children:(0,m.jsx)(on,{children:(0,m.jsx)("tbody",{children:(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsxs)(qe,{children:[(0,m.jsx)(u,{stateName:"",prefix:"",size:"Card Elements Bundled",dotted:!1}),(0,m.jsxs)(Xe,{children:[(0,m.jsx)(pa.A,{image:ha,title:"Media",sx:{width:320,height:180}}),(0,m.jsx)(Je,{children:"{Header}"}),(0,m.jsx)(Oe,{children:"Instance Slot"}),(0,m.jsxs)(xa.A,{children:[(0,m.jsx)(We,{children:"Action 1"}),(0,m.jsx)(We,{children:"Action 2"})]})]})]})}),(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:"<CardMedia image={CardMediaImage} title=\"Media\" sx={{ width: 320, height: 180 }} />\n<HeaderText>{'{Header}'}</HeaderText>\n<StorybookActionButtonAdjusted>Instance Slot</StorybookActionButtonAdjusted>\n<MuiCardActions>\n <StorybookActionButton>Action 1</StorybookActionButton>\n <StorybookActionButton>Action 2</StorybookActionButton>\n</MuiCardActions>"})})]})})})})]})})}),(0,m.jsx)(Bn,{bigText:"Dialog",inlineText:"<Dialog>"}),(0,m.jsx)(tn,{children:["XL","LG","MD","SM","XSM"].map(e=>(0,m.jsx)(rn,{children:(0,m.jsx)(on,{children:(0,m.jsx)("tbody",{children:(0,m.jsxs)("tr",{style:{display:"flex",flexDirection:"column"},children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{stateName:"",prefix:"",size:e,dotted:!1})}),(0,m.jsx)("td",{className:"adjustedTD",children:(0,m.jsx)(ga,{size:e})})]})})})},e))}),(0,m.jsx)(Bn,{bigText:"FormDialog",inlineText:"<FormDialog>"}),(0,m.jsx)(tn,{children:["XL","LG","MD","SM","XSM"].map(e=>(0,m.jsx)(rn,{children:(0,m.jsx)(on,{children:(0,m.jsx)("tbody",{children:(0,m.jsxs)("tr",{style:{display:"flex",flexDirection:"column"},children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{stateName:"",prefix:"",size:e,dotted:!1})}),(0,m.jsx)("td",{className:"adjustedTD",children:(0,m.jsx)(ba,{size:e})})]})})})},e))})]});var Aa=t(84536),fa=t(25269),va=t(87631),ya=t(50943),wa=t(33588),_a=t(48767),Ca=t(39172),ka=t(95329),Sa=t(79812),za=t(1183),Ia=t(15957),Ba=t(15060),Ta=t(12515);const La=["large","medium","small"],Ma=["standard","primary","secondary"],Da=()=>{const e=["Circular","Rounded"];return(0,m.jsxs)(dn,{children:[(0,m.jsx)(Bn,{bigText:"Pagination",inlineText:"<Pagination>"}),e.map(e=>(0,m.jsx)(cn,{children:(0,m.jsx)(xn,{children:La.map(n=>{const t=n.charAt(0).toUpperCase()+n.slice(1);return(0,m.jsx)(hn,{children:(0,m.jsx)(mn,{children:(0,m.jsx)("tbody",{children:(0,m.jsxs)("tr",{style:{display:"flex",flexDirection:"column"},children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{stateName:e,prefix:"Size",size:t,dotted:!0})}),(0,m.jsx)("td",{children:(0,m.jsx)(un,{children:(0,m.jsx)("tbody",{children:Ma.map(t=>{const r=t.charAt(0).toUpperCase()+t.slice(1),i='<Pagination size="'.concat(n,'" color="').
1concat(t,'" shape="').concat("Circular"===e?"circular":"rounded",'" count={6} />');return(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{size:r,stateName:"",prefix:"",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsxs)(gn,{children:[(0,m.jsx)(Aa.A,{size:n,color:t,shape:"Circular"===e?"circular":"rounded",count:6,sx:"secondary"===t?{color:"#FFC107","& .Mui-selected":{backgroundColor:"#FFC107 !important",color:"#fff"}}:{}}),(0,m.jsx)(y,{content:i})]})})]},t)})})})})]})})})},n)})})},e)),(0,m.jsx)(Bn,{bigText:"Pagination First/Last",inlineText:"<Pagination>"}),e.map(e=>(0,m.jsx)(cn,{children:(0,m.jsx)(pn,{children:La.map(n=>{const t=n.charAt(0).toUpperCase()+n.slice(1);return(0,m.jsx)(hn,{children:(0,m.jsx)(mn,{children:(0,m.jsx)("tbody",{children:(0,m.jsxs)("tr",{style:{display:"flex",flexDirection:"column"},children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{stateName:e,prefix:"Size",size:t,dotted:!0})}),(0,m.jsx)("td",{children:(0,m.jsx)(un,{children:(0,m.jsx)("tbody",{children:Ma.map(t=>{const r=t.charAt(0).toUpperCase()+t.slice(1),i='<Pagination size="'.concat(n,'" color="').concat(t,'" shape="').concat("Circular"===e?"circular":"rounded",'" showFirstButton showLastButton count={6} />');return(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{size:r,stateName:"",prefix:"",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsxs)(gn,{children:[(0,m.jsx)(Aa.A,{size:n,color:t,shape:"Circular"===e?"circular":"rounded",count:6,showFirstButton:!0,showLastButton:!0,sx:"secondary"===t?{color:"#FFC107","& .Mui-selected":{backgroundColor:"#FFC107 !important",color:"#fff"}}:{}}),(0,m.jsx)(y,{content:i})]})})]},"firstlast-".concat(t))})})})})]})})})},"firstlast-".concat(e,"-").concat(n))})})},"firstlast-".concat(e))),(0,m.jsx)(Bn,{bigText:"Table",inlineText:"<Table>"}),(0,m.jsx)(bn,{children:["Normal","Small"].map(e=>(0,m.jsxs)(jn,{children:[(0,m.jsx)(u,{stateName:e,prefix:"",size:"",dotted:!1}),(0,m.jsxs)(An,{children:[(0,m.jsxs)(fn,{children:[(0,m.jsx)(u,{size:"Basic",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(fa.A,{component:Li.A,style:{flex:1},elevation:0,children:(0,m.jsxs)(va.A,{size:"Small"===e?"small":"medium",children:[(0,m.jsx)(ya.A,{children:(0,m.jsxs)(wa.A,{children:[(0,m.jsx)(_a.A,{sx:{fontWeight:600},children:"Head"}),(0,m.jsx)(_a.A,{sx:{fontWeight:600},children:"Head"}),(0,m.jsx)(_a.A,{sx:{fontWeight:600},children:"Head"})]})}),(0,m.jsx)(Ca.A,{children:Array.from({length:5}).map((e,n)=>(0,m.jsxs)(wa.A,{children:[(0,m.jsx)(_a.A,{children:"Cell"}),(0,m.jsx)(_a.A,{children:"Cell"}),(0,m.jsx)(_a.A,{children:"Cell"})]},n))})]})}),(0,m.jsx)(y,{content:'<Table size="'.concat("Small"===e?"small":"medium",'" />')})]},"Basic"),(0,m.jsxs)(fn,{children:[(0,m.jsx)(u,{size:"Checkbox",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(fa.A,{component:Li.A,style:{flex:1},elevation:0,children:(0,m.jsxs)(va.A,{size:"Small"===e?"small":"medium",children:[(0,m.jsx)(ya.A,{children:(0,m.jsxs)(wa.A,{children:[(0,m.jsx)(_a.A,{padding:"checkbox",children:(0,m.jsx)(Dt.A,{})}),(0,m.jsx)(_a.A,{sx:{fontWeight:600},children:"Head"}),(0,m.jsx)(_a.A,{sx:{fontWeight:600},children:"Head"})]})}),(0,m.jsx)(Ca.A,{children:Array.from({length:5}).map((e,n)=>(0,m.jsxs)(wa.A,{children:[(0,m.jsx)(_a.A,{padding:"checkbox",children:(0,m.jsx)(Dt.A,{})}),(0,m.jsx)(_a.A,{children:"Cell"}),(0,m.jsx)(_a.A,{children:"Cell"})]},n))})]})}),(0,m.jsx)(y,{content:'<Table size="'.concat("Small"===e?"small":"medium",'" padding="checkbox" />')})]},"Checkbox"),(0,m.jsxs)(fn,{children:[(0,m.jsx)(u,{size:"Footer",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(Ra,{}),(0,m.jsx)(y,{content:"<CustomFooterTable />"})]},"Footer"),(0,m.jsxs)(fn,{children:[(0,m.jsx)(u,{size:"Dense",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(fa.A,{component:Li.A,style:{flex:1},elevation:0,children:(0,m.jsxs)(va.A,{size:"small","aria-label":"dense table",sx:{minWidth:650},children:[(0,m.jsx)(ya.A,{children:(0,m.jsxs)(wa.A,{children:[(0,m.jsx)(_a.A,{children:"Dessert (100g serving)"}),(0,m.jsx)(_a.A,{align:"right",children:"Calories"}),(0,m.jsx)(_a.A,{align:"right",children:"Fat\xa0(g)"}),(0,m.jsx)(_a.A,{align:"right",children:"Carbs\xa0(g)"}),(0,m.jsx)(_a.A,{align:"right",children:"Protein\xa0(g)"})]})}),(0,m.jsx)(Ca.A,{children:Na.map(e=>(0,m.jsxs)(wa.A,{sx:{"&:last-child td, &:last-child th":{border:0}},children:[(0,m.jsx)(_a.A,{component:"th",scope:"row",children:e.name}),(0,m.jsx)(_a.A,{align:"right",children:e.calories}),(0,m.jsx)(_a.A,{align:"right",children:e.fat}),(0,m.jsx)(_a.A,{align:"right",children:e.carbs}),(0,m.jsx)(_a.A,{align:"right",children:e.protein})]},e.name))})]})}),(0,m.jsx)(y,{content:'<Table size="small" aria-label="dense table" />'})]},"Dense")]})]},e))}),(0,m.jsx)(Bn,{bigText:"Empty state"}
1),(0,m.jsx)(fa.A,{component:Li.A,elevation:0,children:(0,m.jsxs)(va.A,{children:[(0,m.jsx)(ya.A,{children:(0,m.jsx)(wa.A,{children:Array.from({length:7}).map((e,n)=>(0,m.jsx)(_a.A,{children:(0,m.jsx)("b",{children:"Header"})},n))})}),(0,m.jsx)(Ca.A,{children:(0,m.jsx)(wa.A,{children:(0,m.jsx)(_a.A,{colSpan:7,children:(0,m.jsxs)(vn,{children:[(0,m.jsx)(wn,{}),(0,m.jsx)(yn,{children:"No data available"})]})})})}),(0,m.jsx)(ka.A,{children:(0,m.jsx)(wa.A,{children:(0,m.jsx)(Sa.A,{rowsPerPageOptions:[5,10,25,{label:"All",value:-1}],colSpan:7,count:0,rowsPerPage:5,page:0,onPageChange:()=>{},onRowsPerPageChange:()=>{},ActionsComponent:Pa})})})]})}),(0,m.jsx)(y,{content:'<Table>\n <TableHead>\n <TableRow>\n <TableCell>Header 1</TableCell>\n <TableCell>Header 2</TableCell>\n <TableCell>Header 3</TableCell>\n </TableRow>\n </TableHead>\n <TableBody>\n <TableRow>\n <TableCell colSpan={3}>\n \x3c!-- Icon + "No data available" text --\x3e\n </TableCell>\n </TableRow>\n </TableBody>\n</Table>'})]})},Na=[{name:"Frozen yoghurt",calories:159,fat:6,carbs:24,protein:4},{name:"Ice cream sandwich",calories:237,fat:9,carbs:37,protein:4.3},{name:"Eclair",calories:262,fat:16,carbs:24,protein:6},{name:"Cupcake",calories:305,fat:3.7,carbs:67,protein:4.3},{name:"Gingerbread",calories:356,fat:16,carbs:49,protein:3.9}];function Pa(e){const n=(0,z.A)(),{count:t,page:r,rowsPerPage:i,onPageChange:a}=e;return(0,m.jsxs)("div",{style:{flexShrink:0,marginLeft:8},children:[(0,m.jsx)(ca.A,{onClick:e=>{a(e,0)},disabled:0===r,children:"rtl"===n.direction?(0,m.jsx)(Ta.A,{}):(0,m.jsx)(za.A,{})}),(0,m.jsx)(ca.A,{onClick:e=>{a(e,r-1)},disabled:0===r,children:"rtl"===n.direction?(0,m.jsx)(Ba.A,{}):(0,m.jsx)(Ia.A,{})}),(0,m.jsx)(ca.A,{onClick:e=>{a(e,r+1)},disabled:r>=Math.ceil(t/i)-1,children:"rtl"===n.direction?(0,m.jsx)(Ia.A,{}):(0,m.jsx)(Ba.A,{})}),(0,m.jsx)(ca.A,{onClick:e=>{a(e,Math.max(0,Math.ceil(t/i)-1))},disabled:r>=Math.ceil(t/i)-1,children:"rtl"===n.direction?(0,m.jsx)(za.A,{}):(0,m.jsx)(Ta.A,{})})]})}function Fa(e,n,t){return{name:e,calories:n,fat:t}}const Ea=[Fa("Cupcake",305,3.7),Fa("Donut",452,25),Fa("Eclair",262,16),Fa("Frozen yoghurt",159,6),Fa("Gingerbread",356,16),Fa("Honeycomb",408,3.2),Fa("Ice cream sandwich",237,9),Fa("Jelly Bean",375,0),Fa("KitKat",518,26),Fa("Lollipop",392,.2),Fa("Marshmallow",318,0),Fa("Nougat",360,19),Fa("Oreo",437,18)].sort((e,n)=>e.calories<n.calories?-1:1);function Ra(){const[e,n]=i.useState(0),[t,r]=i.useState(5),a=e>0?Math.max(0,(1+e)*t-Ea.length):0;return(0,m.jsx)(fa.A,{component:Li.A,elevation:0,children:(0,m.jsxs)(va.A,{children:[(0,m.jsx)(ya.A,{children:(0,m.jsxs)(wa.A,{children:[(0,m.jsx)(_a.A,{sx:{fontWeight:600},children:"Head"}),(0,m.jsx)(_a.A,{sx:{fontWeight:600},children:"Head"}),(0,m.jsx)(_a.A,{sx:{fontWeight:600},children:"Head"})]})}),(0,m.jsxs)(Ca.A,{children:[(t>0?Ea.slice(e*t,e*t+t):Ea).map(e=>(0,m.jsxs)(wa.A,{children:[(0,m.jsx)(_a.A,{component:"th",scope:"row",children:e.name}),(0,m.jsx)(_a.A,{children:e.calories}),(0,m.jsx)(_a.A,{children:e.fat})]},e.name)),a>0&&(0,m.jsx)(wa.A,{style:{height:53*a},children:(0,m.jsx)(_a.A,{colSpan:6})})]}),(0,m.jsx)(ka.A,{children:(0,m.jsx)(wa.A,{children:(0,m.jsx)(Sa.A,{rowsPerPageOptions:[5,10,25,{label:"All",value:-1}],colSpan:3,count:Ea.length,rowsPerPage:t,page:e,onPageChange:(e,t)=>
1{n(t)},onRowsPerPageChange:e=>{r(parseInt(e.target.value,10)),n(0)},ActionsComponent:Pa})})})]})})}var Wa,Oa,Ha,Qa,Ua=t(66712),Ga=t(34244),Ya=t(67534);const Ja=()=>(0,m.jsxs)(Ua.A,{"aria-label":"breadcrumb",children:[(0,m.jsxs)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]}),(0,m.jsxs)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]}),(0,m.jsxs)(Ga.A,{underline:"hover",color:"text.primary",href:"#","aria-current":"page",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]})]}),Va=()=>(0,m.jsxs)(Ua.A,{maxItems:2,"aria-label":"breadcrumb",children:[(0,m.jsxs)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]}),(0,m.jsxs)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]}),(0,m.jsxs)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]}),(0,m.jsxs)(Ga.A,{underline:"hover",color:"text.primary",href:"#","aria-current":"page",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]})]}),Xa=()=>(0,m.jsxs)(Ua.A,{separator:"\u203a","aria-label":"breadcrumb",children:[(0,m.jsx)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:"Link"}),(0,m.jsx)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:"Link"}),(0,m.jsx)(Ga.A,{underline:"hover",color:"text.primary",href:"#","aria-current":"page",children:"Link"})]}),qa=()=>(0,m.jsxs)(Ua.A,{separator:"\u203a",maxItems:2,"aria-label":"breadcrumb",children:[(0,m.jsx)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:"Link"}),(0,m.jsx)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:"Link"}),(0,m.jsx)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:"Link"}),(0,m.jsx)(Ga.A,{underline:"hover",color:"text.primary",href:"#","aria-current":"page",children:"Link"})]}),Za=()=>(0,m.jsxs)(Ua.A,{separator:(0,m.jsx)(Ya.A,{fontSize:"small"}),"aria-label":"breadcrumb",children:[(0,m.jsxs)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]}),(0,m.jsxs)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]}),(0,m.jsxs)(Ga.A,{underline:"hover",color:"text.primary",href:"#","aria-current":"page",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]})]}),$a=()=>(0,m.jsxs)(Ua.A,{separator:(0,m.jsx)(Ya.A,{fontSize:"small"}),maxItems:2,"aria-label":"breadcrumb",children:[(0,m.jsxs)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]}),(0,m.jsxs)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]}),(0,m.jsxs)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]}),(0,m.jsxs)(Ga.A,{underline:"hover",color:"text.primary",href:"#","aria-current":"page",children:[(0,m.jsx)(h.A,{fontSize:"small"})," Link"]})]}),Ka=()=>(0,m.jsxs)(Ua.A,{separator:"\u203a","aria-label":"breadcrumb",children:[(0,m.jsx)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:"Link"}),(0,m.jsx)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:"Link"}),(0,m.jsx)(Ga.A,{underline:"hover",color:"text.primary",href:"#","aria-current":"page",children:"Link"})]}),el=()=>(0,m.jsxs)(Ua.A,{separator:"\u203a",maxItems:2,"aria-label":"breadcrumb",children:[(0,m.jsx)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:"Link"}),(0,m.jsx)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:"Link"}),(0,m.jsx)(Ga.A,{underline:"hover",color:"inherit",href:"#",children:"Link"}),(0,m.jsx)(Ga.A,{underline:"hover",color:"text.primary",href:"#","aria-current":"page",children:"Link"})]}),nl='<Breadcrumbs aria-label="breadcrumb">\n <Link underline="hover" color="inherit" href="#"><StarIcon fontSize="small" /> Link</Link>\n <Link underline="hover" color="inherit" href="#"><StarIcon fontSize="small" /> Link</Link>\n <Link underline="hover" color="text.primary" href="#" aria-current="page"><StarIcon fontSize="small" /> Link</Link>\n</Breadcrumbs>',tl='<Breadcrumbs maxItems={2} aria-label="breadcrumb">\n <Link underline="hover" color="inherit" href="#"><StarIcon fontSize="small" /> Link</Link>\n <Link underline="hover" color="inherit" href="#"><StarIcon fontSize="small" /> Link</Link>\n <Link underline="hover" color="inherit" href="#"><StarIcon fontSize="small" /> Link</Link>\n <Link underline="hover" color="text.primary" href="#" aria-current="page"><StarIcon fontSize="small" /> Link</Link>\n</Breadcrumbs>',rl='<Breadcrumbs separator="\u203a" aria-label="breadcrumb">\n <Link underline="hover" color="inherit" href="#">Link</Link>\n <Link underline="hover" color="inherit" href="#">Link</Link>\n <Link underline="hover" color="text.primary" href="#" aria-current="page">Link</Link>\n</Breadcrumbs>',il='<Breadcrumbs separator="\u203a" maxItems={2} aria-label="breadcrumb">\n <Link underline="hover" color="inherit" href="#">Link</Link>\n <Link underline="hover" color="inherit" href="#">Link</Link>\n <Link underline="hover" color="inherit" href="#">Link</Link>\n <Link underline="hover" color="text.primary" href="#" aria-current="page">Link</Link>\n</Breadcrumbs>',al='<Breadcrumbs separator={<NavigateNextIcon fontSize="small" />} aria-label="breadcrumb">\n <Link underline="hover" color="inherit" href="#"><StarIcon fontSize="small" /> Link</Link>\n <Link underline="hover" color="inherit" href="#"><StarIcon fontSize="small" /> Link</Link>\n <Link underline="hover" color="text.primary" href="#" aria-current="page"><StarIcon fontSize="small" /> Link</Link>\n</Breadcrumbs>',ll='<Breadcrumbs separator={<NavigateNextIcon fontSize="small" />} maxItems={2} aria-label="breadcrumb">\n <Link underline="hover" color="inherit" href="#"><StarIcon fontSize="small" /> Link</Link>\n <Link underline="hover" color="inherit" href="#"><StarIcon fontSize="small" /> Link</Link>\n <Link underline="hover" color="inherit" href="#"><StarIcon fontSize="small" /> Link</Link>\n <Link underline="hover" color="text.primary" href="#" aria-current="page"><StarIcon fontSize="small" /> Link</Link>\n</Breadcrumbs>',ol='<Breadcrumbs separator="\u203a" aria-label="breadcrumb">\n <Link underline="hover" color="inherit" href="#">Link</Link>\n <Link underline="hover" color="inherit" href="#">Link</Link>\n <Link underline="hover" color="text.primary" href="#" aria-current="page">Link</Link>\n</Breadcrumbs>',sl='<Breadcrumbs separator="\u203a" maxItems={2} aria-label="breadcrumb">\n <Link underline="hover" color="inherit" href="#">Link</Link>\n <Link underline="hover" color="inherit" href="#">Link</Link>\n <Link underline="hover" color="inherit" href="#">Link</Link>\n <Link underline="hover" color="text.primary" href="#" aria-current="page">Link</Link>\n</Breadcrumbs>',dl=()=>(0,m.jsxs)(cl,{children:[(0,m.jsx)(Bn,{bigText:"Breadcrumbs",inlineText:"<Breadcrumbs>"}),(0,m.jsxs)(xl,{children:[(0,m.jsxs)(pl,{children:[(0,m.jsx)(u,{stateName:"Basic breadcrumbs",size:"",prefix:"",dotted:!1}),(0,m.jsx)(hl,{children:(0,m.jsxs)("tbody",{children:[(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{size:"Default",stateName:"",prefix:"",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsx)(Ja,{})}),(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:nl})})]}),(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{size:"Collapsed",stateName:"",prefix:"",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsx)(Va,{})}),(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:tl})})]}),(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{size:"No icons",stateName:"",prefix:"",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsx)(Xa,{})}),(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:rl})})]}),(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{size:"Collapsed No icons",stateName:"",prefix:"",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsx)(qa,{})}),(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:il})})]})]})})]}),(0,m.jsxs)(pl,{children:[(0,m.jsx)(u,{stateName:"Custom separator",size:"",prefix:"",dotted:!1}),(0,m.jsx)(hl,{children:(0,m.jsxs)("tbody",{children:[(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{size:"Default",stateName:"",prefix:"",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsx)(Za,{})}),(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:al})})]}),(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{size:"Collapsed",stateName:"",prefix:"",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsx)($a,{})}),(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:ll})})]}),(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{size:"No icons",stateName:"",prefix:"",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsx)(Ka,{})}),(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:ol})})]}),(0,m.jsxs)("tr",{children:[(0,m.jsx)("td",{children:(0,m.jsx)(u,{size:"Collapsed No icons",stateName:"",prefix:"",dotted:!1})}),(0,m.jsx)("td",{children:(0,m.jsx)(el,{})}),(0,m.jsx)("td",{children:(0,m.jsx)(y,{content:sl})})]})]})})]})]})]}
1),cl=a.Ay.div(Wa||(Wa=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),xl=a.Ay.div(Oa||(Oa=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 40px;\n\n @media (min-width: 1024px) {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n }\n"]))),pl=a.Ay.div(Ha||(Ha=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n flex: 1;\n"]))),hl=a.Ay.table(Qa||(Qa=(0,r.A)(["\n width: 100%;\n border-collapse: collapse;\n\n td {\n padding: 12px;\n vertical-align: middle;\n }\n"])));var ml,ul,gl,bl=t(278),jl=t(66187),Al=t(39709);bl.t1.register(bl.PP,bl.kc,bl.FN,bl.No,bl.E8,bl.Bs,bl.m_,bl.s$,bl.dN,Al.A);const fl="#2665EC",vl=()=>{const e={labels:["Group","Group","Group","Group","Group","Group","Group"],datasets:[{label:"Series 1",data:[50,70,30,90,60,80,40],backgroundColor:fl}]},n={labels:Array.from({length:11},(e,n)=>(20*n).toString()),datasets:[{label:"Series 1",data:[20,40,10,60,30,80,50,100,40,70,60],borderColor:fl,backgroundColor:fl,fill:!1,tension:.4,pointBackgroun
1dColor:fl,pointRadius:5}]},t={labels:["Series 1","Series 2","Series 3"],datasets:[{data:[45,25,30],backgroundColor:["#800080","#339966",fl],borderWidth:0}]},r={datasets:[{label:"Var B",data:Array.from({length:90},()=>({x:Math.floor(201*Math.random()),y:Math.floor(101*Math.random())})),backgroundColor:fl},{label:"Series 4",data:Array.from({length:90},()=>({x:Math.floor(201*Math.random()),y:Math.floor(101*Math.random())})),backgroundColor:"#9336FD"}]},i={labels:["0","20","40","60","80","90","200"],datasets:[{label:"Series 1",data:[10,40,20,60,30,70,100],fill:!0,backgroundColor:"rgba(38,101,236,0.2)",borderColor:fl,tension:.4,pointRadius:0}]};return(0,m.jsxs)(yl,{children:[(0,m.jsxs)(wl,{children:[(0,m.jsxs)(_l,{children:[(0,m.jsx)(Bn,{bigText:"Bar Chart",inlineText:"<BarChart>"}),(0,m.jsx)(jl.yP,{data:e,options:{plugins:{datalabels:{color:"#fff",anchor:"center",align:"center",font:{size:12}},legend:{display:!0}},scales:{y:{max:100}}}})]}),(0,m.jsx)(_l,{className:"clipoardSectionColumn",children:(0,m.jsx)(y,{content:"<Bar\n data={{\n labels: ['Group', 'Group', 'Group', 'Group', 'Group', 'Group', 'Group'],\n datasets: [{ label: 'Series 1', data: [50,70,30,90,60,80,40], backgroundColor: '".concat(fl,"' }]\n }}\n options={{\n plugins: { datalabels: { color: '#fff', anchor: 'center', align: 'center', font: { size: 12 } }, legend: { display: true } },\n scales: { y: { max: 100 } }\n }}\n/>")})})]}),(0,m.jsxs)(wl,{children:[(0,m.jsxs)(_l,{children:[(0,m.jsx)(Bn,{bigText:"Line Chart",inlineText:"<LineChart>"}),(0,m.jsx)(jl.N1,{data:n,options:{responsive:!0,plugins:{legend:{display:!0}},scales:{y:{min:0,max:100},x:{min:0,max:200,ticks:{stepSize:20}}}}})]}),(0,m.jsx)(_l,{className:"clipoardSectionColumn",children:(0,m.jsx)(y,{content:"<Line\n data={{\n labels: ".concat(JSON.stringify(n.labels),",\n datasets: [{ label: 'Series 1', data: ").concat(JSON.stringify(n.datasets[0].data),", borderColor: '").concat(fl,"', backgroundColor: '").concat(fl,"', fill: false, tension: 0.4, pointBackgroun
1dColor: '").concat(fl,"', pointRadius: 5 }]\n }}\n options={{\n responsive: true,\n plugins: { legend: { display: true } },\n scales: { y: { min: 0, max: 100 }, x: { min: 0, max: 200, ticks: { stepSize: 20 } } }\n }}\n />")})})]}),(0,m.jsxs)(wl,{className:"pieRow",children:[(0,m.jsxs)(_l,{children:[(0,m.jsx)(Bn,{bigText:"Pie Chart",inlineText:"<PieChart>"}),(0,m.jsx)(jl.Fq,{data:t,options:{plugins:{datalabels:{color:"white",font:{size:14},formatter:e=>"".concat(e,"%")},legend:{display:!0,position:"right"}}},width:200,height:200})]}),(0,m.jsx)(_l,{className:"clipoardSectionColumn",children:(0,m.jsx)(y,{content:"<Pie\n data={{\n labels: ['Series 1','Series 2','Series 3'],\n datasets: [{ data: [45,25,30], backgroundColor: ['#800080','#339966','".concat(fl,"'], borderWidth: 0 }]\n }}\n options={{\n plugins: { datalabels: { color: 'white', font: { size: 14 }, formatter: (value) => `${value}%` }, legend: { display: true, position: 'right' } }\n }}\n />")})})]}),(0,m.jsxs)(wl,{children:[(0,m.jsxs)(_l,{children:[(0,m.jsx)(Bn,{bigText:"Scatter Chart",inlineText:"<ScatterChart>"}),(0,m.jsx)(jl.Xl,{data:r,options:{responsive:!0,plugins:{legend:{display:!0},tooltip:{enabled:!0},datalabels:{display:!1}},scales:{x:{min:0,max:200},y:{min:0,max:100}}}})]}),(0,m.jsx)(_l,{className:"clipoardSectionColumn",children:(0,m.jsx)(y,{content:"<Scatter\n data={{\n datasets: [\n { label: 'Var B', data: ".concat(JSON.stringify(r.datasets[0].data),", backgroundColor: '").concat(fl,"' },\n { label: 'Series 4', data: ").concat(JSON.stringify(r.datasets[1].data),", backgroundColor: '#9336FD' }\n ]\n }}\n options={{\n responsive: true,\n plugins: { legend: { display: true }, tooltip: { enabled: true }, datalabels: { display: false } },\n scales: { x: { min: 0, max: 200 }, y: { min: 0, max: 100 } }\n }}\n />")})})]}),(0,m.jsxs)(wl,{children:[(0,m.jsxs)(_l,{children:[(0,m.jsx)(Bn,{bigText:"Area Chart",inlineText:"<AreaChart>"}),(0,m.jsx)(jl.N1,{data:i,options:{responsive:!0,plugins:{legend:{display:!0}},scales:{x:{min:0,max:200},y:{min:0,max:100}}}})]}),(0,m.jsx)(_l,{className:"clipoardSectionColumn",children:(0,m.jsx)(y,{content:"<Line\n data={{\n labels: ['0','20','40','60','80','90','200'],\n datasets: [{ label: 'Series 1', data: [10,40,20,60,30,70,100], fill: true, backgroundColor: 'rgba(38,101,236,0.2)', borderColor: '".concat(fl,"', tension: 0.4, pointRadius: 0 }]\n }}\n options={{\n responsive: true,\n plugins: { legend: { display: true } },\n scales: { x: { min: 0, max: 200 }, y: { min: 0, max: 100 } }\n }}\n />")})})]})]})},yl=a.Ay.div(ml||(ml=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 40px;\n"]))),wl=a.Ay.div(ul||(ul=(0,r.A)(["\n display: flex;\n flex-direction: row;\n gap: 20px;\n margin-bottom: 30px;\n\n @media screen and (max-width: ","px) {\n flex-direction: column;\n }\n\n &.pieRow {\n height: 500px;\n }\n"])),l.f.laptop),_l=a.Ay.div(gl||(gl=(0,r.A)(["\n flex: 1;\n display: flex;\n flex-direction: column;\n\n &.clipoardSectionColumn {\n justify-content: center;\n align-items: flex-start;\n padding-top: 80px;\n }\n"])));var Cl,kl,Sl,zl,Il,Bl,Tl=t(26236),Ll=t(72939),Ml=t(81505),Dl=t(56715),Nl=t(15010);const Pl=()=>{const[e,n]=(0,i.useState)(new Date),[t,r]=(0,i.useState)(new Date),[a,l]=(0,i.useState)(new Date),[o,s]=(0,i.useState)(new Date),[d,c]=(0,i.useState)(new Date),[x,p]=(0,i.useState)(new Date),[h,g]=(0,i.useState)(new Date),[b,j]=(0,i.useState)(new Date),[A,f]=(0,i.useState)(new Date),[v,w]=(0,i.useState)(new Date);return(0,m.jsx)(Nl.$J,{dateAdapter:Dl.h,children:(0,m.jsxs)(Fl,{children:[(0,m.jsx)(Bn,{bigText:"Calendar",inlineText:"<DateRangeCalendar>"}),(0,m.jsxs)(El,{children:[(0,m.jsxs)(Rl,{children:[(0,m.jsx)(u,{stateName:"Single date",size:"",prefix:"",dotted:!1}),(0,m.jsxs)(Wl,{children:[(0,m.jsxs)(Ol,{children:[(0,m.jsx)(u,{size:"Day",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(Hl,{children:(0,m.jsx)(Tl.$,{displayStaticWrapperAs:"desktop",openTo:"day",value:e,onCh
1ange:e=>n(e)})}),(0,m.jsx)(y,{content:'<StaticDatePicker openTo="day" value={singleDay} />'})]}),(0,m.jsxs)(Ol,{children:[(0,m.jsx)(u,{size:"Date Disabled",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(Hl,{children:(0,m.jsx)(Tl.$,{displayStaticWrapperAs:"desktop",openTo:"day",value:t,onChange:e=>r(e),shouldDisableDate:e=>0===e.getDay()||6===e.getDay()})}),(0,m.jsx)(y,{content:'<StaticDatePicker openTo="day" value={singleDisabled} shouldDisableDate={(date) => date.getDay()===0 || date.getDay()===6} />'})]}),(0,m.jsxs)(Ol,{children:[(0,m.jsx)(u,{size:"Month",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(Hl,{children:(0,m.jsx)(Tl.$,{displayStaticWrapperAs:"desktop",openTo:"month",views:["month"],value:a,onChange:e=>l(e)})}),(0,m.jsx)(y,{content:'<StaticDatePicker openTo="month" value={singleMonth} />'})]}),(0,m.jsxs)(Ol,{children:[(0,m.jsx)(u,{size:"Year",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(Hl,{children:(0,m.jsx)(Tl.$,{displayStaticWrapperAs:"desktop",openTo:"year",views:["year"],value:o,onChange:e=>s(e)})}),(0,m.jsx)(y,{content:'<StaticDatePicker openTo="year" value={singleYear} />'})]})]})]}),(0,m.jsxs)(Rl,{children:[(0,m.jsx)(u,{stateName:"Range",size:"",prefix:"",dotted:!1}),(0,m.jsxs)(Wl,{children:[(0,m.jsxs)(Ol,{children:[(0,m.jsx)(u,{size:"Desktop",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(Hl,{children:(0,m.jsx)(Tl.$,{displayStaticWrapperAs:"desktop",openTo:"day",value:d,onChange:e=>c(e)})}),(0,m.jsx)(y,{content:'<StaticDatePicker displayStaticWrapperAs="desktop" value={rangeDesktop} />'})]}),(0,m.jsxs)(Ol,{children:[(0,m.jsx)(u,{size:"Mobile",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(Hl,{children:(0,m.jsx)(Tl.$,{displayStaticWrapperAs:"mobile",openTo:"day",value:x,onChange:e=>p(e)})}),(0,m.jsx)(y,{content:'<StaticDatePicker displayStaticWrapperAs="mobile" value={rangeMobile} />'})]})]})]})]}),(0,m.jsxs)(El,{children:[(0,m.jsxs)(Rl,{children:[(0,m.jsx)(Bn,{bigText:"DatePicker",inlineText:"<DatePicker>"}),(0,m.jsxs)(Wl,{children:[(0,m.jsxs)(Ol,{children:[(0,m.jsx)(u,{size:"Desktop",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(Hl,{children:(0,m.jsx)(Ll.l,{openTo:"day",value:h,onChange:e=>g(e)})}),(0,m.jsx)(y,{content:"<DatePicker value={datePickerDesktop} />"})]}),(0,m.jsxs)(Ol,{children:[(0,m.jsx)(u,{size:"Mobile",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(Hl,{children:(0,m.jsx)(Ll.l,{openTo:"day",value:b,onChange:e=>j(e)})}),(0,m.jsx)(y,{content:"<DatePicker value={datePickerMobile} />"})]})]})]}),(0,m.jsxs)(Rl,{children:[(0,m.jsx)(Bn,{bigText:"DateField",inlineText:"<DateField>"}),(0,m.jsxs)(Wl,{children:[(0,m.jsxs)(Ol,{children:[(0,m.jsx)(u,{size:"Clearable: False",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(Hl,{children:(0,m.jsx)(Ml.v,{value:A,onChange:e=>f(e),clearable:!1})}),(0,m.jsx)(y,{content:"<DateField value={dateFieldClearFalse} clearable={false} />"})]}),(0,m.jsxs)(Ol,{children:[(0,m.jsx)(u,{size:"Clearable: True",stateName:"",prefix:"",dotted:!1}),(0,m.jsx)(Hl,{children:(0,m.jsx)(Ml.v,{value:v,onChange:e=>w(e),clearable:!0})}),(0,m.jsx)(y,{content:"<DateField value={dateFieldClearTrue} clearable={true} />"})]})]})]})]})]})})},Fl=a.Ay.div(Cl||(Cl=(0,r.A)(["\n display: flex;\n flex-direction: column;\n"]))),El=a.Ay.div(kl||(kl=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n\n @media (min-width: 1024px) {\n flex-direction: row;\n gap: 150px;\n margin-bottom: 30px;\n }\n"]))),Rl=a.Ay.div(Sl||(Sl=(0,r.A)(["\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 16px;\n"]))),Wl=a.Ay.div(zl||(zl=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 24px;\n"]))),Ol=a.Ay.div(Il||(Il=(0,r.A)(["\n display: grid;\n grid-template-columns: 150px 1fr auto;\n align-items: center;
1\n"]))),Hl=a.Ay.div(Bl||(Bl=(0,r.A)(["\n width: 100%;\n\n @media (min-width: 1024px) {\n max-width: 380px; /* adjust this as needed */\n }\n"])));var Ql,Ul,Gl,Yl,Jl,Vl,Xl,ql,Zl,$l,Kl,eo,no,to,ro,io,ao,lo,oo;const so=()=>{const[e,n]=(0,i.useState)("Buttons"),[t,r]=(0,i.useState)(!1),a=["Buttons","Select","Inputs","Tabs","Checkbox + radio","Typography + colors","Skeleton","Alert","Card","Pagination + table","Breadcrumbs + navigation","Chart","Calendar"],[l,o]=(0,i.useState)(null),s=t=>{t!==e&&(o(e),n(t),o(null),r(!1))};return(0,m.jsxs)(ho,{children:[(0,m.jsxs)(mo,{children:[(0,m.jsxs)(uo,{children:[(0,m.jsx)(go,{children:(0,m.jsx)("img",{className:"logoImage",onClick:()=>n("Buttons"),src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADMAAAA/CAYAAABNY/BRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAHUSURBVHgB7dk9TgJBFMDx92bXQi0UhcJKSIixE72BnsB4gsVoL6UdJPZiR5CEK3AD9QaUJkoca0lYSvmY0UFQNAI7IvgG599BdkJ+zL7JBnDjuCqBYIvzyNdX2G4pHeJB1zAg2hyDKDp4tZ+uRYOuIYvphHog2hiVBog+RhUQZAZG9QFaHnSJORiVArmDQWZh3koMApmIUXVAUe8zyFSMKrETZ+f9b5iMAQnSOzirF3uvjcao+kEuaIYSHmEKCQlLzZZcDna19PZOaz7qPmg2nGaM59Y4TLjNw6onHCjqrDH+NuvPYqhmMVSzGKJxuzNUsxiqWQzVLIZqFkM1i6HaDGHQnxkMSlG3txnVZgqj/Yum25rbih89RWHCtVEkUPO71sYwhJL612fy6X+GnRmqWQzVLIZqFkO1mcEIxAftJ4Ch
1IXJoyxRD6cO0c13+exiUmcaCk+XZ0PQh3cbGIMgbAe7JXT5Uhj9uDAz6QorMfSGSBSL9CKN249lxPJ5b5UAoPczrgDMhkreFyDUQLPDRLAEuGgtsmypENXJnJGLZESJFGdFrCKY74JdhMgM+qm8xVAd8VF8w6LdRJiv5SAkM7P0A6Az4IotV8mEjISqX+nH7b3sBVkCTKODvDZsAAAAASUVORK5CYII=",alt:"Pausal logo"})}),(0,m.jsxs)(bo,{onClick:()=>r(!t),isOpen:t,children:[(0,m.jsx)(Co,{isVisible:!t,children:(0,m.jsx)(c.A,{fontSize:"inherit"})}),(0,m.jsx)(Co,{isVisible:t,children:(0,m.jsx)(x.A,{fontSize:"inherit"})})]})]}),(0,m.jsx)(jo,{children:a.map(n=>(0,m.jsx)(fo,{active:e===n,onClick:()=>s(n),children:n},n))}),(0,m.jsx)(Ao,{isOpen:t,children:a.map(n=>(0,m.jsx)(vo,{active:e===n,onClick:()=>s(n),children:n},n))})]}),(0,m.jsxs)(yo,{children:[l&&(0,m.jsx)(ko,{isExiting:!0,children:(0,m.jsx)(_o,{})},l),!l&&"Buttons"===e&&(0,m.jsxs)(ko,{children:[(0,m.jsx)(Bn,{bigText:"Buttons",inlineText:"<Button>"}),["large","medium","small"].map(e=>(0,m.jsxs)(So,{children:[(0,m.jsx)(D,{color:"primary",size:e}),(0,m.jsx)(D,{color:"error",size:e}),(0,m.jsx)(D,{color:"success",size:e})]},e)),(0,m.jsx)(So,{children:(0,m.jsx)(M,{size:"large"})})]}),!l&&"Inputs"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(it,{})}),!l&&"Tabs"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(vt,{})}),!l&&"Checkbox + radio"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(Et,{})}),!l&&"Typography + colors"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(ar,{})}),!l&&"Skeleton"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(Rr,{})}),!l&&"Alert"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(Mi,{})}),!l&&"Card"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(ja,{})}),!l&&"Pagination + table"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(Da,{})}),!l&&"Breadcrumbs + navigation"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(dl,{})}),!l&&"Chart"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(vl,{})}),!l&&"Calendar"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(Pl,{})}),!l&&"Select"===e&&(0,m.jsx)(ko,{children:(0,m.jsx)(Gn,{})}),!l&&a.filter(e=>!["Buttons","Inputs","Tabs","Checkbox + radio","Select","Typography + colors","Skeleton","Alert","Card","Pagination + table","Breadcrumbs + navigation","Chart","Calendar"].includes(e)).map(n=>e===n&&(0,m.jsxs)(ko,{children:[(0,m.jsx)(wo,{children:n}),(0,m.jsx)(_o,{})]},n))]})]})},co=(0,a.i7)(Ql||(Ql=(0,r.A)(["\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n"]))),xo=(0,a.i7)(Ul||(Ul=(0,r.A)(["\n from {\n opacity: 0;\n transform: translateY(30px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n"]))),po=(0,a.i7)(Gl||(Gl=(0,r.A)(["\n from {\n opacity: 1;\n transform: translateY(0);\n }\n to {\n opacity: 0;\n transform: translateY(-20px);\n }\n"]))),ho=a.Ay.div(Yl||(Yl=(0,r.A)(["\n background-color: var(--theme-bg);\n min-height: 100vh;\n font-family: 'Poppins';\n"]))),mo=a.Ay.header(Jl||(Jl=(0,r.A)(["\n background: white;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n position: sticky;\n top: 0;\n z-index: 1000;\n\n @media screen and (min-width: ","px) {\n display: flex;\n }\n"])),l.f.laptop),uo=a.Ay.div(Vl||(Vl=(0,r.A)(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 15px 30px;\n background-color: var(--theme-bg);\n\n @media (min-width: 1024px) {\n justify-content: center;\n padding: 15px 20px 15px 30px;\n }\n"]))),go=a.Ay.div(Xl||(Xl=(0,r.A)(["\n font-size: 24px;\n font-weight: bold;\n color: #2665ec;\n\n .logoImage {\n width: 40.8652px;\n height: 52.1338px;\n cursor: pointer;\n }\n"]))),bo=a.Ay.button(ql||(ql=(0,r.A)(["\n background: none;\n border: none;\n cursor: pointer;\n width: 42px;\n height: 35px;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n transition: all 0.3s ease;\n\n @media (min-width: 1024px) {\n display: none;\n }\n"]))),jo=a.Ay.nav(Zl||(Zl=(0,r.A)(["\n display: none;\n padding: 15px 30px;\n gap: 20px;\n flex-wrap: wrap;\n background-color: var(--theme-bg);\n align-items: center;\n\n @media (min-width: 1024px) {\n display: flex;\n width: 100%;\n justify-content: space-between;\n }\n"]))),Ao=a.Ay.nav($l||($l=(0,r.A)(["\n display: ",";\n flex-direction: column;\n background: var(--theme-bg);\n border-top: 1px solid #eee;\n animation: "," 0.3s ease-out;\n padding: 0;\n\n @media (min-width: 1024px) {\n display: none;\n }\n"])),e=>e.isOpen?"flex":"none",co),fo=a.Ay.div(Kl||(Kl=(0,r.A)(["\n cursor: pointer;\n font-weight: ",";\n color: var(--theme-text);\n position: relative;\n transition: all 0.3s ease;\n\n &:after {\n content: '';\n position: absolute;\n width: ",";\n height: 2px;\n background: #2665ec;\n bottom: -5px;\n left: 0;\n transition: width 0.3s ease;\n }\n\n &:hover:after {\n width: 100%;\n }\n"])),e=>e.active?"bold":"normal",e=>
1e.active?"100%":"0"),vo=a.Ay.div(eo||(eo=(0,r.A)(["\n cursor: pointer;\n font-weight: ",";\n color: ",";\n padding: 15px 30px;\n border-bottom: 1px solid #f0f0f0;\n transition: all 0.3s ease;\n position: relative;\n\n &:last-child {\n border-bottom: none;\n }\n\n &:hover {\n background-color: #f8f9fa;\n color: var(--primary-color);\n }\n\n ","\n"])),e=>e.active?"bold":"normal",e=>e.active?"var(--primary-color)":"var(--secondary-color)",e=>e.active&&"\n background-color: #f0f6ff;\n border-left: 3px solid var(--primary-color);\n "),yo=a.Ay.main(no||(no=(0,r.A)(["\n padding: 30px;\n display: flex;\n flex-direction: column;\n gap: 50px;\n"]))),wo=a.Ay.h2(to||(to=(0,r.A)(["\n margin-bottom: 20px;\n color: var(--primary-color);\n"]))),_o=a.Ay.div(ro||(ro=(0,r.A)(["\n display: flex;\n flex-wrap: wrap;\n gap: 20px;\n align-items: center;\n"]))),Co=a.Ay.div(io||(io=(0,r.A)(["\n position: absolute;\n font-size: 26px;\n color: #2665ec;\n transition: opacity 0.3s ease, transform 0.3s ease;\n opacity: ",";\n transform: ",";\n pointer-events: none; /* So clicks always hit the button */\n"])),e=>{let{isVisible:n}=e;return n?1:0},e=>{let{isVisible:n}=e;return n?"rotate(0deg) scale(1)":"rotate(90deg) scale(0.7)"}),ko=a.Ay.section(ao||(ao=(0,r.A)(["\n animation: "," 0.2s ease forwards;\n"])),e=>{let{isExiting:n}=e;return n?po:xo}),So=a.Ay.div(lo||(lo=(0,r.A)(["\n display: flex;\n flex-direction: column;\n gap: 30px;\n margin-bottom: 50px;\n\n @media (min-width: 1024px) {\n flex-direction: row;\n align-items: flex-start;\n justify-content: space-between;\n }\n"])));a.Ay.div(oo||(oo=(0,r.A)(["\n display: grid;\n grid-template-columns: 1fr;\n gap: 16px;\n\n @media screen and (min-width: ","px) {\n grid-template-columns: 1fr 1fr;\n }\n\n @media screen and (min-width: ","px) {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n"])),l.f.mobileL+180,l.f.laptop)},2866:(e,n,t)=>{t.r(n),t.d(n,{default:()=>U});var r,i,a,l,o=t(57528),s=t(9950),d=t(67079),c=t(21835),x=t(28429),p=t(6170),h=t(65486),m=t(81747),u=t(68436),g=t(70217),b=t(72571),j=t(21218),A=t(63565),f=t(61286),v=t(47064),y=t(23797),w=t(85708),_=t(21690),C=t(18160),k=t(35955),S=t(71527),z=t(20900),I=t(38337),B=t(26309),T=t(94963),L=t(74946),M=t(93360),D=t(91663),N=t(2598),P=t(4611),F=t(96355),E=t(44414),R=function(e){return e.sent="sent",e.preparation="preparation",e}(R||{});const W=d.Ay.div(r||(r=(0,o.A)(["\n padding: 25px;\n padding-bottom: 120px;\n display: inline-block;\n vertical-align: top;\n width: -webkit-fill-available;\n width: -moz-available;\n .button-add {\n margin-top: 20px;\n }
1\n .preview-modal {\n .modal-wrapper {\n width: 800px;\n padding: 15px;\n overflow: auto;\n max-height: 74vh;\n }\n }\n .manage-orders-modal {\n .modal-wrapper {\n max-height: 90%;\n overflow-y: auto;\n }\n }\n label {\n font-size: 14px;\n line-height: 34px;\n }\n .toggle-label {\n display: flex;\n justify-content: space-between;\n align-items: center;\n @media (max-width: ",") {\n align-items: flex-start;\n flex-direction: column;\n }\n }\n"])),A.i.tablet),O=d.Ay.div(i||(i=(0,o.A)(["\n display: flex;\n flex-direction: column;\n border: 1px solid var(--palette-styled-border);\n border-radius: 16px;\n padding: 24px 16px 24px 16px;\n"]))),H=d.Ay.div(a||(a=(0,o.A)(["\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 8px;\n justify-content: flex-end;\n\n @media screen and (max-width: ",") {\n flex-direction: column;\n align-items: stretch;\n\n & > * {\n width: 100%;\n min-width: 0;\n }\n }\n"])),A.i.mobileL),Q=d.Ay.div(l||(l=(0,o.A)(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n flex-wrap: wrap;\n gap: 8px;\n\n @media screen and (max-width: ",") {\n flex-direction: column;\n align-items: stretch;\n\n & > * {\n width: 100%;\n min-width: 0;\n }\n }\n"])),A.i.mobileL),U=()=>{(0,C.A)("memorandums");const[e,n]=(0,s.useState)(),t=(0,F.default)(e=>e.isNavbarCollapsed),r=(0,h.A)(e=>
1e.agency),[i,a]=(0,s.useState)(),[l,o]=(0,s.useState)(!1),[d,A]=(0,s.useState)(""),[U,G]=(0,s.useState)(""),[Y,J]=(0,s.useState)(!1),V=localStorage.getItem("access_token"),{currentLang:X}=(0,m.A)(),q=(0,u.A)(X),{state:Z}=(0,x.zy)(),{name:$,template:K}=Z,ee=(0,x.Zp)(),ne=r.logo?"".concat("https://prod.api.pausal.rs","/").concat(r.logo):null,[te,re]=(0,s.useState)(0),[ie,ae]=(0,s.useState)({recipient:"",subject:"",message:""}),[le,oe]=(0,s.useState)(!1),[se,de]=(0,s.useState)(!1),ce=(0,s.useRef)(null),xe=(0,s.useRef)(null),{handleClickOutside1:pe}=(0,f.A)(ce,oe),{handleClickOutside2:he}=(0,f.A)(xe,de),{userBOid:me}=(0,_.A)(),ue="admin"===localStorage.getItem("role")?"admin":"user",{refetch:ge}=(0,w.h)(ue,me),[be,je]=(0,s.useState)(!1),Ae=(0,v.A)(d,3,!0),fe=r.bankAccounts.data.length>0?r.bankAccounts.data.filter(e=>"domestic"===e.type).sort((e,n)=>1===n.default?1:-1).map(e=>({value:e})):[],ve=e=>e.replace(/class="ql-align-center"/g,'style="text-align: center"').replace(/class="ql-align-left"/g,'style="text-align: left"').replace(/class="ql-align-right"/g,'style="text-align: right"').replace(/class="ql-align-justify"/g,'style="text-align: justify"').replace(/<hr class="ql-hr"\s*\/?>/g,'<hr style="border: none; border-top: 1px solid #000; margin: 10px 0; height: 1px;" />').replace(/<hr[^>]*>/gi,'<p style="text-align: center; margin: 10px 0;">\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014</p>').replace(/<div style="width: 100%; height: 1px; background-color: #000; margin: 10px 0; border: none;"><\/div>/g,'<div style="width: 100%; height: 1px; background-color: #000; margin: 10px 0; border: none; display: block;"></div>').replace(/<div class="divider"[^>]*><\/div>/g,'<div style="width: 100%; height: 1px; background-color: #000; margin: 10px 0; border: none; display: block;"></div>').replace(/<div style=\{\{([^}]+)\}\}>([^<]+)<\/div>/g,'<span style="$1">$2</span>').replace(/<div style='\{([^}]+)\}'>([^<]+)<\/div>/g,'<span style="$1">$2</span>').replace(/fontSize: '([^']+)'/g,"font-size: $1").replace(/color: rgb\(([^)]+)\)/g,"color: rgb($1)").replace(/class='ql-align-center'\s*style="([^"]*)"/g,'style="text-align: center; $1"').replace(/class='ql-align-left'\s*style="([^"]*)"/g,'style="text-align: left; $1"').replace(/class='ql-align-right'\s*style="([^"]*)"/g,'style="text-align: right; $1"').replace(/class='ql-align-justify'\s*style="([^"]*)"/g,'style="text-align: justify; $1"'),ye=(e,n)=>{var t,i,l,o;const s=(()=>{var e,n,t,i,a,l,o;return'<p style="text-align: center">'.concat(ne?'<img src="'.concat(ne,"?renderKey=").concat(te,'" />'):"",'</p>\n <h1 style="text-align: center; font-size: 22pt">').concat(null!==(e=null===r||void 0===r?void 0:r.full_name)&&void 0!==e?e:"",'</h1>\n <p style="text-align: center; font-size: 12pt">\n ').concat(null!==(n=null===r||void 0===r?void 0:r.street_address)&&void 0!==n?n:""," ").concat(null!==r&&void 0!==r&&r.street_number?r.street_number+",":""," ").concat(null!==(t=null===r||void 0===r?void 0:r.city)&&void 0!==t?t:""," PIB: ").concat(null!==(i=null===r||void 0===r?void 0:r.pib)&&void 0!==i?i:""," MB: ").concat(null!==(a=null===r||void 0===r?void 0:r.identification_number)&&void 0!==a?a:"",'\n </p>\n <p style="text-align: center; font-size: 12pt">').concat(null!==(l=null===r||void 0===r?void 0:r.agency_email)&&void 0!==l?l:"",'</p>\n <p style="text-align: center; font-size: 12pt">Telefon: ').concat(null!==(o=null===r||void 0===r?void 0:r.phone)&&void 0!==o?o:"",'</p>\n <hr style="height:2px;border-width:0;color:gray;background-color:gray">\n ')})();if("1"===n)return void a(ve(s));const d={2:"".concat(s,"<br><h1 style='text-align: center; font-size: 18pt;'>Zahtev</h1><br><br><p style='text-align: center'>Za preduzetni\u010dku agenciju ").concat(null===e||void 0===e?void 0:e.full_name," \u017eelim da otkupim devize u iznosu od: IZNOS VALUTA</p><p style='text-align: center'>Uplatu izvr\u0161iti na ra\u010dun br.: ").concat(fe[0].value.account_number,"</p><br><br><br><br><br><br><br><p>S po\u0161tovanjem,<br>________________<p><br>M.P."),3:"".concat(s,"<br><h1 style='text-align: center; font-size: 18pt;'>Ponuda</h1><br><p><div style='color: rgb(0, 0, 0); font-size: 12pt;'>Komitent</div><br><em style='color: rgb(153, 153, 153); font-size: 12pt;'>Naziv</em><br><br><em style='color: rgb(153, 153, 153); font-size: 12pt;'>Adresa</em><br><br><em style='color: rgb(153, 153, 153); font-size: 12pt;'>Grad</em><br><br><em style='color: rgb(153, 153, 153); font-size: 12pt;'>PIB </em></p><br><br><p><div style='color: rgb(0, 0, 0); font-size: 12pt; display: inline'>Ponuda za obavljanje</div><em style='color: rgb(102, 102, 102); font-size: 12pt;'> [opis posla]</em><div style='color: rgb(0, 0, 0); font-size: 12pt; display: inline'> iznosi </div><em style='color: rgb(102, 102, 102); font-size: 12pt; display: inline'>[iznos i valuta] </em><div style='color: rgb(0, 0, 0); font-size: 12pt; display: inline'>po [satu, danu\u2026].</div></p><br><br><p><div style='color: rgb(0, 0, 0); font-size: 12pt;'>Ukoliko ste saglasni sa ponudom, na ime dogovorenog posla, uplatiti </div><em style='color: rgb(102, 102, 102); font-size: 12pt;'>[ukupan iznos i valuta]</em><div style='color: rgb(0, 0, 0); font-size: 12pt;'> na \u017eiro ra\u010dun: ").concat(fe[0].value.account_number,".</div><br><div style='color: rgb(0, 0, 0); font-size: 12pt;'>Prihvatanje ponude se realizuje uplatom po ovom dokumentu.</div><br><div style='color: rgb(0, 0, 0); font-size: 12pt;'>
1Dokument se ne mo\u017ee koristiti za knji\u017eenje u poslovnim knjigama.</div></p>"),4:"".concat(s,"<br><h1 style='text-align: center; font-size: 18pt;'>Izjava o ka\u0161njenju</h1><br><br><p style='text-align: center'>Izjavljujemo da kasnimo sa podno\u0161enjem dokumentacije za vlasnika preduzetni\u010dke radnje ").concat(null===e||void 0===e?void 0:e.full_name,", JMBG: ").concat(null===e||void 0===e?void 0:e.user.data.jmbg,", radi du\u017eeg boravka u inostranstvu vlasnika kao jedinog potpisnika dokumentacije.</p><br><br><br><br><br><br><br><p>S po\u0161tovanjem,<br>________________<p><br>M.P."),5:"".concat(s,"<br><h1 style='text-align: center; font-size: 18pt;'>Odluka o slu\u017ebenom putovanju</h1><br><br><p style='text-align: center'>Upu\u0107uje se ____________________ na slu\u017ebeni put u:</p><p style='text-align: center'>Br. li\u010dne karte:</p><p style='text-align: center'>Br. paso\u0161a:</p><p style='text-align: center'>Dan polaska:</p><p style='text-align: center'>Dan povratka:</p><p style='text-align: center'>____________________ putuje automobilom.</p><p style='text-align: center'>Putni tro\u0161kovi padaju na teret ").concat(null===e||void 0===e?void 0:e.full_name,"</p><br><br><br><br><br><br><br><p>S po\u0161tovanjem,<br>________________<p><br>M.P."),6:"".concat(s,"<br><br><p style='text-align: center'>Na osnovu \u010dlana 9. Zakona o ra\u010dunovodstvu dana ______ godine preduzetnik ").concat(null===e||void 0===e?void 0:e.full_name," donosi slede\u0107u</p><br><br><p style='text-align: center'>ODLUKU</p><br><p style='text-align: center'>O odre\u0111ivanju lica ovla\u0161\u0107enog za potpisivanje</p><br><br><p style='text-align: center'>Ovom Odlukom odre\u0111uje se lice ovla\u0161\u0107eno za sastavljanje, kontrolu verodostojnosti i za potpisivanje ra\u010dunovodstvenih isprava i to: ").concat(null===e||void 0===e?void 0:e.user.data.first_name," ").concat(null===e||void 0===e?void 0:e.user.data.last_name," vlasnik preduzetni\u010dke radnje ").concat(null===e||void 0===e?void 0:e.full_name,", ima neograni\u010dena ovla\u0161\u0107enja i potpisuje samostalno ra\u010dunovodstvene isprave.</p><p style='text-align: center'>Identifikaciona oznaka ovla\u0161\u0107enog lica je: ").concat(null===e||void 0===e?void 0:e.signature,"</p><br><br><br><br><br><br><br><p>Preduzetnik<br>________________ M.P.<p>"),7:"".concat(s,"<br><br><p style='text-align: center'>POTVRDA O ZAPOSLENJU I VISINI PRIMANJA</p><br><br><br><p style='text-align: justify'>Popunjava poslodavac:<br><br>Potvr\u0111ujem da je ").concat(null===e||void 0===e?void 0:e.user.data.first_name," ").concat(null===e||void 0===e?void 0:e.user.data.last_name,", JMBG: ").concat(null!==e&&void 0!==e&&e.user.data.jmbg?null===e||void 0===e?void 0:e.user.data.jmbg:"_______________________",", iz ________________________________ (adresa prebivali\u0161ta), sa li\u010dnom kartom broj ________________ izdatom od MUP ________________ po zanimanju ________________ zaposlen kod ").concat(null===e||void 0===e?void 0:e.full_name,", na neodre\u0111eno vreme po\u010dev od ________________ godine, na radnom mestu u preduzetni\u010dkoj agenciji. U momentu izdavanja ove potvrde ").concat(null===e||void 0===e?void 0:e.user.data.first_name," ").concat(null===e||void 0===e?void 0:e.user.data.last_name," je ostvario ukupan radni sta\u017e u trajanju od (gg.mm.dd) ________________.</p><p style='text-align: left'>Prose\u010dna zarada zaposlenog u prethodna 3 meseca iznosi ________________ (unesi osnovicu sa poreskog re\u0161enja) dinara bruto.</p><br><br><br><p style='text-align: center'>PODACI O PREDUZE\u0106U</p><br><br><p class='large'>Isplatilac: ").concat(null===e||void 0===e?void 0:e.full_name,"</p><p class='ql-border'>Sedi\u0161te isplatioca: ").concat(null===e||void 0===e?void 0:e.street_address," ").concat(null===e||void 0===e?void 0:e.street_number," ").concat(null===e||void 0===e?void 0:e.city,"</p><p class='ql-border'>PIB: ").concat(null===e||void 0===e?void 0:e.pib,"</p><p class='ql-border'>Mati\u010dni broj: ").concat(null===e||void 0===e?void 0:e.identification_number,"</p><p class='ql-border'>\u0160ifra delatnosti isplatioca: ").concat(null===e||void 0===e||null===(t=e.activityCode)||void 0===t||null===(i=t.data)||void 0===i?void 0:i.code," ").concat(null===e||void 0===e||null===(l=e.activityCode)||void 0===l||null===(o=l.data)||void 0===o?void 0:o.name,"</p><br><br><br><br><br><p><br>________________ <p><p><br>Potpis<br><p>"),8:"".concat(s,"<br><br><p style='text-align: center'>UGOVOR O POZAJMICI</p><br><br><br><p style='text-align: justify'>UGOVORNE STRANE:<br><p style='text-align: left'>1. ").concat(null===e||void 0===e?void 0:e.full_name,", ").concat(null===e||void 0===e?void 0:e.street_address," ").concat(null===e||void 0===e?void 0:e.street_number," ").concat(null===e||void 0===e?void 0:e.city,", PIB: ").concat(null===e||void 0===e?void 0:e.pib,", MB: ").concat(null===e||void 0===e?void 0:e.identification_number,"</p><p style='text-align: left'>2. ").concat(null===e||void 0===e?void 0:e.user.data.first_name," ").concat(null===e||void 0===e?void 0:e.user.data.last_name,", ").concat(null!==e&&void 0!==e&&e.user.data.address?(null===e||void 0===e?void 0:e.user.data.address)+" "+(null===e||void 0===e?void 0:e.user.data.city):"________________________________ (adresa)",", JMBG: ").concat(null!==e&&void 0!==e&&e.user.data.jmbg?null===e||void 0===e?void 0:e.user.data.jmbg:"_______________________","</p></p><br><br><br><p style='text-align: center'>\u010cLAN 1</p><br><p style='text-align: center'>Predmet ovog Ugovora je pozajmica koju ").concat(null===e||void 0===e?void 0:e.user.data.first_name," ").concat(null===e||void 0===e?void 0:e.user.data.last_name," iz ").
1concat(null!==e&&void 0!==e&&e.user.data.city?null===e||void 0===e?void 0:e.user.data.city:"_______________________ (mesto)"," dana _______________(datum) u skladu sa zakonskim odredbama daje: ").concat(null===e||void 0===e?void 0:e.full_name,".</p></p><br><br><p style='text-align: center'>\u010cLAN 2</p><br><p style='text-align: center'>").concat(null===e||void 0===e?void 0:e.user.data.first_name," ").concat(null===e||void 0===e?void 0:e.user.data.last_name," \u0107e svoju obavezu iz \u010dlana 1 ovog Ugovora ispuniti tako \u0161to \u0107e ").concat(null===e||void 0===e?void 0:e.full_name," uplatiti svoja raspolo\u017eiva sredstva u iznosu od<br>______________ dinara.</p></p><br><br><p style='text-align: center'>\u010cLAN 3</p><br><p style='text-align: center'>").concat(null===e||void 0===e?void 0:e.full_name," se obavezuje da kada se za to budu stekli uslovi ").concat(null===e||void 0===e?void 0:e.user.data.first_name," ").concat(null===e||void 0===e?void 0:e.user.data.last_name," vrati Pozajmicu u iznosu navedenom u \u010dlanu 2 ovog Ugovora.</p></p><br><br><p style='text-align: center'>\u010cLAN 4</p><br><p style='text-align: center'>Ugovor je sa\u010dinjen u 2 (dva) istovetna primerka od kojih po 1 (jedan) za svaku ugovornu stranu.</p><br><br><br><br><br><p style='text-align: center'>UGOVORNE STRANE:</p><br><br><div style='text-align: center'>_______________________ _______________________<br>").concat(null===e||void 0===e?void 0:e.user.data.first_name," ").concat(null===e||void 0===e?void 0:e.user.data.last_name," ").concat(null===e||void 0===e?void 0:e.full_name,"</div>")};return a(ve(d[n]||d[2]))},we=async()=>{if(!Ae)try{if(J(!0),be){const e={template:i,status:R.preparation,heading:d,description:U,memorandum_type:$,preferred:!0};c.default.createMemorandum(e)}const e={template:i,status:R.preparation,heading:d,description:U,memorandum_type:$,preferred:!1},t=await c.default.createMemorandum(e);return n(t.data.data),J(!1),ge(),t.data.data}catch(e){throw console.error("Error in handleSave:",e),e}};return(0,s.useEffect)(()=>{A($),K&&(async()=>{J(!0);try{const e=await c.default.getAgency();ye(e.data.data,K)}catch(e){console.error("Error fetching agency data:",e)}finally{J(!1)}})()},[$,K]),(0,s.useEffect)(()=>{n({template:i,status:R.preparation,heading:d,description:U,memorandum_type:$,preferred:be})},[be,i,d,U]),(0,E.jsxs)(E.Fragment,{children:[(0,E.jsxs)(W,{children:[Y&&(0,E.jsx)(p.A,{}),(0,E.jsx)(g.A,{active:l,close:()=>o(!1),children:(0,E.jsx)(b.A,{close:()=>o(!1),setFormData:ae,formData:ie,t:q,id:null===e||void 0===e?void 0:e.id,success:()=>{J(!1),y.oR.success(q("pages.memos.sendMemoSuccess").text),(async()=>{J(!0);try{const e=await c.default.getAllMemorandums("1","10","any","");return j.A.setState({memoData:e.data}),Promise.resolve()}catch(e){return console.error("Error fetching memorandums:",e),Promise.reject(e)}finally{J(!1)}})().then(()=>{ee("/memorandums/sent")}).catch(e=>{console.error("Error in success:",e)})},memorandum:e,loading:()=>J(!0),handleSaveMemorandum:we,modalVisible:l,memoId:null===e||void 0===e?void 0:e.id})}),(0,E.jsx)(S.z,{navigate:"/memorandums/all",breadcrumb:"".concat(q("navbar.pausal.myBusiness").text," / ").concat(q("navbar.pausal.memorandums").text),pageTitle:q("navbar.pausal.memorandums").text}),(0,E.jsx)(z.A,{variant:"body2",sx:{marginBottom:"40px"},children:q("pages.memos.memosDescription").text}),(0,E.jsxs)(O,{children:[(0,E.jsx)(I.A,{type:"text",label:q("pages.memos.name").text,value:d,onChange:e=>{A(e.target.value)},error:""!==Ae,helperText:Ae,sx:{width:"100%",maxWidth:"549px",marginBottom:"16px",borderRadius:"16px","& .MuiOutlinedInput-root":{borderRadius:"16px",overflow:"hidden",backgroundColor:"var(--theme-bg)","& fieldset":{borderColor:"var(--palette-styled-border)"},"&:hover fieldset":{borderColor:"var(--palette-styled-border)"},"&.Mui-focused fieldset":{borderColor:"var(--palette-styled-border)"},"& .MuiOutlinedInput-input":{backgroundColor:"transparent"}}},size:"small"}),(0,E.jsx)(I.A,{type:"text",label:q("pages.memos.description").text,value:U,onChange:e=>{G(e.target.value)}
1,sx:{width:"100%",maxWidth:"549px",marginBottom:"16px",borderRadius:"16px","& .MuiOutlinedInput-root":{borderRadius:"16px",overflow:"hidden",backgroundColor:"var(--theme-bg)","& fieldset":{borderColor:"var(--palette-styled-border)"},"&:hover fieldset":{borderColor:"var(--palette-styled-border)"},"&.Mui-focused fieldset":{borderColor:"var(--palette-styled-border)"},"& .MuiOutlinedInput-input":{backgroundColor:"transparent"}}},size:"small"}),(0,E.jsx)(k.A,{value:i,onChange:e=>{(e=>{re(te+1),a(e)})(e)}})]})]}),(0,E.jsx)(P.A,{isVisible:!0,isNavbarCollapsed:t,children:(0,E.jsx)(Q,{children:(0,E.jsxs)(H,{children:[(0,E.jsx)(N.A,{checked:be,onClick:e=>e.stopPropagation(),onChange:e=>{je(e.target.checked)},label:q("pages.memos.templateCreation").text}),(0,E.jsx)(T.e,{onClick:()=>{(async()=>{Ae||await we().then(()=>{ee("/memorandums/preparation")})})()},startIcon:(0,E.jsx)(B.A,{}),sx:{backgroundColor:"var(--gray-card-bg)",border:"1px solid var(--palette-styled-border)",fontWeight:400,minWidth:"134px",height:"42px","& .MuiSvgIcon-root":{color:"var(--text-primary)"},color:"var(--text-primary)","&:hover":{backgroundColor:"var(--gray-card-bg)",opacity:.9},borderRadius:"32px",padding:"8px"},children:q("pages.editInvoice.save").text}),(0,E.jsx)(T.e,{onClick:()=>(async()=>{Ae||await we().then(async e=>{const n=e;n?c.default.downloadMemosWord(n,V).then(()=>{ee("/memorandums/sent")}):console.error("Failed to retrieve memorandum ID")}).catch(e=>{console.error("Error during API calls:",e)})})(),startIcon:(0,E.jsx)(M.A,{}),sx:{backgroundColor:"var(--gray-card-bg)",border:"1px solid var(--palette-styled-border)",fontWeight:400,minWidth:"150px",height:"42px","& .MuiSvgIcon-root":{color:"var(--text-primary)"},color:"var(--text-primary)","&:hover":{backgroundColor:"var(--gray-card-bg)",opacity:.9},borderRadius:"32px",padding:"8px"},children:q("pages.invoiceCard.dropdownItems.downloadWord").text}),(0,E.jsx)(T.e,{onClick:()=>(async()=>{Ae||await we().then(async e=>{const n=e;n?c.default.downloadMemorandum(n,V).then(()=>{ee("/memorandums/sent")}).catch(e=>{console.error("Error during API calls:",e)}):console.error("Failed to retrieve memorandum ID")}).catch(e=>{console.error("Error during API calls:",e)})})(),startIcon:(0,E.jsx)(M.A,{}),sx:{backgroundColor:"var(--gray-card-bg)",border:"1px solid var(--palette-styled-border)",fontWeight:400,minWidth:"150px",height:"42px","& .MuiSvgIcon-root":{color:"var(--text-primary)"},color:"var(--text-primary)","&:hover":{backgroundColor:"var(--gray-card-bg)",opacity:.9},borderRadius:"32px",padding:"8px"},children:q("pages.invoiceCard.dropdownItems.downloadPDF").text}),(0,E.jsx)(T.e,{onClick:()=>{Ae||o(!0)},startIcon:(0,E.jsx)(D.A,{}),sx:{backgroundColor:"var(--gray-card-bg)",border:"1px solid var(--palette-styled-border)",fontWeight:400,minWidth:"134px",height:"42px","& .MuiSvgIcon-root":{color:"var(--text-primary)"},color:"var(--text-primary)","&:hover":{backgroundColor:"var(--gray-card-bg)",opacity:.9},borderRadius:"32px",padding:"8px"},children:q("pages.editInvoice.send").text}),(0,E.jsx)(T.e,{onClick:()=>{(async()=>{Ae||(J(!0),await we().then(async e=>{const n=null===e||void 0===e?void 0:e.id;n?c.default.createMemoReady(n,V).then(()=>{J(!1),ee("/memorandums/sent")}):(J(!1),console.error("Failed to retrieve memorandum ID"))}).catch(e=>{J(!1),console.error("Error during API calls:",e)}))})()},startIcon:(0,E.jsx)(L.A,{}),sx:{backgroundColor:"var(--gray-card-bg)",border:"1px solid var(--palette-styled-border)",fontWeight:400,minWidth:"134px",height:"42px","& .MuiSvgIcon-root":{color:"var(--text-primary)"},color:"var(--text-primary)","&:hover":{backgroundColor:"var(--gray-card-bg)",opacity:.9},borderRadius:"32px",padding:"8px"},children:q("pages.memos.ready").text})]})})})]})}},4611:(e,n,t)=>{t.d(n,{A:()=>A,d:()=>j});var r,i,a,l=t(57528),o=t(9950),s=t(20900),d=t(67079),c=t(84453),x=t(9013),p=t(63565),h=t(34722),m=t(68436),u=t(81747),g=t(73355),b=t(44414);const j="data-invoice-footer-marker",A=e=>{let{isVisible:n,isNavbarCollapsed:t,children:r,textContent:i,isProforma:a=!1,errors:l,requireInvoiceFooterInView:d=!1}=e;const{width:A}=(0,h.A)(),{currentLang:w}=(0,u.A)(),_=(0,m.A)(w),C=A<p.f.laptop,[k,S]=(0,o.useState)(!C),[z,I]=(0,o.useState)(!1),[B,T]=(0,o.useState)(!d||!g.P.isCapacitorAndroidApp);(0,o.useEffect)(()=>
1{if(!g.P.isCapacitorAndroidApp)return;const e=e=>{var n,t;I(null!==(n=null===(t=e.detail)||void 0===t?void 0:t.hidden)&&void 0!==n&&n)};return window.addEventListener("capacitor-sticky-footer",e),()=>window.removeEventListener("capacitor-sticky-footer",e)},[]),(0,o.useEffect)(()=>{if(!d||!g.P.isCapacitorAndroidApp||!C)return void T(!0);const e="[".concat(j,"]");let n=null,t=null;const r=()=>{var r;const i=document.querySelector(e);var a;if(!i)return t=null,null===(a=n)||void 0===a||a.disconnect(),n=null,void T(!1);i!==t&&(null===(r=n)||void 0===r||r.disconnect(),t=i,n=new IntersectionObserver(e=>{e.forEach(e=>{T(e.isIntersecting&&e.intersectionRatio>=1)})},{threshold:1}),n.observe(i))};r();const i=new MutationObserver(()=>{r()});return i.observe(document.body,{childList:!0,subtree:!0}),()=>{var e;null===(e=n)||void 0===e||e.disconnect(),i.disconnect()}},[C,d]);const L=n&&!z&&B;return(0,o.useEffect)(()=>{S(!C)},[C]),(0,o.useEffect)(()=>{l&&Object.keys(l).length>0&&S(!1)},[l]),C?(0,b.jsxs)(f,{$isVisible:L,$isNavbarCollapsed:t,$isProforma:a,children:[(0,b.jsx)(v,{$expanded:k,onClick:()=>{S(e=>!e)},children:k?(0,b.jsx)(c.A,{fontSize:"small",sx:{color:"var(--theme-text)"}}):(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(s.A,{variant:"body2",fontWeight:500,sx:{color:"var(--palette-white)"},children:i||_("pages.reports.continueAction").text}),(0,b.jsx)(x.A,{fontSize:"small",sx:{color:"var(--palette-white)"}})]})}),k&&(0,b.jsx)(y,{children:r})]}):(0,b.jsxs)(f,{$isVisible:L,$isNavbarCollapsed:t,$isProforma:a,children:[i&&(0,b.jsx)(s.A,{variant:"body1",fontWeight:500,sx:{color:"var(--theme-text)"},children:i}),r]})},f=d.Ay.div(r||(r=(0,l.A)(["\n position: fixed;\n bottom: 0;\n left: ",";\n right: 0;\n background-color: var(--card-bg);\n border-top: 1px solid var(--palette-styled-border);\n padding: 10.5px 28px;\n z-index: 1000;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n gap: ",";\n box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);\n transform: translateY(",");\n opacity: ",";\n transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out, left 0.2s ease;\n pointer-events: ",";\n\n @media screen and (max-width: ","px) {\n left: 0;\n flex-direction: column;\n align-items: stretch;\n justify-content: flex-end;\n gap: 0;\n padding: 0;\n }\n"])),e=>e.$isNavbarCollapsed?"47px":"260px",e=>e.$isProforma?"10px":"12px",e=>e.$isVisible?"0":"100%",e=>e.$isVisible?1:0,e=>e.$isVisible?"auto":"none",p.f.laptop-1),v=d.Ay.div(i||(i=(0,l.A)(["\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n cursor: pointer;\n width: 100%;\n height: ",";\n background-color: ",";\n"])),e=>e.$expanded?"32px":"60px",e=>e.$expanded?"var(--card-bg)":"var(--text-hover)"),y=d.Ay.div(a||(a=(0,l.A)(["\n width: 100%;\n box-sizing: border-box;\n padding: 12px 16px 16px 16px;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 12px;\n align-items: center;\n justify-content: flex-end;\n\n @media screen and (max-width: ","px) {\n flex-direction: column;\n align-items: stretch;\n gap: 10px;\n\n & > * {\n width: 100%;\n min-width: 0;\n }\n }\n"])),p.f.laptop-1)},21056:(e,n,t)=>{t.r(n),t.d(n,{default:()=>Q});var r,i,a,l,o=t(57528),s=t(89379),d=t(9950),c=t(67079),x=t(21835),p=t(28429),h=t(6170),m=t(68436),u=t(81747),g=t(72571),b=t(70217),j=t(21218),A=t(63565),f=t(61286),v=t(47064),y=t(65486),w=t(23797),_=t(85708),C=t(21690),k=t(18160),S=t(35955),z=t(71527),I=t(38337),B=t(2598),T=t(74946),L=t(93360),M=t(91663),D=t(94963),N=t(26309),P=t(4611),F=t(96355),E=t(44414);const R=c.Ay.div(r||(r=(0,o.A)(["\n padding: 25px;\n padding-bottom: 120px;\n display: inline-block;\n vertical-align: top;\n width: -webkit-fill-available;\n width: -moz-available;\n .button-add {\n margin-top: 20px;\n }
1\n .preview-modal {\n .modal-wrapper {\n width: 800px;\n padding: 15px;\n overflow: auto;\n max-height: 74vh;\n }\n }\n .manage-orders-modal {\n .modal-wrapper {\n max-height: 90%;\n overflow-y: auto;\n }\n }\n label {\n font-size: 14px;\n line-height: 34px;\n }\n .toggle-label {\n display: flex;\n justify-content: space-between;\n align-items: center;\n @media (max-width: ",") {\n align-items: flex-start;\n flex-direction: column;\n }\n }\n"])),A.i.tablet),W=c.Ay.div(i||(i=(0,o.A)(["\n display: flex;\n flex-direction: column;\n border: 1px solid var(--palette-styled-border);\n border-radius: 16px;\n padding: 24px 16px 24px 16px;\n"]))),O=c.Ay.div(a||(a=(0,o.A)(["\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 8px;\n justify-content: flex-end;\n\n @media screen and (max-width: ",") {\n flex-direction: column;\n align-items: stretch;\n\n & > * {\n width: 100%;\n min-width: 0;\n }\n }\n"])),A.i.mobileL),H=c.Ay.div(l||(l=(0,o.A)(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n flex-wrap: wrap;\n gap: 8px;\n\n @media screen and (max-width: ",") {\n flex-direction: column;\n align-items: stretch;\n\n & > * {\n width: 100%;\n min-width: 0;\n }\n }\n"])),A.i.mobileL),Q=()=>{(0,k.A)("memorandums");const[e,n]=(0,d.useState)(),t=(0,F.default)(e=>e.isNavbarCollapsed),[r,i]=(0,d.useState)(),[a,l]=(0,d.useState)(!1),{agency:o}=(0,y.A)(),[c,A]=(0,d.useState)(""),[Q,U]=(0,d.useState)(""),[G,Y]=(0,d.useState)(!1),J=(0,v.A)(c,3,!0),{pathname:V}=(0,p.zy)(),X=V.includes("pattern"),[q,Z]=(0,d.useState)(!1),$=localStorage.getItem("access_token"),[K,ee]=(0,d.useState)({recipient:"",subject:"",message:""}),[ne,te]=(0,d.useState)(!1),[re,ie]=(0,d.useState)(!1),ae=(0,d.useRef)(null),le=(0,d.useRef)(null),{handleClickOutside1:oe}=(0,f.A)(ae,te),{handleClickOutside2:se}=(0,f.A)(le,ie),de=o.logo?"".concat("https://prod.api.pausal.rs","/").concat(o.logo):null,[ce]=(0,d.useState)({page:"1",limit:"10",status:"all",find:""}),{currentLang:xe}=(0,u.A)(),pe=(0,m.A)(xe),{userBOid:he}=(0,C.A)(),me="admin"===localStorage.getItem("role")?"admin":"user",{refetch:ue}=(0,_.h)(me,he),ge=(0,p.Zp)(),be=(0,p.g)(),{id:je}=be,Ae=e=>{const n=de?'<p style="text-align:center;"><img src="'.concat(de,'" /></p>'):"";let t=e.replace(/<(div|p)[^>]*class=["']ql-align-center["'][^>]*>\s*<img[^>]*src=["'][^"']*["'][^>]*>\s*<\/(div|p)>/gi,"");return t=t.replace(/class=["']ql-align-center["']/g,'style="text-align: center"').replace(/class=["']ql-align-left["']/g,'style="text-align: left"').replace(/class=["']ql-align-right["']/g,'style="text-align: right"').replace(/class=["']ql-align-justify["']/g,'style="text-align: justify"'),t=t.replace(/<hr[^>]*>/gi,'<p style="text-align: center; margin: 10px 0;">\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014</p>'),t=t.replace(/font-size: '([^']+)'/g,"font-size: $1").replace(/color: rgb\(([^)]+)\)/g,"color: rgb($1)"),de&&(t="".concat(n,"\n").concat(t)),t};(0,d.useEffect)(()=>{(async()=>{Z(!0);try{const{data:e}=await x.default.getSpecificMemorandum(je),t=Ae(e.data.template);n((0,s.A)((0,s.A)({},e.data),{},{template:t})),i(t),A(e.data.heading),U(e.data.description)}catch(e){console.error("Error fetching memorandum:",e)}finally{Z(!1)}})()},[]),(0,d.useEffect)(()=>{n((0,s.A)((0,s.A)({},e),{},{template:r,heading:c,description:Q,preferred:G}))},[G,r,c,Q]);const fe=async()=>{if(J)return Promise.reject();{if(Z(!0),G){const e={template:r,heading:c,description:Q,preferred:!0}
1;x.default.createMemorandum(e)}const n={id:null===e||void 0===e?void 0:e.id,template:r,heading:c,description:Q,preferred:!1},t=await x.default.updateMemorandum(n);return ue(),t.data.data}},ve=async()=>{J||(Z(!0),fe().then(()=>{ge(-1),Z(!1)}))};return(0,E.jsxs)(E.Fragment,{children:[(0,E.jsxs)(R,{children:[q&&(0,E.jsx)(h.A,{}),(0,E.jsx)(b.A,{active:a,close:()=>l(!1),children:(0,E.jsx)(g.A,{close:()=>l(!1),setFormData:ee,formData:K,t:pe,success:()=>{w.oR.success(pe("pages.memos.sendMemoSuccess").text),(async()=>{Z(!0);try{const e=await x.default.getAllMemorandums("1","10","any","");return j.A.setState({memoData:e.data}),Promise.resolve()}catch(e){return console.error("Error fetching memorandums:",e),Promise.reject(e)}finally{Z(!1)}})().then(()=>{ge("/memorandums/sent")}).catch(e=>{console.error("Error in success:",e)})},memorandum:e,handleUpdateMemorandum:fe,loading:()=>Z(!0),memoId:null===e||void 0===e?void 0:e.id,modalVisible:a})}),(0,E.jsx)(z.z,{navigate:"/memorandums/all",breadcrumb:"".concat(pe("navbar.pausal.myBusiness").text," / ").concat(pe("navbar.pausal.memorandums").text),pageTitle:pe("pages.memos.titleSingle").text}),(0,E.jsxs)(W,{children:[(0,E.jsx)(I.A,{type:"text",label:pe("pages.memos.name").text,value:c,onChange:e=>{A(e.target.value)},error:""!==J,helperText:J,sx:{width:"100%",maxWidth:"549px",marginBottom:"16px",borderRadius:"16px","& .MuiOutlinedInput-root":{borderRadius:"16px",overflow:"hidden",backgroundColor:"var(--theme-bg)","& fieldset":{borderColor:"var(--palette-styled-border)"},"&:hover fieldset":{borderColor:"var(--palette-styled-border)"},"&.Mui-focused fieldset":{borderColor:"var(--palette-styled-border)"},"& .MuiOutlinedInput-input":{backgroundColor:"transparent"}}},size:"small"}),(0,E.jsx)(I.A,{type:"text",label:pe("pages.memos.description").text,value:Q,onChange:e=>{U(e.target.value)},sx:{width:"100%",maxWidth:"549px",marginBottom:"16px",borderRadius:"16px","& .MuiOutlinedInput-root":{borderRadius:"16px",overflow:"hidden",backgroundColor:"var(--theme-bg)","& fieldset":{borderColor:"var(--palette-styled-border)"},"&:hover fieldset":{borderColor:"var(--palette-styled-border)"},"&.Mui-focused fieldset":{borderColor:"var(--palette-styled-border)"},"& .MuiOutlinedInput-input":{backgroundColor:"transparent"}}},size:"small"}),(0,E.jsx)(S.A,{value:r,onChange:e=>{(e=>{i(e)})(e)}})]})]}),(0,E.jsx)(P.A,{isVisible:!0,isNavbarCollapsed:t,children:(0,E.jsx)(H,{children:X?(0,E.jsx)(D.e,{onClick:()=>{ve()},startIcon:(0,E.jsx)(N.A,{}),sx:{backgroundColor:"var(--gray-card-bg)",border:"1px solid var(--palette-styled-border)",fontWeight:400,minWidth:"134px",height:"42px","& .MuiSvgIcon-root":{color:"var(--text-primary)"},color:"var(--text-primary)","&:hover":{backgroundColor:"var(--gray-card-bg)",opacity:.9},borderRadius:"32px",padding:"8px"},children:pe("pages.editInvoice.save").text}):(0,E.jsx)(E.Fragment,{children:(0,E.jsxs)(O,{children:[(0,E.jsx)(B.A,{checked:G,onClick:e=>e.stopPropagation(),onChange:e=>{Y(e.target.checked)},label:pe("pages.memos.templateCreation").text}),(0,E.jsx)(D.e,{onClick:()=>{ve()},startIcon:(0,E.jsx)(N.A,{}),sx:{backgroundColor:"var(--gray-card-bg)",border:"1px solid var(--palette-styled-border)",fontWeight:400,minWidth:"134px",height:"42px","& .MuiSvgIcon-root":{color:"var(--text-primary)"},color:"var(--text-primary)","&:hover":{backgroundColor:"var(--gray-card-bg)",opacity:.9},borderRadius:"32px",padding:"8px"},children:pe("pages.editInvoice.save").text}),(0,E.jsx)(D.e,{onClick:()=>(async()=>{J||(Z(!0),fe().then(()=>{e.id?x.default.downloadMemosWord(e,$).then(()=>{ge("/memorandums/sent"),Z(!1)}):console.error("Failed to retrieve memorandum ID")}))})(),startIcon:(0,E.jsx)(L.A,{}),sx:{backgroundColor:"var(--gray-card-bg)",border:"1px solid var(--palette-styled-border)",fontWeight:400,minWidth:"150px",height:"42px","& .MuiSvgIcon-root":{color:"var(--text-primary)"},color:"var(--text-primary)","&:hover":{backgroundColor:"var(--gray-card-bg)",opacity:.9},borderRadius:"32px",padding:"8px"},children:pe("pages.invoiceCard.dropdownItems.downloadWord").text}),(0,E.jsx)(D.e,{onClick:()=>(async()=>{J||(Z(!0),fe().then(()=>{x.default.downloadMemorandum(e,$).then(()=>{ge("/memorandums/sent"),Z(!1)})}))})(),startIcon:(0,E.jsx)(L.A,{}),sx:{backgroundColor:"var(--gray-card-bg)",border:"1px solid var(--palette-styled-border)",fontWeight:400,minWidth:"150px",height:"42px","& .MuiSvgIcon-root":{color:"var(--text-primary)"},color:"var(--text-primary)","&:hover":{backgroundColor:"var(--gray-card-bg)",opacity:.9},borderRadius:"32px",padding:"8px"},children:pe("pages.invoiceCard.dropdownItems.downloadPDF").text}),(0,E.jsx)(D.e,{onClick:()=>{J||l(!0)},startIcon:(0,E.jsx)(M.A,{}),sx:{backgroundColor:"var(--gray-card-bg)",border:"1px solid var(--palette-styled-border)",fontWeight:400,minWidth:"134px",height:"42px","& .MuiSvgIcon-root":{color:"var(--text-primary)"},color:"var(--text-primary)","&:hover":{backgroundColor:"var(--gray-card-bg)",opacity:.9},borderRadius:"32px",padding:"8px"},children:pe("pages.editInvoice.send").text}),(0,E.jsx)(D.e,{onClick:()=>{(async()=>{J||(Z(!0),fe().then(()=>{x.default.createMemoReady(null===e||void 0===e?void 0:e.id,$).then(()=>{ge("/memorandums/sent"),Z(!1)})}))})()},startIcon:(0,E.jsx)(T.A,{}),sx:{backgroundColor:"var(--gray-card-bg)",border:"1px solid var(--palette-styled-border)",fontWeight:400,minWidth:"134px",height:"42px","& .MuiSvgIcon-root":{color:"var(--text-primary)"},color:"var(--text-primary)","&:hover":{backgroundColor:"var(--gray-card-bg)",opacity:.9},borderRadius:"32px",padding:"8px"},children:pe("pages.memos.ready").text})]})})})})]})}}}]);
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.