CINXE.COM
Tailwind CSS Select for React - Material Tailwind
<!DOCTYPE html><html lang="en" class="scroll-smooth"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width"/><title>Tailwind CSS Select for React - Material Tailwind</title><meta name="description" content="Customise your web projects with our beautiful select component for Tailwind CSS and React using Material Design guidelines."/><link rel="canonical" href="https://www.material-tailwind.com/docs/react/select"/><meta name="next-head-count" content="5"/><meta name="ahrefs-site-verification" content="7b6973de8e282762b663bca399042c685eb9ef3217a725e88c8cf68f599b967b"/><link rel="shortcut icon" href="https://docs.material-tailwind.com/favicon.png" type="image/png"/><link rel="apple-touch-icon" sizes="180x180" href="https://docs.material-tailwind.com/favicon.png"/><link rel="icon" type="image/png" sizes="32x32" href="https://docs.material-tailwind.com/favicon.png"/><link rel="icon" type="image/png" sizes="16x16" href="https://docs.material-tailwind.com/favicon.png"/><link rel="manifest" href="https://docs.material-tailwind.com/img/site.webmanifest"/><link rel="mask-icon" href="https://docs.material-tailwind.com/img/safari-pinned-tab.svg" color="#020617"/><meta name="msapplication-TileColor" content="#020617"/><meta name="theme-color" content="#ffffff"/><noscript><img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=111649226022273&ev=PageView&noscript=1"/></noscript><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-1ycn6IcaQQ40/MKBW2W4Rhis/DbILU74C1vSrLJxCq57o941Ym01SwNsOMqvEBFlcgUa6xLiPY/NS5R+E6ztJQ==" crossorigin="anonymous"/><script defer="" data-domain="material-tailwind.com" src="https://plausible.io/js/script.js"></script><script defer="" src="https://cdn.jsdelivr.net/npm/apexcharts"></script><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css"/><script defer="" src="https://cdn.jsdelivr.net/npm/flatpickr"></script><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@docsearch/css@3"/><script defer="" src="https://cdn.jsdelivr.net/npm/@docsearch/js@3"></script><script async="" defer="" src="https://unpkg.com/@material-tailwind/html@latest/scripts/ripple.js"></script><script async="" defer="" src="https://cdn.jsdelivr.net/npm/clipboard@2.0.11/dist/clipboard.min.js"></script><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /><link rel="preload" href="https://docs.material-tailwind.com/_next/static/css/ca6b01f261ab16d0.css" as="style"/><link rel="stylesheet" href="https://docs.material-tailwind.com/_next/static/css/ca6b01f261ab16d0.css" data-n-g=""/><noscript data-n-css=""></noscript><script defer="" nomodule="" src="https://docs.material-tailwind.com/_next/static/chunks/polyfills-c67a75d1b6f99dc8.js"></script><script src="https://docs.material-tailwind.com/_next/static/chunks/webpack-4530abfa10c7789f.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/chunks/framework-5ac2b14b431a77fa.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/chunks/main-3092d4aad05c774c.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/chunks/pages/_app-b264bd2bc24d7974.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/chunks/2d7f6f8c-97884eec69e990bf.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/chunks/fc83e031-ab0de3e344fce1dc.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/chunks/ff39441c-accb95dc5730898c.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/chunks/9f96d65d-c1f4b49dbc767bef.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/chunks/d848df63-b45c47b3fb9784b2.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/chunks/38-419c464ef6ade4f9.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/chunks/pages/docs/%5B...slug%5D-855efe671254ef22.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/7xyavH52hdVKj4bs-JAX1/_buildManifest.js" defer=""></script><script src="https://docs.material-tailwind.com/_next/static/7xyavH52hdVKj4bs-JAX1/_ssgManifest.js" defer=""></script><style data-href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&family=Roboto+Slab:wght@100;200;300;400;500;600;700;800;900&family=Roboto:wght@100;300;400;500;700;900&display=swap">@font-face{font-family:'Fira Code';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/firacode/v22/uU9eCBsR6Z2vfE9aq3bL0fxyUs4tcw4W_A9sFVQ.woff) format('woff')}@font-face{font-family:'Roboto';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgWxM.woff) format('woff')}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5vAA.woff) format('woff')}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Me5g.woff) format('woff')}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9vAA.woff) format('woff')}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlvAA.woff) format('woff')}@font-face{font-family:'Roboto';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtvAA.woff) format('woff')}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjojIWWaw.woff) format('woff')}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:200;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjoDISWaw.woff) format('woff')}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjo0oSWaw.woff) format('woff')}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjojISWaw.woff) format('woff')}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjovoSWaw.woff) format('woff')}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:600;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjoUoOWaw.woff) format('woff')}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjoa4OWaw.woff) format('woff')}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:800;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjoDIOWaw.woff) format('woff')}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjoJYOWaw.woff) format('woff')}@font-face{font-family:'Fira Code';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/firacode/v22/uU9eCBsR6Z2vfE9aq3bL0fxyUs4tcw4W_A9sJV37MOzlojwUKaJO.woff) format('woff');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Fira Code';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/firacode/v22/uU9eCBsR6Z2vfE9aq3bL0fxyUs4tcw4W_A9sJVT7MOzlojwUKaJO.woff) format('woff');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Fira Code';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/firacode/v22/uU9eCBsR6Z2vfE9aq3bL0fxyUs4tcw4W_A9sJVz7MOzlojwUKaJO.woff) format('woff');unicode-range:U+1F00-1FFF}@font-face{font-family:'Fira Code';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/firacode/v22/uU9eCBsR6Z2vfE9aq3bL0fxyUs4tcw4W_A9sJVP7MOzlojwUKaJO.woff) format('woff');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Fira Code';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/firacode/v22/uU9eCBsR6Z2vfE9aq3bL0fxyUs4tcw4W_A9sJV77MOzlojwUKaJO.woff) format('woff');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Fira Code';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/firacode/v22/uU9eCBsR6Z2vfE9aq3bL0fxyUs4tcw4W_A9sJVD7MOzlojwUKQ.woff) format('woff');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxFIzIXKMnyrYk.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxMIzIXKMnyrYk.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxEIzIXKMnyrYk.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxLIzIXKMnyrYk.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxHIzIXKMnyrYk.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxGIzIXKMnyrYk.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxIIzIXKMny.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fCRc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fABc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fCBc4AMP6lbBP.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fBxc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fCxc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fChc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fBBc4AMP6lQ.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu72xKKTU1Kvnz.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu5mxKKTU1Kvnz.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu7mxKKTU1Kvnz.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu4WxKKTU1Kvnz.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu7WxKKTU1Kvnz.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu7GxKKTU1Kvnz.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu4mxKKTU1Kg.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fCRc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fABc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fCBc4AMP6lbBP.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fBxc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fCxc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fChc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fBBc4AMP6lQ.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfCRc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfABc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfCBc4AMP6lbBP.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfBxc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfCxc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfChc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfBBc4AMP6lQ.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfCRc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfABc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfCBc4AMP6lbBP.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfBxc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfCxc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfChc4AMP6lbBP.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfBBc4AMP6lQ.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufA5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufJ5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufB5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufO5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufC5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufD5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:100;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufN5qWr4xCC.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:200;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufA5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:200;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufJ5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:200;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufB5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:200;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufO5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:200;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufC5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:200;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufD5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:200;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufN5qWr4xCC.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufA5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufJ5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufB5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufO5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufC5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufD5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufN5qWr4xCC.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufA5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufJ5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufB5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufO5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufC5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufD5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufN5qWr4xCC.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufA5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufJ5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufB5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufO5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufC5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufD5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufN5qWr4xCC.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:600;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufA5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:600;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufJ5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:600;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufB5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:600;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufO5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:600;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufC5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:600;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufD5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:600;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufN5qWr4xCC.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufA5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufJ5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufB5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufO5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufC5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufD5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufN5qWr4xCC.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:800;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufA5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:800;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufJ5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:800;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufB5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:800;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufO5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:800;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufC5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:800;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufD5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:800;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufN5qWr4xCC.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufA5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufJ5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufB5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufO5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufC5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufD5qWr4xCCQ_k.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufN5qWr4xCC.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}</style><style data-href="https://fonts.googleapis.com/icon?family=Material+Icons">@font-face{font-family:'Material Icons';font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/materialicons/v142/flUhRq6tzZclQEJ-Vdg-IuiaDsNa.woff) format('woff')}.material-icons{font-family:'Material Icons';font-weight:normal;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;font-feature-settings:'liga'}@font-face{font-family:'Material Icons';font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/materialicons/v142/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2) format('woff2')}.material-icons{font-family:'Material Icons';font-weight:normal;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased}</style></head><body class="root"> <script async="" defer="" src="https://cdn.jsdelivr.net/npm/clipboard@2.0.11/dist/clipboard.min.js"></script><noscript><iframe title="google-tag-manage" src="https://www.googletagmanager.com/ns.html?id=GTM-KB2WKJS" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><div id="__next"><div class="relative mb-8 h-full w-full bg-white"><div class="sticky top-0 z-[999] flex w-full items-center"><nav class="block px-8 backdrop-saturate-200 backdrop-blur-2xl bg-opacity-80 border border-white/80 text-white w-full max-w-full rounded-none border-b-[1.5px] !border-blue-gray-50 bg-white py-1.5 !pl-2 !pr-3 lg:!px-4 lg:!py-0.5"><div class="container mx-auto"><div class="flex w-full items-center !justify-between"><a class="py-2.375 mr-4 flex items-center gap-2 text-inherit lg:ml-0" href="/"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32" fill="none"><rect width="32" height="32" rx="5" fill="black"></rect><rect x="7.43408" y="10.8491" width="16.74" height="10.3629" fill="url(#pattern0)"></rect><defs><pattern id="pattern0" patternContentUnits="objectBoundingBox" width="1" height="1"><use xlink:href="#image0_5_15367" transform="matrix(0.000437181 0 0 0.000706215 -0.000571691 0)"></use></pattern><image id="image0_5_15367" width="2290" height="1416" xlink:href="data:image/png;base64,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Yz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOnBob3Rvc2hvcD0iaHR0cDovL25zLmFkb2JlLmNvbS9waG90b3Nob3AvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0RXZ0PSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VFdmVudCMiIGV4aWY6UGl4ZWxYRGltZW5zaW9uPSIyMjkwIiBleGlmOlBpeGVsWURpbWVuc2lvbj0iMTQxNiIgZXhpZjpVc2VyQ29tbWVudD0iU2NyZWVuc2hvdCIgeG1wOkNyZWF0ZURhdGU9IjIwMjMtMDYtMjZUMTU6Mzg6MTcrMDM6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDIzLTA2LTI4VDExOjE2OjA5KzAzOjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDIzLTA2LTI4VDExOjE2OjA5KzAzOjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgcGhvdG9zaG9wOklDQ1Byb2ZpbGU9IkRpc3BsYXkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OTBlM2VmZDMtYmFkNi00N2ZjLWFjOTItZTRmNmQ0ZDY5NDgwIiB4bXBNTTpEb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6ZGZmOWIxOTktMmViZC1mMDQyLWJmZmUtOWViYTM3Y2IwZmRhIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6OTQ1NmZkMWQtN2M4Yy00YjAwLThhZTYtM2YxYjA2Y2YzMTAxIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6OTQ1NmZkMWQtN2M4Yy00YjAwLThhZTYtM2YxYjA2Y2YzMTAxIiBzdEV2dDp3aGVuPSIyMDIzLTA2LTI4VDExOjE2OjA5KzAzOjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3No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"></image></defs></svg><p class="block antialiased font-sans text-sm font-bold leading-tight text-primary">Material <br/> Tailwind</p><div class="relative grid items-center font-sans font-bold uppercase whitespace-nowrap select-none py-1.5 px-3 text-xs rounded-lg ml-2 border-[1.5px] border-blue-gray-50 pb-1 pt-1.5 text-primary" style="opacity:0"><span class="">v2.1.9</span></div><hr class="mx-2 h-8 border-r border-primary/10"/><p class="block antialiased font-sans text-sm font-medium leading-tight text-primary">Documentation</p></a><button class="relative align-middle select-none font-sans font-medium text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none max-w-[40px] max-h-[40px] rounded-lg text-xs ml-auto h-6 w-6 text-primary hover:bg-transparent focus:bg-transparent active:bg-transparent lg:hidden" type="button"><span class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform"><svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 stroke-primary text-primary" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M4 6h16M4 12h16M4 18h16"></path></svg></span></button><div class="lg:base-auto hidden flex-grow basis-full items-center lg:flex lg-max:max-h-0"><div class="flex w-full flex-col justify-end lg:!ml-auto lg:flex-row"><nav class="flex flex-col gap-1 p-2 font-sans text-base font-normal text-blue-gray-700 min-w-max px-0 lg:!flex-row"><a class="flex items-center gap-1 cursor-pointer rounded-lg py-2.5 px-4 text-sm text-blue-gray-800 hover:text-primary hover:bg-blue-gray-50 hover:bg-opacity-80 focus:bg-blue-gray-50 focus:bg-opacity-80 active:bg-blue-gray-50 active:bg-opacity-80 hover:text-primary focus:text-primary active:text-primary transition-all leading-none" aria-expanded="false" aria-haspopup="menu" id=":R5qlkmH2:" href="/docs/react/installation">Docs</a><a href="/pro"><div role="button" tabindex="0" class="flex items-center w-full p-3 rounded-lg text-start transition-all hover:bg-blue-gray-50 hover:bg-opacity-80 focus:bg-blue-gray-50 focus:bg-opacity-80 active:bg-blue-gray-50 active:bg-opacity-80 focus:text-blue-gray-900 active:text-blue-gray-900 outline-none px-4 py-2.5 text-sm text-blue-gray-800 hover:text-primary">Pro</div></a><a href="/blocks"><div role="button" tabindex="0" class="flex items-center w-full p-3 rounded-lg text-start transition-all hover:bg-blue-gray-50 hover:bg-opacity-80 focus:bg-blue-gray-50 focus:bg-opacity-80 active:bg-blue-gray-50 active:bg-opacity-80 focus:text-blue-gray-900 active:text-blue-gray-900 outline-none px-4 py-2.5 text-sm text-blue-gray-800 hover:text-primary">Blocks</div></a><a href="/roots-of-ui-ux-design"><div role="button" tabindex="0" class="flex items-center w-full p-3 rounded-lg text-start transition-all hover:bg-blue-gray-50 hover:bg-opacity-80 focus:bg-blue-gray-50 focus:bg-opacity-80 active:bg-blue-gray-50 active:bg-opacity-80 focus:text-blue-gray-900 active:text-blue-gray-900 outline-none px-4 py-2.5 text-sm text-blue-gray-800 hover:text-primary">Book</div></a><div class="flex cursor-pointer items-center gap-1 rounded-lg px-4 py-2.5 text-sm leading-none text-blue-gray-800 transition-all hover:bg-blue-gray-50 hover:bg-opacity-80 hover:text-primary focus:bg-blue-gray-50 focus:bg-opacity-80 focus:text-primary active:bg-blue-gray-50 active:bg-opacity-80 active:text-primary" aria-expanded="false" aria-haspopup="menu" id=":RlqlkmH2:">Resources <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-3.5 w-3.5"><path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5"></path></svg></div></nav><div class="ml-2 flex items-center gap-2"><div class="group relative mt-1"><div class="relative w-full min-w-[200px] h-10 min-w-[100px]"><input type="email" placeholder="Search" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all placeholder-shown:border placeholder-shown:border-blue-gray-200 placeholder-shown:border-t-blue-gray-200 border focus:border-2 border-t-transparent focus:border-t-transparent placeholder:opacity-0 focus:placeholder:opacity-100 text-sm px-3 py-2.5 rounded-[7px] border-blue-gray-200 focus:border-gray-900 !h-9 w-full border-[1.5px] !border-blue-gray-100 bg-white text-blue-gray-800 ring-4 ring-transparent placeholder:text-blue-gray-600 focus:!border-primary focus:!border-t-primary group-hover:!border-primary"/><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal !overflow-visible truncate peer-placeholder-shown:text-blue-gray-500 leading-tight peer-focus:leading-tight peer-disabled:text-transparent peer-disabled:peer-placeholder-shown:text-blue-gray-500 transition-all -top-1.5 peer-placeholder-shown:text-sm text-[11px] peer-focus:text-[11px] before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 peer-placeholder-shown:before:border-transparent before:rounded-tl-md before:border-t peer-focus:before:border-t-2 before:border-l peer-focus:before:border-l-2 before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 peer-placeholder-shown:after:border-transparent after:rounded-tr-md after:border-t peer-focus:after:border-t-2 after:border-r peer-focus:after:border-r-2 after:pointer-events-none after:transition-all peer-disabled:after:border-transparent peer-placeholder-shown:leading-[3.75] text-gray-500 peer-focus:text-gray-900 before:border-blue-gray-200 peer-focus:before:!border-gray-900 after:border-blue-gray-200 peer-focus:after:!border-gray-900 hidden"> </label></div><div class="absolute right-3.5 top-1.5 "><kbd class="rounded border border-blue-gray-100 bg-white px-1 pb-0 pt-px text-xs font-medium text-gray-900 shadow shadow-black/5"><span class="mr-0.5 inline-block translate-y-[1.5px] text-base">⌘</span>K</kbd></div><div class="absolute inset-0 w-full opacity-0"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"></span></button>ab</div></div><a target="_blank" rel="noreferrer" class="flex items-center gap-2 p-1.5 text-primary" href="https://github.com/creativetimofficial/material-tailwind?ref=material-tailwind"><div class="relative grid font-sans font-bold uppercase whitespace-nowrap select-none px-3 rounded-lg items-center gap-2 border !border-blue-gray-100 bg-white py-1 !pr-2 text-xs text-blue-gray-900" style="opacity:0"><div class="absolute top-2/4 -translate-y-2/4 w-5 h-5 left-1.5"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="text-blue-gray-900" class="!ml-0 mt-[2.5px] h-3.5 w-3.5"><path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path></svg></div><span class="ml-[18px]"><span class="-ml-2 text-blue-gray-900">0</span></span></div><i class="fab fa-github text-xl leading-none opacity-80"></i></a><a target="_blank" rel="noreferrer" class="p-1.5 leading-none text-primary opacity-80" href="https://discord.com/invite/FhCJCaHdQa"><i class="fab fa-discord text-lg leading-none"></i></a><a href="/blocks#pricing"><button class="align-middle select-none font-sans font-bold text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none text-xs px-4 rounded-lg text-white shadow-md shadow-gray-900/10 hover:shadow-lg hover:shadow-gray-900/20 focus:opacity-[0.85] focus:shadow-none active:opacity-[0.85] active:shadow-none flex items-center justify-between bg-gray-900 py-2.5" type="button">Pricing & FAQ</button></a></div></div></div></div><div class="block w-full basis-full overflow-hidden" style="height:0px"><div class="overflow-hidden pb-1 lg:overflow-visible"><div class="flex w-full flex-col justify-end lg:!ml-auto lg:flex-row"><nav class="flex flex-col gap-1 p-2 font-sans text-base font-normal text-blue-gray-700 min-w-max px-0 lg:!flex-row"><a class="flex items-center gap-1 cursor-pointer rounded-lg py-2.5 px-4 text-sm text-blue-gray-800 hover:text-primary hover:bg-blue-gray-50 hover:bg-opacity-80 focus:bg-blue-gray-50 focus:bg-opacity-80 active:bg-blue-gray-50 active:bg-opacity-80 hover:text-primary focus:text-primary active:text-primary transition-all leading-none" aria-expanded="false" aria-haspopup="menu" id=":RbclkmH2:" href="/docs/react/installation">Docs</a><a href="/pro"><div role="button" tabindex="0" class="flex items-center w-full p-3 rounded-lg text-start transition-all hover:bg-blue-gray-50 hover:bg-opacity-80 focus:bg-blue-gray-50 focus:bg-opacity-80 active:bg-blue-gray-50 active:bg-opacity-80 focus:text-blue-gray-900 active:text-blue-gray-900 outline-none px-4 py-2.5 text-sm text-blue-gray-800 hover:text-primary">Pro</div></a><a href="/blocks"><div role="button" tabindex="0" class="flex items-center w-full p-3 rounded-lg text-start transition-all hover:bg-blue-gray-50 hover:bg-opacity-80 focus:bg-blue-gray-50 focus:bg-opacity-80 active:bg-blue-gray-50 active:bg-opacity-80 focus:text-blue-gray-900 active:text-blue-gray-900 outline-none px-4 py-2.5 text-sm text-blue-gray-800 hover:text-primary">Blocks</div></a><a href="/roots-of-ui-ux-design"><div role="button" tabindex="0" class="flex items-center w-full p-3 rounded-lg text-start transition-all hover:bg-blue-gray-50 hover:bg-opacity-80 focus:bg-blue-gray-50 focus:bg-opacity-80 active:bg-blue-gray-50 active:bg-opacity-80 focus:text-blue-gray-900 active:text-blue-gray-900 outline-none px-4 py-2.5 text-sm text-blue-gray-800 hover:text-primary">Book</div></a><div class="flex cursor-pointer items-center gap-1 rounded-lg px-4 py-2.5 text-sm leading-none text-blue-gray-800 transition-all hover:bg-blue-gray-50 hover:bg-opacity-80 hover:text-primary focus:bg-blue-gray-50 focus:bg-opacity-80 focus:text-primary active:bg-blue-gray-50 active:bg-opacity-80 active:text-primary" aria-expanded="false" aria-haspopup="menu" id=":R1bclkmH2:">Resources <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-3.5 w-3.5"><path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5"></path></svg></div></nav><div class="ml-2 flex items-center gap-2"><div class="group relative mt-1"><div class="relative w-full min-w-[200px] h-10 min-w-[100px]"><input type="email" placeholder="Search" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all placeholder-shown:border placeholder-shown:border-blue-gray-200 placeholder-shown:border-t-blue-gray-200 border focus:border-2 border-t-transparent focus:border-t-transparent placeholder:opacity-0 focus:placeholder:opacity-100 text-sm px-3 py-2.5 rounded-[7px] border-blue-gray-200 focus:border-gray-900 !h-9 w-full border-[1.5px] !border-blue-gray-100 bg-white text-blue-gray-800 ring-4 ring-transparent placeholder:text-blue-gray-600 focus:!border-primary focus:!border-t-primary group-hover:!border-primary"/><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal !overflow-visible truncate peer-placeholder-shown:text-blue-gray-500 leading-tight peer-focus:leading-tight peer-disabled:text-transparent peer-disabled:peer-placeholder-shown:text-blue-gray-500 transition-all -top-1.5 peer-placeholder-shown:text-sm text-[11px] peer-focus:text-[11px] before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 peer-placeholder-shown:before:border-transparent before:rounded-tl-md before:border-t peer-focus:before:border-t-2 before:border-l peer-focus:before:border-l-2 before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 peer-placeholder-shown:after:border-transparent after:rounded-tr-md after:border-t peer-focus:after:border-t-2 after:border-r peer-focus:after:border-r-2 after:pointer-events-none after:transition-all peer-disabled:after:border-transparent peer-placeholder-shown:leading-[3.75] text-gray-500 peer-focus:text-gray-900 before:border-blue-gray-200 peer-focus:before:!border-gray-900 after:border-blue-gray-200 peer-focus:after:!border-gray-900 hidden"> </label></div><div class="absolute right-3.5 top-1.5 "><kbd class="rounded border border-blue-gray-100 bg-white px-1 pb-0 pt-px text-xs font-medium text-gray-900 shadow shadow-black/5"><span class="mr-0.5 inline-block translate-y-[1.5px] text-base">⌘</span>K</kbd></div><div class="absolute inset-0 w-full opacity-0"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"></span></button>ab</div></div><a target="_blank" rel="noreferrer" class="flex items-center gap-2 p-1.5 text-primary" href="https://github.com/creativetimofficial/material-tailwind?ref=material-tailwind"><div class="relative grid font-sans font-bold uppercase whitespace-nowrap select-none px-3 rounded-lg items-center gap-2 border !border-blue-gray-100 bg-white py-1 !pr-2 text-xs text-blue-gray-900" style="opacity:0"><div class="absolute top-2/4 -translate-y-2/4 w-5 h-5 left-1.5"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="text-blue-gray-900" class="!ml-0 mt-[2.5px] h-3.5 w-3.5"><path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path></svg></div><span class="ml-[18px]"><span class="-ml-2 text-blue-gray-900">0</span></span></div><i class="fab fa-github text-xl leading-none opacity-80"></i></a><a target="_blank" rel="noreferrer" class="p-1.5 leading-none text-primary opacity-80" href="https://discord.com/invite/FhCJCaHdQa"><i class="fab fa-discord text-lg leading-none"></i></a><a href="/blocks#pricing"><button class="align-middle select-none font-sans font-bold text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none text-xs px-4 rounded-lg text-white shadow-md shadow-gray-900/10 hover:shadow-lg hover:shadow-gray-900/20 focus:opacity-[0.85] focus:shadow-none active:opacity-[0.85] active:shadow-none flex items-center justify-between bg-gray-900 py-2.5" type="button">Pricing & FAQ</button></a></div></div></div></div></div><div class="mt-2 flex items-center border-t border-blue-gray-50 pb-2 pt-4 lg:hidden"><button type="button" class="text-blue-gray-900"><svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M4 6h16M4 12h16M4 18h7"></path></svg></button><ol class="ml-4 flex min-w-0 whitespace-nowrap text-sm leading-6 text-blue-gray-700"><li class="flex items-center capitalize">react<svg width="3" height="6" class="mx-3 overflow-visible text-blue-gray-300"><path d="M0 0L3 3L0 6" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg></li><li class="flex items-center capitalize">select</li></ol></div></nav></div><div class="px-6"><div class="container mx-auto flex"><aside class="fixed top-0 z-[999] h-screen w-80 overflow-y-scroll pb-4 pr-4 transition-all duration-300 lg:sticky lg:left-0 lg:top-16 lg:z-10 lg:w-56 -left-96"><div class="fixed left-0 top-0 h-screen w-screen bg-gray-900/20 backdrop-blur-sm transition-opacity duration-300 lg:hidden pointer-events-none opacity-0"></div><div class="fixed top-0 z-[9999] h-screen w-80 overflow-y-scroll !bg-white pb-6 pl-6 lg:relative lg:w-56 lg:bg-transparent lg:pl-0 lg:pt-0"><div class="mb-24 mt-6"><div><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">Getting Started</p><ul class="py-2"><li class=""><a href="/docs/react/installation"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Installation</p></a></li><li class=""><a href="/docs/react/installation-with-cli"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Installation with CLI</p></a></li><li class=""><a href="/docs/react/license"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">License</p></a></li><li class=""><a href="/docs/react/what-is-tailwind-css"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">What is Tailwind CSS</p></a></li><li class="!mb-4"><a href="/docs/react/release-notes"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Release Notes</p></a></li></ul></div><div><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">Upgrade Guide</p><ul class="py-2"><li class="!mb-4"><a href="/docs/react/2.x-migration-guide"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">v2 Migration Guide</p></a></li></ul></div><div><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">Integration Guide</p><ul class="py-2"><li class=""><a href="/docs/react/guide/next"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Next.js</p></a></li><li class=""><a href="/docs/react/guide/cra"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Create React App</p></a></li><li class=""><a href="/docs/react/guide/remix"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Remix</p></a></li><li class=""><a href="/docs/react/guide/vite"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Vite</p></a></li><li class=""><a href="/docs/react/guide/astro"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Astro</p></a></li><li class=""><a href="/docs/react/guide/gatsby"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Gatsby</p></a></li><li class="!mb-4"><a href="/docs/react/guide/genezio"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Genezio</p></a></li></ul></div><div><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">Customization</p><ul class="py-2"><li class=""><a href="/docs/react/theming"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Theming</p></a></li><li class=""><a href="/docs/react/colors"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Colors</p></a></li><li class=""><a href="/docs/react/fonts"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Fonts</p></a></li><li class=""><a href="/docs/react/shadows"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Shadows</p></a></li><li class="!mb-4"><a href="/docs/react/screens"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Screens</p></a></li></ul></div><div><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">Components</p><ul class="py-2"><li class=""><a href="/docs/react/accordion"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Accordion</p></a></li><li class=""><a href="/docs/react/alert"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Alert</p></a></li><li class=""><a href="/docs/react/avatar"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Avatar</p></a></li><li class=""><a href="/docs/react/badge"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Badge</p></a></li><li class=""><a href="/docs/react/breadcrumbs"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Breadcrumbs</p></a></li><li class=""><a href="/docs/react/button"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Button</p></a></li><li class=""><a href="/docs/react/button-group"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Button Group</p></a></li><li class=""><a href="/docs/react/card"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Card</p></a></li><li class=""><a href="/docs/react/chip"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Chip</p></a></li><li class=""><a href="/docs/react/collapse"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Collapse</p></a></li><li class=""><a href="/docs/react/carousel"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Carousel</p></a></li><li class=""><a href="/docs/react/dialog"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Dialog</p></a></li><li class=""><a href="/docs/react/drawer"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Drawer</p></a></li><li class=""><a href="/docs/react/footer"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Footer</p></a></li><li class=""><a href="/docs/react/form"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Form</p></a></li><li class=""><a href="/docs/react/gallery"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Gallery</p></a></li><li class=""><a href="/docs/react/icon-button"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Icon Button</p></a></li><li class=""><a href="/docs/react/img"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Image</p></a></li><li class=""><a href="/docs/react/list"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">List</p></a></li><li class=""><a href="/docs/react/menu"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Menu</p></a></li><li class=""><a href="/docs/react/mega-menu"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Mega Menu</p></a></li><li class=""><a href="/docs/react/modal"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Modal</p></a></li><li class=""><a href="/docs/react/navbar"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Navbar</p></a></li><li class=""><a href="/docs/react/popover"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Popover</p></a></li><li class=""><a href="/docs/react/progress-bar"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Progress Bar</p></a></li><li class=""><a href="/docs/react/pagination"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Pagination</p></a></li><li class=""><a href="/docs/react/rating-bar"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Rating Bar</p></a></li><li class=""><a href="/docs/react/sidebar"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Sidebar</p></a></li><li class=""><a href="/docs/react/skeleton"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Skeleton</p></a></li><li class=""><a href="/docs/react/slider"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Slider</p></a></li><li class=""><a href="/docs/react/speed-dial"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Speed Dial</p></a></li><li class=""><a href="/docs/react/spinner"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Spinner</p></a></li><li class=""><a href="/docs/react/stepper"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Stepper</p></a></li><li class=""><a href="/docs/react/tabs"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Tabs</p></a></li><li class=""><a href="/docs/react/table"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Table</p></a></li><li class=""><a href="/docs/react/timeline"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Timeline</p></a></li><li class=""><a href="/docs/react/tooltip"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Tooltip</p></a></li><li class=""><a href="/docs/react/typography"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Typography</p></a></li><li class="!mb-4"><a href="/docs/react/video"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Video</p></a></li></ul></div><div><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">Forms</p><ul class="py-2"><li class=""><a href="/docs/react/checkbox"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Checkbox</p></a></li><li class=""><a href="/docs/react/input"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Input</p></a></li><li class=""><a href="/docs/react/input-number"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Input Number</p></a></li><li class=""><a href="/docs/react/input-phone"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Input Phone</p></a></li><li class=""><a href="/docs/react/radio-button"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Radio Button</p></a></li><li class=""><a href="/docs/react/select"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-medium text-blue-500">Select</p></a></li><li class=""><a href="/docs/react/switch"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Switch</p></a></li><li class="!mb-4"><a href="/docs/react/textarea"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Textarea</p></a></li></ul></div><div><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">Web 3.0 Components</p><ul class="py-2"><li class=""><a href="/docs/react/crypto/crypto-login"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Crypto Login</p></a></li><li class=""><a href="/docs/react/crypto/crypto-card"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Crypto Card</p></a></li><li class=""><a href="/docs/react/crypto/crypto-chart"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Crypto Chart</p></a></li><li class=""><a href="/docs/react/crypto/crypto-modal"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Crypto Modal</p></a></li><li class="!mb-4"><a href="/docs/react/crypto/crypto-table"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Crypto Table</p></a></li></ul></div><div><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">Plugins</p><ul class="py-2"><li class=""><a href="/docs/react/plugins/algolia-search"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Algolia Search</p></a></li><li class=""><a href="/docs/react/plugins/charts"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Charts</p></a></li><li class=""><a href="/docs/react/plugins/clipboard"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Clipboard</p></a></li><li class=""><a href="/docs/react/plugins/date-picker"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">Date Picker</p></a></li><li class="!mb-4"><a href="/docs/react/plugins/text-editor"><p class="antialiased font-sans text-sm leading-normal relative list-item w-full py-1 capitalize transition-colors hover:text-primary font-normal text-gray-600">WSSIWYG Editor</p></a></li></ul></div><div class="relative flex flex-col bg-clip-border rounded-xl bg-gray-900 text-white shadow-gray-900/20 shadow-md"><div class="p-6 px-4 py-2.5"><h6 class="block antialiased tracking-normal font-sans text-base font-semibold leading-relaxed text-inherit mb-1">Material Tailwind v3</h6><p class="block antialiased font-sans text-sm leading-normal text-white font-normal">We've just released the new version of Material Tailwind with a lot of new features and improvements. It's currently on <span class="font-semibold text-yellow-600">beta</span> <!-- -->and we need your feedback to make it better.</p><a href="/docs/v3/react/installation"><button class="align-middle select-none font-sans font-bold text-center transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none text-xs py-2 px-4 rounded-lg bg-white text-blue-gray-900 shadow-md shadow-blue-gray-500/10 hover:shadow-lg hover:shadow-blue-gray-500/20 focus:opacity-[0.85] focus:shadow-none active:opacity-[0.85] active:shadow-none block w-full mb-1.5 mt-4 normal-case" type="button">Go to v3 Docs</button></a></div></div></div></div></aside><div class="mt-6 w-full lg:w-[60%] lg:px-6"><div id="select" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h1 class="block antialiased tracking-normal font-sans text-3xl font-semibold leading-snug !mb-4 text-primary lg:!text-3xl">Tailwind CSS Select - React</h1></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">Use our Tailwind CSS <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component to collect user provided information from a list of options.</p> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">A <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component is a dropdown menu for displaying choices. Use the radio component when there are fewer total options (less than 5).</p> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">See below our <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component example that you can use in your Tailwind CSS and React project. The example comes in different colors and styles, so you can adapt it easily to your needs.</p> <br/> <div class="scroll-mt-64 overflow-hidden rounded-xl border border-blue-gray-50 bg-white "><div class="flex items-center justify-between border-b border-blue-gray-50 p-1 "><div class="flex w-full items-center justify-end gap-2"><button type="button" class="relative align-middle select-none font-sans font-medium text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none w-8 max-w-[32px] h-8 max-h-[32px] rounded-lg text-xs text-blue-gray-500 hover:bg-blue-gray-500/10 active:bg-blue-gray-500/30 hover:text-blue-gray-900"><span class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-5 w-5"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25ZM6.75 12h.008v.008H6.75V12Zm0 3h.008v.008H6.75V15Zm0 3h.008v.008H6.75V18Z"></path></svg></span></button></div></div><div class="grid min-h-[140px] w-full place-items-center overflow-x-scroll rounded-lg p-6 lg:overflow-visible"><div class="w-72"><div class="relative w-full min-w-[200px] h-10"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-2.5 rounded-[7px] border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[3.75] text-blue-gray-400 before:border-transparent after:border-transparent">Select Version</label></div></div></div><div class="code-preview block max-h-[40rem] overflow-scroll rounded-b-xl"><div data-rehype-pretty-code-fragment=""><pre data-language="jsx" data-theme="default"><code data-language="jsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> { Select, Option } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span> <span class="line"> </span> <span class="line"><span style="color:#FF7B72">export</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">function</span><span style="color:#C9D1D9"> </span><span style="color:#D2A8FF">SelectDefault</span><span style="color:#C9D1D9">() {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">return</span><span style="color:#C9D1D9"> (</span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">className</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"w-72"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> );</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div></div></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-variants" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-variants" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Select Variants</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">The <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component comes with 3 different variants that you can change it using the <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">variant</code> prop.</p> <div class="scroll-mt-64 overflow-hidden rounded-xl border border-blue-gray-50 bg-white "><div class="flex items-center justify-between border-b border-blue-gray-50 p-1 "><div class="flex w-full items-center justify-end gap-2"><button type="button" class="relative align-middle select-none font-sans font-medium text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none w-8 max-w-[32px] h-8 max-h-[32px] rounded-lg text-xs text-blue-gray-500 hover:bg-blue-gray-500/10 active:bg-blue-gray-500/30 hover:text-blue-gray-900"><span class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-5 w-5"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25ZM6.75 12h.008v.008H6.75V12Zm0 3h.008v.008H6.75V15Zm0 3h.008v.008H6.75V18Z"></path></svg></span></button></div></div><div class="grid min-h-[140px] w-full place-items-center overflow-x-scroll rounded-lg p-6 lg:overflow-visible"><div class="flex w-72 flex-col gap-6"><div class="relative w-full min-w-[200px] h-11"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border-b text-sm pt-4 pb-1.5 border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-0 pt-3"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute font-normal transition-all -top-2.5 after:content[' '] after:block after:w-full after:absolute after:-bottom-2.5 left-0 after:border-b-2 after:transition-transform after:duration-300 text-sm peer-disabled:text-blue-gray-400 after:scale-x-0 leading-tight text-blue-gray-500 after:border-gray-500">Select Version</label></div><div class="relative w-full min-w-[200px] h-11"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border-b text-sm pt-4 pb-1.5 border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-0 pt-3"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute font-normal transition-all -top-1.5 after:content[' '] after:block after:w-full after:absolute after:-bottom-1.5 left-0 after:border-b-2 after:transition-transform after:duration-300 text-sm peer-disabled:text-blue-gray-400 after:scale-x-0 leading-[4.25] text-blue-gray-500 after:border-gray-500">Select Version</label></div><div class="relative w-full min-w-[200px] h-10"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-2.5 rounded-[7px] border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[3.75] text-blue-gray-400 before:border-transparent after:border-transparent">Select Version</label></div></div></div><div class="code-preview block max-h-[40rem] overflow-scroll rounded-b-xl"><div data-rehype-pretty-code-fragment=""><pre data-language="jsx" data-theme="default"><code data-language="jsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> { Select, Option } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span> <span class="line"> </span> <span class="line"><span style="color:#FF7B72">export</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">function</span><span style="color:#C9D1D9"> </span><span style="color:#D2A8FF">SelectVariants</span><span style="color:#C9D1D9">() {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">return</span><span style="color:#C9D1D9"> (</span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">className</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"flex w-72 flex-col gap-6"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">variant</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"static"</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">variant</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"standard"</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">variant</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"outlined"</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> );</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div></div></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-sizes" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-sizes" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Select Sizes</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">The <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component comes with 2 different sizes that you can change it using the <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">size</code> prop.</p> <div class="scroll-mt-64 overflow-hidden rounded-xl border border-blue-gray-50 bg-white "><div class="flex items-center justify-between border-b border-blue-gray-50 p-1 "><div class="flex w-full items-center justify-end gap-2"><button type="button" class="relative align-middle select-none font-sans font-medium text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none w-8 max-w-[32px] h-8 max-h-[32px] rounded-lg text-xs text-blue-gray-500 hover:bg-blue-gray-500/10 active:bg-blue-gray-500/30 hover:text-blue-gray-900"><span class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-5 w-5"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25ZM6.75 12h.008v.008H6.75V12Zm0 3h.008v.008H6.75V15Zm0 3h.008v.008H6.75V18Z"></path></svg></span></button></div></div><div class="grid min-h-[140px] w-full place-items-center overflow-x-scroll rounded-lg p-6 lg:overflow-visible"><div class="flex w-72 flex-col gap-6"><div class="relative w-full min-w-[200px] h-10"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-2.5 rounded-[7px] border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[3.75] text-blue-gray-400 before:border-transparent after:border-transparent">Select Version</label></div><div class="relative w-full min-w-[200px] h-11"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-3 rounded-[7px] border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[4.1] text-blue-gray-400 before:border-transparent after:border-transparent">Select Version</label></div></div></div><div class="code-preview block max-h-[40rem] overflow-scroll rounded-b-xl"><div data-rehype-pretty-code-fragment=""><pre data-language="jsx" data-theme="default"><code data-language="jsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> { Select, Option } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span> <span class="line"> </span> <span class="line"><span style="color:#FF7B72">export</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">function</span><span style="color:#C9D1D9"> </span><span style="color:#D2A8FF">SelectSizes</span><span style="color:#C9D1D9">() {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">return</span><span style="color:#C9D1D9"> (</span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">className</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"flex w-72 flex-col gap-6"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">size</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"md"</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">size</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"lg"</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> );</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div></div></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-colors" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-colors" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Select Colors</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">The <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component comes with 19 different colors that you can change it using the <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">color</code> prop.</p> <div class="scroll-mt-64 overflow-hidden rounded-xl border border-blue-gray-50 bg-white "><div class="flex items-center justify-between border-b border-blue-gray-50 p-1 "><div class="flex w-full items-center justify-end gap-2"><button type="button" class="relative align-middle select-none font-sans font-medium text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none w-8 max-w-[32px] h-8 max-h-[32px] rounded-lg text-xs text-blue-gray-500 hover:bg-blue-gray-500/10 active:bg-blue-gray-500/30 hover:text-blue-gray-900"><span class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-5 w-5"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25ZM6.75 12h.008v.008H6.75V12Zm0 3h.008v.008H6.75V15Zm0 3h.008v.008H6.75V18Z"></path></svg></span></button></div></div><div class="grid min-h-[140px] w-full place-items-center overflow-x-scroll rounded-lg p-6 lg:overflow-visible"><div class="flex w-72 flex-col gap-6"><div class="relative w-full min-w-[200px] h-10"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-2.5 rounded-[7px] border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[3.75] text-blue-gray-400 before:border-transparent after:border-transparent">Select Version</label></div><div class="relative w-full min-w-[200px] h-10"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-2.5 rounded-[7px] border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[3.75] text-blue-gray-400 before:border-transparent after:border-transparent">Select Version</label></div><div class="relative w-full min-w-[200px] h-10"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-2.5 rounded-[7px] border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[3.75] text-blue-gray-400 before:border-transparent after:border-transparent">Select Version</label></div></div></div><div class="code-preview block max-h-[40rem] overflow-scroll rounded-b-xl"><div data-rehype-pretty-code-fragment=""><pre data-language="jsx" data-theme="default"><code data-language="jsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> { Select, Option } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span> <span class="line"> </span> <span class="line"><span style="color:#FF7B72">export</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">function</span><span style="color:#C9D1D9"> </span><span style="color:#D2A8FF">SelectColors</span><span style="color:#C9D1D9">() {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">return</span><span style="color:#C9D1D9"> (</span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">className</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"flex w-72 flex-col gap-6"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">color</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"blue"</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">color</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"purple"</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">color</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"teal"</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> );</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div></div></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-validations" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-validations" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Select Validations</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">The <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component comes with error and success states for performing validations.</p> <div id="select-validations" class="scroll-mt-64 overflow-hidden rounded-xl border border-blue-gray-50 bg-white "><div class="flex items-center justify-between border-b border-blue-gray-50 p-1 "><div class="flex w-full items-center justify-end gap-2"><button type="button" class="relative align-middle select-none font-sans font-medium text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none w-8 max-w-[32px] h-8 max-h-[32px] rounded-lg text-xs text-blue-gray-500 hover:bg-blue-gray-500/10 active:bg-blue-gray-500/30 hover:text-blue-gray-900"><span class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-5 w-5"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25ZM6.75 12h.008v.008H6.75V12Zm0 3h.008v.008H6.75V15Zm0 3h.008v.008H6.75V18Z"></path></svg></span></button></div></div><div class="grid min-h-[140px] w-full place-items-center overflow-x-scroll rounded-lg p-6 lg:overflow-visible"><div class="flex w-72 flex-col gap-6"><div class="relative w-full min-w-[200px] h-10"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-2.5 rounded-[7px] border-red-500" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[3.75] text-red-500 before:border-red-500 after:border-red-500">Select Version</label></div><div class="relative w-full min-w-[200px] h-10"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-2.5 rounded-[7px] border-green-500" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[3.75] text-green-500 before:border-green-500 after:border-green-500">Select Version</label></div></div></div><div class="code-preview block max-h-[40rem] overflow-scroll rounded-b-xl"><div data-rehype-pretty-code-fragment=""><pre data-language="jsx" data-theme="default"><code data-language="jsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> { Select, Option } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span> <span class="line"> </span> <span class="line"><span style="color:#FF7B72">export</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">function</span><span style="color:#C9D1D9"> </span><span style="color:#D2A8FF">SelectValidations</span><span style="color:#C9D1D9">() {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">return</span><span style="color:#C9D1D9"> (</span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">className</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"flex w-72 flex-col gap-6"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">error</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">success</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> );</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div></div></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="controlled-select" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#controlled-select" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Controlled Select</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">You can make the <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component to be controlled using the <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">value</code> and <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">onChange</code> props.</p> <div id="controlled-select" class="scroll-mt-64 overflow-hidden rounded-xl border border-blue-gray-50 bg-white "><div class="flex items-center justify-between border-b border-blue-gray-50 p-1 "><div class="flex w-full items-center justify-end gap-2"><button type="button" class="relative align-middle select-none font-sans font-medium text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none w-8 max-w-[32px] h-8 max-h-[32px] rounded-lg text-xs text-blue-gray-500 hover:bg-blue-gray-500/10 active:bg-blue-gray-500/30 hover:text-blue-gray-900"><span class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-5 w-5"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25ZM6.75 12h.008v.008H6.75V12Zm0 3h.008v.008H6.75V15Zm0 3h.008v.008H6.75V18Z"></path></svg></span></button></div></div><div class="grid min-h-[140px] w-full place-items-center overflow-x-scroll rounded-lg p-6 lg:overflow-visible"><div class="w-72"><div class="relative w-full min-w-[200px] h-10"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-2.5 rounded-[7px] border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[3.75] text-blue-gray-400 before:border-transparent after:border-transparent">Select Version</label></div></div></div><div class="code-preview block max-h-[40rem] overflow-scroll rounded-b-xl"><div data-rehype-pretty-code-fragment=""><pre data-language="jsx" data-theme="default"><code data-language="jsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> React </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"react"</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> { Select, Option } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span> <span class="line"> </span> <span class="line"><span style="color:#FF7B72">export</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">function</span><span style="color:#C9D1D9"> </span><span style="color:#D2A8FF">ControlledSelect</span><span style="color:#C9D1D9">() {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">const</span><span style="color:#C9D1D9"> [</span><span style="color:#79C0FF">value</span><span style="color:#C9D1D9">, </span><span style="color:#79C0FF">setValue</span><span style="color:#C9D1D9">] </span><span style="color:#FF7B72">=</span><span style="color:#C9D1D9"> React.</span><span style="color:#D2A8FF">useState</span><span style="color:#C9D1D9">(</span><span style="color:#A5D6FF">"react"</span><span style="color:#C9D1D9">);</span></span> <span class="line"> </span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">return</span><span style="color:#C9D1D9"> (</span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">className</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"w-72"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">value</span><span style="color:#FF7B72">={</span><span style="color:#C9D1D9">value</span><span style="color:#FF7B72">}</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">onChange</span><span style="color:#FF7B72">={</span><span style="color:#C9D1D9">(</span><span style="color:#FFA657">val</span><span style="color:#C9D1D9">) </span><span style="color:#FF7B72">=></span><span style="color:#C9D1D9"> </span><span style="color:#D2A8FF">setValue</span><span style="color:#C9D1D9">(val)</span><span style="color:#FF7B72">}</span></span> <span class="line"><span style="color:#C9D1D9"> ></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">value</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"html"</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">value</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"react"</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">value</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"vue"</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">value</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"angular"</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">value</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"svelte"</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> );</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div></div></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-custom-animation" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-custom-animation" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Select Custom Animation</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">You can modify the open/close state animation for <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component using the <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">animate</code> prop.</p> <div class="scroll-mt-64 overflow-hidden rounded-xl border border-blue-gray-50 bg-white "><div class="flex items-center justify-between border-b border-blue-gray-50 p-1 "><div class="flex w-full items-center justify-end gap-2"><button type="button" class="relative align-middle select-none font-sans font-medium text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none w-8 max-w-[32px] h-8 max-h-[32px] rounded-lg text-xs text-blue-gray-500 hover:bg-blue-gray-500/10 active:bg-blue-gray-500/30 hover:text-blue-gray-900"><span class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-5 w-5"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25ZM6.75 12h.008v.008H6.75V12Zm0 3h.008v.008H6.75V15Zm0 3h.008v.008H6.75V18Z"></path></svg></span></button></div></div><div class="grid min-h-[140px] w-full place-items-center overflow-x-scroll rounded-lg p-6 lg:overflow-visible"><div class="w-72"><div class="relative w-full min-w-[200px] h-10"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-2.5 rounded-[7px] border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[3.75] text-blue-gray-400 before:border-transparent after:border-transparent">Select Version</label></div></div></div><div class="code-preview block max-h-[40rem] overflow-scroll rounded-b-xl"><div data-rehype-pretty-code-fragment=""><pre data-language="jsx" data-theme="default"><code data-language="jsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> { Select, Option } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span> <span class="line"> </span> <span class="line"><span style="color:#FF7B72">export</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">function</span><span style="color:#C9D1D9"> </span><span style="color:#D2A8FF">SelectCustomAnimation</span><span style="color:#C9D1D9">() {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">return</span><span style="color:#C9D1D9"> (</span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">className</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"w-72"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">animate</span><span style="color:#FF7B72">={</span><span style="color:#C9D1D9">{</span></span> <span class="line"><span style="color:#C9D1D9"> mount: { y: </span><span style="color:#79C0FF">0</span><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> unmount: { y: </span><span style="color:#79C0FF">25</span><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> }</span><span style="color:#FF7B72">}</span></span> <span class="line"><span style="color:#C9D1D9"> ></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> );</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div></div></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-disabled" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-disabled" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Select Disabled</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">A <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> could be disabled as well, it will help you to prevent user interactions like click or focus over the <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component.</p> <div class="scroll-mt-64 overflow-hidden rounded-xl border border-blue-gray-50 bg-white "><div class="flex items-center justify-between border-b border-blue-gray-50 p-1 "><div class="flex w-full items-center justify-end gap-2"><button type="button" class="relative align-middle select-none font-sans font-medium text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none w-8 max-w-[32px] h-8 max-h-[32px] rounded-lg text-xs text-blue-gray-500 hover:bg-blue-gray-500/10 active:bg-blue-gray-500/30 hover:text-blue-gray-900"><span class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-5 w-5"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25ZM6.75 12h.008v.008H6.75V12Zm0 3h.008v.008H6.75V15Zm0 3h.008v.008H6.75V18Z"></path></svg></span></button></div></div><div class="grid min-h-[140px] w-full place-items-center overflow-x-scroll rounded-lg p-6 lg:overflow-visible"><div class="w-72"><div class="relative w-full min-w-[200px] h-10"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-2.5 rounded-[7px] border-blue-gray-200" disabled="" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[3.75] text-blue-gray-400 before:border-transparent after:border-transparent">Select Version</label></div></div></div><div class="code-preview block max-h-[40rem] overflow-scroll rounded-b-xl"><div data-rehype-pretty-code-fragment=""><pre data-language="jsx" data-theme="default"><code data-language="jsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> { Select, Option } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span> <span class="line"> </span> <span class="line"><span style="color:#FF7B72">export</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">function</span><span style="color:#C9D1D9"> </span><span style="color:#D2A8FF">SelectDisabled</span><span style="color:#C9D1D9">() {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">return</span><span style="color:#C9D1D9"> (</span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">className</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"w-72"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Version"</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">disabled</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind HTML</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind React</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Vue</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Angular</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">>Material Tailwind Svelte</</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> );</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div></div></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="countries-select" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#countries-select" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Countries Select</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">See the example below to see how you can create a <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component with a list of countries.</p> <br/> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">This example is using <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm"><a href="https://www.npmjs.com/package/use-react-countries" target="_blank">use-react-countries</a></code> make sure you have installed it.</p> <div data-rehype-pretty-code-fragment=""><pre data-language="bash" data-theme="default"><code data-language="bash" data-theme="default"><span class="line"><span style="color:#C9D1D9">npm i use-react-countries</span></span></code></pre></div> <br/> <div class="scroll-mt-64 overflow-hidden rounded-xl border border-blue-gray-50 bg-white "><div class="flex items-center justify-between border-b border-blue-gray-50 p-1 "><div class="flex w-full items-center justify-end gap-2"><button type="button" class="relative align-middle select-none font-sans font-medium text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none w-8 max-w-[32px] h-8 max-h-[32px] rounded-lg text-xs text-blue-gray-500 hover:bg-blue-gray-500/10 active:bg-blue-gray-500/30 hover:text-blue-gray-900"><span class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-5 w-5"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25ZM6.75 12h.008v.008H6.75V12Zm0 3h.008v.008H6.75V15Zm0 3h.008v.008H6.75V18Z"></path></svg></span></button></div></div><div class="grid min-h-[140px] w-full place-items-center overflow-x-scroll rounded-lg p-6 lg:overflow-visible"><div class="w-72"><div class="relative w-full min-w-[200px] h-11"><button type="button" class="peer w-full h-full bg-transparent text-blue-gray-700 font-sans font-normal text-left outline outline-0 focus:outline-0 disabled:bg-blue-gray-50 disabled:border-0 disabled:cursor-not-allowed transition-all border text-sm px-3 py-3 rounded-[7px] border-blue-gray-200" aria-expanded="false" aria-haspopup="listbox" role="combobox"><span class="absolute top-2/4 -translate-y-2/4 left-3 pt-0.5"></span><div class="grid place-items-center absolute top-2/4 right-2 pt-px w-5 h-5 text-blue-gray-400 rotate-0 -translate-y-2/4 transition-all"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></div></button><label class="flex w-full h-full select-none pointer-events-none absolute left-0 font-normal transition-all -top-1.5 before:content[' '] before:block before:box-border before:w-2.5 before:h-1.5 before:mt-[6.5px] before:mr-1 before:rounded-tl-md before:pointer-events-none before:transition-all peer-disabled:before:border-transparent after:content[' '] after:block after:flex-grow after:box-border after:w-2.5 after:h-1.5 after:mt-[6.5px] after:ml-1 after:rounded-tr-md after:pointer-events-none after:transition-all peer-disabled:after:border-transparent text-sm peer-disabled:text-blue-gray-400 leading-[4.1] text-blue-gray-400 before:border-transparent after:border-transparent">Select Country</label></div></div></div><div class="code-preview block max-h-[40rem] overflow-scroll rounded-b-xl"><div data-rehype-pretty-code-fragment=""><pre data-language="jsx" data-theme="default"><code data-language="jsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> React </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"react"</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> { useCountries } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"use-react-countries"</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> { Select, Option } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span> <span class="line"> </span> <span class="line"><span style="color:#FF7B72">export</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">function</span><span style="color:#C9D1D9"> </span><span style="color:#D2A8FF">CountriesSelect</span><span style="color:#C9D1D9">() {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">const</span><span style="color:#C9D1D9"> { </span><span style="color:#79C0FF">countries</span><span style="color:#C9D1D9"> } </span><span style="color:#FF7B72">=</span><span style="color:#C9D1D9"> </span><span style="color:#D2A8FF">useCountries</span><span style="color:#C9D1D9">();</span></span> <span class="line"> </span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">return</span><span style="color:#C9D1D9"> (</span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">className</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"w-72"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Select</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">size</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"lg"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">label</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"Select Country"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">selected</span><span style="color:#FF7B72">={</span><span style="color:#C9D1D9">(</span><span style="color:#FFA657">element</span><span style="color:#C9D1D9">) </span><span style="color:#FF7B72">=></span></span> <span class="line"><span style="color:#C9D1D9"> element </span><span style="color:#FF7B72">&&</span></span> <span class="line"><span style="color:#C9D1D9"> React.</span><span style="color:#D2A8FF">cloneElement</span><span style="color:#C9D1D9">(element, {</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#79C0FF">true</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> className:</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"flex items-center opacity-100 px-0 gap-2 pointer-events-none"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> })</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">}</span></span> <span class="line"><span style="color:#C9D1D9"> ></span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">{</span><span style="color:#C9D1D9">countries.</span><span style="color:#D2A8FF">map</span><span style="color:#C9D1D9">(({ </span><span style="color:#FFA657">name</span><span style="color:#C9D1D9">, </span><span style="color:#FFA657">flags</span><span style="color:#C9D1D9"> }) </span><span style="color:#FF7B72">=></span><span style="color:#C9D1D9"> (</span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">key</span><span style="color:#FF7B72">={</span><span style="color:#C9D1D9">name</span><span style="color:#FF7B72">}</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">value</span><span style="color:#FF7B72">={</span><span style="color:#C9D1D9">name</span><span style="color:#FF7B72">}</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">className</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"flex items-center gap-2"</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> <</span><span style="color:#7EE787">img</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">src</span><span style="color:#FF7B72">={</span><span style="color:#C9D1D9">flags.svg</span><span style="color:#FF7B72">}</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">alt</span><span style="color:#FF7B72">={</span><span style="color:#C9D1D9">name</span><span style="color:#FF7B72">}</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">className</span><span style="color:#FF7B72">=</span><span style="color:#A5D6FF">"h-5 w-5 rounded-full object-cover"</span></span> <span class="line"><span style="color:#C9D1D9"> /></span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">{</span><span style="color:#C9D1D9">name</span><span style="color:#FF7B72">}</span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Option</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> ))</span><span style="color:#FF7B72">}</span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">Select</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> </</span><span style="color:#7EE787">div</span><span style="color:#C9D1D9">></span></span> <span class="line"><span style="color:#C9D1D9"> );</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div></div></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-props" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-props" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Select Props</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">The following props are available for select component. These are the custom props that we've added for the select component and you can use all the other native props as well.</p> <div class="!overflow-scroll"><table class="!w-full !min-w-[700px] lg:!min-w-full"><thead><tr><th class="min-w-[120px] border-b border-blue-gray-100 py-3 text-left font-medium text-blue-gray-900">Attribute</th><th class="min-w-[120px] border-b border-blue-gray-100 py-3 text-left font-medium text-blue-gray-900">Type</th><th class="min-w-[120px] border-b border-blue-gray-100 py-3 text-left font-medium text-blue-gray-900">Description</th><th class="min-w-[120px] border-b border-blue-gray-100 py-3 text-left font-medium text-blue-gray-900">Default</th></tr></thead><tbody><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>variant</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><a class="!font-medium !text-primary !transition-colors hover:!text-blue-500" href="#types-variant">Variant</a></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Change select variant</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">outlined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>size</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><a class="!font-medium !text-primary !transition-colors hover:!text-blue-500" href="#types-size">Size</a></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Change select size</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">md</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>color</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><a class="!font-medium !text-primary !transition-colors hover:!text-blue-500" href="#types-color">Color</a></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Change select color</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">gray</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>label</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">string</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Add label for select</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>''</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>error</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">boolean</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Change select state to error</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">false</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>success</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">boolean</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Change select state to success</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">false</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>arrow</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">node</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Change select arrow icon</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">undefined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>value</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">string</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Change selected value for select</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">undefined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>onChange</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">function</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Return selected value when select value changed</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">undefined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>selected</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">function</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Return selected element and it's index</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">undefined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>offset</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><a class="!font-medium !text-primary !transition-colors hover:!text-blue-500" href="#types-offset">Offset</a></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Change select menu offset from it's input</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">5</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>dismiss</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><a class="!font-medium !text-primary !transition-colors hover:!text-blue-500" href="#types-dismiss">Dismiss</a></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Change dismiss listeners when clicking outside</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">undefined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>animate</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><a class="!font-medium !text-primary !transition-colors hover:!text-blue-500" href="#types-animate">Animate</a></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Change select menu animation</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">undefined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>lockScroll</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">boolean</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Lock page scrolling when select menu is opened</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">false</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>containerProps</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">object</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Add custom props for select container</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">undefined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>labelProps</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">object</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Add custom props for select label</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">undefined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>menuProps</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">object</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Add custom props for select menu</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">undefined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>disabled</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">boolean</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Disable select</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">false</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>name</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">string</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Add name for select</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">false</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>className</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">string</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Add custom className for select</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>''</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>children</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">node</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Add content for select</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">No default value it's a required prop.</td></tr></tbody></table></div> <br/> <br/> <h3 class="block antialiased tracking-normal font-sans text-xl font-semibold leading-snug !mb-2 text-primary">For TypeScript Only</h3> <div data-rehype-pretty-code-fragment=""><pre data-language="tsx" data-theme="default"><code data-language="tsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> { SelectProps } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-option-props" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-option-props" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Select Option Props</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">The following props are available for select option component. These are the custom props that we've added for the select option component and you can use all the other native props as well.</p> <div class="!overflow-scroll"><table class="!w-full !min-w-[700px] lg:!min-w-full"><thead><tr><th class="min-w-[120px] border-b border-blue-gray-100 py-3 text-left font-medium text-blue-gray-900">Attribute</th><th class="min-w-[120px] border-b border-blue-gray-100 py-3 text-left font-medium text-blue-gray-900">Type</th><th class="min-w-[120px] border-b border-blue-gray-100 py-3 text-left font-medium text-blue-gray-900">Description</th><th class="min-w-[120px] border-b border-blue-gray-100 py-3 text-left font-medium text-blue-gray-900">Default</th></tr></thead><tbody><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>value</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">string</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Add select option value, it works together with value props of select</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">undefined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>index</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">number</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Add select option value</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">undefined</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>disabled</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">boolean</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Disable select option</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">false</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>className</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">string</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Add custom className for select option</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>''</code></td></tr><tr><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code>children</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500"><code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">node</code></td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">Add content for select option</td><td class="min-w-[120px] border-b border-blue-gray-50 py-3 text-left text-sm text-blue-gray-500">No default value it's a required prop.</td></tr></tbody></table></div> <br/> <br/> <h3 class="block antialiased tracking-normal font-sans text-xl font-semibold leading-snug !mb-2 text-primary">For TypeScript Only</h3> <div data-rehype-pretty-code-fragment=""><pre data-language="tsx" data-theme="default"><code data-language="tsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> { SelectOptionProps } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="types-variant" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#types-variant" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Types - Variant</h2></div> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">variant</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">=</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"standard"</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"outlined"</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"static"</span><span style="color:#C9D1D9">;</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="types-size" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#types-size" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Types - Size</h2></div> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">size</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">=</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"md"</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"lg"</span><span style="color:#C9D1D9">;</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="types-color" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#types-color" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Types - Color</h2></div> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">color</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">=</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"blue-gray"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"gray"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"brown"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-orange"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"orange"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"amber"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"yellow"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"lime"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-green"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"green"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"teal"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"cyan"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-blue"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"blue"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"indigo"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-purple"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"purple"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"pink"</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"red"</span><span style="color:#C9D1D9">;</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="types-offset" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#types-offset" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Types - Offset</h2></div> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">offset</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">=</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">number</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">mainAxis</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">number</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">crossAxis</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">number</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">alignmentAxis</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">number</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">null</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="types-dismiss" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#types-dismiss" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Types - Dismiss</h2></div> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">dismissType</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">=</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">enabled</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">escapeKey</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">referencePress</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">referencePressEvent</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'pointerdown'</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'mousedown'</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'click'</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">outsidePress</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> ((</span><span style="color:#FFA657">event</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">MouseEvent</span><span style="color:#C9D1D9">) </span><span style="color:#FF7B72">=></span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">);</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">outsidePressEvent</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'pointerdown'</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'mousedown'</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'click'</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">ancestorScroll</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">bubbles</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">escapeKey</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">outsidePress</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9">};</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="types-animate" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#types-animate" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Types - Animate</h2></div> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">animate</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">=</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">mount</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">unmount</span><span style="color:#FF7B72">?:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9">};</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-theme" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-theme" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Select Theme</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">Learn how to customize the theme and styles for select components, the theme object for select components has three main objects:</p> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600"><strong>A.</strong> The <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">defaultProps</code> object for setting up the default value for props of select components.<br/> <strong>B.</strong> The <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">valid</code> object for customizing the valid values for select components props.<br/> <strong>C.</strong> The <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">styles</code> object for customizing the theme and styles of select components.<br/></p> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">You can customize the theme and styles of select components by adding Tailwind CSS classes as key paired values for objects.</p> <br/> <br/> <div id="select-theme-object-type" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-theme-object-type" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Select Theme Object Type</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">Variant of <code class="rounded-md px-1 font-['Fira_Code'] font-normal bg-gray-900/[0.1] text-gray-900 text-sm">Select</code> component theme has a specific type of <a href="#select-variant-object-type" class="font-medium hover:text-blue-500 transition-colors">Select Variant Styles Type</a></p> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">interface</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectStylesType</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">defaultProps</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">variant</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">string</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">color</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">string</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">size</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">string</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">label</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">string</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">error</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">success</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">arrow</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">node</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">value</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">string</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">onChange</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">func</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">selected</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">func</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">offset</span><span style="color:#FF7B72">:</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">number</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">mainAxis</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">number</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">crossAxis</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">number</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">alignmentAxis</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">number</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">dismiss</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">enabled</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">escapeKey</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">referencePress</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">referencePressEvent</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'pointerdown'</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'mousedown'</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'click'</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">outsidePress</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> ((</span><span style="color:#FFA657">event</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">MouseEvent</span><span style="color:#C9D1D9">) </span><span style="color:#FF7B72">=></span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">);</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">outsidePressEvent</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'pointerdown'</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'mousedown'</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">'click'</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">ancestorScroll</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">bubbles</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">|</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">escapeKey</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">outsidePress</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">animate</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">mount</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">unmount</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">autoHeight</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">lockScroll</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">labelProps</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">menuProps</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">className</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">string</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">disabled</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">boolean</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">valid</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">variants</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">string</span><span style="color:#C9D1D9">[];</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">sizes</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">string</span><span style="color:#C9D1D9">[];</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">colors</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">string</span><span style="color:#C9D1D9">[];</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">styles</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">base</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">container</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">select</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">arrow</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">initial</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">active</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">label</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">menu</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">option</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">initial</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">active</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">disabled</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">variants</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">outlined</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectVariantStylesType</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">standard</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectVariantStylesType</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">static</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectVariantStylesType</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div> <br/> <br/> <h3 class="block antialiased tracking-normal font-sans text-xl font-semibold leading-snug !mb-2 text-primary">For TypeScript Only</h3> <div data-rehype-pretty-code-fragment=""><pre data-language="tsx" data-theme="default"><code data-language="tsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> { SelectStylesType } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-variant-object-type" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-variant-object-type" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Theme Object Type - Select Variant</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">Select variant object type contains three specific types of <a href="#select-size-object-type" class="font-medium hover:text-blue-500 transition-colors">Select Size Styles Type</a>, <a href="#select-states-object-type" class="font-medium hover:text-blue-500 transition-colors">Select States Styles Type</a> and <a href="#select-state-object-type" class="font-medium hover:text-blue-500 transition-colors">Select State Styles Type</a></p> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">interface</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectVariantStylesType</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">base</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">select</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">label</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">sizes</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">md</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectSizeStylesType</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">lg</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectSizeStylesType</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">colors</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">select</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">label</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">states</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectStatesStylesType</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">error</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectStateStylesType</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">success</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectStateStylesType</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div> <br/> <br/> <h3 class="block antialiased tracking-normal font-sans text-xl font-semibold leading-snug !mb-2 text-primary">For TypeScript Only</h3> <div data-rehype-pretty-code-fragment=""><pre data-language="tsx" data-theme="default"><code data-language="tsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> { SelectVariantStylesType } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-size-object-type" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-size-object-type" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Theme Object Type - Select Size</h2></div> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">interface</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectSizeStylesType</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">container</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">select</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">label</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">initial</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">states</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">close</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">open</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">withValue</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div> <br/> <br/> <h3 class="block antialiased tracking-normal font-sans text-xl font-semibold leading-snug !mb-2 text-primary">For TypeScript Only</h3> <div data-rehype-pretty-code-fragment=""><pre data-language="tsx" data-theme="default"><code data-language="tsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> { SelectSizeStylesType } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-states-object-type" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-states-object-type" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Theme Object Type - Select States</h2></div> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">interface</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectStatesStylesType</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">close</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">select</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">label</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">open</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">select</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">label</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">withValue</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">select</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">label</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div> <br/> <br/> <h3 class="block antialiased tracking-normal font-sans text-xl font-semibold leading-snug !mb-2 text-primary">For TypeScript Only</h3> <div data-rehype-pretty-code-fragment=""><pre data-language="tsx" data-theme="default"><code data-language="tsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> { SelectStatesStylesType } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-state-object-type" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-state-object-type" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Theme Object Type - Select State</h2></div> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">interface</span><span style="color:#C9D1D9"> </span><span style="color:#FFA657">SelectStateStylesType</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">select</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">initial</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">states</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">close</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">open</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">withValue</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">label</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">initial</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">states</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">close</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">open</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#FFA657">withValue</span><span style="color:#FF7B72">:</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">object</span><span style="color:#C9D1D9">;</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9"> };</span></span> <span class="line"><span style="color:#C9D1D9">}</span></span></code></pre></div> <br/> <br/> <h3 class="block antialiased tracking-normal font-sans text-xl font-semibold leading-snug !mb-2 text-primary">For TypeScript Only</h3> <div data-rehype-pretty-code-fragment=""><pre data-language="tsx" data-theme="default"><code data-language="tsx" data-theme="default"><span class="line"><span style="color:#FF7B72">import</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">type</span><span style="color:#C9D1D9"> { SelectStateStylesType } </span><span style="color:#FF7B72">from</span><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"@material-tailwind/react"</span><span style="color:#C9D1D9">;</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="select-theme-customization" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#select-theme-customization" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Select Theme Customization</h2></div> <div data-rehype-pretty-code-fragment=""><pre data-language="ts" data-theme="default"><code data-language="ts" data-theme="default"><span class="line"><span style="color:#FF7B72">const</span><span style="color:#C9D1D9"> </span><span style="color:#79C0FF">theme</span><span style="color:#C9D1D9"> </span><span style="color:#FF7B72">=</span><span style="color:#C9D1D9"> {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> defaultProps: {</span></span> <span class="line"><span style="color:#C9D1D9"> variant: </span><span style="color:#A5D6FF">"outlined"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"blue"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> size: </span><span style="color:#A5D6FF">"md"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> label: </span><span style="color:#A5D6FF">""</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> error: </span><span style="color:#79C0FF">false</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> success: </span><span style="color:#79C0FF">false</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> arrow: </span><span style="color:#79C0FF">undefined</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> value: </span><span style="color:#79C0FF">undefined</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> onChange: </span><span style="color:#79C0FF">undefined</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> selected: </span><span style="color:#79C0FF">undefined</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> offset: </span><span style="color:#79C0FF">5</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> dismiss: {},</span></span> <span class="line"><span style="color:#C9D1D9"> animate: {</span></span> <span class="line"><span style="color:#C9D1D9"> unmount: {},</span></span> <span class="line"><span style="color:#C9D1D9"> mount: {},</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> autoHeight: </span><span style="color:#79C0FF">false</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> lockScroll: </span><span style="color:#79C0FF">false</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> labelProps: {},</span></span> <span class="line"><span style="color:#C9D1D9"> menuProps: {},</span></span> <span class="line"><span style="color:#C9D1D9"> className: </span><span style="color:#A5D6FF">""</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#79C0FF">false</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> containerProps: </span><span style="color:#79C0FF">undefined</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> valid: {</span></span> <span class="line"><span style="color:#C9D1D9"> variants: [</span><span style="color:#A5D6FF">"standard"</span><span style="color:#C9D1D9">, </span><span style="color:#A5D6FF">"outlined"</span><span style="color:#C9D1D9">, </span><span style="color:#A5D6FF">"static"</span><span style="color:#C9D1D9">],</span></span> <span class="line"><span style="color:#C9D1D9"> sizes: [</span><span style="color:#A5D6FF">"md"</span><span style="color:#C9D1D9">, </span><span style="color:#A5D6FF">"lg"</span><span style="color:#C9D1D9">],</span></span> <span class="line"><span style="color:#C9D1D9"> colors: [</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"blue-gray"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"gray"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"brown"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-orange"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"orange"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"amber"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"yellow"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"lime"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-green"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"green"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"teal"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"cyan"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-blue"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"blue"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"indigo"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-purple"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"purple"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"pink"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"red"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> ],</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> styles: {</span></span> <span class="line"><span style="color:#C9D1D9"> base: {</span></span> <span class="line"><span style="color:#C9D1D9"> container: {</span></span> <span class="line"><span style="color:#C9D1D9"> position: </span><span style="color:#A5D6FF">"relative"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> width: </span><span style="color:#A5D6FF">"w-full"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> minWidth: </span><span style="color:#A5D6FF">"min-w-[200px]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> peer: </span><span style="color:#A5D6FF">"peer"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> width: </span><span style="color:#A5D6FF">"w-full"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> height: </span><span style="color:#A5D6FF">"h-full"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> bg: </span><span style="color:#A5D6FF">"bg-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-700"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> fontFamily: </span><span style="color:#A5D6FF">"font-sans"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> fontWeight: </span><span style="color:#A5D6FF">"font-normal"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> textAlign: </span><span style="color:#A5D6FF">"text-left"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> outline: </span><span style="color:#A5D6FF">"outline outline-0 focus:outline-0"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"disabled:bg-blue-gray-50 disabled:border-0"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> transition: </span><span style="color:#A5D6FF">"transition-all"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> arrow: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {</span></span> <span class="line"><span style="color:#C9D1D9"> display: </span><span style="color:#A5D6FF">"grid"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> placeItems: </span><span style="color:#A5D6FF">"place-items-center"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> position: </span><span style="color:#A5D6FF">"absolute"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> top: </span><span style="color:#A5D6FF">"top-2/4"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> right: </span><span style="color:#A5D6FF">"right-2"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pt: </span><span style="color:#A5D6FF">"pt-px"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> width: </span><span style="color:#A5D6FF">"w-5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> height: </span><span style="color:#A5D6FF">"h-5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> transform: </span><span style="color:#A5D6FF">"rotate-0 -translate-y-2/4"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> transition: </span><span style="color:#A5D6FF">"transition-all"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> active: {</span></span> <span class="line"><span style="color:#C9D1D9"> transform: </span><span style="color:#A5D6FF">"rotate-180"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> mt: </span><span style="color:#A5D6FF">"mt-px"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> display: </span><span style="color:#A5D6FF">"flex"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> width: </span><span style="color:#A5D6FF">"w-full"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> height: </span><span style="color:#A5D6FF">"h-full"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> userSelect: </span><span style="color:#A5D6FF">"select-none"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pointerEvents: </span><span style="color:#A5D6FF">"pointer-events-none"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> position: </span><span style="color:#A5D6FF">"absolute"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> left: </span><span style="color:#A5D6FF">"left-0"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> fontWeight: </span><span style="color:#A5D6FF">"font-normal"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> transition: </span><span style="color:#A5D6FF">"transition-all"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> menu: {</span></span> <span class="line"><span style="color:#C9D1D9"> width: </span><span style="color:#A5D6FF">"w-full"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> maxHeight: </span><span style="color:#A5D6FF">"max-h-96"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> bg: </span><span style="color:#A5D6FF">"bg-white"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> p: </span><span style="color:#A5D6FF">"p-3"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> border: </span><span style="color:#A5D6FF">"border border-blue-gray-50"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderRadius: </span><span style="color:#A5D6FF">"rounded-md"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> boxShadow: </span><span style="color:#A5D6FF">"shadow-lg shadow-blue-gray-500/10"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> fontFamily: </span><span style="color:#A5D6FF">"font-sans"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> fontWeight: </span><span style="color:#A5D6FF">"font-normal"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> overflow: </span><span style="color:#A5D6FF">"overflow-auto"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> outline: </span><span style="color:#A5D6FF">"focus:outline-none"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> option: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {</span></span> <span class="line"><span style="color:#C9D1D9"> pt: </span><span style="color:#A5D6FF">"pt-[9px]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pb: </span><span style="color:#A5D6FF">"pb-2"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> px: </span><span style="color:#A5D6FF">"px-3"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderRadius: </span><span style="color:#A5D6FF">"rounded-md"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> lightHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> cursor: </span><span style="color:#A5D6FF">"cursor-pointer"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> userSelect: </span><span style="color:#A5D6FF">"select-none"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> background: </span><span style="color:#A5D6FF">"hover:bg-blue-gray-50 focus:bg-blue-gray-50"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> opacity: </span><span style="color:#A5D6FF">"hover:bg-opacity-80 focus:bg-opacity-80"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"hover:text-blue-gray-900 focus:text-blue-gray-900"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> outline: </span><span style="color:#A5D6FF">"outline outline-0"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> transition: </span><span style="color:#A5D6FF">"transition-all"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> active: {</span></span> <span class="line"><span style="color:#C9D1D9"> bg: </span><span style="color:#A5D6FF">"bg-blue-gray-50 bg-opacity-80"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-900"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: {</span></span> <span class="line"><span style="color:#C9D1D9"> opacity: </span><span style="color:#A5D6FF">"opacity-50"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> cursor: </span><span style="color:#A5D6FF">"cursor-not-allowed"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> userSelect: </span><span style="color:#A5D6FF">"select-none"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pointerEvents: </span><span style="color:#A5D6FF">"pointer-events-none"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> variants: {</span></span> <span class="line"><span style="color:#C9D1D9"> outlined: {</span></span> <span class="line"><span style="color:#C9D1D9"> base: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {},</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> position: </span><span style="color:#A5D6FF">"-top-1.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: {</span></span> <span class="line"><span style="color:#C9D1D9"> content: </span><span style="color:#A5D6FF">"before:content[' ']"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> display: </span><span style="color:#A5D6FF">"before:block"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> boxSizing: </span><span style="color:#A5D6FF">"before:box-border"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> width: </span><span style="color:#A5D6FF">"before:w-2.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> height: </span><span style="color:#A5D6FF">"before:h-1.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> mt: </span><span style="color:#A5D6FF">"before:mt-[6.5px]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> mr: </span><span style="color:#A5D6FF">"before:mr-1"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderRadius: </span><span style="color:#A5D6FF">"before:rounded-tl-md"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pointerEvents: </span><span style="color:#A5D6FF">"before:pointer-events-none"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> transition: </span><span style="color:#A5D6FF">"before:transition-all"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"peer-disabled:before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> content: </span><span style="color:#A5D6FF">"after:content[' ']"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> display: </span><span style="color:#A5D6FF">"after:block"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> flexGrow: </span><span style="color:#A5D6FF">"after:flex-grow"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> boxSizing: </span><span style="color:#A5D6FF">"after:box-border"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> width: </span><span style="color:#A5D6FF">"after:w-2.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> height: </span><span style="color:#A5D6FF">"after:h-1.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> mt: </span><span style="color:#A5D6FF">"after:mt-[6.5px]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> ml: </span><span style="color:#A5D6FF">"after:ml-1"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderRadius: </span><span style="color:#A5D6FF">"after:rounded-tr-md"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pointerEvents: </span><span style="color:#A5D6FF">"after:pointer-events-none"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> transition: </span><span style="color:#A5D6FF">"after:transition-all"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"peer-disabled:after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> sizes: {</span></span> <span class="line"><span style="color:#C9D1D9"> md: {</span></span> <span class="line"><span style="color:#C9D1D9"> container: {</span></span> <span class="line"><span style="color:#C9D1D9"> height: </span><span style="color:#A5D6FF">"h-10"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> px: </span><span style="color:#A5D6FF">"px-3"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> py: </span><span style="color:#A5D6FF">"py-2.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderRadius: </span><span style="color:#A5D6FF">"rounded-[7px]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-[3.75]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> lg: {</span></span> <span class="line"><span style="color:#C9D1D9"> container: {</span></span> <span class="line"><span style="color:#C9D1D9"> height: </span><span style="color:#A5D6FF">"h-11"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> px: </span><span style="color:#A5D6FF">"px-3"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> py: </span><span style="color:#A5D6FF">"py-3"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderRadius: </span><span style="color:#A5D6FF">"rounded-[7px]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-[4.1]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> colors: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"blue-gray"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> gray: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> brown: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-orange"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> orange: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> amber: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> yellow: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> lime: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-green"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> green: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> teal: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> cyan: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-blue"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> blue: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> indigo: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-purple"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> purple: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> pink: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> red: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"blue-gray"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> gray: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> brown: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-orange"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> orange: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> amber: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> yellow: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> lime: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-green"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> green: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> teal: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> cyan: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-blue"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> blue: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> indigo: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-purple"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> purple: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> pink: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> red: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderWidth: </span><span style="color:#A5D6FF">"border"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"peer-disabled:text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: {</span></span> <span class="line"><span style="color:#C9D1D9"> bt: </span><span style="color:#A5D6FF">"before:border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> bl: </span><span style="color:#A5D6FF">"before:border-l-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> bt: </span><span style="color:#A5D6FF">"after:border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> br: </span><span style="color:#A5D6FF">"after:border-r-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderWidth: </span><span style="color:#A5D6FF">"border-2"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-[11px]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"peer-disabled:text-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: {</span></span> <span class="line"><span style="color:#C9D1D9"> bt: </span><span style="color:#A5D6FF">"before:border-t-2"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> bl: </span><span style="color:#A5D6FF">"before:border-l-2"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> bt: </span><span style="color:#A5D6FF">"after:border-t-2"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> br: </span><span style="color:#A5D6FF">"after:border-r-2"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderWidth: </span><span style="color:#A5D6FF">"border"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-[11px]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"peer-disabled:text-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: {</span></span> <span class="line"><span style="color:#C9D1D9"> bt: </span><span style="color:#A5D6FF">"before:border-t"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> bl: </span><span style="color:#A5D6FF">"before:border-l"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> bt: </span><span style="color:#A5D6FF">"after:border-t"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> br: </span><span style="color:#A5D6FF">"after:border-r"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> error: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> success: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderTopColor: </span><span style="color:#A5D6FF">"border-t-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> before: </span><span style="color:#A5D6FF">"before:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> standard: {</span></span> <span class="line"><span style="color:#C9D1D9"> base: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {},</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> position: </span><span style="color:#A5D6FF">"-top-1.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> content: </span><span style="color:#A5D6FF">"after:content[' ']"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> display: </span><span style="color:#A5D6FF">"after:block"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> width: </span><span style="color:#A5D6FF">"after:w-full"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> position: </span><span style="color:#A5D6FF">"after:absolute"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> bottom: </span><span style="color:#A5D6FF">"after:-bottom-1.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> left: </span><span style="color:#A5D6FF">"left-0"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderWidth: </span><span style="color:#A5D6FF">"after:border-b-2"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> transition: </span><span style="color:#A5D6FF">"after:transition-transform after:duration-300"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> sizes: {</span></span> <span class="line"><span style="color:#C9D1D9"> md: {</span></span> <span class="line"><span style="color:#C9D1D9"> container: {</span></span> <span class="line"><span style="color:#C9D1D9"> height: </span><span style="color:#A5D6FF">"h-11"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pt: </span><span style="color:#A5D6FF">"pt-4"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pb: </span><span style="color:#A5D6FF">"pb-1.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-[4.25]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> lg: {</span></span> <span class="line"><span style="color:#C9D1D9"> container: {</span></span> <span class="line"><span style="color:#C9D1D9"> height: </span><span style="color:#A5D6FF">"h-12"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> px: </span><span style="color:#A5D6FF">"px-px"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pt: </span><span style="color:#A5D6FF">"pt-5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pb: </span><span style="color:#A5D6FF">"pb-2"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-[4.875]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> colors: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"blue-gray"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> gray: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> brown: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-orange"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> orange: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> amber: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> yellow: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> lime: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-green"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> green: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> teal: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> cyan: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-blue"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> blue: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> indigo: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-purple"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> purple: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> pink: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> red: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"blue-gray"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-50"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> gray: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> brown: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-orange"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> orange: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> amber: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> yellow: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> lime: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-green"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> green: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> teal: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> cyan: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-blue"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> blue: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> indigo: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-purple"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> purple: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> pink: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> red: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderWidth: </span><span style="color:#A5D6FF">"border-b"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"peer-disabled:text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> transform: </span><span style="color:#A5D6FF">"after:scale-x-0"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderWidth: </span><span style="color:#A5D6FF">"border-b"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-[11px]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"peer-disabled:text-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> transform: </span><span style="color:#A5D6FF">"after:scale-x-100"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderWidth: </span><span style="color:#A5D6FF">"border-b"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-[11px]"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"peer-disabled:text-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> transform: </span><span style="color:#A5D6FF">"after:scale-x-0"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> error: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> success: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> static: {</span></span> <span class="line"><span style="color:#C9D1D9"> base: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {},</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> position: </span><span style="color:#A5D6FF">"-top-2.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> content: </span><span style="color:#A5D6FF">"after:content[' ']"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> display: </span><span style="color:#A5D6FF">"after:block"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> width: </span><span style="color:#A5D6FF">"after:w-full"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> position: </span><span style="color:#A5D6FF">"after:absolute"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> bottom: </span><span style="color:#A5D6FF">"after:-bottom-2.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> left: </span><span style="color:#A5D6FF">"left-0"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> borderWidth: </span><span style="color:#A5D6FF">"after:border-b-2"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> transition: </span><span style="color:#A5D6FF">"after:transition-transform after:duration-300"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> sizes: {</span></span> <span class="line"><span style="color:#C9D1D9"> md: {</span></span> <span class="line"><span style="color:#C9D1D9"> container: {</span></span> <span class="line"><span style="color:#C9D1D9"> height: </span><span style="color:#A5D6FF">"h-11"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pt: </span><span style="color:#A5D6FF">"pt-4"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pb: </span><span style="color:#A5D6FF">"pb-1.5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> lg: {</span></span> <span class="line"><span style="color:#C9D1D9"> container: {</span></span> <span class="line"><span style="color:#C9D1D9"> height: </span><span style="color:#A5D6FF">"h-12"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> px: </span><span style="color:#A5D6FF">"px-px"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pt: </span><span style="color:#A5D6FF">"pt-5"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> pb: </span><span style="color:#A5D6FF">"pb-2"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> lineHeight: </span><span style="color:#A5D6FF">"leading-tight"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> colors: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"blue-gray"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> gray: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> brown: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-orange"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> orange: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> amber: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> yellow: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> lime: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-green"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> green: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> teal: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> cyan: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-blue"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> blue: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> indigo: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-purple"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> purple: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> pink: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> red: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-blue-gray-200"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"blue-gray"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-gray-50"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> gray: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> brown: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-brown-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-orange"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> orange: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-orange-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> amber: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-amber-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> yellow: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-yellow-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> lime: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-lime-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-green"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> green: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> teal: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-teal-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> cyan: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-cyan-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"light-blue"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-light-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> blue: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-blue-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> indigo: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-indigo-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> </span><span style="color:#A5D6FF">"deep-purple"</span><span style="color:#C9D1D9">: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-deep-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> purple: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-purple-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> pink: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-pink-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> red: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-blue-gray-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderWidth: </span><span style="color:#A5D6FF">"border-b"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"peer-disabled:text-blue-gray-400"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> transform: </span><span style="color:#A5D6FF">"after:scale-x-0"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderWidth: </span><span style="color:#A5D6FF">"border-b"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"peer-disabled:text-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> transform: </span><span style="color:#A5D6FF">"after:scale-x-100"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderWidth: </span><span style="color:#A5D6FF">"border-b"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> fontSize: </span><span style="color:#A5D6FF">"text-sm"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> disabled: </span><span style="color:#A5D6FF">"peer-disabled:text-transparent"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: {</span></span> <span class="line"><span style="color:#C9D1D9"> transform: </span><span style="color:#A5D6FF">"after:scale-x-0"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> error: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-red-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> success: {</span></span> <span class="line"><span style="color:#C9D1D9"> select: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> borderColor: </span><span style="color:#A5D6FF">"border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> label: {</span></span> <span class="line"><span style="color:#C9D1D9"> initial: {},</span></span> <span class="line"><span style="color:#C9D1D9"> states: {</span></span> <span class="line"><span style="color:#C9D1D9"> close: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> open: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> withValue: {</span></span> <span class="line"><span style="color:#C9D1D9"> color: </span><span style="color:#A5D6FF">"text-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> after: </span><span style="color:#A5D6FF">"after:border-green-500"</span><span style="color:#C9D1D9">,</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9"> },</span></span> <span class="line"><span style="color:#C9D1D9">};</span></span></code></pre></div> <hr class="!mb-12 !mt-16 border-transparent"/> <div id="more-examples" class="group relative -ml-4 flex scroll-mt-40 items-center pl-4"><a href="#more-examples" class="absolute z-50 -ml-10 mb-2.5 rounded-md border border-blue-gray-50 bg-blue-gray-50/50 p-1 opacity-0 hover:opacity-100 group-hover:opacity-100"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="pointer-events-none h-3.5 w-3.5 rounded-lg"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 8.25h15m-16.5 7.5h15m-1.8-13.5-3.9 19.5m-2.1-19.5-3.9 19.5"></path></svg></a><h2 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug !mb-2 text-primary">Explore More Tailwind CSS Examples</h2></div> <p class="block antialiased font-sans text-base font-light leading-relaxed text-inherit !mb-4 !font-normal !text-gray-600">Looking for more select component examples? Check out our <strong><a href="https://www.material-tailwind.com/blocks/ecommerce-sections" target="_blank">Ecommerce Sections</a></strong> from <a href="https://www.material-tailwind.com/blocks" target="_blank">Material Tailwind Blocks</a>.</p></div><aside class="sticky top-14 ml-auto hidden h-screen w-64 pb-4 pt-6 lg:block"><div class="h-screen w-64 overflow-y-scroll pb-40"><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">On This Page</p><ul class="mb-8 list-none pt-2"><li><a href="#select" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select</a></li><li><a href="#select-variants" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select variants</a></li><li><a href="#select-sizes" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select sizes</a></li><li><a href="#select-colors" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select colors</a></li><li><a href="#select-validations" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select validations</a></li><li><a href="#controlled-select" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">controlled select</a></li><li><a href="#select-custom-animation" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select custom animation</a></li><li><a href="#select-disabled" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select disabled</a></li><li><a href="#countries-select" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">countries select</a></li><li><a href="#select-props" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select props</a></li><li><a href="#select-option-props" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select option props</a></li><li><a href="#types-variant" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">types variant</a></li><li><a href="#types-size" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">types size</a></li><li><a href="#types-color" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">types color</a></li><li><a href="#types-offset" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">types offset</a></li><li><a href="#types-dismiss" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">types dismiss</a></li><li><a href="#types-animate" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">types animate</a></li><li><a href="#select-theme" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select theme</a></li><li><a href="#select-theme-object-type" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select theme object type</a></li><li><a href="#select-variant-object-type" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select variant object type</a></li><li><a href="#select-size-object-type" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select size object type</a></li><li><a href="#select-states-object-type" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select states object type</a></li><li><a href="#select-state-object-type" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select state object type</a></li><li><a href="#select-theme-customization" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">select theme customization</a></li><li><a href="#more-examples" class="relative list-item w-full py-1 text-sm capitalize transition-colors hover:text-primary focus:text-primary font-normal text-gray-600">more examples</a></li></ul><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">Contribute</p><ul class="mb-8 list-none pt-2"><li><a target="_blank" href="https://github.com/creativetimofficial/material-tailwind/blob/main/CONTRIBUTING.md?ref=material-tailwind" class="relative list-item w-full py-1 text-sm capitalize text-gray-600 transition-colors hover:text-primary focus:text-primary" rel="noreferrer">Contributor guides</a></li><li><a target="_blank" href="https://www.github.com/creativetimofficial/material-tailwind/blob/main/documentation/react/select.mdx?ref=material-tailwind" class="relative list-item w-full py-1 text-sm capitalize text-gray-600 transition-colors hover:text-primary focus:text-primary" rel="noreferrer">Edit this page</a></li></ul><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">Community</p><ul class="mb-8 list-none pt-2"><li><a target="_blank" href="https://discord.com/invite/FhCJCaHdQa?ref=material-tailwind" class="relative list-item w-full py-1 text-sm capitalize text-gray-600 transition-colors hover:text-primary focus:text-primary" rel="noreferrer">Join us on Discord</a></li><li><a target="_blank" href="https://www.creative-tim.com/blog?ref=material-tailwind" class="relative list-item w-full py-1 text-sm capitalize text-gray-600 transition-colors hover:text-primary focus:text-primary" rel="noreferrer">Read blog posts</a></li><li><a target="_blank" rel="noreferrer" href="https://opencollective.com/material-tailwind?ref=material-tailwind" class="relative list-item w-full py-1 text-sm capitalize text-gray-600 transition-colors hover:text-primary focus:text-primary">Open Collective</a></li></ul><p class="block antialiased font-sans text-sm leading-normal font-bold capitalize text-primary">Frameworks</p><ul class="mb-8 list-none pt-2"><li class="mb-3"><a class="pointer-events-none flex items-center gap-2" href="/docs/react/installation"><img alt="react" src="https://docs.material-tailwind.com/svg/react.svg" width="48" height="48" decoding="async" data-nimg="1" class="h-5 w-5" loading="lazy" style="color:transparent"/><p class="block antialiased font-sans text-sm leading-normal font-medium text-primary">React</p></a></li><li><a class="pointer-events-auto opacity-70 transition-opacity duration-300 hover:opacity-100 flex items-center gap-2" href="/docs/html/installation"><img alt="html" src="https://docs.material-tailwind.com/svg/html.svg" width="48" height="48" decoding="async" data-nimg="1" class="h-5 w-5" loading="lazy" style="color:transparent"/><p class="block antialiased font-sans text-sm leading-normal font-medium text-primary">HTML</p></a></li><li class="mt-8"><a target="_blank" href="https://github.com/creativetimofficial/material-tailwind?ref=material-tailwind"><button class="align-middle select-none font-sans text-center transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none py-2 px-4 rounded-lg hover:opacity-75 focus:ring active:opacity-[0.85] relative inline-flex items-center gap-3 border-[1.5px] border-blue-gray-50 bg-white text-sm font-medium capitalize text-primary focus:ring-transparent" type="button"><i class="fab fa-github text-base text-primary"></i>Give us Star</button></a></li></ul><a target="_blank" href="https://www.material-tailwind.com/roots-of-ui-ux-design?ref=material-tailwind"><div class="relative flex flex-col bg-clip-border rounded-xl bg-transparent text-gray-700 shadow-none border border-blue-gray-50"><div class="relative bg-clip-border rounded-xl overflow-hidden bg-transparent text-gray-700 shadow-none mx-4 mb-0 mt-4"><img alt="book" srcSet="/_next/image?url=https%3A%2F%2Fdocs.material-tailwind.com%2Fimage%2Fui-ux-book.jpg&w=828&q=75 1x, /_next/image?url=https%3A%2F%2Fdocs.material-tailwind.com%2Fimage%2Fui-ux-book.jpg&w=1920&q=75 2x" src="/_next/image?url=https%3A%2F%2Fdocs.material-tailwind.com%2Fimage%2Fui-ux-book.jpg&w=1920&q=75" width="768" height="768" decoding="async" data-nimg="1" class="h-full w-full object-cover" loading="lazy" style="color:transparent"/></div><div class="p-4"><h6 class="block antialiased tracking-normal font-sans text-base font-semibold leading-relaxed text-blue-gray-900">Roots of UI/UX Design</h6><p class="antialiased font-sans text-sm leading-normal text-inherit mb-2 block font-normal !text-gray-600">By Creative Tim</p><p class="block antialiased font-sans text-sm leading-normal text-inherit font-normal !text-gray-600">Learn to Develop Intuitive Web Experiences</p></div></div></a></div></aside></div></div></div><footer class="relative z-50 bg-white px-8 pb-6 pt-12"><div class="container mx-auto"><div class="flex flex-wrap"><div class="w-full md:w-4/12"><h4 class="block antialiased tracking-normal font-sans text-2xl font-semibold leading-snug text-inherit mb-2 !font-semibold !text-primary">Material Tailwind</h4><p class="block antialiased font-sans text-inherit text-md mb-2 mt-0 font-normal !text-gray-600">Easy to use React components for Tailwind CSS and Material Design.</p><div class="mt-6"><a href="https://www.twitter.com/creativetim?ref=material-tailwind" target="_blank" rel="noreferrer"><i class="fab fa-twitter font-xl align-center mr-2 inline-block items-center justify-center rounded-full border-[1.5px] border-blue-gray-50 p-3 text-center text-primary outline-none focus:outline-none"></i></a><a href="https://www.facebook.com/creativetim?ref=material-tailwind" target="_blank" rel="noreferrer"><i class="fab fa-facebook-square font-xl align-center mr-2 inline-block items-center justify-center rounded-full border-[1.5px] border-blue-gray-50 p-3 text-center text-primary outline-none focus:outline-none"></i></a><a href="https://www.dribbble.com/creativetim?ref=material-tailwind" target="_blank" rel="noreferrer"><i class="fab fa-dribbble font-xl align-center mr-2 inline-block items-center justify-center rounded-full border-[1.5px] border-blue-gray-50 p-3 text-center text-primary outline-none focus:outline-none"></i></a><a href="https://www.github.com/creativetimofficial?ref=material-tailwind" target="_blank" rel="noreferrer"><i class="fab fa-github font-xl align-center mr-2 inline-block items-center justify-center rounded-full border-[1.5px] border-blue-gray-50 p-3 text-center text-primary outline-none focus:outline-none"></i></a><a href="https://discord.com/invite/FhCJCaHdQa?ref=material-tailwind" target="_blank" rel="noreferrer"><i class="fab fa-discord font-xl align-center mr-2 inline-block items-center justify-center rounded-full border-[1.5px] border-blue-gray-50 p-3 text-center text-primary outline-none focus:outline-none"></i></a></div></div><div class="ml-auto w-full px-4 md:w-7/12"><div class="items-top mb-6 flex flex-wrap"><div class="w-6/12 pt-6 md:ml-auto md:px-4 md:pt-0 xl:w-3/12"><span class="text-md mb-4 block font-medium text-primary">Company</span><ul class="list-unstyled"><li><a href="https://www.creative-tim.com/presentation?ref=material-tailwind" target="_blank" rel="noreferrer" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary">About Us</a></li><li><a href="https://www.creative-tim.com/blog?ref=material-tailwind" target="_blank" rel="noreferrer" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary">Blog</a></li><li><a href="https://github.com/creativetimofficial?ref=material-tailwind" target="_blank" rel="noreferrer" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary">Github</a></li><li><a href="https://www.creative-tim.com/templates/free?ref=material-tailwind" target="_blank" rel="noreferrer" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary">Free Products</a></li></ul></div><div class="ml-auto w-6/12 pt-6 md:px-4 md:pt-0 xl:w-3/12"><span class="text-md mb-4 block font-medium text-primary">Help and Support</span><ul class="list-unstyled"><li><a rel="noreferrer" target="_blank" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary" href="https://www.creative-tim.com/knowledge-center?ref=material-tailwind">Knowledge Center</a></li><li><a rel="noreferrer" target="_blank" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary" href="https://www.creative-tim.com/contact-us?ref=material-tailwind">Contact Us</a></li><li><a rel="noreferrer" target="_blank" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary" href="https://www.creative-tim.com/support-terms?ref=material-tailwind">Premium Support</a></li><li><a rel="noreferrer" target="_self" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary" href="/blocks#pricing">Pricing</a></li></ul></div><div class="ml-auto w-6/12 pt-6 md:px-4 md:pt-0 xl:w-3/12"><span class="text-md mb-4 block font-medium text-primary">Resources</span><ul class="list-unstyled"><li><a rel="noreferrer" target="_self" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary" href="/docs/react/installation">Documentation</a></li><li><a rel="noreferrer" target="_blank" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary" href="https://www.creative-tim.com/services/updivision?ref=material-tailwind">Custom Development</a></li><li><a rel="noreferrer" target="_blank" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary" href="https://discord.com/invite/FhCJCaHdQa?ref=material-tailwind">Discord</a></li><li><a rel="noreferrer" target="_blank" class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary" href="https://tailwindcomponents.com/?ref=material-tailwind">Tailwind Components</a></li></ul></div><div class="ml-auto w-6/12 pt-6 md:px-4 md:pt-0 xl:w-3/12"><span class="text-md mb-4 block font-medium text-primary">Technologies</span><ul class="list-unstyled"><li><a class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary" href="/docs/react/installation">React</a></li><li><a class="block pb-2 text-sm font-normal leading-relaxed text-gray-600 transition-colors hover:text-primary" href="/docs/html/installation">HTML</a></li></ul></div></div></div></div><hr class="my-6 border-blue-gray-50"/><div class="flex flex-wrap items-center justify-center gap-2 text-center md:justify-between"><a href="https://vercel.com/?utm_source=ct-tailwind-team&utm_campaign=oss" target="_blank" rel="noopener noreferrer" class="inline-flex items-center font-semibold text-primary no-underline"><span class="mr-1">Powered by</span><span><svg height="22" viewBox="0 0 283 64" fill="none"><path fill="currentColor" d="M141.04 16c-11.04 0-19 7.2-19 18s8.96 18 20 18c6.67 0 12.55-2.64 16.19-7.09l-7.65-4.42c-2.02 2.21-5.09 3.5-8.54 3.5-4.79 0-8.86-2.5-10.37-6.5h28.02c.22-1.12.35-2.28.35-3.5 0-10.79-7.96-17.99-19-17.99zm-9.46 14.5c1.25-3.99 4.67-6.5 9.45-6.5 4.79 0 8.21 2.51 9.45 6.5h-18.9zM248.72 16c-11.04 0-19 7.2-19 18s8.96 18 20 18c6.67 0 12.55-2.64 16.19-7.09l-7.65-4.42c-2.02 2.21-5.09 3.5-8.54 3.5-4.79 0-8.86-2.5-10.37-6.5h28.02c.22-1.12.35-2.28.35-3.5 0-10.79-7.96-17.99-19-17.99zm-9.45 14.5c1.25-3.99 4.67-6.5 9.45-6.5 4.79 0 8.21 2.51 9.45 6.5h-18.9zM200.24 34c0 6 3.92 10 10 10 4.12 0 7.21-1.87 8.8-4.92l7.68 4.43c-3.18 5.3-9.14 8.49-16.48 8.49-11.05 0-19-7.2-19-18s7.96-18 19-18c7.34 0 13.29 3.19 16.48 8.49l-7.68 4.43c-1.59-3.05-4.68-4.92-8.8-4.92-6.07 0-10 4-10 10zm82.48-29v46h-9V5h9zM36.95 0L73.9 64H0L36.95 0zm92.38 5l-27.71 48L73.91 5H84.3l17.32 30 17.32-30h10.39zm58.91 12v9.69c-1-.29-2.06-.49-3.2-.49-5.81 0-10 4-10 10V51h-9V17h9v9.2c0-5.08 5.91-9.2 13.2-9.2z"></path></svg></span></a><div class="text-md mt-2 py-1 font-normal text-gray-600">Copyright © <!-- -->2024<!-- --> <a class="text-inherit transition-all" href="/">Material Tailwind</a> <!-- -->by<!-- --> <a href="https://www.creative-tim.com?ref=material-tailwind" target="_blank" rel="noreferrer" class="text-inherit transition-all">Creative Tim. Made with ❤️ for a better web.</a></div></div></div></footer><div class="fixed right-4 top-2/4 hidden -translate-y-2/4 lg:block"><div class="relative bg-clip-border rounded-xl bg-white text-gray-700 shadow-md group flex flex-col gap-1 border border-blue-gray-50 p-1.5"><a href="/docs/react/installation"><button class="align-middle select-none font-sans font-bold text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none text-sm rounded-lg border border-white hover:opacity-75 focus:ring focus:ring-white/50 active:opacity-[0.85] flex w-full items-center gap-2 px-2 py-2 text-gray-600 hover:border hover:border-blue-gray-50 hover:text-primary" type="button"><img src="https://docs.material-tailwind.com/img/logos/icon-react.svg" alt="react-icon" class="h-6 w-6"/><span class="mr-2 hidden font-bold group-hover:block">React</span></button></a><a href="/docs/html/installation"><button class="align-middle select-none font-sans font-bold text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none text-sm rounded-lg border border-white hover:opacity-75 focus:ring focus:ring-white/50 active:opacity-[0.85] flex w-full items-center gap-2 px-2 py-2 text-gray-600 hover:border hover:border-blue-gray-50 hover:text-primary" type="button"><img src="https://docs.material-tailwind.com/svg/tailwind.svg" alt="react-icon" class="h-6 w-6"/><span class="mr-2 hidden font-bold group-hover:block">Tailwind CSS</span></button></a><a href="/figma"><button class="align-middle select-none font-sans font-bold text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none text-sm rounded-lg border border-white hover:opacity-75 focus:ring focus:ring-white/50 active:opacity-[0.85] flex w-full items-center gap-2 px-2 py-2 text-gray-600 hover:border hover:border-blue-gray-50 hover:text-primary" type="button"><img src="https://docs.material-tailwind.com/img/icon-figma.svg" alt="react-icon" class="h-6 w-6"/><span class="mr-2 hidden font-bold group-hover:block">Figma</span></button></a></div></div><script defer="" src="https://cdn.jsdelivr.net/npm/choices.js/public/assets/scripts/choices.min.js"></script><script defer="" chat-hash="j2rbsnzetxp03odoe7qxbwl" src="https://widget.galichat.com/gali-embeded.min.js"></script></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"frontMatter":{"title":"Tailwind CSS Select for React - Material Tailwind","description":"Customise your web projects with our beautiful select component for Tailwind CSS and React using Material Design guidelines.","navigation":["select","select-variants","select-sizes","select-colors","select-validations","controlled-select","select-custom-animation","select-disabled","countries-select","select-props","select-option-props","types-variant","types-size","types-color","types-offset","types-dismiss","types-animate","select-theme","select-theme-object-type","select-variant-object-type","select-size-object-type","select-states-object-type","select-state-object-type","select-theme-customization","more-examples"],"github":"select","prev":"rating-bar","next":"slider"},"mdxSource":{"compiledSource":"/*@jsxRuntime automatic @jsxImportSource react*/\nconst {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = Object.assign({\n h1: \"h1\",\n p: \"p\",\n div: \"div\",\n pre: \"pre\",\n code: \"code\",\n span: \"span\",\n hr: \"hr\",\n h2: \"h2\",\n table: \"table\",\n thead: \"thead\",\n tr: \"tr\",\n th: \"th\",\n tbody: \"tbody\",\n td: \"td\",\n a: \"a\",\n h3: \"h3\",\n strong: \"strong\"\n }, _provideComponents(), props.components), {DocsTitle, Code, CodePreview, SelectExamples} = _components;\n if (!Code) _missingMdxReference(\"Code\", true);\n if (!CodePreview) _missingMdxReference(\"CodePreview\", true);\n if (!DocsTitle) _missingMdxReference(\"DocsTitle\", true);\n if (!SelectExamples) _missingMdxReference(\"SelectExamples\", false);\n if (!SelectExamples.ControlledSelect) _missingMdxReference(\"SelectExamples.ControlledSelect\", true);\n if (!SelectExamples.CountriesSelect) _missingMdxReference(\"SelectExamples.CountriesSelect\", true);\n if (!SelectExamples.SelectColors) _missingMdxReference(\"SelectExamples.SelectColors\", true);\n if (!SelectExamples.SelectCustomAnimation) _missingMdxReference(\"SelectExamples.SelectCustomAnimation\", true);\n if (!SelectExamples.SelectDefault) _missingMdxReference(\"SelectExamples.SelectDefault\", true);\n if (!SelectExamples.SelectDisabled) _missingMdxReference(\"SelectExamples.SelectDisabled\", true);\n if (!SelectExamples.SelectSizes) _missingMdxReference(\"SelectExamples.SelectSizes\", true);\n if (!SelectExamples.SelectValidations) _missingMdxReference(\"SelectExamples.SelectValidations\", true);\n if (!SelectExamples.SelectVariants) _missingMdxReference(\"SelectExamples.SelectVariants\", true);\n return _jsxs(_Fragment, {\n children: [_jsx(DocsTitle, {\n href: \"select\",\n children: _jsx(_components.h1, {\n children: \"Tailwind CSS Select - React\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"Use our Tailwind CSS \", _jsx(Code, {\n children: \"Select\"\n }), \" component to collect user provided information from a list of options.\"]\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"A \", _jsx(Code, {\n children: \"Select\"\n }), \" component is a dropdown menu for displaying choices. Use the radio component when there are fewer total options (less than 5).\"]\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"See below our \", _jsx(Code, {\n children: \"Select\"\n }), \" component example that you can use in your Tailwind CSS and React project. The example comes in different colors and styles, so you can adapt it easily to your needs.\"]\n }), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(CodePreview, {\n link: \"select#select\",\n component: _jsx(SelectExamples.SelectDefault, {}),\n children: _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { Select, Option } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"export\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"function\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"SelectDefault\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"() {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"return\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" (\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"w-72\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" );\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-variants\",\n children: _jsx(_components.h2, {\n children: \"Select Variants\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"The \", _jsx(Code, {\n children: \"Select\"\n }), \" component comes with 3 different variants that you can change it using the \", _jsx(Code, {\n children: \"variant\"\n }), \" prop.\"]\n }), \"\\n\", _jsx(CodePreview, {\n component: _jsx(SelectExamples.SelectVariants, {}),\n children: _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { Select, Option } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"export\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"function\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"SelectVariants\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"() {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"return\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" (\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"flex w-72 flex-col gap-6\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"variant\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"static\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"variant\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"standard\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"variant\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"outlined\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" );\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-sizes\",\n children: _jsx(_components.h2, {\n children: \"Select Sizes\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"The \", _jsx(Code, {\n children: \"Select\"\n }), \" component comes with 2 different sizes that you can change it using the \", _jsx(Code, {\n children: \"size\"\n }), \" prop.\"]\n }), \"\\n\", _jsx(CodePreview, {\n component: _jsx(SelectExamples.SelectSizes, {}),\n children: _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { Select, Option } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"export\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"function\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"SelectSizes\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"() {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"return\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" (\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"flex w-72 flex-col gap-6\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"size\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"md\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"size\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"lg\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" );\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-colors\",\n children: _jsx(_components.h2, {\n children: \"Select Colors\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"The \", _jsx(Code, {\n children: \"Select\"\n }), \" component comes with 19 different colors that you can change it using the \", _jsx(Code, {\n children: \"color\"\n }), \" prop.\"]\n }), \"\\n\", _jsx(CodePreview, {\n component: _jsx(SelectExamples.SelectColors, {}),\n children: _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { Select, Option } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"export\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"function\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"SelectColors\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"() {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"return\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" (\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"flex w-72 flex-col gap-6\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"color\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"color\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"purple\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"color\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"teal\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" );\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-validations\",\n children: _jsx(_components.h2, {\n children: \"Select Validations\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"The \", _jsx(Code, {\n children: \"Select\"\n }), \" component comes with error and success states for performing validations.\"]\n }), \"\\n\", _jsx(CodePreview, {\n id: \"select-validations\",\n component: _jsx(SelectExamples.SelectValidations, {}),\n children: _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { Select, Option } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"export\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"function\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"SelectValidations\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"() {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"return\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" (\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"flex w-72 flex-col gap-6\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"error\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"success\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" );\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"controlled-select\",\n children: _jsx(_components.h2, {\n children: \"Controlled Select\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"You can make the \", _jsx(Code, {\n children: \"Select\"\n }), \" component to be controlled using the \", _jsx(Code, {\n children: \"value\"\n }), \" and \", _jsx(Code, {\n children: \"onChange\"\n }), \" props.\"]\n }), \"\\n\", _jsx(CodePreview, {\n id: \"controlled-select\",\n component: _jsx(SelectExamples.ControlledSelect, {}),\n children: _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" React \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { Select, Option } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"export\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"function\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"ControlledSelect\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"() {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"const\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" [\"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"value\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \", \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"setValue\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"] \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" React.\"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"useState\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \");\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"return\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" (\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"w-72\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"value\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"={\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"value\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"}\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"onChange\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"={\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"val\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \") \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\u003e\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"setValue\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"(val)\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"}\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003e\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"value\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"html\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"value\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"value\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"vue\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"value\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"angular\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"value\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"svelte\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" );\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-custom-animation\",\n children: _jsx(_components.h2, {\n children: \"Select Custom Animation\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"You can modify the open/close state animation for \", _jsx(Code, {\n children: \"Select\"\n }), \" component using the \", _jsx(Code, {\n children: \"animate\"\n }), \" prop.\"]\n }), \"\\n\", _jsx(CodePreview, {\n component: _jsx(SelectExamples.SelectCustomAnimation, {}),\n children: _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { Select, Option } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"export\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"function\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"SelectCustomAnimation\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"() {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"return\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" (\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"w-72\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"animate\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"={\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"{\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" mount: { y: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"0\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" unmount: { y: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"25\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" }\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"}\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003e\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" );\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-disabled\",\n children: _jsx(_components.h2, {\n children: \"Select Disabled\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"A \", _jsx(Code, {\n children: \"Select\"\n }), \" could be disabled as well, it will help you to prevent user interactions like click or focus over the \", _jsx(Code, {\n children: \"Select\"\n }), \" component.\"]\n }), \"\\n\", _jsx(CodePreview, {\n component: _jsx(SelectExamples.SelectDisabled, {}),\n children: _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { Select, Option } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"export\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"function\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"SelectDisabled\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"() {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"return\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" (\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"w-72\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Version\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"disabled\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind HTML\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind React\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Vue\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Angular\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003eMaterial Tailwind Svelte\u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" );\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"countries-select\",\n children: _jsx(_components.h2, {\n children: \"Countries Select\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"See the example below to see how you can create a \", _jsx(Code, {\n children: \"Select\"\n }), \" component with a list of countries.\"]\n }), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsxs(_components.p, {\n children: [\"This example is using \", _jsx(Code, {\n children: _jsx(\"a\", {\n href: \"https://www.npmjs.com/package/use-react-countries\",\n target: \"_blank\",\n children: \"use-react-countries\"\n })\n }), \" make sure you have installed it.\"]\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"bash\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"bash\",\n \"data-theme\": \"default\",\n children: _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"npm i use-react-countries\"\n })\n })\n })\n })\n }), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(CodePreview, {\n component: _jsx(SelectExamples.CountriesSelect, {}),\n children: _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"jsx\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" React \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { useCountries } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"use-react-countries\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { Select, Option } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"export\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"function\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"CountriesSelect\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"() {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"const\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"countries\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"useCountries\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"();\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"return\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" (\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"w-72\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"size\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"lg\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"Select Country\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"selected\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"={\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"element\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \") \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" element \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"\u0026\u0026\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" React.\"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"cloneElement\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"(element, {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"true\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" className:\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"flex items-center opacity-100 px-0 gap-2 pointer-events-none\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" })\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"}\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003e\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"{\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"countries.\"\n }), _jsx(_components.span, {\n style: {\n color: \"#D2A8FF\"\n },\n children: \"map\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"(({ \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"name\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \", \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"flags\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" }) \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\u003e\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" (\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"key\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"={\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"name\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"}\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"value\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"={\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"name\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"}\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"flex items-center gap-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"img\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"src\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"={\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"flags.svg\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"}\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"alt\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"={\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"name\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"}\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"h-5 w-5 rounded-full object-cover\\\"\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" /\u003e\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"{\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"name\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"}\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" ))\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"}\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"Select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \u003c/\"\n }), _jsx(_components.span, {\n style: {\n color: \"#7EE787\"\n },\n children: \"div\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"\u003e\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" );\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-props\",\n children: _jsx(_components.h2, {\n children: \"Select Props\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"The following props are available for select component. These are the custom props\\nthat we've added for the select component and you can use all the other\\nnative props as well.\"\n }), \"\\n\", _jsxs(_components.table, {\n children: [_jsx(_components.thead, {\n children: _jsxs(_components.tr, {\n children: [_jsx(_components.th, {\n children: \"Attribute\"\n }), _jsx(_components.th, {\n children: \"Type\"\n }), _jsx(_components.th, {\n children: \"Description\"\n }), _jsx(_components.th, {\n children: \"Default\"\n })]\n })\n }), _jsxs(_components.tbody, {\n children: [_jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"variant\"\n })\n }), _jsx(_components.td, {\n children: _jsx(_components.a, {\n href: \"#types-variant\",\n children: \"Variant\"\n })\n }), _jsx(_components.td, {\n children: \"Change select variant\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"outlined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"size\"\n })\n }), _jsx(_components.td, {\n children: _jsx(_components.a, {\n href: \"#types-size\",\n children: \"Size\"\n })\n }), _jsx(_components.td, {\n children: \"Change select size\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"md\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"color\"\n })\n }), _jsx(_components.td, {\n children: _jsx(_components.a, {\n href: \"#types-color\",\n children: \"Color\"\n })\n }), _jsx(_components.td, {\n children: \"Change select color\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"gray\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"label\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"string\"\n })\n }), _jsx(_components.td, {\n children: \"Add label for select\"\n }), _jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"''\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"error\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"boolean\"\n })\n }), _jsx(_components.td, {\n children: \"Change select state to error\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"false\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"success\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"boolean\"\n })\n }), _jsx(_components.td, {\n children: \"Change select state to success\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"false\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"arrow\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"node\"\n })\n }), _jsx(_components.td, {\n children: \"Change select arrow icon\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"undefined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"value\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"string\"\n })\n }), _jsx(_components.td, {\n children: \"Change selected value for select\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"undefined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"onChange\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"function\"\n })\n }), _jsx(_components.td, {\n children: \"Return selected value when select value changed\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"undefined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"selected\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"function\"\n })\n }), _jsx(_components.td, {\n children: \"Return selected element and it's index\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"undefined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"offset\"\n })\n }), _jsx(_components.td, {\n children: _jsx(_components.a, {\n href: \"#types-offset\",\n children: \"Offset\"\n })\n }), _jsx(_components.td, {\n children: \"Change select menu offset from it's input\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"5\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"dismiss\"\n })\n }), _jsx(_components.td, {\n children: _jsx(_components.a, {\n href: \"#types-dismiss\",\n children: \"Dismiss\"\n })\n }), _jsx(_components.td, {\n children: \"Change dismiss listeners when clicking outside\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"undefined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"animate\"\n })\n }), _jsx(_components.td, {\n children: _jsx(_components.a, {\n href: \"#types-animate\",\n children: \"Animate\"\n })\n }), _jsx(_components.td, {\n children: \"Change select menu animation\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"undefined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"lockScroll\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"boolean\"\n })\n }), _jsx(_components.td, {\n children: \"Lock page scrolling when select menu is opened\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"false\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"containerProps\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"object\"\n })\n }), _jsx(_components.td, {\n children: \"Add custom props for select container\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"undefined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"labelProps\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"object\"\n })\n }), _jsx(_components.td, {\n children: \"Add custom props for select label\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"undefined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"menuProps\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"object\"\n })\n }), _jsx(_components.td, {\n children: \"Add custom props for select menu\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"undefined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"disabled\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"boolean\"\n })\n }), _jsx(_components.td, {\n children: \"Disable select\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"false\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"name\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"string\"\n })\n }), _jsx(_components.td, {\n children: \"Add name for select\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"false\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"className\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"string\"\n })\n }), _jsx(_components.td, {\n children: \"Add custom className for select\"\n }), _jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"''\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"children\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"node\"\n })\n }), _jsx(_components.td, {\n children: \"Add content for select\"\n }), _jsx(_components.td, {\n children: \"No default value it's a required prop.\"\n })]\n })]\n })]\n }), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(_components.h3, {\n children: \"For TypeScript Only\"\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { SelectProps } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-option-props\",\n children: _jsx(_components.h2, {\n children: \"Select Option Props\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"The following props are available for select option component. These are the custom\\nprops that we've added for the select option component and you can use\\nall the other native props as well.\"\n }), \"\\n\", _jsxs(_components.table, {\n children: [_jsx(_components.thead, {\n children: _jsxs(_components.tr, {\n children: [_jsx(_components.th, {\n children: \"Attribute\"\n }), _jsx(_components.th, {\n children: \"Type\"\n }), _jsx(_components.th, {\n children: \"Description\"\n }), _jsx(_components.th, {\n children: \"Default\"\n })]\n })\n }), _jsxs(_components.tbody, {\n children: [_jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"value\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"string\"\n })\n }), _jsx(_components.td, {\n children: \"Add select option value, it works together with value props of select\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"undefined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"index\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"number\"\n })\n }), _jsx(_components.td, {\n children: \"Add select option value\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"undefined\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"disabled\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"boolean\"\n })\n }), _jsx(_components.td, {\n children: \"Disable select option\"\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"false\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"className\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"string\"\n })\n }), _jsx(_components.td, {\n children: \"Add custom className for select option\"\n }), _jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"''\"\n })\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: _jsx(_components.code, {\n children: \"children\"\n })\n }), _jsx(_components.td, {\n children: _jsx(Code, {\n children: \"node\"\n })\n }), _jsx(_components.td, {\n children: \"Add content for select option\"\n }), _jsx(_components.td, {\n children: \"No default value it's a required prop.\"\n })]\n })]\n })]\n }), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(_components.h3, {\n children: \"For TypeScript Only\"\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { SelectOptionProps } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"types-variant\",\n children: _jsx(_components.h2, {\n children: \"Types - Variant\"\n })\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"variant\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"standard\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"outlined\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"static\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"types-size\",\n children: _jsx(_components.h2, {\n children: \"Types - Size\"\n })\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"size\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"md\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"lg\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"types-color\",\n children: _jsx(_components.h2, {\n children: \"Types - Color\"\n })\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"color\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue-gray\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"gray\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"brown\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-orange\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"orange\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"amber\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"yellow\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"lime\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-green\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"green\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"teal\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"cyan\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-blue\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"indigo\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-purple\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"purple\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pink\\\"\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"red\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n })]\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"types-offset\",\n children: _jsx(_components.h2, {\n children: \"Types - Offset\"\n })\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"offset\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"number\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"mainAxis\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"number\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"crossAxis\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"number\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"alignmentAxis\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"number\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"null\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n })]\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"types-dismiss\",\n children: _jsx(_components.h2, {\n children: \"Types - Dismiss\"\n })\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"dismissType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"enabled\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"escapeKey\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"referencePress\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"referencePressEvent\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'pointerdown'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'mousedown'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'click'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"outsidePress\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" ((\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"event\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"MouseEvent\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \") \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\u003e\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \");\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"outsidePressEvent\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'pointerdown'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'mousedown'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'click'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"ancestorScroll\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"bubbles\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"escapeKey\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"outsidePress\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"};\"\n })\n })]\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"types-animate\",\n children: _jsx(_components.h2, {\n children: \"Types - Animate\"\n })\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"animate\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"mount\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"unmount\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"?:\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"};\"\n })\n })]\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-theme\",\n children: _jsx(_components.h2, {\n children: \"Select Theme\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"Learn how to customize the theme and styles for select components, the theme object for select components has three main objects:\"\n }), \"\\n\", _jsxs(_components.p, {\n children: [_jsx(_components.strong, {\n children: \"A.\"\n }), \" The \", _jsx(Code, {\n children: \"defaultProps\"\n }), \" object for setting up the default value for props of select components.\", _jsx(\"br\", {}), \"\\n\", _jsx(_components.strong, {\n children: \"B.\"\n }), \" The \", _jsx(Code, {\n children: \"valid\"\n }), \" object for customizing the valid values for select components props.\", _jsx(\"br\", {}), \"\\n\", _jsx(_components.strong, {\n children: \"C.\"\n }), \" The \", _jsx(Code, {\n children: \"styles\"\n }), \" object for customizing the theme and styles of select components.\", _jsx(\"br\", {})]\n }), \"\\n\", _jsx(_components.p, {\n children: \"You can customize the theme and styles of select components by adding Tailwind CSS classes as key paired values for objects.\"\n }), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-theme-object-type\",\n children: _jsx(_components.h2, {\n children: \"Select Theme Object Type\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"Variant of \", _jsx(Code, {\n children: \"Select\"\n }), \" component theme has a specific type of \", _jsx(\"a\", {\n href: \"#select-variant-object-type\",\n className: \"font-medium hover:text-blue-500 transition-colors\",\n children: \"Select Variant Styles Type\"\n })]\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"interface\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"defaultProps\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"variant\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"string\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"color\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"string\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"size\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"string\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"string\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"error\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"success\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"arrow\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"node\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"value\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"string\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"onChange\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"func\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"selected\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"func\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"offset\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"number\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"mainAxis\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"number\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"crossAxis\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"number\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"alignmentAxis\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"number\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"dismiss\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"enabled\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"escapeKey\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"referencePress\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"referencePressEvent\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'pointerdown'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'mousedown'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'click'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"outsidePress\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" ((\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"event\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"MouseEvent\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \") \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\u003e\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \");\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"outsidePressEvent\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'pointerdown'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'mousedown'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"'click'\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"ancestorScroll\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"bubbles\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"|\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"escapeKey\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"outsidePress\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"animate\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"mount\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"unmount\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"autoHeight\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"lockScroll\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"labelProps\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"menuProps\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"className\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"string\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"disabled\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"boolean\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"valid\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"variants\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"string\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"[];\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"sizes\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"string\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"[];\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"colors\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"string\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"[];\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"styles\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"base\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"container\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"arrow\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"initial\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"active\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"menu\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"option\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"initial\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"active\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"disabled\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"variants\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"outlined\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectVariantStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"standard\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectVariantStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"static\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectVariantStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n }), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(_components.h3, {\n children: \"For TypeScript Only\"\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { SelectStylesType } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-variant-object-type\",\n children: _jsx(_components.h2, {\n children: \"Theme Object Type - Select Variant\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"Select variant object type contains three specific types of \", _jsx(\"a\", {\n href: \"#select-size-object-type\",\n className: \"font-medium hover:text-blue-500 transition-colors\",\n children: \"Select Size Styles Type\"\n }), \", \", _jsx(\"a\", {\n href: \"#select-states-object-type\",\n className: \"font-medium hover:text-blue-500 transition-colors\",\n children: \"Select States Styles Type\"\n }), \" and \", _jsx(\"a\", {\n href: \"#select-state-object-type\",\n className: \"font-medium hover:text-blue-500 transition-colors\",\n children: \"Select State Styles Type\"\n })]\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"interface\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectVariantStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"base\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"sizes\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"md\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectSizeStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"lg\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectSizeStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"colors\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"states\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectStatesStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"error\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectStateStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"success\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectStateStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n }), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(_components.h3, {\n children: \"For TypeScript Only\"\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { SelectVariantStylesType } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-size-object-type\",\n children: _jsx(_components.h2, {\n children: \"Theme Object Type - Select Size\"\n })\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"interface\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectSizeStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"container\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"initial\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"states\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"close\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"open\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"withValue\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n }), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(_components.h3, {\n children: \"For TypeScript Only\"\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { SelectSizeStylesType } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-states-object-type\",\n children: _jsx(_components.h2, {\n children: \"Theme Object Type - Select States\"\n })\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"interface\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectStatesStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"close\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"open\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"withValue\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n }), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(_components.h3, {\n children: \"For TypeScript Only\"\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { SelectStatesStylesType } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-state-object-type\",\n children: _jsx(_components.h2, {\n children: \"Theme Object Type - Select State\"\n })\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"interface\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"SelectStateStylesType\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"select\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"initial\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"states\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"close\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"open\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"withValue\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"label\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"initial\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"states\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"close\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"open\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FFA657\"\n },\n children: \"withValue\"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"object\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" };\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"}\"\n })\n })]\n })\n })\n }), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(\"br\", {}), \"\\n\", _jsx(_components.h3, {\n children: \"For TypeScript Only\"\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"tsx\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"import\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"type\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" { SelectStateStylesType } \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"from\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"@material-tailwind/react\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \";\"\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"select-theme-customization\",\n children: _jsx(_components.h2, {\n children: \"Select Theme Customization\"\n })\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"ts\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"const\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"theme\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#FF7B72\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" defaultProps: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" variant: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"outlined\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" size: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"md\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" error: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"false\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" success: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"false\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" arrow: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"undefined\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" value: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"undefined\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" onChange: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"undefined\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" selected: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"undefined\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" offset: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"5\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" dismiss: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" animate: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" unmount: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" mount: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" autoHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"false\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lockScroll: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"false\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" labelProps: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" menuProps: {},\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" className: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"false\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" containerProps: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#79C0FF\"\n },\n children: \"undefined\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" valid: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" variants: [\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"standard\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \", \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"outlined\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \", \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"static\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"],\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" sizes: [\"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"md\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \", \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"lg\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"],\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" colors: [\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue-gray\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"gray\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"brown\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-orange\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"orange\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"amber\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"yellow\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"lime\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-green\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"green\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"teal\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"cyan\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-blue\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"indigo\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-purple\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"purple\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pink\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"red\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" ],\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" styles: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" base: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" container: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" position: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"relative\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" width: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"w-full\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" minWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"min-w-[200px]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" peer: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" width: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"w-full\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" height: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"h-full\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bg: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"bg-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-700\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontFamily: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"font-sans\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontWeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"font-normal\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" textAlign: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-left\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" outline: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"outline outline-0 focus:outline-0\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"disabled:bg-blue-gray-50 disabled:border-0\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transition: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"transition-all\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" arrow: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" display: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"grid\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" placeItems: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"place-items-center\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" position: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"absolute\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" top: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"top-2/4\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" right: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"right-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pt-px\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" width: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"w-5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" height: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"h-5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transform: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"rotate-0 -translate-y-2/4\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transition: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"transition-all\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" active: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transform: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"rotate-180\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" mt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"mt-px\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" display: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"flex\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" width: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"w-full\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" height: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"h-full\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" userSelect: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"select-none\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pointerEvents: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pointer-events-none\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" position: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"absolute\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" left: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"left-0\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontWeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"font-normal\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transition: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"transition-all\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" menu: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" width: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"w-full\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" maxHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"max-h-96\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bg: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"bg-white\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" p: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"p-3\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" border: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border border-blue-gray-50\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderRadius: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"rounded-md\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" boxShadow: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"shadow-lg shadow-blue-gray-500/10\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontFamily: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"font-sans\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontWeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"font-normal\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" overflow: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"overflow-auto\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" outline: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"focus:outline-none\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" option: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pt-[9px]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pb: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pb-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" px: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"px-3\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderRadius: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"rounded-md\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lightHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" cursor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"cursor-pointer\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" userSelect: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"select-none\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" background: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"hover:bg-blue-gray-50 focus:bg-blue-gray-50\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" opacity: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"hover:bg-opacity-80 focus:bg-opacity-80\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"hover:text-blue-gray-900 focus:text-blue-gray-900\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" outline: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"outline outline-0\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transition: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"transition-all\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" active: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bg: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"bg-blue-gray-50 bg-opacity-80\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-900\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" opacity: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"opacity-50\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" cursor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"cursor-not-allowed\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" userSelect: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"select-none\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pointerEvents: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pointer-events-none\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" variants: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" outlined: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" base: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" position: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"-top-1.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" content: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:content[' ']\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" display: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:block\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" boxSizing: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:box-border\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" width: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:w-2.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" height: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:h-1.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" mt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:mt-[6.5px]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" mr: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:mr-1\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderRadius: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:rounded-tl-md\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pointerEvents: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:pointer-events-none\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transition: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:transition-all\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer-disabled:before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" content: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:content[' ']\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" display: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:block\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" flexGrow: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:flex-grow\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" boxSizing: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:box-border\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" width: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:w-2.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" height: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:h-1.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" mt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:mt-[6.5px]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" ml: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:ml-1\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderRadius: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:rounded-tr-md\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pointerEvents: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:pointer-events-none\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transition: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:transition-all\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer-disabled:after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" sizes: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" md: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" container: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" height: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"h-10\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" px: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"px-3\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" py: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"py-2.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderRadius: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"rounded-[7px]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-[3.75]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lg: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" container: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" height: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"h-11\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" px: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"px-3\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" py: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"py-3\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderRadius: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"rounded-[7px]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-[4.1]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" colors: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue-gray\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" gray: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" brown: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-orange\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" orange: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" amber: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" yellow: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lime: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-green\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" green: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" teal: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" cyan: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-blue\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" blue: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" indigo: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-purple\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" purple: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pink: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" red: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue-gray\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" gray: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" brown: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-orange\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" orange: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" amber: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" yellow: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lime: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-green\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" green: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" teal: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" cyan: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-blue\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" blue: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" indigo: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-purple\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" purple: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pink: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" red: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer-disabled:text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bl: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-l-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" br: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-r-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-[11px]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer-disabled:text-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-t-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bl: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-l-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-t-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" br: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-r-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-[11px]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer-disabled:text-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-t\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bl: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-l\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-t\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" br: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-r\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" error: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" success: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderTopColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-t-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" before: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"before:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" standard: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" base: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" position: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"-top-1.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" content: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:content[' ']\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" display: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:block\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" width: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:w-full\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" position: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:absolute\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bottom: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:-bottom-1.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" left: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"left-0\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-b-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transition: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:transition-transform after:duration-300\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" sizes: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" md: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" container: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" height: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"h-11\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pt-4\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pb: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pb-1.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-[4.25]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lg: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" container: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" height: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"h-12\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" px: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"px-px\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pt-5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pb: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pb-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-[4.875]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" colors: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue-gray\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" gray: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" brown: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-orange\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" orange: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" amber: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" yellow: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lime: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-green\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" green: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" teal: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" cyan: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-blue\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" blue: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" indigo: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-purple\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" purple: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pink: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" red: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue-gray\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-50\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" gray: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" brown: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-orange\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" orange: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" amber: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" yellow: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lime: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-green\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" green: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" teal: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" cyan: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-blue\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" blue: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" indigo: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-purple\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" purple: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pink: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" red: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-b\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer-disabled:text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transform: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:scale-x-0\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-b\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-[11px]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer-disabled:text-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transform: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:scale-x-100\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-b\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-[11px]\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer-disabled:text-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transform: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:scale-x-0\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" error: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" success: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" static: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" base: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" position: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"-top-2.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" content: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:content[' ']\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" display: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:block\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" width: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:w-full\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" position: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:absolute\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" bottom: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:-bottom-2.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" left: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"left-0\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-b-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transition: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:transition-transform after:duration-300\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" sizes: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" md: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" container: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" height: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"h-11\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pt-4\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pb: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pb-1.5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lg: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" container: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" height: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"h-12\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" px: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"px-px\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pt: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pt-5\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pb: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"pb-2\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lineHeight: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"leading-tight\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" colors: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue-gray\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" gray: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" brown: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-orange\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" orange: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" amber: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" yellow: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lime: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-green\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" green: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" teal: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" cyan: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-blue\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" blue: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" indigo: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-purple\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" purple: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pink: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" red: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-blue-gray-200\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"blue-gray\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-gray-50\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" gray: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" brown: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-brown-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-orange\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" orange: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-orange-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" amber: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-amber-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" yellow: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-yellow-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" lime: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-lime-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-green\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" green: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" teal: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-teal-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" cyan: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-cyan-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"light-blue\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-light-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" blue: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-blue-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" indigo: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-indigo-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"deep-purple\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \": {\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-deep-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" purple: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-purple-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" pink: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-pink-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" red: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-blue-gray-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-b\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer-disabled:text-blue-gray-400\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transform: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:scale-x-0\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-b\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer-disabled:text-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transform: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:scale-x-100\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderWidth: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-b\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" fontSize: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-sm\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" disabled: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"peer-disabled:text-transparent\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" transform: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:scale-x-0\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" error: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-red-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" success: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" select: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" borderColor: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" label: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" initial: {},\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" states: {\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" close: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" open: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" withValue: {\"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" color: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"text-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" after: \"\n }), _jsx(_components.span, {\n style: {\n color: \"#A5D6FF\"\n },\n children: \"\\\"after:border-green-500\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \",\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \" },\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#C9D1D9\"\n },\n children: \"};\"\n })\n })]\n })\n })\n }), \"\\n\", _jsx(_components.hr, {}), \"\\n\", _jsx(DocsTitle, {\n href: \"more-examples\",\n children: _jsx(_components.h2, {\n children: \"Explore More Tailwind CSS Examples\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"Looking for more select component examples? Check out our \", _jsx(_components.strong, {\n children: _jsx(\"a\", {\n href: \"https://www.material-tailwind.com/blocks/ecommerce-sections\",\n target: \"_blank\",\n children: \"Ecommerce Sections\"\n })\n }), \" from \", _jsx(\"a\", {\n href: \"https://www.material-tailwind.com/blocks\",\n target: \"_blank\",\n children: \"Material Tailwind Blocks\"\n }), \".\"]\n })]\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = Object.assign({}, _provideComponents(), props.components);\n return MDXLayout ? _jsx(MDXLayout, Object.assign({}, props, {\n children: _jsx(_createMdxContent, props)\n })) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\nfunction _missingMdxReference(id, component) {\n throw new Error(\"Expected \" + (component ? \"component\" : \"object\") + \" `\" + id + \"` to be defined: you likely forgot to import, pass, or provide it.\");\n}\n","frontmatter":{},"scope":{}},"slug":["react","select"]},"__N_SSG":true},"page":"/docs/[...slug]","query":{"slug":["react","select"]},"buildId":"7xyavH52hdVKj4bs-JAX1","assetPrefix":"https://docs.material-tailwind.com","isFallback":false,"gsp":true,"scriptLoader":[]}</script><script async="" defer="" src="https://cdn.jsdelivr.net/npm/clipboard@2.0.11/dist/clipboard.min.js"></script></body></html>