{label}
\r\n\r\n
\r\n );\r\n};\r\n\r\nexport default MusclePieChart;\r\n","import React, { createContext, useState, useEffect } from 'react';\r\nimport { apiService } from '../services/apiService';\r\nimport { authService } from '../services/authService';\r\nimport LogoImage from \"../assets/logo_partner.png\";\r\n\r\nexport const SidebarContext = createContext();\r\n\r\nexport const SidebarProvider = ({ children }) => {\r\n const [isCollapsed, setIsCollapsed] = useState(true);\r\n const [partners, setPartners] = useState([]);\r\n const [selectedPartner, setSelectedPartner] = useState('');\r\n const [logo, setLogo] = useState(LogoImage);\r\n\r\n const toggleSidebar = (source) => {\r\n if (source === 'opennav') {\r\n setIsCollapsed(!isCollapsed);\r\n }\r\n else {\r\n if (window.innerWidth > 768) {\r\n setIsCollapsed(true);\r\n }\r\n else if (window.innerWidth <= 768 && source === 'menu') {\r\n setIsCollapsed(false);\r\n }\r\n }\r\n };\r\n\r\n const fetchPartners = async () => {\r\n const isLoggedIn = await authService.isLoggedIn();\r\n if (isLoggedIn) {\r\n const partnersResponse = await apiService.partnerByUserId();\r\n if (partnersResponse.data.length > 0) {\r\n setPartners(partnersResponse.data);\r\n\r\n const storedPartner = sessionStorage.getItem('selectedPartner') || partnersResponse.data[0].id;\r\n await handleSelectPartner(storedPartner); // Selecionar o parceiro inicial\r\n }\r\n }\r\n };\r\n\r\n const handleSelectPartner = async (id) => {\r\n const partnerData = await apiService.partnerbyid(id);\r\n setSelectedPartner(partnerData.data.name);\r\n setLogo(partnerData.data.logo ? `data:image/png;base64,${partnerData.data.logo}` : LogoImage);\r\n\r\n sessionStorage.setItem('userpartnerid', partnerData.data?.id || '');\r\n sessionStorage.setItem('userpartner', partnerData.data?.name || '');\r\n sessionStorage.setItem('logo', partnerData.data?.logo || LogoImage);\r\n sessionStorage.setItem('selectedPartner', id);\r\n\r\n };\r\n\r\n // Função para atualizar manualmente os dados da Sidebar\r\n const refreshSidebarData = async () => {\r\n await fetchPartners(); // Recarrega parceiros e dados relacionados\r\n };\r\n\r\n useEffect(() => {\r\n fetchPartners();\r\n }, []);\r\n\r\n return (\r\n \r\n
\r\n \r\n Your Muscle Score is in the {zoneLabels[zoneIndex]}\r\n
\r\n\r\n Your Muscle Health Score falls within the {percentiles[zoneIndex]}
\r\n relative to other test takers of the same age and sex.\r\n
\r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Total Testers \r\n \r\n \r\n {totaltesters}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Total Tests \r\n \r\n \r\n {totaltests}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Tests Completed \r\n\r\n \r\n \r\n Recent Test Result \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n )\r\n};\r\n\r\nexport default AdminDash;","import { useNavigate } from 'react-router-dom';\r\nimport React, { useState, useEffect } from 'react';\r\nimport NavBar from '../shared/navBar';\r\nimport BannerBackground from \"../assets/vector-8.png\";\r\nimport BannerImage from \"../assets/Login_img.png\";\r\nimport { TextField, Button, Box, Autocomplete } from \"@mui/material\";\r\nimport FooterBar from \"../shared/footer\";\r\nimport Toast from \"../shared/toast\";\r\nimport { apiService } from '../services/apiService';\r\nimport { validator } from '../shared/validator';\r\nimport { grey } from '@mui/material/colors';\r\n\r\nfunction BePartner() {\r\n\r\n const initialState = {\r\n email: \"\",\r\n firstName: \"\",\r\n lastName: \"\",\r\n businessType: \"\",\r\n businessName: \"\",\r\n msg: \"\",\r\n captcha: \"\",\r\n captchaAnswer: \"\",\r\n captchaAnswerback: \"\"\r\n };\r\n\r\n const colors = [\"red\", \"green\", \"blue\", \"yellow\", \"purple\", \"orange\", \"black\", \"brown\", \"pink\", \"gray\"];\r\n const navigate = useNavigate();\r\n const [fields, setFields] = useState(initialState);\r\n const [openToast, setOpenToast] = useState(false);\r\n const [error, setError] = useState(false);\r\n const [msgToast, setmsgToast] = useState('');\r\n const [returnto, setReturnto] = useState('/');\r\n const [emailError, setEmailError] = useState('');\r\n const [retryDelay, setRetryDelay] = useState(0);\r\n const [captchaPosition, setCaptchaPosition] = useState({ top: 0, left: 0 });\r\n\r\n useEffect(() => {\r\n generateCaptcha();\r\n }, []);\r\n\r\n const generateCaptcha = () => {\r\n const randomIndex = Math.floor(Math.random() * colors.length);\r\n const captchaColor = colors[randomIndex];\r\n setFields(prev => ({\r\n ...prev,\r\n captcha: captchaColor,\r\n captchaAnswer: captchaColor\r\n }));\r\n\r\n\r\n\r\n const randomTop = 20;\r\n const randomLeft = Math.floor(Math.random() * 200) + 250;\r\n setCaptchaPosition({ top: randomTop, left: randomLeft });\r\n\r\n\r\n };\r\n\r\n const handleSubmit = async (e) => {\r\n e.preventDefault();\r\n const emailValidationMsg = validator.validateEmail(fields.email);\r\n setEmailError(emailValidationMsg);\r\n if (emailValidationMsg === '') {\r\n if (fields.userCaptcha.toLowerCase() !== fields.captchaAnswer) {\r\n setError(true);\r\n setmsgToast('CAPTCHA validation failed.Recent Testers
\r\nPlease try again.');\r\n setReturnto(null);\r\n setOpenToast(true);\r\n setRetryDelay(10);\r\n setFields(prev => ({ ...prev, userCaptcha: '' }));\r\n\r\n setTimeout(() => {\r\n generateCaptcha();\r\n setRetryDelay(0);\r\n }, 10000);\r\n\r\n return;\r\n }\r\n try {\r\n const data = `{\"email\": \"${fields.email}\",\r\n \"firstName\": \"${fields.firstName}\",\r\n \"lastName\": \"${fields.lastName}\",\r\n \"businessType\": \"${fields.businessType}\",\r\n \"businessName\": \"${fields.businessName}\",\r\n \"msg\": \"${fields.msg.replace(/\\n/g, '
')}\"}`;\r\n\r\n const res = await apiService.bepartnermail(data);\r\n setError(false);\r\n setmsgToast(`${'Thank you for your interest.
We will contact you soon.'}`)\r\n setReturnto('/');\r\n setOpenToast(true);\r\n\r\n } catch (error) {\r\n setError(true);\r\n setmsgToast(`${error.message + '
Check the entered data.'}`);\r\n setReturnto(null);\r\n setOpenToast(true);\r\n }\r\n }\r\n };\r\n\r\n const handleChange = (e, field) => {\r\n setFields(prev => ({\r\n ...prev,\r\n [field]: e.target.value,\r\n }));\r\n };\r\n\r\n const handleCloseToast = () => {\r\n setOpenToast(false);\r\n if (returnto !== null) {\r\n navigate(returnto);\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n
\r\n
\r\n \r\n
\r\n \r\n 
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n Be Our Partner
\r\nPlease fill out the following information
\r\n\r\n 
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n ({\r\n ...column,\r\n flex: 1, // Allow columns to auto-size based on content\r\n }))}\r\n onPageChange={(newPage) => setPage(newPage)}\r\n initialState={{\r\n pagination: {\r\n paginationModel: {\r\n pageSize: 5,\r\n },\r\n },\r\n }}\r\n pageSizeOptions={[5]}\r\n disableSelectionOnClick // Disables row selection on click\r\n checkboxSelection={false} // Removes the checkbox column\r\n components={{\r\n Pagination: () => (\r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n {loading ? (\r\n \r\n Latest Muscle Score\r\n \r\n \r\n \r\n \r\n ) : (\r\n \r\n Welcome!\r\n You are logged In.\r\n \r\n )}\r\n \r\n \r\n\r\n \r\n \r\n
\r\n \r\n );\r\n}\r\n\r\nexport default ClientDash;\r\n","import React, { useState, useEffect } from 'react';\r\nimport {\r\n Container, Paper, Grid, TextField, Pagination, IconButton, Tooltip,\r\n Box, Dialog, DialogTitle, DialogContent, DialogActions, Button\r\n} from '@mui/material';\r\nimport SearchIcon from '@mui/icons-material/Search';\r\nimport ClearIcon from '@mui/icons-material/Clear';\r\nimport AssessmentIcon from '@mui/icons-material/Assessment';\r\nimport Toast from '../shared/toast';\r\nimport SideBar from \"../shared/sideBar\";\r\nimport Header from \"../shared/header.js\";\r\nimport NavInfo from \"../shared/NavInfo.js\";\r\nimport { DataGrid } from '@mui/x-data-grid';\r\nimport { apiService } from '../services/apiService.js';\r\nimport { authService } from '../services/authService';\r\n\r\nconst ClientTestReport = () => {\r\n const [rows, setRows] = useState([]);\r\n const [filteredRows, setFilteredRows] = useState([]);\r\n const [searchText, setSearchText] = useState('');\r\n const [openToast, setOpenToast] = useState(false);\r\n const [msgToast, setMsgToast] = useState('');\r\n const [error, setError] = useState(false);\r\n\r\n // Fetch Data\r\n useEffect(() => {\r\n async function fetchData() {\r\n try {\r\n const userData = await authService.getUserData();\r\n const res = await apiService.getTestResultsByUserId(userData.id);\r\n\r\n const testScores = res.data.map(ts => ({\r\n id: ts.id,\r\n testKitId: ts.testKitId,\r\n testNumber: ts.testNumber,\r\n muscle: ts.muscle,\r\n sexAtBirth: ts.user.sexAtBirth,\r\n }));\r\n setRows(testScores);\r\n setFilteredRows(testScores);\r\n } catch (err) {\r\n setMsgToast(\"Failed to fetch data\");\r\n setError(true);\r\n setOpenToast(true);\r\n }\r\n }\r\n fetchData();\r\n }, []);\r\n\r\n // Search Handling\r\n const handleSearchChange = (event) => {\r\n const query = event.target.value.toLowerCase();\r\n setSearchText(query);\r\n const filteredData = rows.filter(row =>\r\n row.testKitId.toLowerCase().includes(query)\r\n );\r\n setFilteredRows(filteredData);\r\n };\r\n\r\n const clearSearch = () => {\r\n setSearchText('');\r\n setFilteredRows(rows);\r\n };\r\n\r\n // 🔽 Função para baixar o relatório\r\n const handleDownloadReport = async (testId) => {\r\n try {\r\n const testResultResponse = await apiService.getTestResultById(testId);\r\n const testResult = testResultResponse.data;\r\n\r\n if (!testResult || !testResult.fileLocation) {\r\n setMsgToast(\"Report file not found.\");\r\n setError(true);\r\n setOpenToast(true);\r\n return;\r\n }\r\n\r\n const response = await apiService.downloadTestReport(testId);\r\n const url = window.URL.createObjectURL(new Blob([response.data]));\r\n const fileName = testResult.fileLocation.split('/').pop();\r\n\r\n const link = document.createElement('a');\r\n link.href = url;\r\n link.setAttribute('download', fileName);\r\n document.body.appendChild(link);\r\n link.click();\r\n document.body.removeChild(link);\r\n\r\n setMsgToast(\"Report downloaded successfully.\");\r\n setError(false);\r\n } catch (error) {\r\n console.error(\"Error downloading report:\", error);\r\n setMsgToast(\"Error downloading report.\");\r\n setError(true);\r\n } finally {\r\n setOpenToast(true);\r\n }\r\n };\r\n\r\n // 📊 Colunas da Tabela\r\n const columns = [\r\n { field: 'testKitId', headerName: 'TestKit', minWidth: 50 },\r\n { field: 'testNumber', headerName: 'Test Number', minWidth: 50 },\r\n {\r\n field: 'report',\r\n headerName: 'Report',\r\n align: 'center',\r\n renderCell: (params) => (\r\n \r\n
\r\n ) : latestScore ? (\r\n <>\r\n \r\n Once your test is complete you will find your muscle score here.\r\n
\r\n\r\n \r\n \r\n \r\n \r\n {/* 🔎 Search */}\r\n \r\n \r\n \r\n \r\n )\r\n }}\r\n />\r\n \r\n \r\n {/* 📊 Data Grid */}\r\n \r\n ({\r\n ...column,\r\n flex: 1,\r\n p: 2,\r\n }))}\r\n initialState={{\r\n pagination: { paginationModel: { pageSize: 5 } },\r\n }}\r\n pageSizeOptions={[5]}\r\n disableSelectionOnClick\r\n checkboxSelection={false}\r\n sx={{\r\n \"& .MuiDataGrid-columnHeaders\": { fontWeight: \"bold\" },\r\n backgroundColor: \"#ffffff\",\r\n }}\r\n />\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ContactUs;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport SideBar from \"../shared/sideBar\";\r\nimport Header from \"../shared/header\";\r\nimport NavInfo from \"../shared/NavInfo\";\r\nimport { Box, CssBaseline } from \"@mui/material\";\r\nimport UsersCheck from \"../assets/icons/Users/users-check.svg\";\r\nimport UserUp2 from \"../assets/icons/Users/user-up-02.svg\";\r\nimport UsersMinus from \"../assets/icons/Users/users-minus.svg\"; // Ícone já existe\r\nimport Glasses2 from \"../assets/icons/Education/glasses-02.svg\";\r\nimport CheckDone2 from \"../assets/icons/General/check-done-02.svg\";\r\nimport ClockSnooze from \"../assets/icons/Time/clock-snooze.svg\";\r\nimport \"./Dashboard.scss\";\r\nimport { apiService } from \"../services/apiService\";\r\n\r\nimport CheckCircleIcon from \"../assets/icons/General/check-circle.svg\"; // Para Tests Finished\r\nimport MicroscopeIcon from \"../assets/icons/Education/microscope.svg\"; // Para Active Tests\r\nimport ReportIcon from \"../assets/icons/Chart/bar-chart-01.svg\"; // Para Tests To Report\r\n\r\n\r\n\r\nconst Dashboard = () => {\r\n const [counters, setCounters] = useState({\r\n partners: 0,\r\n clients: 0,\r\n activeTests: 0,\r\n testsToDropOff: 0,\r\n testsToReport: 0,\r\n testsFinished: 0,\r\n });\r\n\r\n useEffect(() => {\r\n const fetchCounters = async () => {\r\n try {\r\n const [\r\n partners,\r\n clients,\r\n activeTests,\r\n testsToDropOff,\r\n testsToReport,\r\n testsFinished,\r\n ] = await Promise.all([\r\n apiService.getActivePartnersCount(),\r\n apiService.getActiveClientsCount(),\r\n apiService.getActiveTestsCount(),\r\n apiService.getTestsToDropOffCount(),\r\n apiService.getTestsToReportCount(),\r\n apiService.getFinishedTestsCount(),\r\n ]);\r\n\r\n setCounters({\r\n partners: partners.data,\r\n clients: clients.data,\r\n activeTests: activeTests.data,\r\n testsToDropOff: testsToDropOff.data,\r\n testsToReport: testsToReport.data,\r\n testsFinished: testsFinished.data,\r\n });\r\n } catch (error) {\r\n console.error(\"Error fetching counters\", error);\r\n }\r\n };\r\n\r\n fetchCounters();\r\n }, []);\r\n\r\n const cards = [\r\n { icon: UsersCheck, title: \"Partners\", value: counters.partners },\r\n { icon: UserUp2, title: \"Clients\", value: counters.clients },\r\n { icon: MicroscopeIcon, title: \"Active Tests\", value: counters.activeTests },\r\n { icon: ClockSnooze, title: \"Tests To DropOff\", value: counters.testsToDropOff },\r\n { icon: ReportIcon, title: \"Tests To Report\", value: counters.testsToReport },\r\n { icon: CheckCircleIcon , title: \"Tests Finished\", value: counters.testsFinished },\r\n ];\r\n\r\n return (\r\n <>\r\n \r\n {
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n Get In Touch With Us\r\n \r\n \r\n \r\n
\r\n \r\n \r\n Please fill out this form and we will get back to you as soon as possible!\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default Dashboard;\r\n","import './DialogPartner.css';\r\nimport React, { useState, useEffect } from 'react';\r\nimport { TextField, Button, Box, InputLabel, MenuItem, Select, FormControl, FormControlLabel, Checkbox, Grid, Paper, Container } from \"@mui/material\";\r\nimport Toast from \"../shared/toast\";\r\nimport { apiService } from '../services/apiService';\r\nimport Autocomplete from '@mui/material/Autocomplete';\r\nimport LogoImage from \"../assets/logo_partner.png\";\r\nimport { validator } from \"../shared/validator\";\r\n\r\nconst DialogPartner = ({ partnerId, handleCloseModal }) => {\r\n const [msgToast, setmsgToast] = useState('');\r\n const [openToast, setOpenToast] = useState(false);\r\n const [error, setError] = useState(false);\r\n const [lstProvOrState, setlstProvOrState] = useState([]);\r\n const [lstPartnerType, setlstPartnerType] = useState([]);\r\n const [lstCities, setlstcities] = useState([]);\r\n const [addressId, setAddressId] = useState(null);\r\n const [logo, setLogo] = useState(null);\r\n const [countries, setCountries] = useState([]);\r\n const [thumbnail, setThumbnail] = useState(null);\r\n\r\n const initialState = {\r\n name: \"\",\r\n partnerType: {\r\n type: \"\"\r\n },\r\n partnerAddress: {\r\n streetAddress: \"\",\r\n extendedAddress: \"\",\r\n postalCode: \"\",\r\n country: \"CA\",\r\n provinceOrState: {\r\n name: \"\"\r\n },\r\n city: {\r\n name: \"\"\r\n }\r\n },\r\n active: true\r\n };\r\n\r\n const [fields, setFields] = useState(initialState);\r\n const [defaultCountry, setDefaultCountry] = useState('CA');\r\n\r\n useEffect(() => {\r\n async function fetchData() {\r\n try {\r\n const fetchedCountries = [\r\n { name: \"Canada\", code: \"CA\" },\r\n { name: \"Brazil\", code: \"BR\" },\r\n { name: \"United States\", code: \"US\" },\r\n ];\r\n setCountries(fetchedCountries);\r\n\r\n const [partnertypes, provstates, cities] = await Promise.all([\r\n apiService.partnertypeall(),\r\n apiService.provinceorstateall(),\r\n apiService.citiesall()\r\n ]);\r\n\r\n const mapData = (data, key) => data.map(item => item[key]);\r\n\r\n setlstPartnerType(mapData(partnertypes.data, 'type'));\r\n setlstProvOrState(mapData(provstates.data, 'name'));\r\n setlstcities(mapData(cities.data, 'name'));\r\n\r\n if (partnerId !== '0') {\r\n const partnermailData = { param: partnerId };\r\n const [partneradm, partner] = await Promise.all([\r\n apiService.admbypartnerid(partnermailData),\r\n apiService.partnerbyid(partnerId)\r\n ]);\r\n\r\n setAddressId(partner.data.addressId);\r\n\r\n setFields({\r\n id: partner.data.id,\r\n active: partner.data.active,\r\n email: partneradm?.data?.email || '',\r\n name: partner.data.name,\r\n partnerType: partner.data.partnerType.type,\r\n streetAddress: partner?.data?.partnerAddress?.streetAddress || '',\r\n extendedAddress: partner?.data?.partnerAddress?.extendedAddress || '',\r\n provinceOrState: partner?.data?.partnerAddress?.provinceOrState?.name || '', // Fix this line\r\n city: partner?.data?.partnerAddress?.city?.name || '', // Fix this line\r\n country: partner?.data?.partnerAddress?.country || 'CA', // Fix this line\r\n postalCode: partner?.data?.partnerAddress?.postalCode || '',\r\n site: partner?.data?.site || '',\r\n logo: partner?.data?.logo || ''\r\n });\r\n }\r\n else {\r\n // Set the default country to 'CA' after the countries are fetched\r\n setFields(prevFields => ({\r\n ...prevFields,\r\n country: 'CA' // Default country to Canada\r\n }));\r\n }\r\n } catch (error) {\r\n setmsgToast(error.message);\r\n setError(true);\r\n setOpenToast(true);\r\n }\r\n }\r\n\r\n fetchData();\r\n }, [partnerId]);\r\n\r\n const createThumbnail = (file, maxWidth = 120, maxHeight = 120, quality = 0.8, backgroundColor = \"#FFFFFF\") => \r\n new Promise((resolve, reject) => {\r\n const reader = new FileReader();\r\n reader.onload = ({ target }) => {\r\n const img = new Image();\r\n img.onload = () => {\r\n const scale = Math.min(maxWidth / img.width, maxHeight / img.height, 1);\r\n const canvas = Object.assign(document.createElement(\"canvas\"), {\r\n width: img.width * scale,\r\n height: img.height * scale\r\n });\r\n \r\n const ctx = canvas.getContext(\"2d\");\r\n \r\n // Preenche o fundo com uma cor sólida para remover a transparência\r\n ctx.fillStyle = backgroundColor;\r\n ctx.fillRect(0, 0, canvas.width, canvas.height);\r\n \r\n // Desenha a imagem por cima do fundo sólido\r\n ctx.drawImage(img, 0, 0, canvas.width, canvas.height);\r\n \r\n // Converte para JPEG para garantir a remoção da transparência\r\n resolve(canvas.toDataURL(\"image/jpeg\", quality).split(\",\")[1]);\r\n };\r\n img.onerror = reject;\r\n img.src = target.result;\r\n };\r\n reader.onerror = reject;\r\n reader.readAsDataURL(file);\r\n });\r\n \r\n \r\n \r\n\r\n const handleLogoChange = async (e) => {\r\n const file = e.target.files[0];\r\n if (file) {\r\n try {\r\n const thumb64 = await createThumbnail(file);\r\n setFields(prev => ({ ...prev, logo: thumb64 }));\r\n setLogo(thumb64);\r\n setThumbnail(thumb64);\r\n } catch (error) {\r\n console.error(\"Erro ao processar imagem:\", error);\r\n }\r\n }\r\n };\r\n\r\n const handleChange = (e, field, newValue = null) => {\r\n setFields(prev => ({\r\n ...prev,\r\n [field]: field === 'active' ? e.target.checked : (newValue !== null ? newValue : e.target.value),\r\n }));\r\n };\r\n\r\n\r\n\r\n const validateFields = () => {\r\n const errors = [];\r\n\r\n if (!fields.email) {\r\n errors.push('Email');\r\n }\r\n\r\n if (!fields.name) {\r\n errors.push('Business Name');\r\n }\r\n\r\n if (fields.partnerType === null | fields.partnerType.type === '') {\r\n errors.push('Business Type');\r\n }\r\n\r\n if (!fields.provinceOrState) {\r\n errors.push('Province or State');\r\n }\r\n\r\n if (!fields.city) {\r\n errors.push('City');\r\n }\r\n\r\n if (!fields.country) {\r\n errors.push('Country');\r\n }\r\n\r\n\r\n const emailValidationMsg = validator.validateEmail(fields.email);\r\n if (emailValidationMsg) {\r\n setmsgToast(emailValidationMsg);\r\n setError(true);\r\n setOpenToast(true);\r\n return false; // Validation failed\r\n }\r\n\r\n if (errors.length > 0) {\r\n if (errors.includes('Email')) {\r\n }\r\n else {\r\n setmsgToast('This fields are required: ' + errors.join(', ')); // Combine error messages \r\n }\r\n\r\n setError(true);\r\n setOpenToast(true);\r\n return false; // Validation failed\r\n }\r\n\r\n return true; // Validation passed\r\n };\r\n\r\n const handleSubmit = async (e) => {\r\n e.preventDefault();\r\n\r\n // Validate fields before submission\r\n if (!validateFields()) {\r\n return; // Stop if validation fails\r\n }\r\n\r\n try {\r\n const setDefault = (value) => (value === null || value === undefined ? '' : value);\r\n\r\n const updatedFields = {\r\n id: setDefault(partnerId),\r\n active: setDefault(fields.active),\r\n email: setDefault(fields.email?.toLowerCase() || ''),\r\n name: setDefault(fields.name?.toUpperCase() || ''),\r\n partnerType: {\r\n type: setDefault(fields.partnerType?.toUpperCase() || ''),\r\n },\r\n partnerAddress: {\r\n streetAddress: setDefault(fields.streetAddress || ''),\r\n extendedAddress: setDefault(fields.extendedAddress || ''),\r\n provinceOrState: {\r\n name: setDefault(fields.provinceOrState?.toUpperCase() || ''),\r\n },\r\n city: {\r\n name: setDefault(fields.city?.toUpperCase() || ''),\r\n },\r\n country: setDefault(fields.country || ''),\r\n postalCode: setDefault(fields.postalCode || ''),\r\n },\r\n logo: setDefault(fields.logo || ''),\r\n site: setDefault(fields.site?.toLowerCase() || ''),\r\n };\r\n\r\n if (partnerId !== '0') {\r\n updatedFields.Id = Number(partnerId);\r\n updatedFields.partnerAddress.Id = Number(addressId);\r\n }\r\n\r\n await apiService.partneradd(updatedFields);\r\n setError(false);\r\n setmsgToast('Data updated successfully.');\r\n setOpenToast(true);\r\n\r\n } catch (error) {\r\n setError(true);\r\n setmsgToast(error.response.data.message);\r\n setOpenToast(true);\r\n }\r\n };\r\n\r\n\r\n const readFileAsBase64 = async (logo) => {\r\n if (logo.size > 100000) {\r\n setError(true);\r\n setmsgToast('The file is very large.\r\n {cards.map((card) => (\r\n
\r\n \r\n 
\r\n
\r\n ))}\r\n {card.title}
\r\n{card.value}
\r\nReduce the file size and try again.');\r\n setOpenToast(true);\r\n }\r\n else {\r\n return new Promise((resolve, reject) => {\r\n const reader = new FileReader();\r\n reader.onload = (event) => {\r\n const arrayBuffer = event.target.result;\r\n const bytes = new Uint8Array(arrayBuffer);\r\n const base64String = btoa(String.fromCharCode.apply(null, bytes));\r\n resolve(base64String);\r\n };\r\n reader.onerror = (error) => {\r\n reject(error);\r\n };\r\n reader.readAsArrayBuffer(logo);\r\n });\r\n }\r\n };\r\n\r\n const handleCloseToast = () => {\r\n setOpenToast(false);\r\n if (!error) {\r\n handleCloseModal();\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n
\r\n \r\n \r\n \r\n handleChange(e, 'email')}\r\n margin=\"normal\"\r\n required\r\n />\r\n \r\n \r\n handleChange(e, 'name')}\r\n margin=\"normal\"\r\n required\r\n />\r\n \r\n \r\n option === fields.partnerType) || null}\r\n onChange={(event, newValue) => handleChange({ target: { value: newValue } }, 'partnerType')}\r\n renderInput={(params) => (\r\n \r\n \r\n handleChange(e, 'streetAddress')}\r\n margin=\"normal\"\r\n />\r\n \r\n \r\n handleChange(e, 'extendedAddress')}\r\n margin=\"normal\"\r\n />\r\n \r\n \r\n option === fields.provinceOrState) || null}\r\n onChange={(event, newValue) => handleChange({ target: { value: newValue } }, 'provinceOrState')}\r\n renderInput={(params) => (\r\n \r\n \r\n option === fields.city) || null}\r\n onChange={(event, newValue) => handleChange({ target: { value: newValue } }, 'city')}\r\n renderInput={(params) => (\r\n \r\n \r\n option.code === fields.country) || null} // Match by country code\r\n onChange={(event, newValue) => handleChange({ target: { value: newValue ? newValue.code : '' } }, 'country')} // Update the form field with country code\r\n getOptionLabel={(option) => option?.name || ''} // Return the name of the country for display\r\n renderInput={(params) => (\r\n \r\n \r\n handleChange(e, 'postalCode')}\r\n margin=\"normal\"\r\n />\r\n \r\n \r\n handleChange(e, 'site')}\r\n margin=\"normal\"\r\n />\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n handleChange(e, 'active')}\r\n name=\"active\"\r\n color=\"primary\"\r\n />\r\n }\r\n label=\"Partner is active\"\r\n />\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Submit\r\n \r\n \r\n \r\n \r\n \r\n \r\n Cancel\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n 
\r\n
\r\n \n * \n * \n * \n *
\n * );\n * }\n * ```\n *\n * When the `in` prop is set to `true`, the child component will first receive\n * the class `example-enter`, then the `example-enter-active` will be added in\n * the next tick. `CSSTransition` [forces a\n * reflow](https://github.com/reactjs/react-transition-group/blob/5007303e729a74be66a21c3e2205e4916821524b/src/CSSTransition.js#L208-L215)\n * between before adding the `example-enter-active`. This is an important trick\n * because it allows us to transition between `example-enter` and\n * `example-enter-active` even though they were added immediately one after\n * another. Most notably, this is what makes it possible for us to animate\n * _appearance_.\n *\n * ```css\n * .my-node-enter {\n * opacity: 0;\n * }\n * .my-node-enter-active {\n * opacity: 1;\n * transition: opacity 200ms;\n * }\n * .my-node-exit {\n * opacity: 1;\n * }\n * .my-node-exit-active {\n * opacity: 0;\n * transition: opacity 200ms;\n * }\n * ```\n *\n * `*-active` classes represent which styles you want to animate **to**, so it's\n * important to add `transition` declaration only to them, otherwise transitions\n * might not behave as intended! This might not be obvious when the transitions\n * are symmetrical, i.e. when `*-enter-active` is the same as `*-exit`, like in\n * the example above (minus `transition`), but it becomes apparent in more\n * complex transitions.\n *\n * **Note**: If you're using the\n * [`appear`](http://reactcommunity.org/react-transition-group/transition#Transition-prop-appear)\n * prop, make sure to define styles for `.appear-*` classes as well.\n */\n\n\nvar CSSTransition = /*#__PURE__*/function (_React$Component) {\n _inheritsLoose(CSSTransition, _React$Component);\n\n function CSSTransition() {\n var _this;\n\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;\n _this.appliedClasses = {\n appear: {},\n enter: {},\n exit: {}\n };\n\n _this.onEnter = function (maybeNode, maybeAppearing) {\n var _this$resolveArgument = _this.resolveArguments(maybeNode, maybeAppearing),\n node = _this$resolveArgument[0],\n appearing = _this$resolveArgument[1];\n\n _this.removeClasses(node, 'exit');\n\n _this.addClass(node, appearing ? 'appear' : 'enter', 'base');\n\n if (_this.props.onEnter) {\n _this.props.onEnter(maybeNode, maybeAppearing);\n }\n };\n\n _this.onEntering = function (maybeNode, maybeAppearing) {\n var _this$resolveArgument2 = _this.resolveArguments(maybeNode, maybeAppearing),\n node = _this$resolveArgument2[0],\n appearing = _this$resolveArgument2[1];\n\n var type = appearing ? 'appear' : 'enter';\n\n _this.addClass(node, type, 'active');\n\n if (_this.props.onEntering) {\n _this.props.onEntering(maybeNode, maybeAppearing);\n }\n };\n\n _this.onEntered = function (maybeNode, maybeAppearing) {\n var _this$resolveArgument3 = _this.resolveArguments(maybeNode, maybeAppearing),\n node = _this$resolveArgument3[0],\n appearing = _this$resolveArgument3[1];\n\n var type = appearing ? 'appear' : 'enter';\n\n _this.removeClasses(node, type);\n\n _this.addClass(node, type, 'done');\n\n if (_this.props.onEntered) {\n _this.props.onEntered(maybeNode, maybeAppearing);\n }\n };\n\n _this.onExit = function (maybeNode) {\n var _this$resolveArgument4 = _this.resolveArguments(maybeNode),\n node = _this$resolveArgument4[0];\n\n _this.removeClasses(node, 'appear');\n\n _this.removeClasses(node, 'enter');\n\n _this.addClass(node, 'exit', 'base');\n\n if (_this.props.onExit) {\n _this.props.onExit(maybeNode);\n }\n };\n\n _this.onExiting = function (maybeNode) {\n var _this$resolveArgument5 = _this.resolveArguments(maybeNode),\n node = _this$resolveArgument5[0];\n\n _this.addClass(node, 'exit', 'active');\n\n if (_this.props.onExiting) {\n _this.props.onExiting(maybeNode);\n }\n };\n\n _this.onExited = function (maybeNode) {\n var _this$resolveArgument6 = _this.resolveArguments(maybeNode),\n node = _this$resolveArgument6[0];\n\n _this.removeClasses(node, 'exit');\n\n _this.addClass(node, 'exit', 'done');\n\n if (_this.props.onExited) {\n _this.props.onExited(maybeNode);\n }\n };\n\n _this.resolveArguments = function (maybeNode, maybeAppearing) {\n return _this.props.nodeRef ? [_this.props.nodeRef.current, maybeNode] // here `maybeNode` is actually `appearing`\n : [maybeNode, maybeAppearing];\n };\n\n _this.getClassNames = function (type) {\n var classNames = _this.props.classNames;\n var isStringClassNames = typeof classNames === 'string';\n var prefix = isStringClassNames && classNames ? classNames + \"-\" : '';\n var baseClassName = isStringClassNames ? \"\" + prefix + type : classNames[type];\n var activeClassName = isStringClassNames ? baseClassName + \"-active\" : classNames[type + \"Active\"];\n var doneClassName = isStringClassNames ? baseClassName + \"-done\" : classNames[type + \"Done\"];\n return {\n baseClassName: baseClassName,\n activeClassName: activeClassName,\n doneClassName: doneClassName\n };\n };\n\n return _this;\n }\n\n var _proto = CSSTransition.prototype;\n\n _proto.addClass = function addClass(node, type, phase) {\n var className = this.getClassNames(type)[phase + \"ClassName\"];\n\n var _this$getClassNames = this.getClassNames('enter'),\n doneClassName = _this$getClassNames.doneClassName;\n\n if (type === 'appear' && phase === 'done' && doneClassName) {\n className += \" \" + doneClassName;\n } // This is to force a repaint,\n // which is necessary in order to transition styles when adding a class name.\n\n\n if (phase === 'active') {\n if (node) forceReflow(node);\n }\n\n if (className) {\n this.appliedClasses[type][phase] = className;\n\n _addClass(node, className);\n }\n };\n\n _proto.removeClasses = function removeClasses(node, type) {\n var _this$appliedClasses$ = this.appliedClasses[type],\n baseClassName = _this$appliedClasses$.base,\n activeClassName = _this$appliedClasses$.active,\n doneClassName = _this$appliedClasses$.done;\n this.appliedClasses[type] = {};\n\n if (baseClassName) {\n removeClass(node, baseClassName);\n }\n\n if (activeClassName) {\n removeClass(node, activeClassName);\n }\n\n if (doneClassName) {\n removeClass(node, doneClassName);\n }\n };\n\n _proto.render = function render() {\n var _this$props = this.props,\n _ = _this$props.classNames,\n props = _objectWithoutPropertiesLoose(_this$props, [\"classNames\"]);\n\n return /*#__PURE__*/React.createElement(Transition, _extends({}, props, {\n onEnter: this.onEnter,\n onEntered: this.onEntered,\n onEntering: this.onEntering,\n onExit: this.onExit,\n onExiting: this.onExiting,\n onExited: this.onExited\n }));\n };\n\n return CSSTransition;\n}(React.Component);\n\nCSSTransition.defaultProps = {\n classNames: ''\n};\nCSSTransition.propTypes = process.env.NODE_ENV !== \"production\" ? _extends({}, Transition.propTypes, {\n /**\n * The animation classNames applied to the component as it appears, enters,\n * exits or has finished the transition. A single name can be provided, which\n * will be suffixed for each stage, e.g. `classNames=\"fade\"` applies:\n *\n * - `fade-appear`, `fade-appear-active`, `fade-appear-done`\n * - `fade-enter`, `fade-enter-active`, `fade-enter-done`\n * - `fade-exit`, `fade-exit-active`, `fade-exit-done`\n *\n * A few details to note about how these classes are applied:\n *\n * 1. They are _joined_ with the ones that are already defined on the child\n * component, so if you want to add some base styles, you can use\n * `className` without worrying that it will be overridden.\n *\n * 2. If the transition component mounts with `in={false}`, no classes are\n * applied yet. You might be expecting `*-exit-done`, but if you think\n * about it, a component cannot finish exiting if it hasn't entered yet.\n *\n * 2. `fade-appear-done` and `fade-enter-done` will _both_ be applied. This\n * allows you to define different behavior for when appearing is done and\n * when regular entering is done, using selectors like\n * `.fade-enter-done:not(.fade-appear-done)`. For example, you could apply\n * an epic entrance animation when element first appears in the DOM using\n * [Animate.css](https://daneden.github.io/animate.css/). Otherwise you can\n * simply use `fade-enter-done` for defining both cases.\n *\n * Each individual classNames can also be specified independently like:\n *\n * ```js\n * classNames={{\n * appear: 'my-appear',\n * appearActive: 'my-active-appear',\n * appearDone: 'my-done-appear',\n * enter: 'my-enter',\n * enterActive: 'my-active-enter',\n * enterDone: 'my-done-enter',\n * exit: 'my-exit',\n * exitActive: 'my-active-exit',\n * exitDone: 'my-done-exit',\n * }}\n * ```\n *\n * If you want to set these classes using CSS Modules:\n *\n * ```js\n * import styles from './styles.css';\n * ```\n *\n * you might want to use camelCase in your CSS file, that way could simply\n * spread them instead of listing them one by one:\n *\n * ```js\n * classNames={{ ...styles }}\n * ```\n *\n * @type {string | {\n * appear?: string,\n * appearActive?: string,\n * appearDone?: string,\n * enter?: string,\n * enterActive?: string,\n * enterDone?: string,\n * exit?: string,\n * exitActive?: string,\n * exitDone?: string,\n * }}\n */\n classNames: classNamesShape,\n\n /**\n * A `\n * {\"I'll receive my-node-* classes\"}\n *
\n * \r\n \r\n Sex At Birth \r\n \r\n \r\n
\r\n \r\n\r\n \r\n \r\n Program Type \r\n handleChange(e, 'programTypeId')}\r\n label=\"Program Type\"\r\n >\r\n {programTypes.map((type) => (\r\n \r\n ))}\r\n \r\n \r\n \r\n {fields.id > 0 && clientPartners && (\r\n \r\n \r\n handleChange(e, 'active')}\r\n name=\"active\"\r\n color=\"primary\"\r\n />\r\n }\r\n label=\"User is active\"\r\n />\r\n \r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default DialogUser;\r\n","// GaugeChartDialog.js\r\nimport React from 'react';\r\nimport { Dialog, DialogTitle, DialogContent, DialogActions, Button, Box, Typography } from '@mui/material';\r\nimport HalfDoughnutChart from '../components/HalfDoughnutChart';\r\nimport MusclePieChart from '../components/MusclePieChart';\r\n\r\nconst GaugeChartDialog = ({ open, handleClose, data, title }) => {\r\n const fields = [\r\n { name: \"Metabolism\", value: data?.metabolism },\r\n { name: \"Behaviour\", value: data?.behaviour },\r\n { name: \"Muscle\", value: data?.muscle },\r\n { name: \"Performance\", value: data?.performance },\r\n { name: \"Nutrition\", value: data?.nutrition },\r\n { name: \"Efficiency\", value: data?.efficiency },\r\n { name: \"Recovery\", value: data?.recovery },\r\n ];\r\n\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default GaugeChartDialog;\r\n","import Toast from \"../shared/toast\";\r\nimport BannerBackground from \"../assets/vector-8.png\";\r\nimport BannerImage from \"../assets/Login_img.png\";\r\nimport { TextField, Button, Box, Grid, Stack } from \"@mui/material\";\r\nimport FooterBar from \"../shared/footer\";\r\nimport { useNavigate, NavLink } from 'react-router-dom';\r\nimport NavBar from '../shared/navBar';\r\nimport '../global.css';\r\nimport './Home.css';\r\n\r\nconst LabDash = () => {\r\n\r\n const navigate = useNavigate();\r\n\r\n return (\r\n\r\n \r\n \r\n Partner \r\n handleChange(e, 'partnerId')}\r\n label=\"Partner\"\r\n >\r\n {clientPartners?.map((partner) => (\r\n \r\n ))}\r\n \r\n \r\n
\r\n )}\r\n \r\n {userRole === \"Admin\" && (\r\n \r\n Role \r\n\r\n \r\n \r\n )}\r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default LabDash;\r\n","import React, { useState, useEffect, useRef } from 'react';\r\nimport NavBar from '../shared/navBar';\r\nimport SideBar from '../shared/sideBar';\r\nimport { List, ListItem, Container, Grid, Button, Box, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Paper, TablePagination, TableSortLabel, CssBaseline, Dialog, DialogTitle, DialogContent, DialogContentText, TextField, DialogActions, Typography } from '@mui/material';\r\nimport { apiService } from '../services/apiService';\r\nimport SearchIcon from '@mui/icons-material/Search';\r\nimport ClearIcon from '@mui/icons-material/Clear';\r\nimport EditNote from '@mui/icons-material/EditNote';\r\nimport ContentCopyIcon from '@mui/icons-material/ContentCopy';\r\nimport Toast from '../shared/toast';\r\nimport { useNavigate } from 'react-router-dom';\r\nimport CheckIcon from '@mui/icons-material/Check';\r\nimport CloseIcon from '@mui/icons-material/Close';\r\nimport Tooltip from '@mui/material/Tooltip';\r\nimport QrCodeIcon from '@mui/icons-material/QrCode';\r\nimport Block from '@mui/icons-material/Block';\r\nimport { formatDate } from '../shared/formatDate';\r\nimport { Row } from 'antd';\r\nimport Header from \"../shared/header.js\";\r\nimport NavInfo from \"../shared/NavInfo.js\";\r\n\r\nconst initialState = {\r\n id: 0,\r\n userid: 0,\r\n firstName: \"\",\r\n lastName: \"\",\r\n testKitId: \"\",\r\n activated: \"\",\r\n labReceived: \"\",\r\n finished: \"\"\r\n};\r\n\r\nconst receiveState = {\r\n testKitId: \"\",\r\n Name: \"\",\r\n Partner: \"\",\r\n Status: \"\"\r\n };\r\n\r\nconst LabReceipt = () => {\r\n const [clienterror, setClienterror] = useState('');\r\n const navigate = useNavigate();\r\n const [lstClients, setLstClients] = useState([]);\r\n const [open, setOpen] = useState(false);\r\n const [fields, setFields] = useState(initialState);\r\n const [errors, setErrors] = useState({});\r\n const [error, setError] = useState(false);\r\n const [openToast, setOpenToast] = useState(false);\r\n const [msgToast, setmsgToast] = useState('Kit Activated.');\r\n const [page, setPage] = useState(0);\r\n const [rowsPerPage, setRowsPerPage] = useState(5);\r\n const [order, setOrder] = useState('asc');\r\n const [orderBy, setOrderBy] = useState('firstName');\r\n const [searchQuery, setSearchQuery] = useState('');\r\n const [searchText, setSearchText] = useState('');\r\n const [refresh, setRefresh] = useState(false); // New state for data refresh\r\n const testKitIdRef = useRef(null);\r\n const [testKitList, setTestKitList] = useState([]);\r\n\r\n useEffect(() => {\r\n async function fetchData() {\r\n try {\r\n const clientsxresults = await apiService.getActiveNotFinished();\r\n if (Array.isArray(clientsxresults.data)) {\r\n const clientlst = clientsxresults.data.map(test => ({\r\n id: test.id || 0,\r\n userId: test.user.id || 0,\r\n firstName: test.user.firstName || '',\r\n lastName: test.user.lastName || '',\r\n activated: test.activated || '',\r\n labReceived: test.labReceived || '',\r\n testKitId: test.testKitId || '',\r\n testNumber: test.testNumber || '',\r\n }));\r\n\r\n setLstClients(clientlst);\r\n }\r\n } catch (error) {\r\n console.error('Error fetching kits.', error);\r\n }\r\n }\r\n\r\n fetchData();\r\n }, [refresh]); // Depend on refresh state\r\n\r\n useEffect(() => {\r\n if (open) {\r\n const timer = setTimeout(() => {\r\n if (testKitIdRef.current) {\r\n testKitIdRef.current.focus();\r\n }\r\n }, 100);\r\n return () => clearTimeout(timer);\r\n }\r\n }, [open]);\r\n\r\n const handleChange = (e, field) => {\r\n setFields(prev => ({\r\n ...prev,\r\n [field]: e.target.value,\r\n }));\r\n setClienterror('');\r\n };\r\n\r\n const handleClose = () => {\r\n fields.testKitId = '';\r\n setOpen(false);\r\n setRefresh(!refresh);\r\n };\r\n\r\n const handleChangePage = (event, newPage) => {\r\n setPage(newPage);\r\n };\r\n\r\n const handleChangeRowsPerPage = (event) => {\r\n setRowsPerPage(parseInt(event.target.value, 10));\r\n setPage(0);\r\n };\r\n\r\n const handleRequestSort = (event, property) => {\r\n const isAsc = orderBy === property && order === 'asc';\r\n setOrder(isAsc ? 'desc' : 'asc');\r\n setOrderBy(property);\r\n };\r\n\r\n const handleUpdateKit = async () => {\r\n try {\r\n if(fields.testKitId){\r\n\r\n const kitToReceive = await apiService.getByTestKitId(fields.testKitId);\r\n if (kitToReceive) {\r\n if (kitToReceive.data.labReceived) {\r\n setmsgToast('Kit already received!');\r\n setError(true);\r\n setOpenToast(true);\r\n } else {\r\n const receive = await apiService.receivetest(kitToReceive.data);\r\n \r\n const newTestKit = {\r\n Name: kitToReceive.data.user.firstName + ' ' + kitToReceive.data.user.lastName,\r\n Partner: kitToReceive.data.Partner,\r\n testKitId: kitToReceive.data.testKitId,\r\n Status: receive.data\r\n };\r\n \r\n // Ensure prevList is always an array\r\n setTestKitList(prevList => [...(prevList || []), newTestKit]);\r\n \r\n //setFields({ testKitId: \"\" }); // Clear the input field\r\n setError(false);\r\n }\r\n }\r\n fields.testKitId = '';\r\n }\r\n }\r\n catch (error) {\r\n if (error.response.data.title === 'Not Found') {\r\n setmsgToast('Kit identification not found');\r\n }\r\n else {\r\n setmsgToast('Failed to communicate with server.');\r\n }\r\n\r\n setError(true);\r\n setOpenToast(true);\r\n } finally {\r\n if (testKitIdRef.current) {\r\n testKitIdRef.current.focus();\r\n }\r\n }\r\n };\r\n\r\n const handleCloseToast = () => {\r\n setOpenToast(false);\r\n };\r\n\r\n const handleSearchKeyDown = (event) => {\r\n if (event.key === 'Enter') {\r\n setSearchQuery(searchText);\r\n }\r\n };\r\n\r\n const filteredClients = lstClients.filter(client =>\r\n client.testKitId.toLowerCase().includes(searchQuery.toLowerCase()) ||\r\n client.testKitId.toLowerCase().includes(searchQuery.toLowerCase())\r\n );\r\n\r\n const sortedClients = filteredClients.slice().sort((a, b) => {\r\n\r\n\r\n const compare = (propA, propB, isNumeric = false) => {\r\n if (propA !== undefined && propB !== undefined) {\r\n if (isNumeric) {\r\n return order === 'asc' ? propA - propB : propB - propA;\r\n } else {\r\n return order === 'asc' ? String(propA).localeCompare(String(propB)) : String(propB).localeCompare(String(propA));\r\n }\r\n }\r\n return 0;\r\n };\r\n\r\n if (orderBy === 'First Name') {\r\n return compare(a.firstName, b.firstName);\r\n }\r\n if (orderBy === 'Last Name') {\r\n return compare(a.lastName, b.lastName);\r\n }\r\n if (orderBy === 'Tests') {\r\n return compare(a.testNumber, b.testNumber);\r\n }\r\n if (orderBy === 'Activated') {\r\n return compare(a.activated, b.activated);\r\n }\r\n if (orderBy === 'Lab') {\r\n return compare(a.labReceived, b.labReceived);\r\n }\r\n if (orderBy === 'Test Kit') {\r\n return compare(a.testKitId, b.testKitId, true);\r\n }\r\n return 0;\r\n });\r\n\r\n const paginatedClients = sortedClients.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage);\r\n\r\n const handleCopyToClipboard = () => {\r\n const tableText = testKitList\r\n .map(kit => `${kit.testKitId}\\t${kit.Name} ${kit.Status}`)\r\n .join('\\n');\r\n navigator.clipboard.writeText(tableText)\r\n .then(() => {\r\n setmsgToast('Table content copied to clipboard!');\r\n setError(false);\r\n setOpenToast(true);\r\n })\r\n .catch(err => {\r\n setmsgToast('Failed to copy text: ', err);\r\n setError(true);\r\n setOpenToast(true);\r\n\r\n\r\n });\r\n\r\n if (testKitIdRef.current) {\r\n testKitIdRef.current.focus();\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n LabDash
\r\n\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n setSearchText(e.target.value)}\r\n onKeyDown={handleSearchKeyDown}\r\n InputProps={{\r\n startAdornment: \r\n \r\n setOpen(true)}\r\n sx={{\r\n width: \"150px\",\r\n backgroundColor: \"rgba(197, 220, 255, 1)\",\r\n color: \"#000000\",\r\n fontWeight: \"bold\",\r\n fontFamily: \"Roboto\",\r\n borderColor: \"rgba(197, 220, 255, 1)\"\r\n }}\r\n >\r\n Receive kits\r\n \r\n \r\n\r\n \r\n \r\n \r\n
\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n a new password.');\r\n setOpenToast(true);\r\n } catch (error) {\r\n await authService.logOut();\r\n setMsgToast(error.response.data);\r\n setError(true);\r\n setOpenToast(true);\r\n }\r\n }\r\n };\r\n\r\n const handleCloseToast = async () => {\r\n setOpenToast(false);\r\n if (!error) {\r\n // Adiciona um atraso de 2 segundos antes de redirecionar\r\n setTimeout(() => {\r\n }, 4000); // 2000ms = 2 segundos\r\n }\r\n if (await authService.getEmail()) {\r\n navigate('/home');\r\n } else {\r\n //setEmail('');\r\n setPassword('');\r\n }\r\n };\r\n\r\n const handleClickShowPassword = () => {\r\n setShowPassword(!showPassword);\r\n };\r\n\r\n const handleMouseDownPassword = (event) => {\r\n event.preventDefault();\r\n };\r\n\r\n const handleRememberMeChange = (event) => {\r\n setRememberMe(event.target.checked);\r\n };\r\n\r\n const handleAcceptTerms = async () => {\r\n await apiService.userAcceptTerms();\r\n setAcceptedTerms(true);\r\n const user = await authService.getUserData();\r\n const userbaseUrl = urlHomeBase[user.role];\r\n navigate(userbaseUrl);\r\n setOpenTermsDialog(false);\r\n };\r\n\r\n const handleOpenTermsDialog = () => {\r\n setOpenTermsDialog(true);\r\n };\r\n\r\n const handleCloseTermsDialog = () => {\r\n setOpenTermsDialog(false);\r\n };\r\n\r\n return (\r\n <>\r\n
\r\n
\r\n \r\n
\r\n \r\n 
\r\n
\r\n \r\n
\r\n Sign-in
\r\n\r\n Log in with your login and password\r\n
\r\n\r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n\r\n \r\n Myomar Molecular Inc.\r\n
\r\n+1 902-483-6644
\r\nsupport@myomarmolecular.com
\r\n\r\n \r\n \r\n {/* \r\n \r\n Client Manager \r\n \r\n {/* Search Client Field */}\r\n \r\n \r\n \r\n \r\n \r\n \r\n ),\r\n }}\r\n />\r\n \r\n\r\n {/* Search Partner Field */}\r\n\r\n {(userRole === \"Admin\") &&\r\n (\r\n \r\n Select Partner \r\n \r\n \r\n \r\n \r\n )}\r\n >\r\n {/* Map over the list of partners to create MenuItems */}\r\n {partners.map((partner) => (\r\n \r\n ))}\r\n \r\n \r\n )}\r\n\r\n {/* Add Client Button */}\r\n {(userRole !== \"Lab_Manager\") &&\r\n (\r\n \r\n \r\n \r\n )\r\n }\r\n\r\n {/* Show Active Only Checkbox */}\r\n \r\n \r\n Show Active Only \r\n \r\n \r\n\r\n {/* Clients Table */}\r\n \r\n \r\n \r\n
\r\n \r\n client.active).length\r\n : lstClients.length}\r\n page={page}\r\n onPageChange={handleChangePage}\r\n rowsPerPage={rowsPerPage}\r\n onRowsPerPageChange={handleChangeRowsPerPage}\r\n rowsPerPageOptions={[]} // Disable rows per page options\r\n labelRowsPerPage=\"\" // Hide \"Rows per page\" label\r\n sx={{\r\n '& .MuiTablePagination-selectLabel': {\r\n display: 'none',\r\n },\r\n '& .MuiTablePagination-displayedRows': {\r\n display: 'none',\r\n },\r\n '& .MuiInputBase-root': {\r\n display: 'none',\r\n },\r\n }}\r\n />\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n {/* Add/Edit Dialog */}\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n setSearchQuery(e.target.value)}\r\n onKeyDown={handleSearchChange}\r\n variant=\"outlined\"\r\n InputProps={{\r\n startAdornment: (\r\n \r\n \r\n \r\n \r\n ),\r\n endAdornment: searchQuery && (\r\n \r\n \r\n \r\n \r\n ),\r\n }}\r\n />\r\n \r\n \r\n \r\n handleOpenInfoModal('0')}\r\n sx={{\r\n backgroundColor: \"rgba(197, 220, 255, 1)\",\r\n color: \"#000000\",\r\n fontWeight: \"bold\",\r\n borderColor: \"rgba(197, 220, 255, 1)\",\r\n \"&:hover\": {\r\n backgroundColor: \"rgba(150, 200, 255, 1)\"\r\n }\r\n }}\r\n >\r\n \r\n \r\n\r\n \r\n \r\n Show Active Only \r\n \r\n \r\n\r\n \r\n \r\n \r\n
\r\n \r\n {partnererror && {partnererror}}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n {/* Partner Info Modal */}\r\n \r\n\r\n {/* Scan Kit Modal */}\r\n \r\n \r\n );\r\n};\r\nexport default ManagerPartner;\r\n\r\n","import React, { useState, useEffect } from 'react';\r\nimport {\r\n Button, Box, DialogTitle, DialogContentText, DialogContent, Pagination, Stack, DialogActions, Dialog, TextField,\r\n Paper, Grid, Typography, IconButton, Tooltip, Container, FormControlLabel, Checkbox\r\n} from '@mui/material';\r\nimport NavBar from \"../shared/navBar\";\r\nimport SideBar from \"../shared/sideBar\";\r\nimport { DataGrid } from '@mui/x-data-grid';\r\nimport UploadFileIcon from '@mui/icons-material/UploadFile';\r\nimport FileDownloadOutlinedIcon from '@mui/icons-material/FileDownloadOutlined';\r\nimport { apiService } from '../services/apiService';\r\nimport Toast from \"../shared/toast\";\r\nimport { authService } from '../services/authService';\r\nimport SearchIcon from '@mui/icons-material/Search';\r\nimport ClearIcon from '@mui/icons-material/Clear';\r\nimport { formatDate } from '../shared/formatDate';\r\nimport LoupeOutlinedIcon from '@mui/icons-material/LoupeOutlined';\r\nimport { AlignHorizontalRight, NorthWest } from '@mui/icons-material';\r\nimport { formatNumber } from 'chart.js/helpers';\r\nimport { DateTimeField } from '@mui/x-date-pickers';\r\nimport ContentPasteIcon from '@mui/icons-material/ContentPaste';\r\nimport DownloadIcon from '@mui/icons-material/Download';\r\nimport QuizIcon from '@mui/icons-material/Quiz'; // Ícone para Questionário\r\nimport Header from \"../shared/header.js\";\r\nimport NavInfo from \"../shared/NavInfo.js\";\r\nimport { Row } from 'antd';\r\n\r\nconst ManageTestResults = () => {\r\n const [rows, setRows] = useState([]);\r\n const [searchText, setSearchText] = useState('');\r\n const [filteredRows, setFilteredRows] = useState([]);\r\n const [openToast, setOpenToast] = useState(false);\r\n const [msgToast, setmsgToast] = useState('');\r\n const [error, setError] = useState(false);\r\n const [openUploadModal, setOpenUploadModal] = useState(false);\r\n const [openImportModal, setOpenImportModal] = useState(false);\r\n const [selectedTestId, setSelectedTestId] = useState(null);\r\n const [selectedFile, setSelectedFile] = useState(null);\r\n const [userId, setUserId] = useState(null);\r\n const [openDetailsDialog, setOpenDetailsDialog] = useState(false);\r\n const [selectedRow, setSelectedRow] = useState(null);\r\n const [tableData, setTableData] = useState([]);\r\n const Tests = useState([]);\r\n const [PastedTests, setPastedTests] = useState(Tests);\r\n const [refresh, setRefresh] = useState(false);\r\n const [fields, setFields] = useState([]);\r\n const [userRole, setUserRole] = useState('');\r\n const [showIncompletedTests, setShowIncompletedTests] = useState(true); \r\n \r\n useEffect(() => {\r\n async function fetchData() {\r\n try {\r\n const res = await apiService.getTestResultsLabReceived();\r\n const testResults = res.data.map(tr => ({\r\n id: tr.id,\r\n name: tr.user.firstName + \" \" + tr.user.lastName,\r\n date: formatDate(tr.activated, false),\r\n testKitId: tr.testKitId,\r\n program: tr.user.programType.name || \"\",\r\n testNumber: tr.testNumber,\r\n questionnaire: tr.questionnaireUser && \r\n tr.questionnaireUser.completionTime ? \r\n formatDate(tr.questionnaireUser.completionTime, false) : '',\r\n taurine: tr.taurine || \"\",\r\n xanthine: tr.xanthine || \"\",\r\n glutamate: tr.glutamate || \"\",\r\n succinate: tr.succinate || \"\",\r\n carnitine: tr.carnitine || \"\",\r\n finished: formatDate(tr.finished, false) || '',\r\n resultReported: tr.resultReported,\r\n UserIdResultReported: tr.UserIdResultReported,\r\n }));\r\n setRows(testResults);\r\n // Filtra automaticamente os testes incompletos na inicialização\r\n if (showIncompletedTests) {\r\n const filtered = testResults.filter(row => \r\n row.finished === '-' && \r\n row.questionnaire.trim() !== '' && \r\n row.UserIdResultReported !== '' && row.resultReported !== '' &&\r\n !(\r\n Number(row.taurine) === 0 && \r\n Number(row.xanthine) === 0 && \r\n Number(row.glutamate) === 0 && \r\n Number(row.succinate) === 0 && \r\n Number(row.carnitine) === 0\r\n )\r\n );\r\n setFilteredRows(filtered);\r\n } else {\r\n setFilteredRows(testResults);\r\n }\r\n\r\n const user = await authService.getUserData();\r\n setUserId(user.id);\r\n\r\n\r\n } catch (err) {\r\n console.log(err);\r\n }\r\n }\r\n fetchData();\r\n\r\n }, [refresh]);\r\n\r\n const handleResendQuestionnaire = async (testId) => {\r\n try {\r\n await apiService.resendQuestionnaireUser(testId);\r\n setmsgToast(\"Questionnaire resent successfully!\");\r\n setError(false);\r\n } catch (err) {\r\n setmsgToast(\"Failed to resend questionnaire.\");\r\n setError(true);\r\n }\r\n setOpenToast(true);\r\n };\r\n\r\n useEffect(() => {\r\n const storeduser = authService.getUserData();\r\n setUserRole(storeduser.role);\r\n}, [userRole]);\r\n\r\n const handlePaste = async () => {\r\n try {\r\n // Read text from clipboard in Excel format\r\n const textbase = await navigator.clipboard.readText();\r\n if (textbase === '' | textbase === null) {\r\n throw new Error(\"Nothing do paste. Try copy again.\");\r\n }\r\n const text = textbase.replace(/,/g, '.').replace(/\\r/g, '\\t0\\r');\r\n const rows = text.split('\\n').filter(row => row.trim() !== '');\r\n\r\n const parsedData = rows\r\n .map(row => row.split('\\t'))\r\n .filter(row =>\r\n // Filter based on numeric cells only (excluding first and last)\r\n row.slice(1, -1).every(cell => !isNaN(parseFloat(cell)) && isFinite(cell))\r\n )\r\n .map(row =>\r\n // Format numeric cells to 5 decimal places, excluding first and last\r\n row.map((cell, index) =>\r\n index === 0 || index === 6 ? cell : parseFloat(cell).toFixed(5)\r\n )\r\n );\r\n\r\n // Process the parsed data\r\n const processParsedData = async () => {\r\n const updatedPastedTests = [];\r\n\r\n const cont = rows[0].split('\\t').filter(value => value.trim() !== '').length;\r\n if (cont !== 7 ) {\r\n throw new Error(\"Invalid Data. Try copy again.\");\r\n }\r\n else {\r\n for (const row of parsedData) {\r\n // Validate Test Kit ID\r\n const response = await apiService.ValidateTestKitId(row[0]);\r\n const valid = response.data; // Assuming response.data is the validity status\r\n\r\n // Update the 'VALID' column (last column) based on the API response\r\n row[6] = valid ? 'OK' : 'ERROR'; // Adjust this logic based on actual API response\r\n\r\n // Push updated row data to array\r\n updatedPastedTests.push({\r\n testKitId: row[0],\r\n T: row[1],\r\n X: row[2],\r\n G: row[3],\r\n S: row[4],\r\n C: row[5],\r\n VALID: row[6],\r\n });\r\n // Update the state with processed data\r\n setPastedTests(updatedPastedTests.filter(item => item.VALID === 'OK'));\r\n }\r\n }\r\n };\r\n\r\n await processParsedData();\r\n setTableData(parsedData);\r\n\r\n } catch (err) {\r\n setmsgToast(err.message);\r\n setTableData([]);\r\n setOpenImportModal(false);\r\n setOpenToast(true);\r\n }\r\n };\r\n\r\n const createNumericColumn = (field, headerName, maxWidth = 50) => ({\r\n field,\r\n headerName,\r\n maxWidth,\r\n align: 'right',\r\n headerAlign: 'center',\r\n valueFormatter: (params) => {\r\n if (params === null || params === undefined || params === '') {\r\n return '0.00000';\r\n }\r\n return Number(params).toFixed(5);\r\n },\r\n });\r\n\r\n const [selectedRows, setSelectedRows] = useState([]);\r\n\r\n const handleCheckboxSelect = (id) => {\r\n setSelectedRows((prevSelectedRows) =>\r\n prevSelectedRows.includes(id)\r\n ? prevSelectedRows.filter(rowId => rowId !== id)\r\n : [...prevSelectedRows, id]\r\n );\r\n };\r\n\r\n const columns = [\r\n ...(userRole === \"Admin\" ? [\r\n { field: 'checkbox', \r\n headerName: '', \r\n maxWidth: 40, \r\n renderCell: (params) => (\r\n \r\n Resend\r\n Questionnaire\r\n
\r\n ),\r\n align: 'center', \r\n headerAlign: 'center',\r\n renderCell: (params) => (\r\n \r\n\r\n \r\n \r\n \r\n \r\n {/* Campo de busca */}\r\n \r\n \r\n \r\n \r\n )\r\n }}\r\n />\r\n \r\n\r\n \r\n {userRole === \"Lab_Manager\" && (\r\n \r\n \r\n \r\n )}\r\n\r\n {userRole === \"Admin\" && (\r\n \r\n \r\n \r\n )}\r\n \r\n\r\n \r\n \r\n Ready to Report \r\n \r\n \r\n \r\n {/* Grid de resultados */}\r\n \r\n\r\n ({\r\n ...column,\r\n flex: 1, // Allows each column to auto-size based on content\r\n p: 2\r\n\r\n }))}\r\n initialState={{\r\n pagination: {\r\n paginationModel: {\r\n pageSize: 5,\r\n },\r\n },\r\n }}\r\n pageSizeOptions={[5]}\r\n disableSelectionOnClick // Disables row selection on click\r\n checkboxSelection={false} // Removes the checkbox column\r\n components={{\r\n Pagination: () => (\r\n \r\n {/* Modal de upload */}\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n setSearchText(e.target.value)}\r\n onKeyDown={handleSearchKeyDown}\r\n InputProps={{\r\n startAdornment: \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Show Active Only \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default NotFound;\r\n","import { Button, Box, DialogTitle, DialogContentText, Typography, DialogContent, Stack, DialogActions, Card, CardContent, Dialog, TextField, MenuItem, Paper, Select, InputLabel, FormControl, Grid } from \"@mui/material\";\r\nimport { useState, useEffect } from 'react';\r\nimport NavBar from '../shared/navBar';\r\nimport SideBar from '../shared/sideBar';\r\nimport { DataGrid } from '@mui/x-data-grid';\r\nimport { LineChart } from '@mui/x-charts/LineChart';\r\nimport { FaUserInjured } from \"react-icons/fa\";\r\nimport { FaBriefcaseMedical } from \"react-icons/fa6\";\r\nimport { apiService } from '../services/apiService';\r\nimport CssBaseline from '@mui/material/CssBaseline';\r\nimport { styled, createTheme, ThemeProvider } from '@mui/material/styles';\r\nimport Container from '@mui/material/Container';\r\nimport Autocomplete from '@mui/material/Autocomplete';\r\nimport { useNavigate } from \"react-router-dom\";\r\n\r\nconst PartnerDash = () => {\r\n\r\n const columns = [\r\n { field: 'id', headerName: 'ID', width: 90 },\r\n {\r\n field: 'firstName',\r\n headerName: 'First name',\r\n width: 150,\r\n editable: true,\r\n },\r\n {\r\n field: 'lastName',\r\n headerName: 'Last name',\r\n width: 150,\r\n editable: true,\r\n },\r\n {\r\n field: 'age',\r\n headerName: 'Age',\r\n type: 'number',\r\n width: 110,\r\n editable: true,\r\n },\r\n {\r\n field: 'fullName',\r\n headerName: 'Full name',\r\n description: 'This column has a value getter and is not sortable.',\r\n sortable: false,\r\n width: 160,\r\n valueGetter: (value, row) => `${row.firstName || ''} ${row.lastName || ''}`,\r\n },\r\n ];\r\n\r\n const rows = [\r\n { id: 1, lastName: '', firstName: '', age: 0 },\r\n ];\r\n\r\n const [partnererror, setPartnererror] = useState('');\r\n const navigate = useNavigate();\r\n\r\n const defaultTheme = createTheme();\r\n\r\n const [lstPartners, setlstPartnerAll] = useState([]);\r\n const [open, setOpen] = useState(false);\r\n const [partnerId, setPartnerId] = useState(0);\r\n\r\n const resetForm = () => {\r\n setFields(initialState);\r\n };\r\n\r\n const initialState = {\r\n Name: \"\",\r\n email: \"\",\r\n mobile: \"\",\r\n PartnerType: {\r\n Type: \"\"\r\n },\r\n partnerAddress: {\r\n streetAddress: \"\",\r\n extendedAddress: \"\",\r\n postalCode: \"\",\r\n country: \"\",\r\n provinceOrState: {\r\n name: \"\"\r\n },\r\n city: {\r\n name: \"\"\r\n }\r\n }\r\n };\r\n\r\n const [fields, setFields] = useState(initialState);\r\n\r\n const handlePartnerChange = (e, field) => {\r\n setFields(prev => ({\r\n ...prev,\r\n [field]: { Type: e.target.value },\r\n }));\r\n };\r\n\r\n\r\n const [selectedPartner, setSelectedPartner] = useState('');\r\n const [totaltesters, setTotaltesters] = useState(0);\r\n const [totaltests, setTotaltests] = useState(0);\r\n\r\n useEffect(() => {\r\n async function fetchData() {\r\n try {\r\n const partners = await apiService.partnerall();\r\n if (Array.isArray(partners.data)) {\r\n const names = partners.data.map(item => ({ id: item.id, name: item.name }));\r\n setlstPartnerAll(names);\r\n };\r\n\r\n } catch (error) {\r\n console.error('Error fetching partner types.', error);\r\n // Handle error\r\n }\r\n }\r\n\r\n fetchData();\r\n }, []);\r\n\r\n const addNew = () => {\r\n navigate('/partnerinfo/0');\r\n }\r\n\r\n const handleChange = (e, field) => {\r\n setFields(prev => ({\r\n ...prev,\r\n [field]: e.target.value,\r\n }));\r\n\r\n setPartnererror('');\r\n };\r\n\r\n const edit = () => {\r\n if (partnerId === 0) {\r\n setPartnererror('* Select partner for edit');\r\n }\r\n else {\r\n navigate(`/partnerinfo/${partnerId}`);\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n \r\n {
\r\n\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Oopss!
\r\n I didn't find the requested page.\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n theme.palette.mode === 'light'\r\n ? theme.palette.grey[100]\r\n : theme.palette.grey[900],\r\n flexGrow: 1,\r\n height: '100vh',\r\n overflow: 'visible',\r\n p: 3,\r\n }}>\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Total Testers \r\n \r\n \r\n {totaltesters}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Total Tests \r\n \r\n \r\n {totaltests}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Tests Completed \r\n\r\n \r\n \r\n Recent Test Result \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n )\r\n};\r\n\r\nexport default PartnerDash;","import './PartnerDetail.css';\r\nimport { useNavigate } from 'react-router-dom';\r\nimport React, { useState, useEffect } from 'react';\r\nimport { Box, mobileStepperClasses } from \"@mui/material\";\r\nimport { apiService } from '../services/apiService';\r\nimport LogoImage from \"../assets/logo_partner.png\";\r\n\r\nconst PartnerDetail = (content) => {\r\n\r\n const navigate = useNavigate();\r\n const [idpartner, setIdpartner] = useState('');\r\n const [address, setAddress] = useState({\r\n id: '',\r\n streetAddress: '',\r\n extendedAddress: '',\r\n provinceOrState: '',\r\n city: '',\r\n country: '',\r\n postalCode: '',\r\n logo: ''\r\n });\r\n\r\n const [fields, setFields] = useState({\r\n id: '',\r\n name: '',\r\n partnerType: '',\r\n streetAddress: '',\r\n extendedAddress: '',\r\n provinceOrState: '',\r\n city: '',\r\n country: '',\r\n postalCode: '',\r\n logo: ''\r\n });\r\n const [isMobile, setIsMobile] = useState(false);\r\n const [Mobile, setMobile] = useState(600);\r\n\r\n useEffect(() => {\r\n \r\n setIsMobile(window.innerWidth < 600);\r\n setMobile(window.innerWidth < 600 ? 300 : 600);\r\n setIdpartner(String(content.data));\r\n async function fetchData() {\r\n try {\r\n if (idpartner) {\r\n const partner = await apiService.partnerbyid(idpartner);\r\n const partnerTypeData = { param: String(partner.data.partnerTypeId) };\r\n\r\n const partnertype = await apiService.partnertypebyid(partnerTypeData);\r\n const addressId = partner.data.addressId;\r\n\r\n if (addressId) {\r\n const partneradress = await apiService.addressbyid({ param: String(addressId) })\r\n setAddress(partneradress.data);\r\n setFields({\r\n id: partner.data.id,\r\n name: partner.data.name,\r\n partnerType: partnertype.data.type,\r\n streetAddress: partneradress.data.streetAddress,\r\n extendedAddress: partneradress.data.extendedAddress,\r\n provinceOrState: String(partneradress.data.provinceOrState.name),\r\n city: String(partneradress.data.city.name),\r\n country: partneradress.data.country,\r\n postalCode: partneradress.data.postalCode,\r\n logo: partner.data.logo,\r\n site: partner.data.site\r\n });\r\n }\r\n }\r\n\r\n } catch (error) {\r\n console.error('Error fetching data:', error);\r\n }\r\n }\r\n\r\n fetchData();\r\n }, [idpartner]);\r\n\r\n return (\r\n Recent Testers
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n };\r\n \r\n\r\nexport default PartnerDetail;","import { Button, TextField } from \"@mui/material\";\r\nimport React, { useState, useEffect, useRef } from 'react';\r\nimport { apiService } from '../services/apiService';\r\nimport './PartnerFind.css';\r\nimport PartnerDetail from './PartnerDetail';\r\nimport Autocomplete from '@mui/material/Autocomplete';\r\nimport LogoImage from \"../assets/logo_partner.png\";\r\n\r\nconst PartnerFind = () => {\r\n const [selectedCity, setSelectedCity] = useState('Select Location');\r\n const [loading, setLoading] = useState(true);\r\n const [error, setError] = useState(false);\r\n const [partnerlst, setPartnerlst] = useState([]);\r\n const [filteredpartnerlst, setFilteredPartnerlst] = useState([]);\r\n const [isModalOpen, setIsModalOpen] = useState(false);\r\n const [idpartner, setIdpartner] = useState(null);\r\n const [popupPosition, setPopupPosition] = useState({ top: 0, left: 0 });\r\n const modalRef = useRef(null);\r\n\r\n const [windowSize, setWindowSize] = useState({\r\n width: 600,\r\n height: 250,\r\n });\r\n\r\n const [lstCities, setLstCities] = useState([]);\r\n\r\n useEffect(() => {\r\n if (window.innerWidth < 600)\r\n setWindowSize({\r\n width: 320,\r\n height: 230,\r\n });\r\n\r\n const fetchData = async () => {\r\n try {\r\n const cities = await apiService.citiesall();\r\n if (Array.isArray(cities.data)) {\r\n const names = cities.data.map(item => item.name);\r\n setLstCities(['All Locations', ...names]);\r\n }\r\n\r\n const response = await apiService.partnerall();\r\n if (!response) {\r\n throw new Error('Network response was not ok');\r\n }\r\n\r\n if (Array.isArray(response.data)) {\r\n const filteredPartners = response.data.filter(item => !item.name.includes('MYOMAR') && !item.name.includes('TEST'));\r\n\r\n setPartnerlst(filteredPartners);\r\n \r\n setFilteredPartnerlst(filteredPartners); //.filter(item => item.partnerAddress.city.name === '888')\r\n \r\n }\r\n } catch (error) {\r\n setError(error.message);\r\n } finally {\r\n setLoading(false);\r\n }\r\n };\r\n\r\n fetchData();\r\n }, []);\r\n\r\n useEffect(() => {\r\n const handleClickOutside = (event) => {\r\n if (modalRef.current && !modalRef.current.contains(event.target)) {\r\n setIsModalOpen(false);\r\n }\r\n };\r\n\r\n if (isModalOpen) {\r\n document.addEventListener('mousedown', handleClickOutside);\r\n } else {\r\n document.removeEventListener('mousedown', handleClickOutside);\r\n }\r\n\r\n return () => {\r\n document.removeEventListener('mousedown', handleClickOutside);\r\n };\r\n }, [isModalOpen]);\r\n\r\n const handleClick = (id, event) => {\r\n setIdpartner(id);\r\n\r\n const cardRect = event.currentTarget.getBoundingClientRect();\r\n\r\n let top = cardRect.bottom;\r\n let left = cardRect.left;\r\n\r\n // Adjust if modal goes out of viewport\r\n if (top + windowSize.height + 100 > window.innerHeight) {\r\n top = window.innerHeight - windowSize.height - 100;\r\n }\r\n left = (window.innerWidth - windowSize.width) / 2;\r\n\r\n setPopupPosition({ top, left });\r\n setIsModalOpen(true);\r\n };\r\n\r\n const handleCityChange = (event, newValue) => {\r\n setSelectedCity(newValue);\r\n };\r\n\r\n const handleSearch = () => {\r\n\r\n if (selectedCity === 'All Locations') {\r\n setFilteredPartnerlst(partnerlst);\r\n }\r\n else {\r\n setFilteredPartnerlst(partnerlst.filter(item => item.partnerAddress.city.name === selectedCity));\r\n }\r\n };\r\n\r\n if (loading) {\r\n return \r\n {fields.name}\r\n
\r\n \r\n{fields.partnerType}
\r\n\r\n {fields.streetAddress}
\r\n {fields.extendedAddress && {fields.extendedAddress}
}\r\n {fields.city}{\", \"}{fields.provinceOrState}
\r\n {fields.postalCode}{\", \"}{fields.country}
\r\n {fields.site}\r\n \r\n
Loading...
;\r\n }\r\n\r\n if (error) {\r\n return Error: {error}
;\r\n }\r\n\r\n return (\r\n \r\n
\r\n
\r\n
\r\n );\r\n};\r\n\r\nexport default PartnerFind;\r\n","import './PartnerInfo.css';\r\nimport { useNavigate, useParams } from 'react-router-dom';\r\nimport React, { useState, useEffect } from 'react';\r\nimport { TextField, Button, Box, InputLabel, MenuItem, Select, FormControl, FormControlLabel, Checkbox, Grid, Paper, Container } from \"@mui/material\";\r\nimport Toast from \"../shared/toast\";\r\nimport { apiService } from '../services/apiService';\r\nimport Autocomplete from '@mui/material/Autocomplete';\r\nimport SideBar from '../shared/sideBar';\r\nimport LogoImage from \"../assets/logo_partner.png\";\r\nimport { authService } from \"../services/authService\";\r\nimport NavBar from '../shared/navBar';\r\nimport urlHomeBase from '../services/urlBase';\r\nimport Header from \"../shared/header.js\";\r\nimport NavInfo from \"../shared/NavInfo.js\";\r\n\r\nconst PartnerInfo = () => {\r\n const [msgToast, setmsgToast] = useState('');\r\n const [openToast, setOpenToast] = useState(false);\r\n const [error, setError] = useState(false);\r\n const [returnto, setReturnto] = useState(false);\r\n const [customValue, setCustomValue] = useState('');\r\n const [lstProvOrState, setlstProvOrState] = useState([]);\r\n const [lstPartnerType, setlstPartnerType] = useState([]);\r\n const [lstCities, setlstcities] = useState([]);\r\n const [addressId, setAddressId] = useState(null);\r\n const [logo, setLogo] = useState(null);\r\n const [thumbnail, setThumbnail] = useState(null);\r\n const navigate = useNavigate();\r\n const [urlBase, setUrlBase] = useState();\r\n const [userRole, setUserRole] = useState('');\r\n \r\n const initialState = {\r\n name: \"\",\r\n partnerType: {\r\n type: \"\"\r\n },\r\n partnerAddress: {\r\n streetAddress: \"\",\r\n extendedAddress: \"\",\r\n postalCode: \"\",\r\n country: \"\",\r\n provinceOrState: {\r\n name: \"\"\r\n },\r\n city: {\r\n name: \"\"\r\n }\r\n },\r\n active: false\r\n };\r\n\r\n const [fields, setFields] = useState(initialState);\r\n \r\n\r\n\r\n const handleLogoChange = async (e) => {\r\n const file = e.target.files[0];\r\n if (file) {\r\n try {\r\n const file64 = await readFileAsBase64(file);\r\n const thumb64 = await createThumbnail(file, 100, 100);\r\n\r\n setFields(prev => ({ ...prev, logo: file64 }));\r\n setLogo(file);\r\n setThumbnail(thumb64);\r\n } catch (error) {\r\n console.error(\"Erro ao processar imagem:\", error);\r\n }\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t \r\n }\r\n };\r\n\r\n const handleChange = (e, field, newValue = null) => {\r\n setFields(prev => ({\r\n ...prev,\r\n [field]: field === 'active' ? e.target.checked : (newValue !== null ? newValue : e.target.value),\r\n }));\r\n };\r\n\r\n const handleInputChange = (e, newValue, field) => {\r\n setFields(prev => ({\r\n ...prev,\r\n [field]: newValue, // Directly set the new input value\r\n }));\r\n };\r\n\r\n const handleCancel = async () => {\r\n navigateTo();\r\n };\r\n\r\n const navigateTo = async () => {\r\n try {\r\n const storeduser = authService.getUserData();\r\n const userbaseUrl = urlHomeBase[storeduser.role];\r\n //setUrlBase(userbaseUrl);\r\n navigate(userbaseUrl);\r\n } catch (error) {\r\n console.error('Error fetching user data:', error);\r\n // Optionally, handle the error by showing a message to the user\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n async function fetchData() {\r\n try {\r\n const storeduser = authService.getUserData();\r\n\r\n const [partnertypes, provstates, cities] = await Promise.all([\r\n apiService.partnertypeall(),\r\n apiService.provinceorstateall(),\r\n apiService.citiesall()\r\n ]);\r\n\r\n const mapData = (data, key) => data.map(item => item[key]);\r\n\r\n setlstPartnerType(mapData(partnertypes.data, 'type'));\r\n setlstProvOrState(mapData(provstates.data, 'name'));\r\n setlstcities(mapData(cities.data, 'name'));\r\n\r\n if (storeduser.selectedPartner !== '0') {\r\n const partnermailData = { param: storeduser.selectedPartner };\r\n const partneradm = await apiService.admbypartnerid(partnermailData);\r\n const partner = await apiService.partnerbyid(storeduser.selectedPartner);\r\n const partnerTypeData = { param: String(partner.data.partnerTypeId) };\r\n const partnerType = await apiService.partnertypebyid(partnerTypeData);\r\n setAddressId(partner.data.addressId);\r\n\r\n setFields({\r\n id: partner.data.id,\r\n active: partner.data.active,\r\n email: partneradm?.data?.email || '',\r\n name: partner.data.name,\r\n partnerType: partnerType.data.type,\r\n addressId: addressId,\r\n streetAddress: partner?.data?.partnerAddress?.streetAddress || '',\r\n extendedAddress: partner?.data?.partnerAddress?.extendedAddress || '',\r\n provinceOrState: String(partner?.data?.partnerAddress?.provinceOrState.name || ''),\r\n city: String(partner?.data?.partnerAddress?.city?.name || ''),\r\n country: partner?.data?.partnerAddress?.country || '',\r\n postalCode: partner?.data?.partnerAddress?.postalCode || '',\r\n site: partner?.data?.site || '',\r\n logo: partner?.data?.logo || ''\r\n });\r\n }\r\n } catch (error) {\r\n setReturnto(true);\r\n setmsgToast(\"Unable to access data. Please contact administrator Myomar\");\r\n setError(true);\r\n setOpenToast(true);\r\n }\r\n }\r\n\r\n fetchData();\r\n }, []);\r\n\r\n const createThumbnail = async (file, maxWidth = 100, maxHeight = 100) => {\r\n return new Promise((resolve, reject) => {\r\n const reader = new FileReader();\r\n reader.onload = (event) => {\r\n const img = new Image();\r\n img.onload = () => {\r\n const canvas = document.createElement('canvas');\r\n let width = img.width;\r\n let height = img.height;\r\n\r\n if (width > height) {\r\n if (width > maxWidth) {\r\n height *= maxWidth / width;\r\n width = maxWidth;\r\n }\r\n } else {\r\n if (height > maxHeight) {\r\n width *= maxHeight / height;\r\n height = maxHeight;\r\n }\r\n }\r\n\r\n canvas.width = width;\r\n canvas.height = height;\r\n const ctx = canvas.getContext(\"2d\");\r\n ctx.drawImage(img, 0, 0, width, height);\r\n\r\n resolve(canvas.toDataURL(\"image/png\"));\r\n };\r\n\r\n img.onerror = (error) => reject(error);\r\n img.src = event.target.result;\r\n };\r\n reader.onerror = (error) => reject(error);\r\n reader.readAsDataURL(file);\r\n });\r\n };\r\n \r\n\r\n\r\n\r\n const handleSubmit = async (e) => {\r\n e.preventDefault();\r\n try {\r\n\r\n const setDefault = (value) => (value === null || value === undefined ? '' : value);\r\n\r\n const updatedFields = {\r\n Active: setDefault(fields.active),\r\n Email: setDefault(fields.email).toLowerCase(),\r\n Name: setDefault(fields.name).toUpperCase(),\r\n PartnerType: {\r\n type: setDefault(fields.partnerType).toUpperCase(),\r\n },\r\n partnerAddress: {\r\n streetAddress: setDefault(fields.streetAddress).toUpperCase(),\r\n extendedAddress: setDefault(fields.extendedAddress).toUpperCase(),\r\n provinceOrState: {\r\n name: setDefault(fields.provinceOrState).toUpperCase(),\r\n },\r\n city: {\r\n name: setDefault(fields.city).toUpperCase(),\r\n },\r\n country: setDefault(fields.country).toUpperCase(),\r\n postalCode: setDefault(fields.postalCode).toUpperCase(),\r\n },\r\n Logo: setDefault(fields.logo),\r\n Site: setDefault(fields.site).toLowerCase(),\r\n };\r\n const storeduser = authService.getUserData();\r\n if (storeduser.selectedPartner !== '0') {\r\n updatedFields.Id = Number(storeduser.selectedPartner);\r\n updatedFields.partnerAddress.Id = Number(addressId);\r\n }\r\n\r\n await apiService.partneradd(updatedFields);\r\n setReturnto(true);\r\n setError(false);\r\n setmsgToast('Data updated successfully.');\r\n setOpenToast(true);\r\n\r\n } catch (error) {\r\n setReturnto(false);\r\n setError(true);\r\n setmsgToast(error.message + '\r\n (\r\n
\r\n\r\n {filteredpartnerlst.map((item) => (\r\n handleClick(item.id, e)}>\r\n
\r\n\r\n ))}\r\n\r\n {isModalOpen && (\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n {item.name} - {item.partnerType.type}\r\n
\r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n
Check the entered data.');\r\n setOpenToast(true);\r\n }\r\n };\r\n\r\n const readFileAsBase64 = async (logo) => {\r\n if (logo.size > 100000) {\r\n setReturnto(false);\r\n setError(true);\r\n setmsgToast('The file is very large.
Reduce the file size and try again.');\r\n setOpenToast(true);\r\n }\r\n else {\r\n return new Promise((resolve, reject) => {\r\n const reader = new FileReader();\r\n reader.onload = (event) => {\r\n const arrayBuffer = event.target.result;\r\n const bytes = new Uint8Array(arrayBuffer);\r\n const base64String = btoa(String.fromCharCode.apply(null, bytes));\r\n resolve(base64String);\r\n };\r\n reader.onerror = (error) => {\r\n reject(error);\r\n };\r\n reader.readAsArrayBuffer(logo);\r\n });\r\n }\r\n };\r\n\r\n const handleCloseToast = () => {\r\n setOpenToast(false);\r\n if (returnto) {\r\n navigateTo();\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
) : null\r\n}\r\n \r\n Please fill out the following information\r\n
\r\n\r\n \r\n Test Kits \r\n \r\n \r\n setTestKitNumber(e.target.value)}\r\n onKeyDown={(e) => e.key === 'Enter' && handleAdd()}\r\n autoFocus\r\n inputProps={{\r\n maxLength: 8, // Limita o número de caracteres para 8\r\n }}\r\n InputProps={{\r\n endAdornment: (\r\n \r\n setTestKitNumber('')}\r\n >\r\n \r\n )\r\n }}\r\n sx={{\r\n '.MuiOutlinedInput-root': {\r\n borderRadius: '5px',\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n '.MuiInputAdornment-root': {\r\n margin: '0 4px',\r\n }\r\n }}\r\n />\r\n \r\n \r\n \r\n ADD\r\n \r\n \r\n \r\n \r\n {partnerName} \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n Done\r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n {/* Delete Confirmation Dialog */}\r\n Loading...
;\r\n }\r\n\r\n if (error) {\r\n return Error: {error}
;\r\n }\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\n\r\nexport default PartnerView;","import React, { useState, useEffect } from 'react';\r\nimport { Container, Grid, Box, Button, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Paper, TablePagination, Typography } from '@mui/material';\r\nimport { apiService } from '../services/apiService';\r\nimport { authService } from '../services/authService';\r\nimport NavBar from '../shared/navBar';\r\nimport SideBar from '../shared/sideBar';\r\nimport { useNavigate } from \"react-router-dom\";\r\nimport Header from \"../shared/header.js\";\r\nimport NavInfo from \"../shared/NavInfo.js\";\r\n\r\nconst Questionnaire = () => {\r\n const [questionnaires, setQuestionnaires] = useState([]);\r\n const [testResult, setTestResult] = useState([]);\r\n const [rowsPerPage, setRowsPerPage] = useState(5);\r\n const [page, setPage] = useState(0);\r\n const navigate = useNavigate();\r\n\r\n useEffect(() => {\r\n const fetchQuestionnaires = async () => {\r\n try {\r\n const userData = await authService.getUserData();\r\n const testResult = await apiService.getTestResultQuestionnaireUserActive(userData.id);\r\n setTestResult(testResult.data);\r\n const response = await apiService.getUserQuestionnaires(userData.id);\r\n setQuestionnaires(response.data);\r\n } catch (err) {\r\n console.log(err);\r\n }\r\n };\r\n\r\n fetchQuestionnaires();\r\n }, []);\r\n\r\n const handleChangePage = (event, newPage) => {\r\n setPage(newPage);\r\n };\r\n\r\n const handleChangeRowsPerPage = (event) => {\r\n setRowsPerPage(parseInt(event.target.value, 5));\r\n setPage(0);\r\n };\r\n\r\n const startQuestionnaire = (questionnaireId, questionnaireUserId) => {\r\n navigate(`/questionnaireQuestions/${questionnaireId}/${questionnaireUserId}`);\r\n };\r\n\r\n return (\r\n <>\r\n Partner Viewer
\r\n\r\n\r\n
\r\n
\r\n
\r\n\r\n\r\n\r\n \r\n (\r\n
\r\n\r\n {filteredpartnerlst.map((item) => (\r\n handleClick(item.id, e)}>\r\n
\r\n\r\n ))}\r\n\r\n {isModalOpen && (\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n {item.name} - {item.partnerType.type}\r\n
\r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default Questionnaire;\r\n","import React, { useState, useEffect } from 'react';\r\nimport { Container, Grid, Box, Button, TextField, Typography, ListItemText, FormControl, Select, Paper, MenuItem, InputLabel, Dialog, DialogTitle, DialogContent, DialogContentText, DialogActions, Checkbox, FormControlLabel } from '@mui/material';\r\nimport { apiService } from '../services/apiService';\r\nimport { authService } from \"../services/authService\";\r\nimport { useParams, useNavigate } from \"react-router-dom\";\r\nimport NavBar from '../shared/navBar';\r\nimport SideBar from '../shared/sideBar';\r\nimport Toast from '../shared/toast';\r\nimport { title } from 'process';\r\nimport Header from \"../shared/header.js\";\r\nimport NavInfo from \"../shared/NavInfo.js\";\r\n\r\nconst QuestionnaireQuestions = () => {\r\n const { questionnaireId, questionnaireUserId } = useParams(); // Recebendo o questionnaireUserId como parâmetro\r\n const [questionnaire, setQuestionnaire] = useState(null);\r\n const [testResult, setTestResult] = useState(null);\r\n const [questionnaireUser, setQuestionnaireUser] = useState(null);\r\n const [answers, setAnswers] = useState({});\r\n const [answersSpecify, setAnswersSpecify] = useState({}); // Estado para armazenar respostas específicas\r\n const [savedAnswers, setSavedAnswers] = useState([]); // Variável para armazenar as respostas já salvas\r\n const [openConfirmDialog, setOpenConfirmDialog] = useState(false); // Estado para o Dialog de confirmação\r\n const [openTermsDialog, setOpenTermsDialog] = useState(false); // Estado para o Dialog de termos e condições\r\n const [userName, setUserName] = useState();\r\n const [PersonalInfoAccepted, setPersonalInfoAccepted] = useState(null);\r\n const [SampleForAnalisisAccepted, setSampleForAnalisisAccepted] = useState(null);\r\n const [openToast, setOpenToast] = useState(false);\r\n const [msgToast, setmsgToast] = useState('');\r\n const [error, setError] = useState(false);\r\n const navigate = useNavigate();\r\n\r\n const handleCloseToast = () => {\r\n setOpenToast(false);\r\n };\r\n\r\n useEffect(() => {\r\n const fetchQuestionnaire = async () => {\r\n try {\r\n const response = await apiService.getQuestionnaireById(Number(questionnaireId));\r\n setQuestionnaire(response.data);\r\n } catch (err) {\r\n console.log(err);\r\n }\r\n };\r\n\r\n fetchQuestionnaire();\r\n }, [questionnaireId]);\r\n\r\n useEffect(() => {\r\n if (questionnaire) {\r\n const fetchTermsAccept = async () => {\r\n try {\r\n const response = await apiService.getUserQuestionnaireById(Number(questionnaireUserId));\r\n setQuestionnaireUser(response.data);\r\n\r\n const test = await apiService.getTestResultByQuestionnaireUserId(Number(questionnaireUserId));\r\n setTestResult(test.data);\r\n\r\n const userdata = await authService.getUserData();\r\n setUserName(userdata.firstName + ' ' + userdata.lastName);\r\n setPersonalInfoAccepted(response.data.agreementTerms != null);\r\n setSampleForAnalisisAccepted(response.data.agreementConsent != null);\r\n if (response.data.agreementTerms != null & response.data.agreementConsent != null) {\r\n setOpenTermsDialog(false);\r\n }\r\n else {\r\n setOpenTermsDialog(true);\r\n };\r\n } catch (err) {\r\n console.log(err);\r\n }\r\n };\r\n\r\n fetchTermsAccept();\r\n }\r\n }, [questionnaire]);\r\n\r\n useEffect(() => {\r\n if (PersonalInfoAccepted && SampleForAnalisisAccepted) {\r\n const fetchSavedAnswers = async () => {\r\n try {\r\n let response = await apiService.getQuestionnaireUserAnswersByQuestionnaireUserId(Number(questionnaireUserId));\r\n let loadedAnswers = response.data;\r\n\r\n if (loadedAnswers.length === 0 && testResult.testNumber > 1) { \r\n const tResult = await apiService.getPreviousTestResult(Number(testResult.user?.id), Number(testResult.testNumber));\r\n response = await apiService.getQuestionnaireUserAnswersByQuestionnaireUserId(Number(tResult.data.questionnaireUserId));\r\n loadedAnswers = response.data;\r\n }\r\n \r\n if (Array.isArray(loadedAnswers)) {\r\n setSavedAnswers(loadedAnswers);\r\n \r\n setAnswers(prev => {\r\n const updatedAnswers = { ...prev };\r\n loadedAnswers.forEach(answer => {\r\n if (!updatedAnswers[answer.questionId]) {\r\n updatedAnswers[answer.questionId] = answer.value.includes(';')\r\n ? answer.value.split(';').map(v => parseInt(v))\r\n : answer.value;\r\n }\r\n });\r\n return updatedAnswers;\r\n });\r\n \r\n setAnswersSpecify(prev => {\r\n const updatedSpecify = { ...prev };\r\n loadedAnswers.forEach(answer => {\r\n if (answer.valueSpecify && !updatedSpecify[answer.questionId]) {\r\n updatedSpecify[answer.questionId] = answer.valueSpecify;\r\n }\r\n });\r\n return updatedSpecify;\r\n });\r\n }\r\n\r\n } catch (err) {\r\n console.log(err);\r\n }\r\n };\r\n\r\n fetchSavedAnswers();\r\n }\r\n }, [PersonalInfoAccepted, SampleForAnalisisAccepted, questionnaireUserId]);\r\n\r\n\r\n const handleChange = (questionId, value) => {\r\n setAnswers((prev) => ({ ...prev, [questionId]: value }));\r\n };\r\n\r\n const handleSpecifyChange = (questionId, specifyValue) => {\r\n setAnswersSpecify((prev) => ({ ...prev, [questionId]: specifyValue }));\r\n };\r\n\r\n const handleSubmit = async () => {\r\n if (!PersonalInfoAccepted) {\r\n setOpenTermsDialog(true);\r\n return;\r\n }\r\n\r\n try {\r\n for (const [questionId, value] of Object.entries(answers)) {\r\n await apiService.addQuestionnaireUserAnswer({\r\n QuestionnaireUserId: Number(questionnaireUserId),\r\n QuestionId: parseInt(questionId, 10),\r\n Value: Array.isArray(value) ? value.join(';') : String(value),\r\n ValueSpecify: answersSpecify[questionId] || ''\r\n });\r\n }\r\n\r\n await apiService.completeQuestionnaireUser(questionnaireUserId);\r\n\r\n setmsgToast('Questionnaire Complete');\r\n navigate('/questionnaire');\r\n } catch (err) {\r\n console.log(err);\r\n setmsgToast('Error completing the questionnaire.');\r\n setError(true);\r\n } finally {\r\n setOpenToast(true);\r\n }\r\n };\r\n\r\n const getSavedAnswerValue = (questionId) => {\r\n const savedAnswer = savedAnswers.find((sa) => sa.questionId === questionId);\r\n return savedAnswer ? savedAnswer.value : '';\r\n };\r\n\r\n const getSavedAnswerSpecifyValue = (questionId) => {\r\n const savedAnswer = savedAnswers.find((sa) => sa.questionId === questionId);\r\n return savedAnswer ? savedAnswer.valueSpecify : '';\r\n };\r\n\r\n const handleOpenConfirmDialog = () => {\r\n setOpenConfirmDialog(true);\r\n };\r\n\r\n const handleCloseConfirmDialog = () => {\r\n setOpenConfirmDialog(false);\r\n };\r\n\r\n const handleConfirmSubmit = () => {\r\n handleSubmit();\r\n handleCloseConfirmDialog();\r\n };\r\n\r\n const handleAcceptTerms = async () => {\r\n questionnaireUser.agreementConsent = SampleForAnalisisAccepted;\r\n questionnaireUser.agreementTerms = PersonalInfoAccepted;\r\n await apiService.updateQuestionnaireUser({\r\n questionnaireUser\r\n });\r\n\r\n if (PersonalInfoAccepted != null & SampleForAnalisisAccepted != null) {\r\n setPersonalInfoAccepted(true);\r\n setSampleForAnalisisAccepted(true);\r\n setOpenTermsDialog(false);\r\n }\r\n };\r\n\r\n const handlePersonalInfoCheckboxChange = (event) => {\r\n if (event.target.checked) {\r\n setPersonalInfoAccepted(new Date().toISOString());\r\n }\r\n else {\r\n setPersonalInfoAccepted(null);\r\n };\r\n };\r\n\r\n const handleSampleForAnalisisCheckboxChange = (event) => {\r\n if (event.target.checked) {\r\n setSampleForAnalisisAccepted(new Date().toISOString());\r\n }\r\n else {\r\n setSampleForAnalisisAccepted(null);\r\n };\r\n };\r\n\r\n if (!questionnaire) {\r\n return \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Please fill out the following questionnaire:\r\n \r\n\r\n \r\n \r\n \r\n )}\r\n \r\n\r\n {/* Modal de confirmação */}\r\n \r\n\r\n \r\n\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default QuestionnaireQuestions;\r\n","import { useNavigate, useParams } from 'react-router-dom';\r\nimport React, { useState, useEffect, useRef } from 'react';\r\nimport NavBar from '../shared/navBar.js';\r\nimport SideBar from '../shared/sideBar.js';\r\nimport Container from '@mui/material/Container';\r\nimport { TextField, Button, Box, Paper, Grid } from \"@mui/material\";\r\nimport FooterBar from \"../shared/footer.js\";\r\nimport Toast from \"../shared/toast.js\";\r\nimport { apiService } from '../services/apiService.js';\r\nimport { authService } from '../services/authService.js';\r\nimport { validator } from '../shared/validator.js';\r\nimport Header from \"../shared/header.js\";\r\nimport NavInfo from \"../shared/NavInfo.js\";\r\n\r\nconst QuickActivate = () => {\r\n\r\n const [userData, setUserData] = useState(null);\r\n const [openToast, setOpenToast] = useState(false);\r\n const [msgToast, setmsgToast] = useState('');\r\n const [returnto, setReturnto] = useState('/');\r\n const [error, setError] = useState(false);\r\n const [emailError, setEmailError] = useState('');\r\n const navigate = useNavigate();\r\n\r\n const [fields, setFields] = useState({\r\n testkitid: '',\r\n email: '',\r\n mobile: ''\r\n });\r\n\r\n const [errors, setErrors] = useState({\r\n testkitid: '',\r\n email: '',\r\n mobile: ''\r\n });\r\n\r\n const testKitRef = useRef(null); // Referência para o campo TestKit\r\n\r\n useEffect(() => {\r\n if (testKitRef.current) {\r\n testKitRef.current.focus(); // Define o foco no campo TestKit ao carregar\r\n }\r\n }, []);\r\n\r\n const handleChange = (e, newValue, field) => {\r\n const value = field === 'mobile' ? newValue.replace(/[^0-9-]/g, '') : newValue;\r\n\r\n if (field === 'mobile' && value.length > 15) {\r\n value = value.slice(0, 15);\r\n }\r\n\r\n setFields((prev) => ({\r\n ...prev,\r\n [field]: value,\r\n }));\r\n };\r\n\r\n\r\n const handleCloseToast = () => {\r\n setOpenToast(false);\r\n navigate('');\r\n };\r\n\r\n const resetForm = () => {\r\n setFields({\r\n testkitid: '',\r\n email: '',\r\n mobile: ''\r\n });\r\n };\r\n\r\n const handleSubmit = async (e) => {\r\n e.preventDefault();\r\n\r\n if (!validateFields()) {\r\n return;\r\n }\r\n\r\n try {\r\n const existEmail = await apiService.verifyEmail({ param: String(fields.email.toLowerCase()) });\r\n if (existEmail.data) {\r\n setErrors((prev) => ({ ...prev, email: '* The email provided already exists' }));\r\n return;\r\n }\r\n\r\n const user = await authService.getUserData();\r\n\r\n const userData = {\r\n Email: fields.email.toLowerCase(),\r\n TestKitId: fields.testkitid,\r\n Mobile: fields.mobile,\r\n UserIdActivated: user.id,\r\n UserPartnerId: user.userpartnerid\r\n };\r\n\r\n const result = await apiService.addQuickActivate(userData);\r\n if (result.statusText === 'OK') {\r\n setmsgToast('Test added successfully.');\r\n setError(false);\r\n setOpenToast(true);\r\n resetForm();\r\n } else {\r\n setmsgToast(result.data);\r\n setError(true);\r\n setOpenToast(true);\r\n return;\r\n }\r\n\r\n\r\n } catch (error) {\r\n setmsgToast(error.request.response);\r\n setError(true);\r\n setOpenToast(true);\r\n }\r\n };\r\n\r\n const validateFields = () => {\r\n let isValid = true;\r\n const newErrors = {};\r\n\r\n if (!fields.testkitid.trim()) {\r\n newErrors.testkitid = '* TestKit ID is required';\r\n isValid = false;\r\n }\r\n const emailvalid = validator.validateEmail(fields.email);\r\n if (emailvalid !== '') {\r\n newErrors.email = emailvalid;\r\n isValid = false;\r\n }\r\n\r\n setErrors(newErrors);\r\n return isValid;\r\n };\r\n\r\n return (\r\n <>\r\n \r\n\r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n \r\n\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {usertoken ? \"Reset Password\": \"Change Password\"}
\r\n\r\n
\r\n \r\n\r\n \r\n Myomar Molecular Inc.\r\n
\r\n+1 902-483-6644
\r\nsupport@myomarmolecular.com
\r\n\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n Sign Up
\r\n\r\n Create your account to start using the platform\r\n
\r\n\r\n
\r\n \r\n Under construction
\r\n\r\n\r\n We are working on it now...
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n ({\r\n ...column,\r\n flex: 0.1, // Allows each column to auto-size based on content\r\n p: 2\r\n \r\n }))}\r\n onPageChange={(newPage) => setPage(newPage)}\r\n initialState={{\r\n pagination: {\r\n paginationModel: {\r\n pageSize: 5,\r\n },\r\n },\r\n }}\r\n pageSizeOptions={[5]}\r\n disableSelectionOnClick // Disables row selection on click\r\n checkboxSelection={false} // Removes the checkbox column\r\n components={{\r\n Pagination: () => (\r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n ');\r\n const rows = normalizedText.split('\\r\\n').filter(row => row.trim() !== '');\r\n const parsedData = rows.map(row =>\r\n row.split('\\t').map(cell => cell.replace(/
/g, '\\n'))\r\n );\r\n\r\n console.log(parsedData); // Debug: Agora as células com múltiplas linhas são preservadas corretamente!\r\n\r\n\r\n const cont = rows[0].split('\\t').filter(value => value.trim() !== '').length;\r\n if (cont < 8) {\r\n throw new Error(\"Invalid Data. Try copy again.\");\r\n }\r\n else {\r\n const parsedData = rows.map(row => row.split('\\t')).map(row => ({\r\n testKitId: row[0],\r\n metabolism: parseFloat(row[1]).toFixed(5),\r\n behaviour: parseFloat(row[2]).toFixed(5),\r\n muscle: parseFloat(row[3]).toFixed(5),\r\n performance: parseFloat(row[4]).toFixed(5),\r\n nutrition: parseFloat(row[5]).toFixed(5),\r\n efficiency: parseFloat(row[6]).toFixed(5),\r\n recovery: parseFloat(row[7]).toFixed(5),\r\n perfmetabolism: row[8],\r\n perfbehaviour: row[9],\r\n nutrmetabolism: row[10],\r\n nutrbehaviour: row[11],\r\n effmetabolism: row[12],\r\n effbehaviour: row[13],\r\n recmetabolism: row[14],\r\n recbehaviour: row[15],\r\n }));\r\n setPastedScores(parsedData);\r\n setTableData(parsedData);\r\n setOpenImportModal(true);\r\n }\r\n } catch (err) {\r\n setmsgToast(\"Failed to paste data. Try copying again.\");\r\n setOpenToast(true);\r\n setError(true);\r\n }\r\n\r\n };\r\n\r\n const handleImportScores = async () => {\r\n try {\r\n await apiService.importTestScores(pastedScores);\r\n\r\n setmsgToast(\"Scores imported successfully!\");\r\n setError(false);\r\n setRefresh(!refresh);\r\n } catch (err) {\r\n setmsgToast(\"Failed to import scores.\");\r\n setError(true);\r\n }\r\n setOpenToast(true);\r\n setOpenImportModal(false);\r\n };\r\n\r\n const handleSearchChange = (event) => {\r\n const query = event.target.value.toLowerCase();\r\n setSearchText(query);\r\n const filteredData = rows.filter(row =>\r\n row.name.toLowerCase().includes(query) ||\r\n row.testKitId.toLowerCase().includes(query)\r\n );\r\n setFilteredRows(filteredData);\r\n };\r\n\r\n const clearSearch = () => {\r\n setSearchText('');\r\n setFilteredRows(rows);\r\n };\r\n\r\n const waitForRender = (ms) => new Promise(resolve => setTimeout(resolve, ms));\r\n\r\n const generatePptFromTemplate = async (rowData, recommendations) => {\r\n try {\r\n\r\n setShowCharts(true);\r\n // Aguarde 500ms para garantir que os gráficos foram renderizados\r\n await waitForRender(1000);\r\n\r\n // Capturar imagens dos gráficos e converter para Base64\r\n const chartIds = [\r\n 'MUSCLESCORECHART',\r\n 'METABOLISMCHART', 'BEHAVIOURCHART', 'MUSCLECHART',\r\n 'PERFORMANCECHART', 'NUTRITIONCHART', 'EFFICIENCYCHART', 'RECOVERYCHART'\r\n \r\n ];\r\n\r\n let images = {};\r\n\r\n const getZone = (value, sex) => {\r\n if (sex === 'M') {\r\n if (value <= 0.446) return 0;\r\n if (value <= 0.535) return 1;\r\n if (value <= 0.624) return 2;\r\n return 3;\r\n }\r\n if (sex === 'F') {\r\n if (value <= 0.363) return 0;\r\n if (value <= 0.481) return 1;\r\n if (value <= 0.599) return 2;\r\n return 3;\r\n }\r\n return -1;\r\n };\r\n\r\n const zoneIndex = getZone(rowData.muscle / 100, rowData.sexAtBirth);\r\n const zoneLabels = ['Low Zone', 'Intermediate Zone', 'Good Zone', 'Excellent Zone'];\r\n const percentiles = ['0-25th percentile', '25-50th percentile', '50-75th percentile', '75-100th percentile'];\r\n const firstTextLocal = `Your Muscle Score is in the ${zoneLabels[zoneIndex]}`;\r\n const secondTextLocal = `Your Muscle Health Score falls within the ${percentiles[zoneIndex]} relative to other test takers of the same age and sex.`;\r\n\r\n //let recommendations = {};\r\n for (const chartId of chartIds) {\r\n const chartElement = document.getElementById(chartId);\r\n let dataUrl;\r\n if (chartElement) {\r\n if (chartId === 'MUSCLESCORECHART') {\r\n const originalCanvas = await htmlToImage.toCanvas(chartElement);\r\n\r\n // Criar um novo canvas maior (Aumenta a altura para comportar os textos)\r\n const newCanvas = document.createElement('canvas');\r\n const ctx = newCanvas.getContext('2d');\r\n\r\n // Define um novo tamanho maior para o canvas (Aumenta a altura)\r\n\r\n const originalWidth = originalCanvas.width;\r\n const originalHeight = originalCanvas.height;\r\n\r\n newCanvas.width = originalCanvas.width;\r\n newCanvas.height = originalCanvas.height;\r\n\r\n // Desenha a imagem original do gráfico no novo canvas\r\n ctx.drawImage(originalCanvas, 0, 0, originalWidth, originalHeight);\r\n\r\n // 📌 🎨 Definição das cores das zonas\r\n const saturatedColors = ['#FF7B7B', '#FFD966', '#6FCF63', '#4CAF50'];\r\n\r\n // 📌 📝 Adicionar textos no Canvas\r\n ctx.font = 'bold 22px Arial';\r\n ctx.fillStyle = saturatedColors[zoneIndex]; // Cor baseada na zona\r\n ctx.textAlign = 'center';\r\n\r\n // 📌 🖼️ Converte o novo canvas para PNG\r\n dataUrl = newCanvas.toDataURL();\r\n\r\n }\r\n else {\r\n\r\n dataUrl = await htmlToImage.toPng(chartElement);\r\n }\r\n if (dataUrl) {\r\n const base64Image = dataUrl.split(',')[1]; // Remove o cabeçalho \"data:image/png;base64,\"\r\n\r\n // Salva a imagem no dicionário de imagens\r\n images[chartId] = base64Image;\r\n }\r\n /*\r\n // TESTE: Abrir a imagem em uma nova aba para verificar\r\n const newWindow = window.open();\r\n if (newWindow) {\r\n newWindow.document.write(`
\r\n Generate\r\n Report\r\n
\r\n ),\r\n align: \"center\",\r\n renderCell: (params) => (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n }}\r\n />\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n ({\r\n ...column,\r\n flex: 1, // Allows each column to auto-size based on content\r\n p: 2\r\n\r\n }))}\r\n initialState={{\r\n pagination: {\r\n paginationModel: {\r\n pageSize: 5,\r\n },\r\n },\r\n }}\r\n pageSizeOptions={[5]}\r\n disableSelectionOnClick // Disables row selection on click\r\n checkboxSelection={false} // Removes the checkbox column\r\n components={{\r\n Pagination: () => (\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n\r\n\r\n \r\n\r\n\r\n \r\n
\r\n )\r\n }\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n ({\r\n ...column,\r\n flex: 1,\r\n p: 2\r\n }))}\r\n onPageChange={(newPage) => setPage(newPage)}\r\n initialState={{\r\n pagination: {\r\n paginationModel: {\r\n pageSize: 5,\r\n },\r\n },\r\n }}\r\n pageSizeOptions={[5]}\r\n disableSelectionOnClick\r\n checkboxSelection={false}\r\n components={{\r\n Pagination: () => (\r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n Check the entered data.');\r\n setReturnto(null);\r\n setError(true);\r\n setOpenToast(true);\r\n }\r\n };\r\n\r\n\r\n\r\n const handleChange = (e, field, newValue = null) => {\r\n setFields(prev => ({\r\n ...prev,\r\n [field]: field === 'active' ? e.target.checked : (newValue !== null ? newValue : e.target.value),\r\n }));\r\n};\r\n\r\nconst handleInputChange = (e, newValue, field) => {\r\n setFields(prev => ({\r\n ...prev,\r\n [field]: newValue, // Directly set the new input value\r\n }));\r\n};\r\n\r\n\r\n const handleCloseToast = () => {\r\n setOpenToast(false);\r\n if (returnto !== null) {\r\n navigate(returnto);\r\n }\r\n };\r\n\r\n const resetForm = () => {\r\n setFields({\r\n email: '',\r\n firstName: '',\r\n lastName: '',\r\n id: '',\r\n mobile: '',\r\n ethnicityId: '',\r\n birthDate: '',\r\n sexAtBirth: '',\r\n streetAddress: '',\r\n extendedAddress: '',\r\n provinceOrState: '',\r\n city: '',\r\n country: 'CA',\r\n postalCode: '',\r\n role: 9,\r\n active: false\r\n });\r\n };\r\n\r\n const handleSubmit = async (e) => {\r\n e.preventDefault();\r\n const emailValidationMsg = validator.validateEmail(fields.email);\r\n setEmailError(emailValidationMsg);\r\n if (emailValidationMsg === '') {\r\n try {\r\n if (userIdCall > 0 && userData) {\r\n // Atualize apenas os campos que mudaram\r\n userData.email = fields.email.toLowerCase();\r\n userData.firstName = fields.firstName.toUpperCase();\r\n userData.lastName = fields.lastName.toUpperCase();\r\n userData.mobile = fields.mobile;\r\n userData.ethnicityId = fields.ethnicityId;\r\n userData.birthDate = fields.birthDate;\r\n userData.sexAtBirth = fields.sexAtBirth;\r\n userData.address = {\r\n streetAddress: fields.streetAddress.toUpperCase(),\r\n extendedAddress: fields.extendedAddress.toUpperCase(),\r\n provinceOrState: {\r\n name: fields.provinceOrState.toUpperCase()\r\n },\r\n city: {\r\n name: fields.city.toUpperCase()\r\n },\r\n country: fields.country.toUpperCase(),\r\n postalCode: fields.postalCode.toUpperCase()\r\n };\r\n userData.role = fields.role;\r\n userData.active = fields.active;\r\n\r\n await apiService.userinfoupdate(userData);\r\n setmsgToast('User updated successfully.');\r\n setReturnto(urlBase);\r\n setError(false);\r\n setOpenToast(true);\r\n } else {\r\n const addFields = {\r\n email: fields.email.toLowerCase(),\r\n firstName: fields.firstName.toUpperCase(),\r\n lastName: fields.lastName.toUpperCase(),\r\n role: fields.role\r\n };\r\n const existEmail = await apiService.verifyEmail({ param: String(fields.email.toLowerCase()) });\r\n if (existEmail.data) {\r\n setmsgToast('The email you entered already exists in our database.');\r\n setReturnto(null);\r\n setError(true);\r\n setOpenToast(true);\r\n } else {\r\n await apiService.useradd(addFields);\r\n setmsgToast('User added successfully.');\r\n setReturnto(urlBase);\r\n setError(false);\r\n setOpenToast(true);\r\n resetForm();\r\n }\r\n }\r\n } catch (error) {\r\n setmsgToast(error.message);\r\n setReturnto(null);\r\n setError(true);\r\n setOpenToast(true);\r\n }\r\n }\r\n };\r\n\r\n const handleCancel = async () => {\r\n navigate(urlBase);\r\n };\r\n\r\n return (\r\n <>\r\n
\r\n\r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {!userParam && (\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
)}\r\n {userParam && (\r\n Please fill out the following information
\r\n
)}\r\n Editing user
\r\nCheck the entered data.');\r\n setError(true);\r\n setReturnto(null);\r\n setOpenToast(true);\r\n }\r\n }\r\n\r\n fetchData();\r\n }, []);\r\n\r\n const handleChange = (e, field) => {\r\n setFields(prev => ({\r\n ...prev,\r\n [field]: e.target.value,\r\n }));\r\n setEmailError('');\r\n };\r\n\r\n const handleCloseToast = () => {\r\n setOpenToast(false);\r\n if (returnto) {\r\n navigate(returnto);\r\n }\r\n };\r\n\r\n const resetForm = () => {\r\n setFields({\r\n email: '',\r\n firstName: '',\r\n lastName: '',\r\n id: '',\r\n mobile: '',\r\n ethnicityId: '',\r\n birthDate: '',\r\n sexAtBirth: '',\r\n streetAddress: '',\r\n extendedAddress: '',\r\n provinceOrState: '',\r\n city: '',\r\n country: 'CA',\r\n postalCode: '',\r\n role: 9\r\n });\r\n };\r\n\r\n const handleSubmit = async (e) => {\r\n e.preventDefault();\r\n const emailValidationMsg = validator.validateEmail(fields.email);\r\n setEmailError(emailValidationMsg);\r\n if (emailValidationMsg === '') {\r\n try {\r\n const addFields = {\r\n email: fields.email.toLowerCase(),\r\n firstName: fields.firstName.toUpperCase(),\r\n lastName: fields.lastName.toUpperCase(),\r\n role: fields.role\r\n };\r\n const existEmail = await apiService.verifyEmail({ param: String(fields.email.toLowerCase()) });\r\n console.log('Exist Email Response:', existEmail); // Add this line\r\n if (existEmail.data) {\r\n setmsgToast('The email you entered already exists in our database.');\r\n setError(true);\r\n setReturnto(null);\r\n setOpenToast(true);\r\n } else {\r\n await apiService.useradd(addFields);\r\n setmsgToast('Thank you for your interest.
We will contact you to complete your registration.');\r\n setReturnto('/');\r\n setError(false);\r\n setOpenToast(true);\r\n resetForm();\r\n }\r\n } catch (error) {\r\n setmsgToast(error.message);\r\n setError(true);\r\n setReturnto(null);\r\n setOpenToast(true);\r\n }\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n Add New User
\r\nPlease fill out the following information
\r\n\r\n
\r\n );\r\n};\r\n\r\nexport default NavInfo;\r\n","import React from \"react\";\r\nimport Logo from \"../assets/Logo.png\";\r\nimport { FaXTwitter } from \"react-icons/fa6\";\r\nimport { SiLinkedin } from \"react-icons/si\";\r\nimport { BsYoutube } from \"react-icons/bs\";\r\nimport { FaInstagram } from \"react-icons/fa\";\r\nimport { useNavigate } from 'react-router-dom';\r\nimport './footer.css';\r\n\r\nfunction FooterBar() {\r\n const navigate = useNavigate();\r\n const openInNewTab = (url) => {\r\n window.open(url, \"_blank\", \"noreferrer\");\r\n };\r\n return (\r\n \r\n \r\n\r\n
\r\n\r\n {canShowButton && (\r\n \r\n \r\n
\r\n )}\r\n \r\n
\r\n\r\n );\r\n\r\n\r\n}\r\n\r\nexport default FooterBar;\r\n","export const formatDate = (dateString, showTime = false) => {\r\n \r\n if(dateString === \"\" | dateString === null)\r\n {\r\n return \"-\";\r\n }\r\n const options = { year: '2-digit', month: '2-digit', day: '2-digit' };\r\n const date = new Date(dateString);\r\n\r\n let formattedDate = date.toLocaleDateString('en-US', options);\r\n\r\n if (showTime) {\r\n const timeOptions = { hour: '2-digit', minute: '2-digit' };\r\n const fTime = date.toLocaleTimeString('en-US', timeOptions);\r\n formattedDate += ` - ${fTime}`;\r\n }\r\n\r\n return formattedDate;\r\n};\r\n","import React from \"react\";\r\nimport HeaderLogo from \"../assets/header-logo.png\";\r\n\r\nimport {\r\n HiOutlineMenuAlt3,\r\n HiOutlineUserCircle,\r\n HiChevronDown,\r\n} from \"react-icons/hi\";\r\nimport { Menu, MenuItem } from \"@mui/material\";\r\nimport { SidebarContext } from \"../context/SidebarContext\";\r\nimport { authService } from \"../services/authService\";\r\nimport { useNavigate } from \"react-router-dom\";\r\n\r\nimport \"./header.scss\";\r\n\r\nconst Header = () => {\r\n const { toggleSidebar } = React.useContext(SidebarContext);\r\n const [userName, setUserName] = React.useState(\"\");\r\n const [anchorEl, setAnchorEl] = React.useState(null); // Estado do menu\r\n const navigate = useNavigate();\r\n\r\n const fetchData = React.useCallback(async () => {\r\n const isLoggedIn = await authService.isLoggedIn();\r\n if (isLoggedIn) {\r\n const userdata = await authService.getUserData();\r\n setUserName(userdata.firstName ? `${userdata.firstName} ${userdata.lastName}` : userdata.email);\r\n }\r\n }, []);\r\n\r\n React.useEffect(() => {\r\n fetchData();\r\n }, [fetchData]);\r\n\r\n const handleMenuOpen = (event) => {\r\n setAnchorEl(event.currentTarget); // Define o elemento do menu\r\n };\r\n\r\n const handleMenuClose = () => {\r\n setAnchorEl(null); // Fecha o menu\r\n };\r\n\r\n const userinfo = () => {\r\n navigate(\"/userinfo\");\r\n //window.location.reload();\r\n };\r\n\r\n const changepassword = () => {\r\n navigate(\"/resetpassword\");\r\n //window.location.reload();\r\n };\r\n\r\n const logout = () => {\r\n authService.logOut();\r\n navigate(\"/Home\");\r\n //window.location.reload();\r\n };\r\n\r\n return (\r\n \r\n
\r\n Myomar Molecular Inc.
\r\n +1 902-483-6644
\r\n support@myomarmolecular.com
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n toggleSidebar(\"opennav\")}>\r\n
\r\n \r\n 
\r\n
\r\n Welcome
\r\n \r\n \r\n
\r\n\r\n {/* Dropdown de Logout */}\r\n \r\n
\r\n {userName}
\r\n\r\n {icon}\r\n
\r\n \r\n \r\n {/* Logotipo Centralizado */}\r\n \r\n {partners.map((partner) => (\r\n handlePartnerChange(partner.id)}\r\n style={{\r\n fontSize: \"12px\",\r\n fontWeight: \"400\",\r\n lineHeight: \"16.41px\",\r\n color: \"#2f2f2f\",\r\n textAlign: \"center\",\r\n }}\r\n >\r\n {partner.name}\r\n \r\n ))}\r\n \r\n
\r\n\r\n )}\r\n \r\n 
\r\n
\r\n\r\n {/* Dropdown Centralizado */}\r\n \r\n
\r\n\r\n {/* Dropdown usando Material-UI */}\r\n \r\n \r\n {selectedPartner\r\n ? selectedPartner.length > 30\r\n ? `${selectedPartner.substring(0, 30)}...`\r\n : selectedPartner\r\n : \"Select a Partner\"}\r\n \r\n
\r\nNAVIGATION
\r\n, and elements get a default\n // `tabIndex` of -1 when the 'tabindex' attribute isn't specified in the DOM,\n // yet they are still part of the regular tab order; in FF, they get a default\n // `tabIndex` of 0; since Chrome still puts those elements in the regular tab\n // order, consider their tab index to be 0.\n if (node.contentEditable === 'true' || (node.nodeName === 'AUDIO' || node.nodeName === 'VIDEO' || node.nodeName === 'DETAILS') && node.getAttribute('tabindex') === null) {\n return 0;\n }\n return node.tabIndex;\n}\nfunction isNonTabbableRadio(node) {\n if (node.tagName !== 'INPUT' || node.type !== 'radio') {\n return false;\n }\n if (!node.name) {\n return false;\n }\n const getRadio = selector => node.ownerDocument.querySelector(`input[type=\"radio\"]${selector}`);\n let roving = getRadio(`[name=\"${node.name}\"]:checked`);\n if (!roving) {\n roving = getRadio(`[name=\"${node.name}\"]`);\n }\n return roving !== node;\n}\nfunction isNodeMatchingSelectorFocusable(node) {\n if (node.disabled || node.tagName === 'INPUT' && node.type === 'hidden' || isNonTabbableRadio(node)) {\n return false;\n }\n return true;\n}\nfunction defaultGetTabbable(root) {\n const regularTabNodes = [];\n const orderedTabNodes = [];\n Array.from(root.querySelectorAll(candidatesSelector)).forEach((node, i) => {\n const nodeTabIndex = getTabIndex(node);\n if (nodeTabIndex === -1 || !isNodeMatchingSelectorFocusable(node)) {\n return;\n }\n if (nodeTabIndex === 0) {\n regularTabNodes.push(node);\n } else {\n orderedTabNodes.push({\n documentOrder: i,\n tabIndex: nodeTabIndex,\n node: node\n });\n }\n });\n return orderedTabNodes.sort((a, b) => a.tabIndex === b.tabIndex ? a.documentOrder - b.documentOrder : a.tabIndex - b.tabIndex).map(a => a.node).concat(regularTabNodes);\n}\nfunction defaultIsEnabled() {\n return true;\n}\n\n/**\n * Utility component that locks focus inside the component.\n *\n * Demos:\n *\n * - [Focus Trap](https://mui.com/base-ui/react-focus-trap/)\n *\n * API:\n *\n * - [FocusTrap API](https://mui.com/base-ui/react-focus-trap/components-api/#focus-trap)\n */\nfunction FocusTrap(props) {\n const {\n children,\n disableAutoFocus = false,\n disableEnforceFocus = false,\n disableRestoreFocus = false,\n getTabbable = defaultGetTabbable,\n isEnabled = defaultIsEnabled,\n open\n } = props;\n const ignoreNextEnforceFocus = React.useRef(false);\n const sentinelStart = React.useRef(null);\n const sentinelEnd = React.useRef(null);\n const nodeToRestore = React.useRef(null);\n const reactFocusEventTarget = React.useRef(null);\n // This variable is useful when disableAutoFocus is true.\n // It waits for the active element to move into the component to activate.\n const activated = React.useRef(false);\n const rootRef = React.useRef(null);\n // @ts-expect-error TODO upstream fix\n const handleRef = useForkRef(children.ref, rootRef);\n const lastKeydown = React.useRef(null);\n React.useEffect(() => {\n // We might render an empty child.\n if (!open || !rootRef.current) {\n return;\n }\n activated.current = !disableAutoFocus;\n }, [disableAutoFocus, open]);\n React.useEffect(() => {\n // We might render an empty child.\n if (!open || !rootRef.current) {\n return;\n }\n const doc = ownerDocument(rootRef.current);\n if (!rootRef.current.contains(doc.activeElement)) {\n if (!rootRef.current.hasAttribute('tabIndex')) {\n if (process.env.NODE_ENV !== 'production') {\n console.error(['MUI: The modal content node does not accept focus.', 'For the benefit of assistive technologies, ' + 'the tabIndex of the node is being set to \"-1\".'].join('\\n'));\n }\n rootRef.current.setAttribute('tabIndex', '-1');\n }\n if (activated.current) {\n rootRef.current.focus();\n }\n }\n return () => {\n // restoreLastFocus()\n if (!disableRestoreFocus) {\n // In IE11 it is possible for document.activeElement to be null resulting\n // in nodeToRestore.current being null.\n // Not all elements in IE11 have a focus method.\n // Once IE11 support is dropped the focus() call can be unconditional.\n if (nodeToRestore.current && nodeToRestore.current.focus) {\n ignoreNextEnforceFocus.current = true;\n nodeToRestore.current.focus();\n }\n nodeToRestore.current = null;\n }\n };\n // Missing `disableRestoreFocus` which is fine.\n // We don't support changing that prop on an open FocusTrap\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [open]);\n React.useEffect(() => {\n // We might render an empty child.\n if (!open || !rootRef.current) {\n return;\n }\n const doc = ownerDocument(rootRef.current);\n const loopFocus = nativeEvent => {\n lastKeydown.current = nativeEvent;\n if (disableEnforceFocus || !isEnabled() || nativeEvent.key !== 'Tab') {\n return;\n }\n\n // Make sure the next tab starts from the right place.\n // doc.activeElement refers to the origin.\n if (doc.activeElement === rootRef.current && nativeEvent.shiftKey) {\n // We need to ignore the next contain as\n // it will try to move the focus back to the rootRef element.\n ignoreNextEnforceFocus.current = true;\n if (sentinelEnd.current) {\n sentinelEnd.current.focus();\n }\n }\n };\n const contain = () => {\n const rootElement = rootRef.current;\n\n // Cleanup functions are executed lazily in React 17.\n // Contain can be called between the component being unmounted and its cleanup function being run.\n if (rootElement === null) {\n return;\n }\n if (!doc.hasFocus() || !isEnabled() || ignoreNextEnforceFocus.current) {\n ignoreNextEnforceFocus.current = false;\n return;\n }\n\n // The focus is already inside\n if (rootElement.contains(doc.activeElement)) {\n return;\n }\n\n // The disableEnforceFocus is set and the focus is outside of the focus trap (and sentinel nodes)\n if (disableEnforceFocus && doc.activeElement !== sentinelStart.current && doc.activeElement !== sentinelEnd.current) {\n return;\n }\n\n // if the focus event is not coming from inside the children's react tree, reset the refs\n if (doc.activeElement !== reactFocusEventTarget.current) {\n reactFocusEventTarget.current = null;\n } else if (reactFocusEventTarget.current !== null) {\n return;\n }\n if (!activated.current) {\n return;\n }\n let tabbable = [];\n if (doc.activeElement === sentinelStart.current || doc.activeElement === sentinelEnd.current) {\n tabbable = getTabbable(rootRef.current);\n }\n\n // one of the sentinel nodes was focused, so move the focus\n // to the first/last tabbable element inside the focus trap\n if (tabbable.length > 0) {\n var _lastKeydown$current, _lastKeydown$current2;\n const isShiftTab = Boolean(((_lastKeydown$current = lastKeydown.current) == null ? void 0 : _lastKeydown$current.shiftKey) && ((_lastKeydown$current2 = lastKeydown.current) == null ? void 0 : _lastKeydown$current2.key) === 'Tab');\n const focusNext = tabbable[0];\n const focusPrevious = tabbable[tabbable.length - 1];\n if (typeof focusNext !== 'string' && typeof focusPrevious !== 'string') {\n if (isShiftTab) {\n focusPrevious.focus();\n } else {\n focusNext.focus();\n }\n }\n // no tabbable elements in the trap focus or the focus was outside of the focus trap\n } else {\n rootElement.focus();\n }\n };\n doc.addEventListener('focusin', contain);\n doc.addEventListener('keydown', loopFocus, true);\n\n // With Edge, Safari and Firefox, no focus related events are fired when the focused area stops being a focused area.\n // for example https://bugzilla.mozilla.org/show_bug.cgi?id=559561.\n // Instead, we can look if the active element was restored on the BODY element.\n //\n // The whatwg spec defines how the browser should behave but does not explicitly mention any events:\n // https://html.spec.whatwg.org/multipage/interaction.html#focus-fixup-rule.\n const interval = setInterval(() => {\n if (doc.activeElement && doc.activeElement.tagName === 'BODY') {\n contain();\n }\n }, 50);\n return () => {\n clearInterval(interval);\n doc.removeEventListener('focusin', contain);\n doc.removeEventListener('keydown', loopFocus, true);\n };\n }, [disableAutoFocus, disableEnforceFocus, disableRestoreFocus, isEnabled, open, getTabbable]);\n const onFocus = event => {\n if (nodeToRestore.current === null) {\n nodeToRestore.current = event.relatedTarget;\n }\n activated.current = true;\n reactFocusEventTarget.current = event.target;\n const childrenPropsHandler = children.props.onFocus;\n if (childrenPropsHandler) {\n childrenPropsHandler(event);\n }\n };\n const handleFocusSentinel = event => {\n if (nodeToRestore.current === null) {\n nodeToRestore.current = event.relatedTarget;\n }\n activated.current = true;\n };\n return /*#__PURE__*/_jsxs(React.Fragment, {\n children: [/*#__PURE__*/_jsx(\"div\", {\n tabIndex: open ? 0 : -1,\n onFocus: handleFocusSentinel,\n ref: sentinelStart,\n \"data-testid\": \"sentinelStart\"\n }), /*#__PURE__*/React.cloneElement(children, {\n ref: handleRef,\n onFocus\n }), /*#__PURE__*/_jsx(\"div\", {\n tabIndex: open ? 0 : -1,\n onFocus: handleFocusSentinel,\n ref: sentinelEnd,\n \"data-testid\": \"sentinelEnd\"\n })]\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? FocusTrap.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * A single child content element.\n */\n children: elementAcceptingRef,\n /**\n * If `true`, the focus trap will not automatically shift focus to itself when it opens, and\n * replace it to the last focused element when it closes.\n * This also works correctly with any focus trap children that have the `disableAutoFocus` prop.\n *\n * Generally this should never be set to `true` as it makes the focus trap less\n * accessible to assistive technologies, like screen readers.\n * @default false\n */\n disableAutoFocus: PropTypes.bool,\n /**\n * If `true`, the focus trap will not prevent focus from leaving the focus trap while open.\n *\n * Generally this should never be set to `true` as it makes the focus trap less\n * accessible to assistive technologies, like screen readers.\n * @default false\n */\n disableEnforceFocus: PropTypes.bool,\n /**\n * If `true`, the focus trap will not restore focus to previously focused element once\n * focus trap is hidden or unmounted.\n * @default false\n */\n disableRestoreFocus: PropTypes.bool,\n /**\n * Returns an array of ordered tabbable nodes (i.e. in tab order) within the root.\n * For instance, you can provide the \"tabbable\" npm dependency.\n * @param {HTMLElement} root\n */\n getTabbable: PropTypes.func,\n /**\n * This prop extends the `open` prop.\n * It allows to toggle the open state without having to wait for a rerender when changing the `open` prop.\n * This prop should be memoized.\n * It can be used to support multiple focus trap mounted at the same time.\n * @default function defaultIsEnabled(): boolean {\n * return true;\n * }\n */\n isEnabled: PropTypes.func,\n /**\n * If `true`, focus is locked.\n */\n open: PropTypes.bool.isRequired\n} : void 0;\nif (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line\n FocusTrap['propTypes' + ''] = exactProp(FocusTrap.propTypes);\n}\nexport { FocusTrap };","export default function getWindow(node) {\n if (node == null) {\n return window;\n }\n\n if (node.toString() !== '[object Window]') {\n var ownerDocument = node.ownerDocument;\n return ownerDocument ? ownerDocument.defaultView || window : window;\n }\n\n return node;\n}","import getWindow from \"./getWindow.js\";\n\nfunction isElement(node) {\n var OwnElement = getWindow(node).Element;\n return node instanceof OwnElement || node instanceof Element;\n}\n\nfunction isHTMLElement(node) {\n var OwnElement = getWindow(node).HTMLElement;\n return node instanceof OwnElement || node instanceof HTMLElement;\n}\n\nfunction isShadowRoot(node) {\n // IE 11 has no ShadowRoot\n if (typeof ShadowRoot === 'undefined') {\n return false;\n }\n\n var OwnElement = getWindow(node).ShadowRoot;\n return node instanceof OwnElement || node instanceof ShadowRoot;\n}\n\nexport { isElement, isHTMLElement, isShadowRoot };","export var max = Math.max;\nexport var min = Math.min;\nexport var round = Math.round;","export default function getUAString() {\n var uaData = navigator.userAgentData;\n\n if (uaData != null && uaData.brands && Array.isArray(uaData.brands)) {\n return uaData.brands.map(function (item) {\n return item.brand + \"/\" + item.version;\n }).join(' ');\n }\n\n return navigator.userAgent;\n}","import getUAString from \"../utils/userAgent.js\";\nexport default function isLayoutViewport() {\n return !/^((?!chrome|android).)*safari/i.test(getUAString());\n}","import { isElement, isHTMLElement } from \"./instanceOf.js\";\nimport { round } from \"../utils/math.js\";\nimport getWindow from \"./getWindow.js\";\nimport isLayoutViewport from \"./isLayoutViewport.js\";\nexport default function getBoundingClientRect(element, includeScale, isFixedStrategy) {\n if (includeScale === void 0) {\n includeScale = false;\n }\n\n if (isFixedStrategy === void 0) {\n isFixedStrategy = false;\n }\n\n var clientRect = element.getBoundingClientRect();\n var scaleX = 1;\n var scaleY = 1;\n\n if (includeScale && isHTMLElement(element)) {\n scaleX = element.offsetWidth > 0 ? round(clientRect.width) / element.offsetWidth || 1 : 1;\n scaleY = element.offsetHeight > 0 ? round(clientRect.height) / element.offsetHeight || 1 : 1;\n }\n\n var _ref = isElement(element) ? getWindow(element) : window,\n visualViewport = _ref.visualViewport;\n\n var addVisualOffsets = !isLayoutViewport() && isFixedStrategy;\n var x = (clientRect.left + (addVisualOffsets && visualViewport ? visualViewport.offsetLeft : 0)) / scaleX;\n var y = (clientRect.top + (addVisualOffsets && visualViewport ? visualViewport.offsetTop : 0)) / scaleY;\n var width = clientRect.width / scaleX;\n var height = clientRect.height / scaleY;\n return {\n width: width,\n height: height,\n top: y,\n right: x + width,\n bottom: y + height,\n left: x,\n x: x,\n y: y\n };\n}","import getWindow from \"./getWindow.js\";\nexport default function getWindowScroll(node) {\n var win = getWindow(node);\n var scrollLeft = win.pageXOffset;\n var scrollTop = win.pageYOffset;\n return {\n scrollLeft: scrollLeft,\n scrollTop: scrollTop\n };\n}","export default function getNodeName(element) {\n return element ? (element.nodeName || '').toLowerCase() : null;\n}","import { isElement } from \"./instanceOf.js\";\nexport default function getDocumentElement(element) {\n // $FlowFixMe[incompatible-return]: assume body is always available\n return ((isElement(element) ? element.ownerDocument : // $FlowFixMe[prop-missing]\n element.document) || window.document).documentElement;\n}","import getBoundingClientRect from \"./getBoundingClientRect.js\";\nimport getDocumentElement from \"./getDocumentElement.js\";\nimport getWindowScroll from \"./getWindowScroll.js\";\nexport default function getWindowScrollBarX(element) {\n // If has a CSS width greater than the viewport, then this will be\n // incorrect for RTL.\n // Popper 1 is broken in this case and never had a bug report so let's assume\n // it's not an issue. I don't think anyone ever specifies width on \n // anyway.\n // Browsers where the left scrollbar doesn't cause an issue report `0` for\n // this (e.g. Edge 2019, IE11, Safari)\n return getBoundingClientRect(getDocumentElement(element)).left + getWindowScroll(element).scrollLeft;\n}","import getWindow from \"./getWindow.js\";\nexport default function getComputedStyle(element) {\n return getWindow(element).getComputedStyle(element);\n}","import getComputedStyle from \"./getComputedStyle.js\";\nexport default function isScrollParent(element) {\n // Firefox wants us to check `-x` and `-y` variations as well\n var _getComputedStyle = getComputedStyle(element),\n overflow = _getComputedStyle.overflow,\n overflowX = _getComputedStyle.overflowX,\n overflowY = _getComputedStyle.overflowY;\n\n return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);\n}","import getBoundingClientRect from \"./getBoundingClientRect.js\";\nimport getNodeScroll from \"./getNodeScroll.js\";\nimport getNodeName from \"./getNodeName.js\";\nimport { isHTMLElement } from \"./instanceOf.js\";\nimport getWindowScrollBarX from \"./getWindowScrollBarX.js\";\nimport getDocumentElement from \"./getDocumentElement.js\";\nimport isScrollParent from \"./isScrollParent.js\";\nimport { round } from \"../utils/math.js\";\n\nfunction isElementScaled(element) {\n var rect = element.getBoundingClientRect();\n var scaleX = round(rect.width) / element.offsetWidth || 1;\n var scaleY = round(rect.height) / element.offsetHeight || 1;\n return scaleX !== 1 || scaleY !== 1;\n} // Returns the composite rect of an element relative to its offsetParent.\n// Composite means it takes into account transforms as well as layout.\n\n\nexport default function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {\n if (isFixed === void 0) {\n isFixed = false;\n }\n\n var isOffsetParentAnElement = isHTMLElement(offsetParent);\n var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);\n var documentElement = getDocumentElement(offsetParent);\n var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled, isFixed);\n var scroll = {\n scrollLeft: 0,\n scrollTop: 0\n };\n var offsets = {\n x: 0,\n y: 0\n };\n\n if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {\n if (getNodeName(offsetParent) !== 'body' || // https://github.com/popperjs/popper-core/issues/1078\n isScrollParent(documentElement)) {\n scroll = getNodeScroll(offsetParent);\n }\n\n if (isHTMLElement(offsetParent)) {\n offsets = getBoundingClientRect(offsetParent, true);\n offsets.x += offsetParent.clientLeft;\n offsets.y += offsetParent.clientTop;\n } else if (documentElement) {\n offsets.x = getWindowScrollBarX(documentElement);\n }\n }\n\n return {\n x: rect.left + scroll.scrollLeft - offsets.x,\n y: rect.top + scroll.scrollTop - offsets.y,\n width: rect.width,\n height: rect.height\n };\n}","import getWindowScroll from \"./getWindowScroll.js\";\nimport getWindow from \"./getWindow.js\";\nimport { isHTMLElement } from \"./instanceOf.js\";\nimport getHTMLElementScroll from \"./getHTMLElementScroll.js\";\nexport default function getNodeScroll(node) {\n if (node === getWindow(node) || !isHTMLElement(node)) {\n return getWindowScroll(node);\n } else {\n return getHTMLElementScroll(node);\n }\n}","export default function getHTMLElementScroll(element) {\n return {\n scrollLeft: element.scrollLeft,\n scrollTop: element.scrollTop\n };\n}","import getBoundingClientRect from \"./getBoundingClientRect.js\"; // Returns the layout rect of an element relative to its offsetParent. Layout\n// means it doesn't take into account transforms.\n\nexport default function getLayoutRect(element) {\n var clientRect = getBoundingClientRect(element); // Use the clientRect sizes if it's not been transformed.\n // Fixes https://github.com/popperjs/popper-core/issues/1223\n\n var width = element.offsetWidth;\n var height = element.offsetHeight;\n\n if (Math.abs(clientRect.width - width) <= 1) {\n width = clientRect.width;\n }\n\n if (Math.abs(clientRect.height - height) <= 1) {\n height = clientRect.height;\n }\n\n return {\n x: element.offsetLeft,\n y: element.offsetTop,\n width: width,\n height: height\n };\n}","import getNodeName from \"./getNodeName.js\";\nimport getDocumentElement from \"./getDocumentElement.js\";\nimport { isShadowRoot } from \"./instanceOf.js\";\nexport default function getParentNode(element) {\n if (getNodeName(element) === 'html') {\n return element;\n }\n\n return (// this is a quicker (but less type safe) way to save quite some bytes from the bundle\n // $FlowFixMe[incompatible-return]\n // $FlowFixMe[prop-missing]\n element.assignedSlot || // step into the shadow DOM of the parent of a slotted node\n element.parentNode || ( // DOM Element detected\n isShadowRoot(element) ? element.host : null) || // ShadowRoot detected\n // $FlowFixMe[incompatible-call]: HTMLElement is a Node\n getDocumentElement(element) // fallback\n\n );\n}","import getParentNode from \"./getParentNode.js\";\nimport isScrollParent from \"./isScrollParent.js\";\nimport getNodeName from \"./getNodeName.js\";\nimport { isHTMLElement } from \"./instanceOf.js\";\nexport default function getScrollParent(node) {\n if (['html', 'body', '#document'].indexOf(getNodeName(node)) >= 0) {\n // $FlowFixMe[incompatible-return]: assume body is always available\n return node.ownerDocument.body;\n }\n\n if (isHTMLElement(node) && isScrollParent(node)) {\n return node;\n }\n\n return getScrollParent(getParentNode(node));\n}","import getScrollParent from \"./getScrollParent.js\";\nimport getParentNode from \"./getParentNode.js\";\nimport getWindow from \"./getWindow.js\";\nimport isScrollParent from \"./isScrollParent.js\";\n/*\ngiven a DOM element, return the list of all scroll parents, up the list of ancesors\nuntil we get to the top window object. This list is what we attach scroll listeners\nto, because if any of these parent elements scroll, we'll need to re-calculate the\nreference element's position.\n*/\n\nexport default function listScrollParents(element, list) {\n var _element$ownerDocumen;\n\n if (list === void 0) {\n list = [];\n }\n\n var scrollParent = getScrollParent(element);\n var isBody = scrollParent === ((_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body);\n var win = getWindow(scrollParent);\n var target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;\n var updatedList = list.concat(target);\n return isBody ? updatedList : // $FlowFixMe[incompatible-call]: isBody tells us target will be an HTMLElement here\n updatedList.concat(listScrollParents(getParentNode(target)));\n}","import getNodeName from \"./getNodeName.js\";\nexport default function isTableElement(element) {\n return ['table', 'td', 'th'].indexOf(getNodeName(element)) >= 0;\n}","import getWindow from \"./getWindow.js\";\nimport getNodeName from \"./getNodeName.js\";\nimport getComputedStyle from \"./getComputedStyle.js\";\nimport { isHTMLElement, isShadowRoot } from \"./instanceOf.js\";\nimport isTableElement from \"./isTableElement.js\";\nimport getParentNode from \"./getParentNode.js\";\nimport getUAString from \"../utils/userAgent.js\";\n\nfunction getTrueOffsetParent(element) {\n if (!isHTMLElement(element) || // https://github.com/popperjs/popper-core/issues/837\n getComputedStyle(element).position === 'fixed') {\n return null;\n }\n\n return element.offsetParent;\n} // `.offsetParent` reports `null` for fixed elements, while absolute elements\n// return the containing block\n\n\nfunction getContainingBlock(element) {\n var isFirefox = /firefox/i.test(getUAString());\n var isIE = /Trident/i.test(getUAString());\n\n if (isIE && isHTMLElement(element)) {\n // In IE 9, 10 and 11 fixed elements containing block is always established by the viewport\n var elementCss = getComputedStyle(element);\n\n if (elementCss.position === 'fixed') {\n return null;\n }\n }\n\n var currentNode = getParentNode(element);\n\n if (isShadowRoot(currentNode)) {\n currentNode = currentNode.host;\n }\n\n while (isHTMLElement(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {\n var css = getComputedStyle(currentNode); // This is non-exhaustive but covers the most common CSS properties that\n // create a containing block.\n // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block\n\n if (css.transform !== 'none' || css.perspective !== 'none' || css.contain === 'paint' || ['transform', 'perspective'].indexOf(css.willChange) !== -1 || isFirefox && css.willChange === 'filter' || isFirefox && css.filter && css.filter !== 'none') {\n return currentNode;\n } else {\n currentNode = currentNode.parentNode;\n }\n }\n\n return null;\n} // Gets the closest ancestor positioned element. Handles some edge cases,\n// such as table ancestors and cross browser bugs.\n\n\nexport default function getOffsetParent(element) {\n var window = getWindow(element);\n var offsetParent = getTrueOffsetParent(element);\n\n while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {\n offsetParent = getTrueOffsetParent(offsetParent);\n }\n\n if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static')) {\n return window;\n }\n\n return offsetParent || getContainingBlock(element) || window;\n}","export var top = 'top';\nexport var bottom = 'bottom';\nexport var right = 'right';\nexport var left = 'left';\nexport var auto = 'auto';\nexport var basePlacements = [top, bottom, right, left];\nexport var start = 'start';\nexport var end = 'end';\nexport var clippingParents = 'clippingParents';\nexport var viewport = 'viewport';\nexport var popper = 'popper';\nexport var reference = 'reference';\nexport var variationPlacements = /*#__PURE__*/basePlacements.reduce(function (acc, placement) {\n return acc.concat([placement + \"-\" + start, placement + \"-\" + end]);\n}, []);\nexport var placements = /*#__PURE__*/[].concat(basePlacements, [auto]).reduce(function (acc, placement) {\n return acc.concat([placement, placement + \"-\" + start, placement + \"-\" + end]);\n}, []); // modifiers that need to read the DOM\n\nexport var beforeRead = 'beforeRead';\nexport var read = 'read';\nexport var afterRead = 'afterRead'; // pure-logic modifiers\n\nexport var beforeMain = 'beforeMain';\nexport var main = 'main';\nexport var afterMain = 'afterMain'; // modifier with the purpose to write to the DOM (or write into a framework state)\n\nexport var beforeWrite = 'beforeWrite';\nexport var write = 'write';\nexport var afterWrite = 'afterWrite';\nexport var modifierPhases = [beforeRead, read, afterRead, beforeMain, main, afterMain, beforeWrite, write, afterWrite];","import { modifierPhases } from \"../enums.js\"; // source: https://stackoverflow.com/questions/49875255\n\nfunction order(modifiers) {\n var map = new Map();\n var visited = new Set();\n var result = [];\n modifiers.forEach(function (modifier) {\n map.set(modifier.name, modifier);\n }); // On visiting object, check for its dependencies and visit them recursively\n\n function sort(modifier) {\n visited.add(modifier.name);\n var requires = [].concat(modifier.requires || [], modifier.requiresIfExists || []);\n requires.forEach(function (dep) {\n if (!visited.has(dep)) {\n var depModifier = map.get(dep);\n\n if (depModifier) {\n sort(depModifier);\n }\n }\n });\n result.push(modifier);\n }\n\n modifiers.forEach(function (modifier) {\n if (!visited.has(modifier.name)) {\n // check for visited object\n sort(modifier);\n }\n });\n return result;\n}\n\nexport default function orderModifiers(modifiers) {\n // order based on dependencies\n var orderedModifiers = order(modifiers); // order based on phase\n\n return modifierPhases.reduce(function (acc, phase) {\n return acc.concat(orderedModifiers.filter(function (modifier) {\n return modifier.phase === phase;\n }));\n }, []);\n}","export default function debounce(fn) {\n var pending;\n return function () {\n if (!pending) {\n pending = new Promise(function (resolve) {\n Promise.resolve().then(function () {\n pending = undefined;\n resolve(fn());\n });\n });\n }\n\n return pending;\n };\n}","import getCompositeRect from \"./dom-utils/getCompositeRect.js\";\nimport getLayoutRect from \"./dom-utils/getLayoutRect.js\";\nimport listScrollParents from \"./dom-utils/listScrollParents.js\";\nimport getOffsetParent from \"./dom-utils/getOffsetParent.js\";\nimport orderModifiers from \"./utils/orderModifiers.js\";\nimport debounce from \"./utils/debounce.js\";\nimport mergeByName from \"./utils/mergeByName.js\";\nimport detectOverflow from \"./utils/detectOverflow.js\";\nimport { isElement } from \"./dom-utils/instanceOf.js\";\nvar DEFAULT_OPTIONS = {\n placement: 'bottom',\n modifiers: [],\n strategy: 'absolute'\n};\n\nfunction areValidElements() {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n return !args.some(function (element) {\n return !(element && typeof element.getBoundingClientRect === 'function');\n });\n}\n\nexport function popperGenerator(generatorOptions) {\n if (generatorOptions === void 0) {\n generatorOptions = {};\n }\n\n var _generatorOptions = generatorOptions,\n _generatorOptions$def = _generatorOptions.defaultModifiers,\n defaultModifiers = _generatorOptions$def === void 0 ? [] : _generatorOptions$def,\n _generatorOptions$def2 = _generatorOptions.defaultOptions,\n defaultOptions = _generatorOptions$def2 === void 0 ? DEFAULT_OPTIONS : _generatorOptions$def2;\n return function createPopper(reference, popper, options) {\n if (options === void 0) {\n options = defaultOptions;\n }\n\n var state = {\n placement: 'bottom',\n orderedModifiers: [],\n options: Object.assign({}, DEFAULT_OPTIONS, defaultOptions),\n modifiersData: {},\n elements: {\n reference: reference,\n popper: popper\n },\n attributes: {},\n styles: {}\n };\n var effectCleanupFns = [];\n var isDestroyed = false;\n var instance = {\n state: state,\n setOptions: function setOptions(setOptionsAction) {\n var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;\n cleanupModifierEffects();\n state.options = Object.assign({}, defaultOptions, state.options, options);\n state.scrollParents = {\n reference: isElement(reference) ? listScrollParents(reference) : reference.contextElement ? listScrollParents(reference.contextElement) : [],\n popper: listScrollParents(popper)\n }; // Orders the modifiers based on their dependencies and `phase`\n // properties\n\n var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers, state.options.modifiers))); // Strip out disabled modifiers\n\n state.orderedModifiers = orderedModifiers.filter(function (m) {\n return m.enabled;\n });\n runModifierEffects();\n return instance.update();\n },\n // Sync update – it will always be executed, even if not necessary. This\n // is useful for low frequency updates where sync behavior simplifies the\n // logic.\n // For high frequency updates (e.g. `resize` and `scroll` events), always\n // prefer the async Popper#update method\n forceUpdate: function forceUpdate() {\n if (isDestroyed) {\n return;\n }\n\n var _state$elements = state.elements,\n reference = _state$elements.reference,\n popper = _state$elements.popper; // Don't proceed if `reference` or `popper` are not valid elements\n // anymore\n\n if (!areValidElements(reference, popper)) {\n return;\n } // Store the reference and popper rects to be read by modifiers\n\n\n state.rects = {\n reference: getCompositeRect(reference, getOffsetParent(popper), state.options.strategy === 'fixed'),\n popper: getLayoutRect(popper)\n }; // Modifiers have the ability to reset the current update cycle. The\n // most common use case for this is the `flip` modifier changing the\n // placement, which then needs to re-run all the modifiers, because the\n // logic was previously ran for the previous placement and is therefore\n // stale/incorrect\n\n state.reset = false;\n state.placement = state.options.placement; // On each update cycle, the `modifiersData` property for each modifier\n // is filled with the initial data specified by the modifier. This means\n // it doesn't persist and is fresh on each update.\n // To ensure persistent data, use `${name}#persistent`\n\n state.orderedModifiers.forEach(function (modifier) {\n return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);\n });\n\n for (var index = 0; index < state.orderedModifiers.length; index++) {\n if (state.reset === true) {\n state.reset = false;\n index = -1;\n continue;\n }\n\n var _state$orderedModifie = state.orderedModifiers[index],\n fn = _state$orderedModifie.fn,\n _state$orderedModifie2 = _state$orderedModifie.options,\n _options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2,\n name = _state$orderedModifie.name;\n\n if (typeof fn === 'function') {\n state = fn({\n state: state,\n options: _options,\n name: name,\n instance: instance\n }) || state;\n }\n }\n },\n // Async and optimistically optimized update – it will not be executed if\n // not necessary (debounced to run at most once-per-tick)\n update: debounce(function () {\n return new Promise(function (resolve) {\n instance.forceUpdate();\n resolve(state);\n });\n }),\n destroy: function destroy() {\n cleanupModifierEffects();\n isDestroyed = true;\n }\n };\n\n if (!areValidElements(reference, popper)) {\n return instance;\n }\n\n instance.setOptions(options).then(function (state) {\n if (!isDestroyed && options.onFirstUpdate) {\n options.onFirstUpdate(state);\n }\n }); // Modifiers have the ability to execute arbitrary code before the first\n // update cycle runs. They will be executed in the same order as the update\n // cycle. This is useful when a modifier adds some persistent data that\n // other modifiers need to use, but the modifier is run after the dependent\n // one.\n\n function runModifierEffects() {\n state.orderedModifiers.forEach(function (_ref) {\n var name = _ref.name,\n _ref$options = _ref.options,\n options = _ref$options === void 0 ? {} : _ref$options,\n effect = _ref.effect;\n\n if (typeof effect === 'function') {\n var cleanupFn = effect({\n state: state,\n name: name,\n instance: instance,\n options: options\n });\n\n var noopFn = function noopFn() {};\n\n effectCleanupFns.push(cleanupFn || noopFn);\n }\n });\n }\n\n function cleanupModifierEffects() {\n effectCleanupFns.forEach(function (fn) {\n return fn();\n });\n effectCleanupFns = [];\n }\n\n return instance;\n };\n}\nexport var createPopper = /*#__PURE__*/popperGenerator(); // eslint-disable-next-line import/no-unused-modules\n\nexport { detectOverflow };","export default function mergeByName(modifiers) {\n var merged = modifiers.reduce(function (merged, current) {\n var existing = merged[current.name];\n merged[current.name] = existing ? Object.assign({}, existing, current, {\n options: Object.assign({}, existing.options, current.options),\n data: Object.assign({}, existing.data, current.data)\n }) : current;\n return merged;\n }, {}); // IE11 does not support Object.values\n\n return Object.keys(merged).map(function (key) {\n return merged[key];\n });\n}","import getWindow from \"../dom-utils/getWindow.js\"; // eslint-disable-next-line import/no-unused-modules\n\nvar passive = {\n passive: true\n};\n\nfunction effect(_ref) {\n var state = _ref.state,\n instance = _ref.instance,\n options = _ref.options;\n var _options$scroll = options.scroll,\n scroll = _options$scroll === void 0 ? true : _options$scroll,\n _options$resize = options.resize,\n resize = _options$resize === void 0 ? true : _options$resize;\n var window = getWindow(state.elements.popper);\n var scrollParents = [].concat(state.scrollParents.reference, state.scrollParents.popper);\n\n if (scroll) {\n scrollParents.forEach(function (scrollParent) {\n scrollParent.addEventListener('scroll', instance.update, passive);\n });\n }\n\n if (resize) {\n window.addEventListener('resize', instance.update, passive);\n }\n\n return function () {\n if (scroll) {\n scrollParents.forEach(function (scrollParent) {\n scrollParent.removeEventListener('scroll', instance.update, passive);\n });\n }\n\n if (resize) {\n window.removeEventListener('resize', instance.update, passive);\n }\n };\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'eventListeners',\n enabled: true,\n phase: 'write',\n fn: function fn() {},\n effect: effect,\n data: {}\n};","import { auto } from \"../enums.js\";\nexport default function getBasePlacement(placement) {\n return placement.split('-')[0];\n}","export default function getVariation(placement) {\n return placement.split('-')[1];\n}","export default function getMainAxisFromPlacement(placement) {\n return ['top', 'bottom'].indexOf(placement) >= 0 ? 'x' : 'y';\n}","import getBasePlacement from \"./getBasePlacement.js\";\nimport getVariation from \"./getVariation.js\";\nimport getMainAxisFromPlacement from \"./getMainAxisFromPlacement.js\";\nimport { top, right, bottom, left, start, end } from \"../enums.js\";\nexport default function computeOffsets(_ref) {\n var reference = _ref.reference,\n element = _ref.element,\n placement = _ref.placement;\n var basePlacement = placement ? getBasePlacement(placement) : null;\n var variation = placement ? getVariation(placement) : null;\n var commonX = reference.x + reference.width / 2 - element.width / 2;\n var commonY = reference.y + reference.height / 2 - element.height / 2;\n var offsets;\n\n switch (basePlacement) {\n case top:\n offsets = {\n x: commonX,\n y: reference.y - element.height\n };\n break;\n\n case bottom:\n offsets = {\n x: commonX,\n y: reference.y + reference.height\n };\n break;\n\n case right:\n offsets = {\n x: reference.x + reference.width,\n y: commonY\n };\n break;\n\n case left:\n offsets = {\n x: reference.x - element.width,\n y: commonY\n };\n break;\n\n default:\n offsets = {\n x: reference.x,\n y: reference.y\n };\n }\n\n var mainAxis = basePlacement ? getMainAxisFromPlacement(basePlacement) : null;\n\n if (mainAxis != null) {\n var len = mainAxis === 'y' ? 'height' : 'width';\n\n switch (variation) {\n case start:\n offsets[mainAxis] = offsets[mainAxis] - (reference[len] / 2 - element[len] / 2);\n break;\n\n case end:\n offsets[mainAxis] = offsets[mainAxis] + (reference[len] / 2 - element[len] / 2);\n break;\n\n default:\n }\n }\n\n return offsets;\n}","import { top, left, right, bottom, end } from \"../enums.js\";\nimport getOffsetParent from \"../dom-utils/getOffsetParent.js\";\nimport getWindow from \"../dom-utils/getWindow.js\";\nimport getDocumentElement from \"../dom-utils/getDocumentElement.js\";\nimport getComputedStyle from \"../dom-utils/getComputedStyle.js\";\nimport getBasePlacement from \"../utils/getBasePlacement.js\";\nimport getVariation from \"../utils/getVariation.js\";\nimport { round } from \"../utils/math.js\"; // eslint-disable-next-line import/no-unused-modules\n\nvar unsetSides = {\n top: 'auto',\n right: 'auto',\n bottom: 'auto',\n left: 'auto'\n}; // Round the offsets to the nearest suitable subpixel based on the DPR.\n// Zooming can change the DPR, but it seems to report a value that will\n// cleanly divide the values into the appropriate subpixels.\n\nfunction roundOffsetsByDPR(_ref, win) {\n var x = _ref.x,\n y = _ref.y;\n var dpr = win.devicePixelRatio || 1;\n return {\n x: round(x * dpr) / dpr || 0,\n y: round(y * dpr) / dpr || 0\n };\n}\n\nexport function mapToStyles(_ref2) {\n var _Object$assign2;\n\n var popper = _ref2.popper,\n popperRect = _ref2.popperRect,\n placement = _ref2.placement,\n variation = _ref2.variation,\n offsets = _ref2.offsets,\n position = _ref2.position,\n gpuAcceleration = _ref2.gpuAcceleration,\n adaptive = _ref2.adaptive,\n roundOffsets = _ref2.roundOffsets,\n isFixed = _ref2.isFixed;\n var _offsets$x = offsets.x,\n x = _offsets$x === void 0 ? 0 : _offsets$x,\n _offsets$y = offsets.y,\n y = _offsets$y === void 0 ? 0 : _offsets$y;\n\n var _ref3 = typeof roundOffsets === 'function' ? roundOffsets({\n x: x,\n y: y\n }) : {\n x: x,\n y: y\n };\n\n x = _ref3.x;\n y = _ref3.y;\n var hasX = offsets.hasOwnProperty('x');\n var hasY = offsets.hasOwnProperty('y');\n var sideX = left;\n var sideY = top;\n var win = window;\n\n if (adaptive) {\n var offsetParent = getOffsetParent(popper);\n var heightProp = 'clientHeight';\n var widthProp = 'clientWidth';\n\n if (offsetParent === getWindow(popper)) {\n offsetParent = getDocumentElement(popper);\n\n if (getComputedStyle(offsetParent).position !== 'static' && position === 'absolute') {\n heightProp = 'scrollHeight';\n widthProp = 'scrollWidth';\n }\n } // $FlowFixMe[incompatible-cast]: force type refinement, we compare offsetParent with window above, but Flow doesn't detect it\n\n\n offsetParent = offsetParent;\n\n if (placement === top || (placement === left || placement === right) && variation === end) {\n sideY = bottom;\n var offsetY = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.height : // $FlowFixMe[prop-missing]\n offsetParent[heightProp];\n y -= offsetY - popperRect.height;\n y *= gpuAcceleration ? 1 : -1;\n }\n\n if (placement === left || (placement === top || placement === bottom) && variation === end) {\n sideX = right;\n var offsetX = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.width : // $FlowFixMe[prop-missing]\n offsetParent[widthProp];\n x -= offsetX - popperRect.width;\n x *= gpuAcceleration ? 1 : -1;\n }\n }\n\n var commonStyles = Object.assign({\n position: position\n }, adaptive && unsetSides);\n\n var _ref4 = roundOffsets === true ? roundOffsetsByDPR({\n x: x,\n y: y\n }, getWindow(popper)) : {\n x: x,\n y: y\n };\n\n x = _ref4.x;\n y = _ref4.y;\n\n if (gpuAcceleration) {\n var _Object$assign;\n\n return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? '0' : '', _Object$assign[sideX] = hasX ? '0' : '', _Object$assign.transform = (win.devicePixelRatio || 1) <= 1 ? \"translate(\" + x + \"px, \" + y + \"px)\" : \"translate3d(\" + x + \"px, \" + y + \"px, 0)\", _Object$assign));\n }\n\n return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + \"px\" : '', _Object$assign2[sideX] = hasX ? x + \"px\" : '', _Object$assign2.transform = '', _Object$assign2));\n}\n\nfunction computeStyles(_ref5) {\n var state = _ref5.state,\n options = _ref5.options;\n var _options$gpuAccelerat = options.gpuAcceleration,\n gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,\n _options$adaptive = options.adaptive,\n adaptive = _options$adaptive === void 0 ? true : _options$adaptive,\n _options$roundOffsets = options.roundOffsets,\n roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;\n var commonStyles = {\n placement: getBasePlacement(state.placement),\n variation: getVariation(state.placement),\n popper: state.elements.popper,\n popperRect: state.rects.popper,\n gpuAcceleration: gpuAcceleration,\n isFixed: state.options.strategy === 'fixed'\n };\n\n if (state.modifiersData.popperOffsets != null) {\n state.styles.popper = Object.assign({}, state.styles.popper, mapToStyles(Object.assign({}, commonStyles, {\n offsets: state.modifiersData.popperOffsets,\n position: state.options.strategy,\n adaptive: adaptive,\n roundOffsets: roundOffsets\n })));\n }\n\n if (state.modifiersData.arrow != null) {\n state.styles.arrow = Object.assign({}, state.styles.arrow, mapToStyles(Object.assign({}, commonStyles, {\n offsets: state.modifiersData.arrow,\n position: 'absolute',\n adaptive: false,\n roundOffsets: roundOffsets\n })));\n }\n\n state.attributes.popper = Object.assign({}, state.attributes.popper, {\n 'data-popper-placement': state.placement\n });\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'computeStyles',\n enabled: true,\n phase: 'beforeWrite',\n fn: computeStyles,\n data: {}\n};","import getBasePlacement from \"../utils/getBasePlacement.js\";\nimport { top, left, right, placements } from \"../enums.js\"; // eslint-disable-next-line import/no-unused-modules\n\nexport function distanceAndSkiddingToXY(placement, rects, offset) {\n var basePlacement = getBasePlacement(placement);\n var invertDistance = [left, top].indexOf(basePlacement) >= 0 ? -1 : 1;\n\n var _ref = typeof offset === 'function' ? offset(Object.assign({}, rects, {\n placement: placement\n })) : offset,\n skidding = _ref[0],\n distance = _ref[1];\n\n skidding = skidding || 0;\n distance = (distance || 0) * invertDistance;\n return [left, right].indexOf(basePlacement) >= 0 ? {\n x: distance,\n y: skidding\n } : {\n x: skidding,\n y: distance\n };\n}\n\nfunction offset(_ref2) {\n var state = _ref2.state,\n options = _ref2.options,\n name = _ref2.name;\n var _options$offset = options.offset,\n offset = _options$offset === void 0 ? [0, 0] : _options$offset;\n var data = placements.reduce(function (acc, placement) {\n acc[placement] = distanceAndSkiddingToXY(placement, state.rects, offset);\n return acc;\n }, {});\n var _data$state$placement = data[state.placement],\n x = _data$state$placement.x,\n y = _data$state$placement.y;\n\n if (state.modifiersData.popperOffsets != null) {\n state.modifiersData.popperOffsets.x += x;\n state.modifiersData.popperOffsets.y += y;\n }\n\n state.modifiersData[name] = data;\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'offset',\n enabled: true,\n phase: 'main',\n requires: ['popperOffsets'],\n fn: offset\n};","var hash = {\n left: 'right',\n right: 'left',\n bottom: 'top',\n top: 'bottom'\n};\nexport default function getOppositePlacement(placement) {\n return placement.replace(/left|right|bottom|top/g, function (matched) {\n return hash[matched];\n });\n}","var hash = {\n start: 'end',\n end: 'start'\n};\nexport default function getOppositeVariationPlacement(placement) {\n return placement.replace(/start|end/g, function (matched) {\n return hash[matched];\n });\n}","import { isShadowRoot } from \"./instanceOf.js\";\nexport default function contains(parent, child) {\n var rootNode = child.getRootNode && child.getRootNode(); // First, attempt with faster native method\n\n if (parent.contains(child)) {\n return true;\n } // then fallback to custom implementation with Shadow DOM support\n else if (rootNode && isShadowRoot(rootNode)) {\n var next = child;\n\n do {\n if (next && parent.isSameNode(next)) {\n return true;\n } // $FlowFixMe[prop-missing]: need a better way to handle this...\n\n\n next = next.parentNode || next.host;\n } while (next);\n } // Give up, the result is false\n\n\n return false;\n}","export default function rectToClientRect(rect) {\n return Object.assign({}, rect, {\n left: rect.x,\n top: rect.y,\n right: rect.x + rect.width,\n bottom: rect.y + rect.height\n });\n}","import { viewport } from \"../enums.js\";\nimport getViewportRect from \"./getViewportRect.js\";\nimport getDocumentRect from \"./getDocumentRect.js\";\nimport listScrollParents from \"./listScrollParents.js\";\nimport getOffsetParent from \"./getOffsetParent.js\";\nimport getDocumentElement from \"./getDocumentElement.js\";\nimport getComputedStyle from \"./getComputedStyle.js\";\nimport { isElement, isHTMLElement } from \"./instanceOf.js\";\nimport getBoundingClientRect from \"./getBoundingClientRect.js\";\nimport getParentNode from \"./getParentNode.js\";\nimport contains from \"./contains.js\";\nimport getNodeName from \"./getNodeName.js\";\nimport rectToClientRect from \"../utils/rectToClientRect.js\";\nimport { max, min } from \"../utils/math.js\";\n\nfunction getInnerBoundingClientRect(element, strategy) {\n var rect = getBoundingClientRect(element, false, strategy === 'fixed');\n rect.top = rect.top + element.clientTop;\n rect.left = rect.left + element.clientLeft;\n rect.bottom = rect.top + element.clientHeight;\n rect.right = rect.left + element.clientWidth;\n rect.width = element.clientWidth;\n rect.height = element.clientHeight;\n rect.x = rect.left;\n rect.y = rect.top;\n return rect;\n}\n\nfunction getClientRectFromMixedType(element, clippingParent, strategy) {\n return clippingParent === viewport ? rectToClientRect(getViewportRect(element, strategy)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent, strategy) : rectToClientRect(getDocumentRect(getDocumentElement(element)));\n} // A \"clipping parent\" is an overflowable container with the characteristic of\n// clipping (or hiding) overflowing elements with a position different from\n// `initial`\n\n\nfunction getClippingParents(element) {\n var clippingParents = listScrollParents(getParentNode(element));\n var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle(element).position) >= 0;\n var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;\n\n if (!isElement(clipperElement)) {\n return [];\n } // $FlowFixMe[incompatible-return]: https://github.com/facebook/flow/issues/1414\n\n\n return clippingParents.filter(function (clippingParent) {\n return isElement(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== 'body';\n });\n} // Gets the maximum area that the element is visible in due to any number of\n// clipping parents\n\n\nexport default function getClippingRect(element, boundary, rootBoundary, strategy) {\n var mainClippingParents = boundary === 'clippingParents' ? getClippingParents(element) : [].concat(boundary);\n var clippingParents = [].concat(mainClippingParents, [rootBoundary]);\n var firstClippingParent = clippingParents[0];\n var clippingRect = clippingParents.reduce(function (accRect, clippingParent) {\n var rect = getClientRectFromMixedType(element, clippingParent, strategy);\n accRect.top = max(rect.top, accRect.top);\n accRect.right = min(rect.right, accRect.right);\n accRect.bottom = min(rect.bottom, accRect.bottom);\n accRect.left = max(rect.left, accRect.left);\n return accRect;\n }, getClientRectFromMixedType(element, firstClippingParent, strategy));\n clippingRect.width = clippingRect.right - clippingRect.left;\n clippingRect.height = clippingRect.bottom - clippingRect.top;\n clippingRect.x = clippingRect.left;\n clippingRect.y = clippingRect.top;\n return clippingRect;\n}","import getWindow from \"./getWindow.js\";\nimport getDocumentElement from \"./getDocumentElement.js\";\nimport getWindowScrollBarX from \"./getWindowScrollBarX.js\";\nimport isLayoutViewport from \"./isLayoutViewport.js\";\nexport default function getViewportRect(element, strategy) {\n var win = getWindow(element);\n var html = getDocumentElement(element);\n var visualViewport = win.visualViewport;\n var width = html.clientWidth;\n var height = html.clientHeight;\n var x = 0;\n var y = 0;\n\n if (visualViewport) {\n width = visualViewport.width;\n height = visualViewport.height;\n var layoutViewport = isLayoutViewport();\n\n if (layoutViewport || !layoutViewport && strategy === 'fixed') {\n x = visualViewport.offsetLeft;\n y = visualViewport.offsetTop;\n }\n }\n\n return {\n width: width,\n height: height,\n x: x + getWindowScrollBarX(element),\n y: y\n };\n}","import getDocumentElement from \"./getDocumentElement.js\";\nimport getComputedStyle from \"./getComputedStyle.js\";\nimport getWindowScrollBarX from \"./getWindowScrollBarX.js\";\nimport getWindowScroll from \"./getWindowScroll.js\";\nimport { max } from \"../utils/math.js\"; // Gets the entire size of the scrollable document area, even extending outside\n// of the `` and `` rect bounds if horizontally scrollable\n\nexport default function getDocumentRect(element) {\n var _element$ownerDocumen;\n\n var html = getDocumentElement(element);\n var winScroll = getWindowScroll(element);\n var body = (_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body;\n var width = max(html.scrollWidth, html.clientWidth, body ? body.scrollWidth : 0, body ? body.clientWidth : 0);\n var height = max(html.scrollHeight, html.clientHeight, body ? body.scrollHeight : 0, body ? body.clientHeight : 0);\n var x = -winScroll.scrollLeft + getWindowScrollBarX(element);\n var y = -winScroll.scrollTop;\n\n if (getComputedStyle(body || html).direction === 'rtl') {\n x += max(html.clientWidth, body ? body.clientWidth : 0) - width;\n }\n\n return {\n width: width,\n height: height,\n x: x,\n y: y\n };\n}","import getFreshSideObject from \"./getFreshSideObject.js\";\nexport default function mergePaddingObject(paddingObject) {\n return Object.assign({}, getFreshSideObject(), paddingObject);\n}","export default function getFreshSideObject() {\n return {\n top: 0,\n right: 0,\n bottom: 0,\n left: 0\n };\n}","export default function expandToHashMap(value, keys) {\n return keys.reduce(function (hashMap, key) {\n hashMap[key] = value;\n return hashMap;\n }, {});\n}","import getClippingRect from \"../dom-utils/getClippingRect.js\";\nimport getDocumentElement from \"../dom-utils/getDocumentElement.js\";\nimport getBoundingClientRect from \"../dom-utils/getBoundingClientRect.js\";\nimport computeOffsets from \"./computeOffsets.js\";\nimport rectToClientRect from \"./rectToClientRect.js\";\nimport { clippingParents, reference, popper, bottom, top, right, basePlacements, viewport } from \"../enums.js\";\nimport { isElement } from \"../dom-utils/instanceOf.js\";\nimport mergePaddingObject from \"./mergePaddingObject.js\";\nimport expandToHashMap from \"./expandToHashMap.js\"; // eslint-disable-next-line import/no-unused-modules\n\nexport default function detectOverflow(state, options) {\n if (options === void 0) {\n options = {};\n }\n\n var _options = options,\n _options$placement = _options.placement,\n placement = _options$placement === void 0 ? state.placement : _options$placement,\n _options$strategy = _options.strategy,\n strategy = _options$strategy === void 0 ? state.strategy : _options$strategy,\n _options$boundary = _options.boundary,\n boundary = _options$boundary === void 0 ? clippingParents : _options$boundary,\n _options$rootBoundary = _options.rootBoundary,\n rootBoundary = _options$rootBoundary === void 0 ? viewport : _options$rootBoundary,\n _options$elementConte = _options.elementContext,\n elementContext = _options$elementConte === void 0 ? popper : _options$elementConte,\n _options$altBoundary = _options.altBoundary,\n altBoundary = _options$altBoundary === void 0 ? false : _options$altBoundary,\n _options$padding = _options.padding,\n padding = _options$padding === void 0 ? 0 : _options$padding;\n var paddingObject = mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));\n var altContext = elementContext === popper ? reference : popper;\n var popperRect = state.rects.popper;\n var element = state.elements[altBoundary ? altContext : elementContext];\n var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary, strategy);\n var referenceClientRect = getBoundingClientRect(state.elements.reference);\n var popperOffsets = computeOffsets({\n reference: referenceClientRect,\n element: popperRect,\n strategy: 'absolute',\n placement: placement\n });\n var popperClientRect = rectToClientRect(Object.assign({}, popperRect, popperOffsets));\n var elementClientRect = elementContext === popper ? popperClientRect : referenceClientRect; // positive = overflowing the clipping rect\n // 0 or negative = within the clipping rect\n\n var overflowOffsets = {\n top: clippingClientRect.top - elementClientRect.top + paddingObject.top,\n bottom: elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,\n left: clippingClientRect.left - elementClientRect.left + paddingObject.left,\n right: elementClientRect.right - clippingClientRect.right + paddingObject.right\n };\n var offsetData = state.modifiersData.offset; // Offsets can be applied only to the popper element\n\n if (elementContext === popper && offsetData) {\n var offset = offsetData[placement];\n Object.keys(overflowOffsets).forEach(function (key) {\n var multiply = [right, bottom].indexOf(key) >= 0 ? 1 : -1;\n var axis = [top, bottom].indexOf(key) >= 0 ? 'y' : 'x';\n overflowOffsets[key] += offset[axis] * multiply;\n });\n }\n\n return overflowOffsets;\n}","import { max as mathMax, min as mathMin } from \"./math.js\";\nexport function within(min, value, max) {\n return mathMax(min, mathMin(value, max));\n}\nexport function withinMaxClamp(min, value, max) {\n var v = within(min, value, max);\n return v > max ? max : v;\n}","import { top, left, right, bottom, start } from \"../enums.js\";\nimport getBasePlacement from \"../utils/getBasePlacement.js\";\nimport getMainAxisFromPlacement from \"../utils/getMainAxisFromPlacement.js\";\nimport getAltAxis from \"../utils/getAltAxis.js\";\nimport { within, withinMaxClamp } from \"../utils/within.js\";\nimport getLayoutRect from \"../dom-utils/getLayoutRect.js\";\nimport getOffsetParent from \"../dom-utils/getOffsetParent.js\";\nimport detectOverflow from \"../utils/detectOverflow.js\";\nimport getVariation from \"../utils/getVariation.js\";\nimport getFreshSideObject from \"../utils/getFreshSideObject.js\";\nimport { min as mathMin, max as mathMax } from \"../utils/math.js\";\n\nfunction preventOverflow(_ref) {\n var state = _ref.state,\n options = _ref.options,\n name = _ref.name;\n var _options$mainAxis = options.mainAxis,\n checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,\n _options$altAxis = options.altAxis,\n checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis,\n boundary = options.boundary,\n rootBoundary = options.rootBoundary,\n altBoundary = options.altBoundary,\n padding = options.padding,\n _options$tether = options.tether,\n tether = _options$tether === void 0 ? true : _options$tether,\n _options$tetherOffset = options.tetherOffset,\n tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;\n var overflow = detectOverflow(state, {\n boundary: boundary,\n rootBoundary: rootBoundary,\n padding: padding,\n altBoundary: altBoundary\n });\n var basePlacement = getBasePlacement(state.placement);\n var variation = getVariation(state.placement);\n var isBasePlacement = !variation;\n var mainAxis = getMainAxisFromPlacement(basePlacement);\n var altAxis = getAltAxis(mainAxis);\n var popperOffsets = state.modifiersData.popperOffsets;\n var referenceRect = state.rects.reference;\n var popperRect = state.rects.popper;\n var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {\n placement: state.placement\n })) : tetherOffset;\n var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {\n mainAxis: tetherOffsetValue,\n altAxis: tetherOffsetValue\n } : Object.assign({\n mainAxis: 0,\n altAxis: 0\n }, tetherOffsetValue);\n var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;\n var data = {\n x: 0,\n y: 0\n };\n\n if (!popperOffsets) {\n return;\n }\n\n if (checkMainAxis) {\n var _offsetModifierState$;\n\n var mainSide = mainAxis === 'y' ? top : left;\n var altSide = mainAxis === 'y' ? bottom : right;\n var len = mainAxis === 'y' ? 'height' : 'width';\n var offset = popperOffsets[mainAxis];\n var min = offset + overflow[mainSide];\n var max = offset - overflow[altSide];\n var additive = tether ? -popperRect[len] / 2 : 0;\n var minLen = variation === start ? referenceRect[len] : popperRect[len];\n var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go\n // outside the reference bounds\n\n var arrowElement = state.elements.arrow;\n var arrowRect = tether && arrowElement ? getLayoutRect(arrowElement) : {\n width: 0,\n height: 0\n };\n var arrowPaddingObject = state.modifiersData['arrow#persistent'] ? state.modifiersData['arrow#persistent'].padding : getFreshSideObject();\n var arrowPaddingMin = arrowPaddingObject[mainSide];\n var arrowPaddingMax = arrowPaddingObject[altSide]; // If the reference length is smaller than the arrow length, we don't want\n // to include its full size in the calculation. If the reference is small\n // and near the edge of a boundary, the popper can overflow even if the\n // reference is not overflowing as well (e.g. virtual elements with no\n // width or height)\n\n var arrowLen = within(0, referenceRect[len], arrowRect[len]);\n var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;\n var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;\n var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);\n var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;\n var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;\n var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;\n var tetherMax = offset + maxOffset - offsetModifierValue;\n var preventedOffset = within(tether ? mathMin(min, tetherMin) : min, offset, tether ? mathMax(max, tetherMax) : max);\n popperOffsets[mainAxis] = preventedOffset;\n data[mainAxis] = preventedOffset - offset;\n }\n\n if (checkAltAxis) {\n var _offsetModifierState$2;\n\n var _mainSide = mainAxis === 'x' ? top : left;\n\n var _altSide = mainAxis === 'x' ? bottom : right;\n\n var _offset = popperOffsets[altAxis];\n\n var _len = altAxis === 'y' ? 'height' : 'width';\n\n var _min = _offset + overflow[_mainSide];\n\n var _max = _offset - overflow[_altSide];\n\n var isOriginSide = [top, left].indexOf(basePlacement) !== -1;\n\n var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;\n\n var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;\n\n var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;\n\n var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);\n\n popperOffsets[altAxis] = _preventedOffset;\n data[altAxis] = _preventedOffset - _offset;\n }\n\n state.modifiersData[name] = data;\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'preventOverflow',\n enabled: true,\n phase: 'main',\n fn: preventOverflow,\n requiresIfExists: ['offset']\n};","export default function getAltAxis(axis) {\n return axis === 'x' ? 'y' : 'x';\n}","import getBasePlacement from \"../utils/getBasePlacement.js\";\nimport getLayoutRect from \"../dom-utils/getLayoutRect.js\";\nimport contains from \"../dom-utils/contains.js\";\nimport getOffsetParent from \"../dom-utils/getOffsetParent.js\";\nimport getMainAxisFromPlacement from \"../utils/getMainAxisFromPlacement.js\";\nimport { within } from \"../utils/within.js\";\nimport mergePaddingObject from \"../utils/mergePaddingObject.js\";\nimport expandToHashMap from \"../utils/expandToHashMap.js\";\nimport { left, right, basePlacements, top, bottom } from \"../enums.js\"; // eslint-disable-next-line import/no-unused-modules\n\nvar toPaddingObject = function toPaddingObject(padding, state) {\n padding = typeof padding === 'function' ? padding(Object.assign({}, state.rects, {\n placement: state.placement\n })) : padding;\n return mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));\n};\n\nfunction arrow(_ref) {\n var _state$modifiersData$;\n\n var state = _ref.state,\n name = _ref.name,\n options = _ref.options;\n var arrowElement = state.elements.arrow;\n var popperOffsets = state.modifiersData.popperOffsets;\n var basePlacement = getBasePlacement(state.placement);\n var axis = getMainAxisFromPlacement(basePlacement);\n var isVertical = [left, right].indexOf(basePlacement) >= 0;\n var len = isVertical ? 'height' : 'width';\n\n if (!arrowElement || !popperOffsets) {\n return;\n }\n\n var paddingObject = toPaddingObject(options.padding, state);\n var arrowRect = getLayoutRect(arrowElement);\n var minProp = axis === 'y' ? top : left;\n var maxProp = axis === 'y' ? bottom : right;\n var endDiff = state.rects.reference[len] + state.rects.reference[axis] - popperOffsets[axis] - state.rects.popper[len];\n var startDiff = popperOffsets[axis] - state.rects.reference[axis];\n var arrowOffsetParent = getOffsetParent(arrowElement);\n var clientSize = arrowOffsetParent ? axis === 'y' ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;\n var centerToReference = endDiff / 2 - startDiff / 2; // Make sure the arrow doesn't overflow the popper if the center point is\n // outside of the popper bounds\n\n var min = paddingObject[minProp];\n var max = clientSize - arrowRect[len] - paddingObject[maxProp];\n var center = clientSize / 2 - arrowRect[len] / 2 + centerToReference;\n var offset = within(min, center, max); // Prevents breaking syntax highlighting...\n\n var axisProp = axis;\n state.modifiersData[name] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset, _state$modifiersData$.centerOffset = offset - center, _state$modifiersData$);\n}\n\nfunction effect(_ref2) {\n var state = _ref2.state,\n options = _ref2.options;\n var _options$element = options.element,\n arrowElement = _options$element === void 0 ? '[data-popper-arrow]' : _options$element;\n\n if (arrowElement == null) {\n return;\n } // CSS selector\n\n\n if (typeof arrowElement === 'string') {\n arrowElement = state.elements.popper.querySelector(arrowElement);\n\n if (!arrowElement) {\n return;\n }\n }\n\n if (!contains(state.elements.popper, arrowElement)) {\n return;\n }\n\n state.elements.arrow = arrowElement;\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'arrow',\n enabled: true,\n phase: 'main',\n fn: arrow,\n effect: effect,\n requires: ['popperOffsets'],\n requiresIfExists: ['preventOverflow']\n};","import { top, bottom, left, right } from \"../enums.js\";\nimport detectOverflow from \"../utils/detectOverflow.js\";\n\nfunction getSideOffsets(overflow, rect, preventedOffsets) {\n if (preventedOffsets === void 0) {\n preventedOffsets = {\n x: 0,\n y: 0\n };\n }\n\n return {\n top: overflow.top - rect.height - preventedOffsets.y,\n right: overflow.right - rect.width + preventedOffsets.x,\n bottom: overflow.bottom - rect.height + preventedOffsets.y,\n left: overflow.left - rect.width - preventedOffsets.x\n };\n}\n\nfunction isAnySideFullyClipped(overflow) {\n return [top, right, bottom, left].some(function (side) {\n return overflow[side] >= 0;\n });\n}\n\nfunction hide(_ref) {\n var state = _ref.state,\n name = _ref.name;\n var referenceRect = state.rects.reference;\n var popperRect = state.rects.popper;\n var preventedOffsets = state.modifiersData.preventOverflow;\n var referenceOverflow = detectOverflow(state, {\n elementContext: 'reference'\n });\n var popperAltOverflow = detectOverflow(state, {\n altBoundary: true\n });\n var referenceClippingOffsets = getSideOffsets(referenceOverflow, referenceRect);\n var popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets);\n var isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets);\n var hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets);\n state.modifiersData[name] = {\n referenceClippingOffsets: referenceClippingOffsets,\n popperEscapeOffsets: popperEscapeOffsets,\n isReferenceHidden: isReferenceHidden,\n hasPopperEscaped: hasPopperEscaped\n };\n state.attributes.popper = Object.assign({}, state.attributes.popper, {\n 'data-popper-reference-hidden': isReferenceHidden,\n 'data-popper-escaped': hasPopperEscaped\n });\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'hide',\n enabled: true,\n phase: 'main',\n requiresIfExists: ['preventOverflow'],\n fn: hide\n};","import { popperGenerator, detectOverflow } from \"./createPopper.js\";\nimport eventListeners from \"./modifiers/eventListeners.js\";\nimport popperOffsets from \"./modifiers/popperOffsets.js\";\nimport computeStyles from \"./modifiers/computeStyles.js\";\nimport applyStyles from \"./modifiers/applyStyles.js\";\nimport offset from \"./modifiers/offset.js\";\nimport flip from \"./modifiers/flip.js\";\nimport preventOverflow from \"./modifiers/preventOverflow.js\";\nimport arrow from \"./modifiers/arrow.js\";\nimport hide from \"./modifiers/hide.js\";\nvar defaultModifiers = [eventListeners, popperOffsets, computeStyles, applyStyles, offset, flip, preventOverflow, arrow, hide];\nvar createPopper = /*#__PURE__*/popperGenerator({\n defaultModifiers: defaultModifiers\n}); // eslint-disable-next-line import/no-unused-modules\n\nexport { createPopper, popperGenerator, defaultModifiers, detectOverflow }; // eslint-disable-next-line import/no-unused-modules\n\nexport { createPopper as createPopperLite } from \"./popper-lite.js\"; // eslint-disable-next-line import/no-unused-modules\n\nexport * from \"./modifiers/index.js\";","import computeOffsets from \"../utils/computeOffsets.js\";\n\nfunction popperOffsets(_ref) {\n var state = _ref.state,\n name = _ref.name;\n // Offsets are the actual position the popper needs to have to be\n // properly positioned near its reference element\n // This is the most basic placement, and will be adjusted by\n // the modifiers in the next step\n state.modifiersData[name] = computeOffsets({\n reference: state.rects.reference,\n element: state.rects.popper,\n strategy: 'absolute',\n placement: state.placement\n });\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'popperOffsets',\n enabled: true,\n phase: 'read',\n fn: popperOffsets,\n data: {}\n};","import getNodeName from \"../dom-utils/getNodeName.js\";\nimport { isHTMLElement } from \"../dom-utils/instanceOf.js\"; // This modifier takes the styles prepared by the `computeStyles` modifier\n// and applies them to the HTMLElements such as popper and arrow\n\nfunction applyStyles(_ref) {\n var state = _ref.state;\n Object.keys(state.elements).forEach(function (name) {\n var style = state.styles[name] || {};\n var attributes = state.attributes[name] || {};\n var element = state.elements[name]; // arrow is optional + virtual elements\n\n if (!isHTMLElement(element) || !getNodeName(element)) {\n return;\n } // Flow doesn't support to extend this property, but it's the most\n // effective way to apply styles to an HTMLElement\n // $FlowFixMe[cannot-write]\n\n\n Object.assign(element.style, style);\n Object.keys(attributes).forEach(function (name) {\n var value = attributes[name];\n\n if (value === false) {\n element.removeAttribute(name);\n } else {\n element.setAttribute(name, value === true ? '' : value);\n }\n });\n });\n}\n\nfunction effect(_ref2) {\n var state = _ref2.state;\n var initialStyles = {\n popper: {\n position: state.options.strategy,\n left: '0',\n top: '0',\n margin: '0'\n },\n arrow: {\n position: 'absolute'\n },\n reference: {}\n };\n Object.assign(state.elements.popper.style, initialStyles.popper);\n state.styles = initialStyles;\n\n if (state.elements.arrow) {\n Object.assign(state.elements.arrow.style, initialStyles.arrow);\n }\n\n return function () {\n Object.keys(state.elements).forEach(function (name) {\n var element = state.elements[name];\n var attributes = state.attributes[name] || {};\n var styleProperties = Object.keys(state.styles.hasOwnProperty(name) ? state.styles[name] : initialStyles[name]); // Set all values to an empty string to unset them\n\n var style = styleProperties.reduce(function (style, property) {\n style[property] = '';\n return style;\n }, {}); // arrow is optional + virtual elements\n\n if (!isHTMLElement(element) || !getNodeName(element)) {\n return;\n }\n\n Object.assign(element.style, style);\n Object.keys(attributes).forEach(function (attribute) {\n element.removeAttribute(attribute);\n });\n });\n };\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'applyStyles',\n enabled: true,\n phase: 'write',\n fn: applyStyles,\n effect: effect,\n requires: ['computeStyles']\n};","import getOppositePlacement from \"../utils/getOppositePlacement.js\";\nimport getBasePlacement from \"../utils/getBasePlacement.js\";\nimport getOppositeVariationPlacement from \"../utils/getOppositeVariationPlacement.js\";\nimport detectOverflow from \"../utils/detectOverflow.js\";\nimport computeAutoPlacement from \"../utils/computeAutoPlacement.js\";\nimport { bottom, top, start, right, left, auto } from \"../enums.js\";\nimport getVariation from \"../utils/getVariation.js\"; // eslint-disable-next-line import/no-unused-modules\n\nfunction getExpandedFallbackPlacements(placement) {\n if (getBasePlacement(placement) === auto) {\n return [];\n }\n\n var oppositePlacement = getOppositePlacement(placement);\n return [getOppositeVariationPlacement(placement), oppositePlacement, getOppositeVariationPlacement(oppositePlacement)];\n}\n\nfunction flip(_ref) {\n var state = _ref.state,\n options = _ref.options,\n name = _ref.name;\n\n if (state.modifiersData[name]._skip) {\n return;\n }\n\n var _options$mainAxis = options.mainAxis,\n checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,\n _options$altAxis = options.altAxis,\n checkAltAxis = _options$altAxis === void 0 ? true : _options$altAxis,\n specifiedFallbackPlacements = options.fallbackPlacements,\n padding = options.padding,\n boundary = options.boundary,\n rootBoundary = options.rootBoundary,\n altBoundary = options.altBoundary,\n _options$flipVariatio = options.flipVariations,\n flipVariations = _options$flipVariatio === void 0 ? true : _options$flipVariatio,\n allowedAutoPlacements = options.allowedAutoPlacements;\n var preferredPlacement = state.options.placement;\n var basePlacement = getBasePlacement(preferredPlacement);\n var isBasePlacement = basePlacement === preferredPlacement;\n var fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipVariations ? [getOppositePlacement(preferredPlacement)] : getExpandedFallbackPlacements(preferredPlacement));\n var placements = [preferredPlacement].concat(fallbackPlacements).reduce(function (acc, placement) {\n return acc.concat(getBasePlacement(placement) === auto ? computeAutoPlacement(state, {\n placement: placement,\n boundary: boundary,\n rootBoundary: rootBoundary,\n padding: padding,\n flipVariations: flipVariations,\n allowedAutoPlacements: allowedAutoPlacements\n }) : placement);\n }, []);\n var referenceRect = state.rects.reference;\n var popperRect = state.rects.popper;\n var checksMap = new Map();\n var makeFallbackChecks = true;\n var firstFittingPlacement = placements[0];\n\n for (var i = 0; i < placements.length; i++) {\n var placement = placements[i];\n\n var _basePlacement = getBasePlacement(placement);\n\n var isStartVariation = getVariation(placement) === start;\n var isVertical = [top, bottom].indexOf(_basePlacement) >= 0;\n var len = isVertical ? 'width' : 'height';\n var overflow = detectOverflow(state, {\n placement: placement,\n boundary: boundary,\n rootBoundary: rootBoundary,\n altBoundary: altBoundary,\n padding: padding\n });\n var mainVariationSide = isVertical ? isStartVariation ? right : left : isStartVariation ? bottom : top;\n\n if (referenceRect[len] > popperRect[len]) {\n mainVariationSide = getOppositePlacement(mainVariationSide);\n }\n\n var altVariationSide = getOppositePlacement(mainVariationSide);\n var checks = [];\n\n if (checkMainAxis) {\n checks.push(overflow[_basePlacement] <= 0);\n }\n\n if (checkAltAxis) {\n checks.push(overflow[mainVariationSide] <= 0, overflow[altVariationSide] <= 0);\n }\n\n if (checks.every(function (check) {\n return check;\n })) {\n firstFittingPlacement = placement;\n makeFallbackChecks = false;\n break;\n }\n\n checksMap.set(placement, checks);\n }\n\n if (makeFallbackChecks) {\n // `2` may be desired in some cases – research later\n var numberOfChecks = flipVariations ? 3 : 1;\n\n var _loop = function _loop(_i) {\n var fittingPlacement = placements.find(function (placement) {\n var checks = checksMap.get(placement);\n\n if (checks) {\n return checks.slice(0, _i).every(function (check) {\n return check;\n });\n }\n });\n\n if (fittingPlacement) {\n firstFittingPlacement = fittingPlacement;\n return \"break\";\n }\n };\n\n for (var _i = numberOfChecks; _i > 0; _i--) {\n var _ret = _loop(_i);\n\n if (_ret === \"break\") break;\n }\n }\n\n if (state.placement !== firstFittingPlacement) {\n state.modifiersData[name]._skip = true;\n state.placement = firstFittingPlacement;\n state.reset = true;\n }\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'flip',\n enabled: true,\n phase: 'main',\n fn: flip,\n requiresIfExists: ['offset'],\n data: {\n _skip: false\n }\n};","import getVariation from \"./getVariation.js\";\nimport { variationPlacements, basePlacements, placements as allPlacements } from \"../enums.js\";\nimport detectOverflow from \"./detectOverflow.js\";\nimport getBasePlacement from \"./getBasePlacement.js\";\nexport default function computeAutoPlacement(state, options) {\n if (options === void 0) {\n options = {};\n }\n\n var _options = options,\n placement = _options.placement,\n boundary = _options.boundary,\n rootBoundary = _options.rootBoundary,\n padding = _options.padding,\n flipVariations = _options.flipVariations,\n _options$allowedAutoP = _options.allowedAutoPlacements,\n allowedAutoPlacements = _options$allowedAutoP === void 0 ? allPlacements : _options$allowedAutoP;\n var variation = getVariation(placement);\n var placements = variation ? flipVariations ? variationPlacements : variationPlacements.filter(function (placement) {\n return getVariation(placement) === variation;\n }) : basePlacements;\n var allowedPlacements = placements.filter(function (placement) {\n return allowedAutoPlacements.indexOf(placement) >= 0;\n });\n\n if (allowedPlacements.length === 0) {\n allowedPlacements = placements;\n } // $FlowFixMe[incompatible-type]: Flow seems to have problems with two array unions...\n\n\n var overflows = allowedPlacements.reduce(function (acc, placement) {\n acc[placement] = detectOverflow(state, {\n placement: placement,\n boundary: boundary,\n rootBoundary: rootBoundary,\n padding: padding\n })[getBasePlacement(placement)];\n return acc;\n }, {});\n return Object.keys(overflows).sort(function (a, b) {\n return overflows[a] - overflows[b];\n });\n}","import { globalStateClasses } from '@mui/utils/generateUtilityClass';\nconst GLOBAL_CLASS_PREFIX = 'base';\nfunction buildStateClass(state) {\n return `${GLOBAL_CLASS_PREFIX}--${state}`;\n}\nfunction buildSlotClass(componentName, slot) {\n return `${GLOBAL_CLASS_PREFIX}-${componentName}-${slot}`;\n}\nexport function generateUtilityClass(componentName, slot) {\n const globalStateClass = globalStateClasses[slot];\n return globalStateClass ? buildStateClass(globalStateClass) : buildSlotClass(componentName, slot);\n}\nexport function isGlobalState(slot) {\n return globalStateClasses[slot] !== undefined;\n}","import { generateUtilityClass } from '../generateUtilityClass';\nimport { generateUtilityClasses } from '../generateUtilityClasses';\nconst COMPONENT_NAME = 'Popper';\nexport function getPopperUtilityClass(slot) {\n return generateUtilityClass(COMPONENT_NAME, slot);\n}\nexport const popperClasses = generateUtilityClasses(COMPONENT_NAME, ['root']);","import { generateUtilityClass } from '../generateUtilityClass';\nexport function generateUtilityClasses(componentName, slots) {\n const result = {};\n slots.forEach(slot => {\n result[slot] = generateUtilityClass(componentName, slot);\n });\n return result;\n}","'use client';\n\nimport * as React from 'react';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst defaultContextValue = {\n disableDefaultClasses: false\n};\nconst ClassNameConfiguratorContext = /*#__PURE__*/React.createContext(defaultContextValue);\nif (process.env.NODE_ENV !== 'production') {\n ClassNameConfiguratorContext.displayName = 'ClassNameConfiguratorContext';\n}\n/**\n * @ignore - internal hook.\n *\n * Wraps the `generateUtilityClass` function and controls how the classes are generated.\n * Currently it only affects whether the classes are applied or not.\n *\n * @returns Function to be called with the `generateUtilityClass` function specific to a component to generate the classes.\n */\nexport function useClassNamesOverride(generateUtilityClass) {\n const {\n disableDefaultClasses\n } = React.useContext(ClassNameConfiguratorContext);\n return slot => {\n if (disableDefaultClasses) {\n return '';\n }\n return generateUtilityClass(slot);\n };\n}\n\n/**\n * Allows to configure the components within to not apply any built-in classes.\n */\nexport function ClassNameConfigurator(props) {\n const {\n disableDefaultClasses,\n children\n } = props;\n const contextValue = React.useMemo(() => ({\n disableDefaultClasses: disableDefaultClasses != null ? disableDefaultClasses : false\n }), [disableDefaultClasses]);\n return /*#__PURE__*/_jsx(ClassNameConfiguratorContext.Provider, {\n value: contextValue,\n children: children\n });\n}","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"anchorEl\", \"children\", \"direction\", \"disablePortal\", \"modifiers\", \"open\", \"placement\", \"popperOptions\", \"popperRef\", \"slotProps\", \"slots\", \"TransitionProps\", \"ownerState\"],\n _excluded2 = [\"anchorEl\", \"children\", \"container\", \"direction\", \"disablePortal\", \"keepMounted\", \"modifiers\", \"open\", \"placement\", \"popperOptions\", \"popperRef\", \"style\", \"transition\", \"slotProps\", \"slots\"];\nimport * as React from 'react';\nimport { chainPropTypes, HTMLElementType, refType, unstable_ownerDocument as ownerDocument, unstable_useEnhancedEffect as useEnhancedEffect, unstable_useForkRef as useForkRef } from '@mui/utils';\nimport { createPopper } from '@popperjs/core';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses } from '../composeClasses';\nimport { Portal } from '../Portal';\nimport { getPopperUtilityClass } from './popperClasses';\nimport { useSlotProps } from '../utils';\nimport { useClassNamesOverride } from '../utils/ClassNameConfigurator';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction flipPlacement(placement, direction) {\n if (direction === 'ltr') {\n return placement;\n }\n switch (placement) {\n case 'bottom-end':\n return 'bottom-start';\n case 'bottom-start':\n return 'bottom-end';\n case 'top-end':\n return 'top-start';\n case 'top-start':\n return 'top-end';\n default:\n return placement;\n }\n}\nfunction resolveAnchorEl(anchorEl) {\n return typeof anchorEl === 'function' ? anchorEl() : anchorEl;\n}\nfunction isHTMLElement(element) {\n return element.nodeType !== undefined;\n}\nfunction isVirtualElement(element) {\n return !isHTMLElement(element);\n}\nconst useUtilityClasses = () => {\n const slots = {\n root: ['root']\n };\n return composeClasses(slots, useClassNamesOverride(getPopperUtilityClass));\n};\nconst defaultPopperOptions = {};\nconst PopperTooltip = /*#__PURE__*/React.forwardRef(function PopperTooltip(props, forwardedRef) {\n var _slots$root;\n const {\n anchorEl,\n children,\n direction,\n disablePortal,\n modifiers,\n open,\n placement: initialPlacement,\n popperOptions,\n popperRef: popperRefProp,\n slotProps = {},\n slots = {},\n TransitionProps\n // @ts-ignore internal logic\n // prevent from spreading to DOM, it can come from the parent component e.g. Select.\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const tooltipRef = React.useRef(null);\n const ownRef = useForkRef(tooltipRef, forwardedRef);\n const popperRef = React.useRef(null);\n const handlePopperRef = useForkRef(popperRef, popperRefProp);\n const handlePopperRefRef = React.useRef(handlePopperRef);\n useEnhancedEffect(() => {\n handlePopperRefRef.current = handlePopperRef;\n }, [handlePopperRef]);\n React.useImperativeHandle(popperRefProp, () => popperRef.current, []);\n const rtlPlacement = flipPlacement(initialPlacement, direction);\n /**\n * placement initialized from prop but can change during lifetime if modifiers.flip.\n * modifiers.flip is essentially a flip for controlled/uncontrolled behavior\n */\n const [placement, setPlacement] = React.useState(rtlPlacement);\n const [resolvedAnchorElement, setResolvedAnchorElement] = React.useState(resolveAnchorEl(anchorEl));\n React.useEffect(() => {\n if (popperRef.current) {\n popperRef.current.forceUpdate();\n }\n });\n React.useEffect(() => {\n if (anchorEl) {\n setResolvedAnchorElement(resolveAnchorEl(anchorEl));\n }\n }, [anchorEl]);\n useEnhancedEffect(() => {\n if (!resolvedAnchorElement || !open) {\n return undefined;\n }\n const handlePopperUpdate = data => {\n setPlacement(data.placement);\n };\n if (process.env.NODE_ENV !== 'production') {\n if (resolvedAnchorElement && isHTMLElement(resolvedAnchorElement) && resolvedAnchorElement.nodeType === 1) {\n const box = resolvedAnchorElement.getBoundingClientRect();\n if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {\n console.warn(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', \"Make sure the element is present in the document or that it's not display none.\"].join('\\n'));\n }\n }\n }\n let popperModifiers = [{\n name: 'preventOverflow',\n options: {\n altBoundary: disablePortal\n }\n }, {\n name: 'flip',\n options: {\n altBoundary: disablePortal\n }\n }, {\n name: 'onUpdate',\n enabled: true,\n phase: 'afterWrite',\n fn: ({\n state\n }) => {\n handlePopperUpdate(state);\n }\n }];\n if (modifiers != null) {\n popperModifiers = popperModifiers.concat(modifiers);\n }\n if (popperOptions && popperOptions.modifiers != null) {\n popperModifiers = popperModifiers.concat(popperOptions.modifiers);\n }\n const popper = createPopper(resolvedAnchorElement, tooltipRef.current, _extends({\n placement: rtlPlacement\n }, popperOptions, {\n modifiers: popperModifiers\n }));\n handlePopperRefRef.current(popper);\n return () => {\n popper.destroy();\n handlePopperRefRef.current(null);\n };\n }, [resolvedAnchorElement, disablePortal, modifiers, open, popperOptions, rtlPlacement]);\n const childProps = {\n placement: placement\n };\n if (TransitionProps !== null) {\n childProps.TransitionProps = TransitionProps;\n }\n const classes = useUtilityClasses();\n const Root = (_slots$root = slots.root) != null ? _slots$root : 'div';\n const rootProps = useSlotProps({\n elementType: Root,\n externalSlotProps: slotProps.root,\n externalForwardedProps: other,\n additionalProps: {\n role: 'tooltip',\n ref: ownRef\n },\n ownerState: props,\n className: classes.root\n });\n return /*#__PURE__*/_jsx(Root, _extends({}, rootProps, {\n children: typeof children === 'function' ? children(childProps) : children\n }));\n});\n\n/**\n * Poppers rely on the 3rd party library [Popper.js](https://popper.js.org/docs/v2/) for positioning.\n *\n * Demos:\n *\n * - [Popper](https://mui.com/base-ui/react-popper/)\n *\n * API:\n *\n * - [Popper API](https://mui.com/base-ui/react-popper/components-api/#popper)\n */\nconst Popper = /*#__PURE__*/React.forwardRef(function Popper(props, forwardedRef) {\n const {\n anchorEl,\n children,\n container: containerProp,\n direction = 'ltr',\n disablePortal = false,\n keepMounted = false,\n modifiers,\n open,\n placement = 'bottom',\n popperOptions = defaultPopperOptions,\n popperRef,\n style,\n transition = false,\n slotProps = {},\n slots = {}\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded2);\n const [exited, setExited] = React.useState(true);\n const handleEnter = () => {\n setExited(false);\n };\n const handleExited = () => {\n setExited(true);\n };\n if (!keepMounted && !open && (!transition || exited)) {\n return null;\n }\n\n // If the container prop is provided, use that\n // If the anchorEl prop is provided, use its parent body element as the container\n // If neither are provided let the Modal take care of choosing the container\n let container;\n if (containerProp) {\n container = containerProp;\n } else if (anchorEl) {\n const resolvedAnchorEl = resolveAnchorEl(anchorEl);\n container = resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) ? ownerDocument(resolvedAnchorEl).body : ownerDocument(null).body;\n }\n const display = !open && keepMounted && (!transition || exited) ? 'none' : undefined;\n const transitionProps = transition ? {\n in: open,\n onEnter: handleEnter,\n onExited: handleExited\n } : undefined;\n return /*#__PURE__*/_jsx(Portal, {\n disablePortal: disablePortal,\n container: container,\n children: /*#__PURE__*/_jsx(PopperTooltip, _extends({\n anchorEl: anchorEl,\n direction: direction,\n disablePortal: disablePortal,\n modifiers: modifiers,\n ref: forwardedRef,\n open: transition ? !exited : open,\n placement: placement,\n popperOptions: popperOptions,\n popperRef: popperRef,\n slotProps: slotProps,\n slots: slots\n }, other, {\n style: _extends({\n // Prevents scroll issue, waiting for Popper.js to add this style once initiated.\n position: 'fixed',\n // Fix Popper.js display issue\n top: 0,\n left: 0,\n display\n }, style),\n TransitionProps: transitionProps,\n children: children\n }))\n });\n});\nprocess.env.NODE_ENV !== \"production\" ? Popper.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * An HTML element, [virtualElement](https://popper.js.org/docs/v2/virtual-elements/),\n * or a function that returns either.\n * It's used to set the position of the popper.\n * The return value will passed as the reference object of the Popper instance.\n */\n anchorEl: chainPropTypes(PropTypes.oneOfType([HTMLElementType, PropTypes.object, PropTypes.func]), props => {\n if (props.open) {\n const resolvedAnchorEl = resolveAnchorEl(props.anchorEl);\n if (resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) && resolvedAnchorEl.nodeType === 1) {\n const box = resolvedAnchorEl.getBoundingClientRect();\n if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {\n return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', \"Make sure the element is present in the document or that it's not display none.\"].join('\\n'));\n }\n } else if (!resolvedAnchorEl || typeof resolvedAnchorEl.getBoundingClientRect !== 'function' || isVirtualElement(resolvedAnchorEl) && resolvedAnchorEl.contextElement != null && resolvedAnchorEl.contextElement.nodeType !== 1) {\n return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', 'It should be an HTML element instance or a virtualElement ', '(https://popper.js.org/docs/v2/virtual-elements/).'].join('\\n'));\n }\n }\n return null;\n }),\n /**\n * Popper render function or node.\n */\n children: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.node, PropTypes.func]),\n /**\n * An HTML element or function that returns one.\n * The `container` will have the portal children appended to it.\n *\n * You can also provide a callback, which is called in a React layout effect.\n * This lets you set the container from a ref, and also makes server-side rendering possible.\n *\n * By default, it uses the body of the top-level document object,\n * so it's simply `document.body` most of the time.\n */\n container: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([HTMLElementType, PropTypes.func]),\n /**\n * Direction of the text.\n * @default 'ltr'\n */\n direction: PropTypes.oneOf(['ltr', 'rtl']),\n /**\n * The `children` will be under the DOM hierarchy of the parent component.\n * @default false\n */\n disablePortal: PropTypes.bool,\n /**\n * Always keep the children in the DOM.\n * This prop can be useful in SEO situation or\n * when you want to maximize the responsiveness of the Popper.\n * @default false\n */\n keepMounted: PropTypes.bool,\n /**\n * Popper.js is based on a \"plugin-like\" architecture,\n * most of its features are fully encapsulated \"modifiers\".\n *\n * A modifier is a function that is called each time Popper.js needs to\n * compute the position of the popper.\n * For this reason, modifiers should be very performant to avoid bottlenecks.\n * To learn how to create a modifier, [read the modifiers documentation](https://popper.js.org/docs/v2/modifiers/).\n */\n modifiers: PropTypes.arrayOf(PropTypes.shape({\n data: PropTypes.object,\n effect: PropTypes.func,\n enabled: PropTypes.bool,\n fn: PropTypes.func,\n name: PropTypes.any,\n options: PropTypes.object,\n phase: PropTypes.oneOf(['afterMain', 'afterRead', 'afterWrite', 'beforeMain', 'beforeRead', 'beforeWrite', 'main', 'read', 'write']),\n requires: PropTypes.arrayOf(PropTypes.string),\n requiresIfExists: PropTypes.arrayOf(PropTypes.string)\n })),\n /**\n * If `true`, the component is shown.\n */\n open: PropTypes.bool.isRequired,\n /**\n * Popper placement.\n * @default 'bottom'\n */\n placement: PropTypes.oneOf(['auto-end', 'auto-start', 'auto', 'bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),\n /**\n * Options provided to the [`Popper.js`](https://popper.js.org/docs/v2/constructors/#options) instance.\n * @default {}\n */\n popperOptions: PropTypes.shape({\n modifiers: PropTypes.array,\n onFirstUpdate: PropTypes.func,\n placement: PropTypes.oneOf(['auto-end', 'auto-start', 'auto', 'bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),\n strategy: PropTypes.oneOf(['absolute', 'fixed'])\n }),\n /**\n * A ref that points to the used popper instance.\n */\n popperRef: refType,\n /**\n * The props used for each slot inside the Popper.\n * @default {}\n */\n slotProps: PropTypes.shape({\n root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])\n }),\n /**\n * The components used for each slot inside the Popper.\n * Either a string to use a HTML element or a component.\n * @default {}\n */\n slots: PropTypes.shape({\n root: PropTypes.elementType\n }),\n /**\n * Help supporting a react-transition-group/Transition component.\n * @default false\n */\n transition: PropTypes.bool\n} : void 0;\nexport { Popper };","'use client';\n\nimport * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport { exactProp, HTMLElementType, unstable_useEnhancedEffect as useEnhancedEffect, unstable_useForkRef as useForkRef, unstable_setRef as setRef } from '@mui/utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction getContainer(container) {\n return typeof container === 'function' ? container() : container;\n}\n\n/**\n * Portals provide a first-class way to render children into a DOM node\n * that exists outside the DOM hierarchy of the parent component.\n *\n * Demos:\n *\n * - [Portal](https://mui.com/base-ui/react-portal/)\n *\n * API:\n *\n * - [Portal API](https://mui.com/base-ui/react-portal/components-api/#portal)\n */\nconst Portal = /*#__PURE__*/React.forwardRef(function Portal(props, forwardedRef) {\n const {\n children,\n container,\n disablePortal = false\n } = props;\n const [mountNode, setMountNode] = React.useState(null);\n // @ts-expect-error TODO upstream fix\n const handleRef = useForkRef( /*#__PURE__*/React.isValidElement(children) ? children.ref : null, forwardedRef);\n useEnhancedEffect(() => {\n if (!disablePortal) {\n setMountNode(getContainer(container) || document.body);\n }\n }, [container, disablePortal]);\n useEnhancedEffect(() => {\n if (mountNode && !disablePortal) {\n setRef(forwardedRef, mountNode);\n return () => {\n setRef(forwardedRef, null);\n };\n }\n return undefined;\n }, [forwardedRef, mountNode, disablePortal]);\n if (disablePortal) {\n if ( /*#__PURE__*/React.isValidElement(children)) {\n const newProps = {\n ref: handleRef\n };\n return /*#__PURE__*/React.cloneElement(children, newProps);\n }\n return /*#__PURE__*/_jsx(React.Fragment, {\n children: children\n });\n }\n return /*#__PURE__*/_jsx(React.Fragment, {\n children: mountNode ? /*#__PURE__*/ReactDOM.createPortal(children, mountNode) : mountNode\n });\n});\nprocess.env.NODE_ENV !== \"production\" ? Portal.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * The children to render into the `container`.\n */\n children: PropTypes.node,\n /**\n * An HTML element or function that returns one.\n * The `container` will have the portal children appended to it.\n *\n * You can also provide a callback, which is called in a React layout effect.\n * This lets you set the container from a ref, and also makes server-side rendering possible.\n *\n * By default, it uses the body of the top-level document object,\n * so it's simply `document.body` most of the time.\n */\n container: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([HTMLElementType, PropTypes.func]),\n /**\n * The `children` will be under the DOM hierarchy of the parent component.\n * @default false\n */\n disablePortal: PropTypes.bool\n} : void 0;\nif (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line\n Portal['propTypes' + ''] = exactProp(Portal.propTypes);\n}\nexport { Portal };","'use client';\n\n/* eslint-disable no-constant-condition */\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { unstable_setRef as setRef, unstable_useEventCallback as useEventCallback, unstable_useControlled as useControlled, unstable_useId as useId, usePreviousProps } from '@mui/utils';\n\n// https://stackoverflow.com/questions/990904/remove-accents-diacritics-in-a-string-in-javascript\n// Give up on IE11 support for this feature\nfunction stripDiacritics(string) {\n return typeof string.normalize !== 'undefined' ? string.normalize('NFD').replace(/[\\u0300-\\u036f]/g, '') : string;\n}\nexport function createFilterOptions(config = {}) {\n const {\n ignoreAccents = true,\n ignoreCase = true,\n limit,\n matchFrom = 'any',\n stringify,\n trim = false\n } = config;\n return (options, {\n inputValue,\n getOptionLabel\n }) => {\n let input = trim ? inputValue.trim() : inputValue;\n if (ignoreCase) {\n input = input.toLowerCase();\n }\n if (ignoreAccents) {\n input = stripDiacritics(input);\n }\n const filteredOptions = !input ? options : options.filter(option => {\n let candidate = (stringify || getOptionLabel)(option);\n if (ignoreCase) {\n candidate = candidate.toLowerCase();\n }\n if (ignoreAccents) {\n candidate = stripDiacritics(candidate);\n }\n return matchFrom === 'start' ? candidate.indexOf(input) === 0 : candidate.indexOf(input) > -1;\n });\n return typeof limit === 'number' ? filteredOptions.slice(0, limit) : filteredOptions;\n };\n}\n\n// To replace with .findIndex() once we stop IE11 support.\nfunction findIndex(array, comp) {\n for (let i = 0; i < array.length; i += 1) {\n if (comp(array[i])) {\n return i;\n }\n }\n return -1;\n}\nconst defaultFilterOptions = createFilterOptions();\n\n// Number of options to jump in list box when `Page Up` and `Page Down` keys are used.\nconst pageSize = 5;\nconst defaultIsActiveElementInListbox = listboxRef => {\n var _listboxRef$current$p;\n return listboxRef.current !== null && ((_listboxRef$current$p = listboxRef.current.parentElement) == null ? void 0 : _listboxRef$current$p.contains(document.activeElement));\n};\nexport function useAutocomplete(props) {\n const {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n unstable_isActiveElementInListbox = defaultIsActiveElementInListbox,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n unstable_classNamePrefix = 'Mui',\n autoComplete = false,\n autoHighlight = false,\n autoSelect = false,\n blurOnSelect = false,\n clearOnBlur = !props.freeSolo,\n clearOnEscape = false,\n componentName = 'useAutocomplete',\n defaultValue = props.multiple ? [] : null,\n disableClearable = false,\n disableCloseOnSelect = false,\n disabled: disabledProp,\n disabledItemsFocusable = false,\n disableListWrap = false,\n filterOptions = defaultFilterOptions,\n filterSelectedOptions = false,\n freeSolo = false,\n getOptionDisabled,\n getOptionKey,\n getOptionLabel: getOptionLabelProp = option => {\n var _option$label;\n return (_option$label = option.label) != null ? _option$label : option;\n },\n groupBy,\n handleHomeEndKeys = !props.freeSolo,\n id: idProp,\n includeInputInList = false,\n inputValue: inputValueProp,\n isOptionEqualToValue = (option, value) => option === value,\n multiple = false,\n onChange,\n onClose,\n onHighlightChange,\n onInputChange,\n onOpen,\n open: openProp,\n openOnFocus = false,\n options,\n readOnly = false,\n selectOnFocus = !props.freeSolo,\n value: valueProp\n } = props;\n const id = useId(idProp);\n let getOptionLabel = getOptionLabelProp;\n getOptionLabel = option => {\n const optionLabel = getOptionLabelProp(option);\n if (typeof optionLabel !== 'string') {\n if (process.env.NODE_ENV !== 'production') {\n const erroneousReturn = optionLabel === undefined ? 'undefined' : `${typeof optionLabel} (${optionLabel})`;\n console.error(`MUI: The \\`getOptionLabel\\` method of ${componentName} returned ${erroneousReturn} instead of a string for ${JSON.stringify(option)}.`);\n }\n return String(optionLabel);\n }\n return optionLabel;\n };\n const ignoreFocus = React.useRef(false);\n const firstFocus = React.useRef(true);\n const inputRef = React.useRef(null);\n const listboxRef = React.useRef(null);\n const [anchorEl, setAnchorEl] = React.useState(null);\n const [focusedTag, setFocusedTag] = React.useState(-1);\n const defaultHighlighted = autoHighlight ? 0 : -1;\n const highlightedIndexRef = React.useRef(defaultHighlighted);\n const [value, setValueState] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: componentName\n });\n const [inputValue, setInputValueState] = useControlled({\n controlled: inputValueProp,\n default: '',\n name: componentName,\n state: 'inputValue'\n });\n const [focused, setFocused] = React.useState(false);\n const resetInputValue = React.useCallback((event, newValue) => {\n // retain current `inputValue` if new option isn't selected and `clearOnBlur` is false\n // When `multiple` is enabled, `newValue` is an array of all selected items including the newly selected item\n const isOptionSelected = multiple ? value.length < newValue.length : newValue !== null;\n if (!isOptionSelected && !clearOnBlur) {\n return;\n }\n let newInputValue;\n if (multiple) {\n newInputValue = '';\n } else if (newValue == null) {\n newInputValue = '';\n } else {\n const optionLabel = getOptionLabel(newValue);\n newInputValue = typeof optionLabel === 'string' ? optionLabel : '';\n }\n if (inputValue === newInputValue) {\n return;\n }\n setInputValueState(newInputValue);\n if (onInputChange) {\n onInputChange(event, newInputValue, 'reset');\n }\n }, [getOptionLabel, inputValue, multiple, onInputChange, setInputValueState, clearOnBlur, value]);\n const [open, setOpenState] = useControlled({\n controlled: openProp,\n default: false,\n name: componentName,\n state: 'open'\n });\n const [inputPristine, setInputPristine] = React.useState(true);\n const inputValueIsSelectedValue = !multiple && value != null && inputValue === getOptionLabel(value);\n const popupOpen = open && !readOnly;\n const filteredOptions = popupOpen ? filterOptions(options.filter(option => {\n if (filterSelectedOptions && (multiple ? value : [value]).some(value2 => value2 !== null && isOptionEqualToValue(option, value2))) {\n return false;\n }\n return true;\n }),\n // we use the empty string to manipulate `filterOptions` to not filter any options\n // i.e. the filter predicate always returns true\n {\n inputValue: inputValueIsSelectedValue && inputPristine ? '' : inputValue,\n getOptionLabel\n }) : [];\n const previousProps = usePreviousProps({\n filteredOptions,\n value,\n inputValue\n });\n React.useEffect(() => {\n const valueChange = value !== previousProps.value;\n if (focused && !valueChange) {\n return;\n }\n\n // Only reset the input's value when freeSolo if the component's value changes.\n if (freeSolo && !valueChange) {\n return;\n }\n resetInputValue(null, value);\n }, [value, resetInputValue, focused, previousProps.value, freeSolo]);\n const listboxAvailable = open && filteredOptions.length > 0 && !readOnly;\n if (process.env.NODE_ENV !== 'production') {\n if (value !== null && !freeSolo && options.length > 0) {\n const missingValue = (multiple ? value : [value]).filter(value2 => !options.some(option => isOptionEqualToValue(option, value2)));\n if (missingValue.length > 0) {\n console.warn([`MUI: The value provided to ${componentName} is invalid.`, `None of the options match with \\`${missingValue.length > 1 ? JSON.stringify(missingValue) : JSON.stringify(missingValue[0])}\\`.`, 'You can use the `isOptionEqualToValue` prop to customize the equality test.'].join('\\n'));\n }\n }\n }\n const focusTag = useEventCallback(tagToFocus => {\n if (tagToFocus === -1) {\n inputRef.current.focus();\n } else {\n anchorEl.querySelector(`[data-tag-index=\"${tagToFocus}\"]`).focus();\n }\n });\n\n // Ensure the focusedTag is never inconsistent\n React.useEffect(() => {\n if (multiple && focusedTag > value.length - 1) {\n setFocusedTag(-1);\n focusTag(-1);\n }\n }, [value, multiple, focusedTag, focusTag]);\n function validOptionIndex(index, direction) {\n if (!listboxRef.current || index < 0 || index >= filteredOptions.length) {\n return -1;\n }\n let nextFocus = index;\n while (true) {\n const option = listboxRef.current.querySelector(`[data-option-index=\"${nextFocus}\"]`);\n\n // Same logic as MenuList.js\n const nextFocusDisabled = disabledItemsFocusable ? false : !option || option.disabled || option.getAttribute('aria-disabled') === 'true';\n if (option && option.hasAttribute('tabindex') && !nextFocusDisabled) {\n // The next option is available\n return nextFocus;\n }\n\n // The next option is disabled, move to the next element.\n // with looped index\n if (direction === 'next') {\n nextFocus = (nextFocus + 1) % filteredOptions.length;\n } else {\n nextFocus = (nextFocus - 1 + filteredOptions.length) % filteredOptions.length;\n }\n\n // We end up with initial index, that means we don't have available options.\n // All of them are disabled\n if (nextFocus === index) {\n return -1;\n }\n }\n }\n const setHighlightedIndex = useEventCallback(({\n event,\n index,\n reason = 'auto'\n }) => {\n highlightedIndexRef.current = index;\n\n // does the index exist?\n if (index === -1) {\n inputRef.current.removeAttribute('aria-activedescendant');\n } else {\n inputRef.current.setAttribute('aria-activedescendant', `${id}-option-${index}`);\n }\n if (onHighlightChange) {\n onHighlightChange(event, index === -1 ? null : filteredOptions[index], reason);\n }\n if (!listboxRef.current) {\n return;\n }\n const prev = listboxRef.current.querySelector(`[role=\"option\"].${unstable_classNamePrefix}-focused`);\n if (prev) {\n prev.classList.remove(`${unstable_classNamePrefix}-focused`);\n prev.classList.remove(`${unstable_classNamePrefix}-focusVisible`);\n }\n let listboxNode = listboxRef.current;\n if (listboxRef.current.getAttribute('role') !== 'listbox') {\n listboxNode = listboxRef.current.parentElement.querySelector('[role=\"listbox\"]');\n }\n\n // \"No results\"\n if (!listboxNode) {\n return;\n }\n if (index === -1) {\n listboxNode.scrollTop = 0;\n return;\n }\n const option = listboxRef.current.querySelector(`[data-option-index=\"${index}\"]`);\n if (!option) {\n return;\n }\n option.classList.add(`${unstable_classNamePrefix}-focused`);\n if (reason === 'keyboard') {\n option.classList.add(`${unstable_classNamePrefix}-focusVisible`);\n }\n\n // Scroll active descendant into view.\n // Logic copied from https://www.w3.org/WAI/content-assets/wai-aria-practices/patterns/combobox/examples/js/select-only.js\n // In case of mouse clicks and touch (in mobile devices) we avoid scrolling the element and keep both behaviors same.\n // Consider this API instead once it has a better browser support:\n // .scrollIntoView({ scrollMode: 'if-needed', block: 'nearest' });\n if (listboxNode.scrollHeight > listboxNode.clientHeight && reason !== 'mouse' && reason !== 'touch') {\n const element = option;\n const scrollBottom = listboxNode.clientHeight + listboxNode.scrollTop;\n const elementBottom = element.offsetTop + element.offsetHeight;\n if (elementBottom > scrollBottom) {\n listboxNode.scrollTop = elementBottom - listboxNode.clientHeight;\n } else if (element.offsetTop - element.offsetHeight * (groupBy ? 1.3 : 0) < listboxNode.scrollTop) {\n listboxNode.scrollTop = element.offsetTop - element.offsetHeight * (groupBy ? 1.3 : 0);\n }\n }\n });\n const changeHighlightedIndex = useEventCallback(({\n event,\n diff,\n direction = 'next',\n reason = 'auto'\n }) => {\n if (!popupOpen) {\n return;\n }\n const getNextIndex = () => {\n const maxIndex = filteredOptions.length - 1;\n if (diff === 'reset') {\n return defaultHighlighted;\n }\n if (diff === 'start') {\n return 0;\n }\n if (diff === 'end') {\n return maxIndex;\n }\n const newIndex = highlightedIndexRef.current + diff;\n if (newIndex < 0) {\n if (newIndex === -1 && includeInputInList) {\n return -1;\n }\n if (disableListWrap && highlightedIndexRef.current !== -1 || Math.abs(diff) > 1) {\n return 0;\n }\n return maxIndex;\n }\n if (newIndex > maxIndex) {\n if (newIndex === maxIndex + 1 && includeInputInList) {\n return -1;\n }\n if (disableListWrap || Math.abs(diff) > 1) {\n return maxIndex;\n }\n return 0;\n }\n return newIndex;\n };\n const nextIndex = validOptionIndex(getNextIndex(), direction);\n setHighlightedIndex({\n index: nextIndex,\n reason,\n event\n });\n\n // Sync the content of the input with the highlighted option.\n if (autoComplete && diff !== 'reset') {\n if (nextIndex === -1) {\n inputRef.current.value = inputValue;\n } else {\n const option = getOptionLabel(filteredOptions[nextIndex]);\n inputRef.current.value = option;\n\n // The portion of the selected suggestion that has not been typed by the user,\n // a completion string, appears inline after the input cursor in the textbox.\n const index = option.toLowerCase().indexOf(inputValue.toLowerCase());\n if (index === 0 && inputValue.length > 0) {\n inputRef.current.setSelectionRange(inputValue.length, option.length);\n }\n }\n }\n });\n const getPreviousHighlightedOptionIndex = () => {\n const isSameValue = (value1, value2) => {\n const label1 = value1 ? getOptionLabel(value1) : '';\n const label2 = value2 ? getOptionLabel(value2) : '';\n return label1 === label2;\n };\n if (highlightedIndexRef.current !== -1 && previousProps.filteredOptions && previousProps.filteredOptions.length !== filteredOptions.length && previousProps.inputValue === inputValue && (multiple ? value.length === previousProps.value.length && previousProps.value.every((val, i) => getOptionLabel(value[i]) === getOptionLabel(val)) : isSameValue(previousProps.value, value))) {\n const previousHighlightedOption = previousProps.filteredOptions[highlightedIndexRef.current];\n if (previousHighlightedOption) {\n return findIndex(filteredOptions, option => {\n return getOptionLabel(option) === getOptionLabel(previousHighlightedOption);\n });\n }\n }\n return -1;\n };\n const syncHighlightedIndex = React.useCallback(() => {\n if (!popupOpen) {\n return;\n }\n\n // Check if the previously highlighted option still exists in the updated filtered options list and if the value and inputValue haven't changed\n // If it exists and the value and the inputValue haven't changed, just update its index, otherwise continue execution\n const previousHighlightedOptionIndex = getPreviousHighlightedOptionIndex();\n if (previousHighlightedOptionIndex !== -1) {\n highlightedIndexRef.current = previousHighlightedOptionIndex;\n return;\n }\n const valueItem = multiple ? value[0] : value;\n\n // The popup is empty, reset\n if (filteredOptions.length === 0 || valueItem == null) {\n changeHighlightedIndex({\n diff: 'reset'\n });\n return;\n }\n if (!listboxRef.current) {\n return;\n }\n\n // Synchronize the value with the highlighted index\n if (valueItem != null) {\n const currentOption = filteredOptions[highlightedIndexRef.current];\n\n // Keep the current highlighted index if possible\n if (multiple && currentOption && findIndex(value, val => isOptionEqualToValue(currentOption, val)) !== -1) {\n return;\n }\n const itemIndex = findIndex(filteredOptions, optionItem => isOptionEqualToValue(optionItem, valueItem));\n if (itemIndex === -1) {\n changeHighlightedIndex({\n diff: 'reset'\n });\n } else {\n setHighlightedIndex({\n index: itemIndex\n });\n }\n return;\n }\n\n // Prevent the highlighted index to leak outside the boundaries.\n if (highlightedIndexRef.current >= filteredOptions.length - 1) {\n setHighlightedIndex({\n index: filteredOptions.length - 1\n });\n return;\n }\n\n // Restore the focus to the previous index.\n setHighlightedIndex({\n index: highlightedIndexRef.current\n });\n // Ignore filteredOptions (and options, isOptionEqualToValue, getOptionLabel) not to break the scroll position\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [\n // Only sync the highlighted index when the option switch between empty and not\n filteredOptions.length,\n // Don't sync the highlighted index with the value when multiple\n // eslint-disable-next-line react-hooks/exhaustive-deps\n multiple ? false : value, filterSelectedOptions, changeHighlightedIndex, setHighlightedIndex, popupOpen, inputValue, multiple]);\n const handleListboxRef = useEventCallback(node => {\n setRef(listboxRef, node);\n if (!node) {\n return;\n }\n syncHighlightedIndex();\n });\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!inputRef.current || inputRef.current.nodeName !== 'INPUT') {\n if (inputRef.current && inputRef.current.nodeName === 'TEXTAREA') {\n console.warn([`A textarea element was provided to ${componentName} where input was expected.`, `This is not a supported scenario but it may work under certain conditions.`, `A textarea keyboard navigation may conflict with Autocomplete controls (for example enter and arrow keys).`, `Make sure to test keyboard navigation and add custom event handlers if necessary.`].join('\\n'));\n } else {\n console.error([`MUI: Unable to find the input element. It was resolved to ${inputRef.current} while an HTMLInputElement was expected.`, `Instead, ${componentName} expects an input element.`, '', componentName === 'useAutocomplete' ? 'Make sure you have bound getInputProps correctly and that the normal ref/effect resolutions order is guaranteed.' : 'Make sure you have customized the input component correctly.'].join('\\n'));\n }\n }\n }, [componentName]);\n }\n React.useEffect(() => {\n syncHighlightedIndex();\n }, [syncHighlightedIndex]);\n const handleOpen = event => {\n if (open) {\n return;\n }\n setOpenState(true);\n setInputPristine(true);\n if (onOpen) {\n onOpen(event);\n }\n };\n const handleClose = (event, reason) => {\n if (!open) {\n return;\n }\n setOpenState(false);\n if (onClose) {\n onClose(event, reason);\n }\n };\n const handleValue = (event, newValue, reason, details) => {\n if (multiple) {\n if (value.length === newValue.length && value.every((val, i) => val === newValue[i])) {\n return;\n }\n } else if (value === newValue) {\n return;\n }\n if (onChange) {\n onChange(event, newValue, reason, details);\n }\n setValueState(newValue);\n };\n const isTouch = React.useRef(false);\n const selectNewValue = (event, option, reasonProp = 'selectOption', origin = 'options') => {\n let reason = reasonProp;\n let newValue = option;\n if (multiple) {\n newValue = Array.isArray(value) ? value.slice() : [];\n if (process.env.NODE_ENV !== 'production') {\n const matches = newValue.filter(val => isOptionEqualToValue(option, val));\n if (matches.length > 1) {\n console.error([`MUI: The \\`isOptionEqualToValue\\` method of ${componentName} does not handle the arguments correctly.`, `The component expects a single value to match a given option but found ${matches.length} matches.`].join('\\n'));\n }\n }\n const itemIndex = findIndex(newValue, valueItem => isOptionEqualToValue(option, valueItem));\n if (itemIndex === -1) {\n newValue.push(option);\n } else if (origin !== 'freeSolo') {\n newValue.splice(itemIndex, 1);\n reason = 'removeOption';\n }\n }\n resetInputValue(event, newValue);\n handleValue(event, newValue, reason, {\n option\n });\n if (!disableCloseOnSelect && (!event || !event.ctrlKey && !event.metaKey)) {\n handleClose(event, reason);\n }\n if (blurOnSelect === true || blurOnSelect === 'touch' && isTouch.current || blurOnSelect === 'mouse' && !isTouch.current) {\n inputRef.current.blur();\n }\n };\n function validTagIndex(index, direction) {\n if (index === -1) {\n return -1;\n }\n let nextFocus = index;\n while (true) {\n // Out of range\n if (direction === 'next' && nextFocus === value.length || direction === 'previous' && nextFocus === -1) {\n return -1;\n }\n const option = anchorEl.querySelector(`[data-tag-index=\"${nextFocus}\"]`);\n\n // Same logic as MenuList.js\n if (!option || !option.hasAttribute('tabindex') || option.disabled || option.getAttribute('aria-disabled') === 'true') {\n nextFocus += direction === 'next' ? 1 : -1;\n } else {\n return nextFocus;\n }\n }\n }\n const handleFocusTag = (event, direction) => {\n if (!multiple) {\n return;\n }\n if (inputValue === '') {\n handleClose(event, 'toggleInput');\n }\n let nextTag = focusedTag;\n if (focusedTag === -1) {\n if (inputValue === '' && direction === 'previous') {\n nextTag = value.length - 1;\n }\n } else {\n nextTag += direction === 'next' ? 1 : -1;\n if (nextTag < 0) {\n nextTag = 0;\n }\n if (nextTag === value.length) {\n nextTag = -1;\n }\n }\n nextTag = validTagIndex(nextTag, direction);\n setFocusedTag(nextTag);\n focusTag(nextTag);\n };\n const handleClear = event => {\n ignoreFocus.current = true;\n setInputValueState('');\n if (onInputChange) {\n onInputChange(event, '', 'clear');\n }\n handleValue(event, multiple ? [] : null, 'clear');\n };\n const handleKeyDown = other => event => {\n if (other.onKeyDown) {\n other.onKeyDown(event);\n }\n if (event.defaultMuiPrevented) {\n return;\n }\n if (focusedTag !== -1 && ['ArrowLeft', 'ArrowRight'].indexOf(event.key) === -1) {\n setFocusedTag(-1);\n focusTag(-1);\n }\n\n // Wait until IME is settled.\n if (event.which !== 229) {\n switch (event.key) {\n case 'Home':\n if (popupOpen && handleHomeEndKeys) {\n // Prevent scroll of the page\n event.preventDefault();\n changeHighlightedIndex({\n diff: 'start',\n direction: 'next',\n reason: 'keyboard',\n event\n });\n }\n break;\n case 'End':\n if (popupOpen && handleHomeEndKeys) {\n // Prevent scroll of the page\n event.preventDefault();\n changeHighlightedIndex({\n diff: 'end',\n direction: 'previous',\n reason: 'keyboard',\n event\n });\n }\n break;\n case 'PageUp':\n // Prevent scroll of the page\n event.preventDefault();\n changeHighlightedIndex({\n diff: -pageSize,\n direction: 'previous',\n reason: 'keyboard',\n event\n });\n handleOpen(event);\n break;\n case 'PageDown':\n // Prevent scroll of the page\n event.preventDefault();\n changeHighlightedIndex({\n diff: pageSize,\n direction: 'next',\n reason: 'keyboard',\n event\n });\n handleOpen(event);\n break;\n case 'ArrowDown':\n // Prevent cursor move\n event.preventDefault();\n changeHighlightedIndex({\n diff: 1,\n direction: 'next',\n reason: 'keyboard',\n event\n });\n handleOpen(event);\n break;\n case 'ArrowUp':\n // Prevent cursor move\n event.preventDefault();\n changeHighlightedIndex({\n diff: -1,\n direction: 'previous',\n reason: 'keyboard',\n event\n });\n handleOpen(event);\n break;\n case 'ArrowLeft':\n handleFocusTag(event, 'previous');\n break;\n case 'ArrowRight':\n handleFocusTag(event, 'next');\n break;\n case 'Enter':\n if (highlightedIndexRef.current !== -1 && popupOpen) {\n const option = filteredOptions[highlightedIndexRef.current];\n const disabled = getOptionDisabled ? getOptionDisabled(option) : false;\n\n // Avoid early form validation, let the end-users continue filling the form.\n event.preventDefault();\n if (disabled) {\n return;\n }\n selectNewValue(event, option, 'selectOption');\n\n // Move the selection to the end.\n if (autoComplete) {\n inputRef.current.setSelectionRange(inputRef.current.value.length, inputRef.current.value.length);\n }\n } else if (freeSolo && inputValue !== '' && inputValueIsSelectedValue === false) {\n if (multiple) {\n // Allow people to add new values before they submit the form.\n event.preventDefault();\n }\n selectNewValue(event, inputValue, 'createOption', 'freeSolo');\n }\n break;\n case 'Escape':\n if (popupOpen) {\n // Avoid Opera to exit fullscreen mode.\n event.preventDefault();\n // Avoid the Modal to handle the event.\n event.stopPropagation();\n handleClose(event, 'escape');\n } else if (clearOnEscape && (inputValue !== '' || multiple && value.length > 0)) {\n // Avoid Opera to exit fullscreen mode.\n event.preventDefault();\n // Avoid the Modal to handle the event.\n event.stopPropagation();\n handleClear(event);\n }\n break;\n case 'Backspace':\n // Remove the value on the left of the \"cursor\"\n if (multiple && !readOnly && inputValue === '' && value.length > 0) {\n const index = focusedTag === -1 ? value.length - 1 : focusedTag;\n const newValue = value.slice();\n newValue.splice(index, 1);\n handleValue(event, newValue, 'removeOption', {\n option: value[index]\n });\n }\n break;\n case 'Delete':\n // Remove the value on the right of the \"cursor\"\n if (multiple && !readOnly && inputValue === '' && value.length > 0 && focusedTag !== -1) {\n const index = focusedTag;\n const newValue = value.slice();\n newValue.splice(index, 1);\n handleValue(event, newValue, 'removeOption', {\n option: value[index]\n });\n }\n break;\n default:\n }\n }\n };\n const handleFocus = event => {\n setFocused(true);\n if (openOnFocus && !ignoreFocus.current) {\n handleOpen(event);\n }\n };\n const handleBlur = event => {\n // Ignore the event when using the scrollbar with IE11\n if (unstable_isActiveElementInListbox(listboxRef)) {\n inputRef.current.focus();\n return;\n }\n setFocused(false);\n firstFocus.current = true;\n ignoreFocus.current = false;\n if (autoSelect && highlightedIndexRef.current !== -1 && popupOpen) {\n selectNewValue(event, filteredOptions[highlightedIndexRef.current], 'blur');\n } else if (autoSelect && freeSolo && inputValue !== '') {\n selectNewValue(event, inputValue, 'blur', 'freeSolo');\n } else if (clearOnBlur) {\n resetInputValue(event, value);\n }\n handleClose(event, 'blur');\n };\n const handleInputChange = event => {\n const newValue = event.target.value;\n if (inputValue !== newValue) {\n setInputValueState(newValue);\n setInputPristine(false);\n if (onInputChange) {\n onInputChange(event, newValue, 'input');\n }\n }\n if (newValue === '') {\n if (!disableClearable && !multiple) {\n handleValue(event, null, 'clear');\n }\n } else {\n handleOpen(event);\n }\n };\n const handleOptionMouseMove = event => {\n const index = Number(event.currentTarget.getAttribute('data-option-index'));\n if (highlightedIndexRef.current !== index) {\n setHighlightedIndex({\n event,\n index,\n reason: 'mouse'\n });\n }\n };\n const handleOptionTouchStart = event => {\n setHighlightedIndex({\n event,\n index: Number(event.currentTarget.getAttribute('data-option-index')),\n reason: 'touch'\n });\n isTouch.current = true;\n };\n const handleOptionClick = event => {\n const index = Number(event.currentTarget.getAttribute('data-option-index'));\n selectNewValue(event, filteredOptions[index], 'selectOption');\n isTouch.current = false;\n };\n const handleTagDelete = index => event => {\n const newValue = value.slice();\n newValue.splice(index, 1);\n handleValue(event, newValue, 'removeOption', {\n option: value[index]\n });\n };\n const handlePopupIndicator = event => {\n if (open) {\n handleClose(event, 'toggleInput');\n } else {\n handleOpen(event);\n }\n };\n\n // Prevent input blur when interacting with the combobox\n const handleMouseDown = event => {\n // Prevent focusing the input if click is anywhere outside the Autocomplete\n if (!event.currentTarget.contains(event.target)) {\n return;\n }\n if (event.target.getAttribute('id') !== id) {\n event.preventDefault();\n }\n };\n\n // Focus the input when interacting with the combobox\n const handleClick = event => {\n // Prevent focusing the input if click is anywhere outside the Autocomplete\n if (!event.currentTarget.contains(event.target)) {\n return;\n }\n inputRef.current.focus();\n if (selectOnFocus && firstFocus.current && inputRef.current.selectionEnd - inputRef.current.selectionStart === 0) {\n inputRef.current.select();\n }\n firstFocus.current = false;\n };\n const handleInputMouseDown = event => {\n if (!disabledProp && (inputValue === '' || !open)) {\n handlePopupIndicator(event);\n }\n };\n let dirty = freeSolo && inputValue.length > 0;\n dirty = dirty || (multiple ? value.length > 0 : value !== null);\n let groupedOptions = filteredOptions;\n if (groupBy) {\n // used to keep track of key and indexes in the result array\n const indexBy = new Map();\n let warn = false;\n groupedOptions = filteredOptions.reduce((acc, option, index) => {\n const group = groupBy(option);\n if (acc.length > 0 && acc[acc.length - 1].group === group) {\n acc[acc.length - 1].options.push(option);\n } else {\n if (process.env.NODE_ENV !== 'production') {\n if (indexBy.get(group) && !warn) {\n console.warn(`MUI: The options provided combined with the \\`groupBy\\` method of ${componentName} returns duplicated headers.`, 'You can solve the issue by sorting the options with the output of `groupBy`.');\n warn = true;\n }\n indexBy.set(group, true);\n }\n acc.push({\n key: index,\n index,\n group,\n options: [option]\n });\n }\n return acc;\n }, []);\n }\n if (disabledProp && focused) {\n handleBlur();\n }\n return {\n getRootProps: (other = {}) => _extends({\n 'aria-owns': listboxAvailable ? `${id}-listbox` : null\n }, other, {\n onKeyDown: handleKeyDown(other),\n onMouseDown: handleMouseDown,\n onClick: handleClick\n }),\n getInputLabelProps: () => ({\n id: `${id}-label`,\n htmlFor: id\n }),\n getInputProps: () => ({\n id,\n value: inputValue,\n onBlur: handleBlur,\n onFocus: handleFocus,\n onChange: handleInputChange,\n onMouseDown: handleInputMouseDown,\n // if open then this is handled imperatively so don't let react override\n // only have an opinion about this when closed\n 'aria-activedescendant': popupOpen ? '' : null,\n 'aria-autocomplete': autoComplete ? 'both' : 'list',\n 'aria-controls': listboxAvailable ? `${id}-listbox` : undefined,\n 'aria-expanded': listboxAvailable,\n // Disable browser's suggestion that might overlap with the popup.\n // Handle autocomplete but not autofill.\n autoComplete: 'off',\n ref: inputRef,\n autoCapitalize: 'none',\n spellCheck: 'false',\n role: 'combobox',\n disabled: disabledProp\n }),\n getClearProps: () => ({\n tabIndex: -1,\n type: 'button',\n onClick: handleClear\n }),\n getPopupIndicatorProps: () => ({\n tabIndex: -1,\n type: 'button',\n onClick: handlePopupIndicator\n }),\n getTagProps: ({\n index\n }) => _extends({\n key: index,\n 'data-tag-index': index,\n tabIndex: -1\n }, !readOnly && {\n onDelete: handleTagDelete(index)\n }),\n getListboxProps: () => ({\n role: 'listbox',\n id: `${id}-listbox`,\n 'aria-labelledby': `${id}-label`,\n ref: handleListboxRef,\n onMouseDown: event => {\n // Prevent blur\n event.preventDefault();\n }\n }),\n getOptionProps: ({\n index,\n option\n }) => {\n var _getOptionKey;\n const selected = (multiple ? value : [value]).some(value2 => value2 != null && isOptionEqualToValue(option, value2));\n const disabled = getOptionDisabled ? getOptionDisabled(option) : false;\n return {\n key: (_getOptionKey = getOptionKey == null ? void 0 : getOptionKey(option)) != null ? _getOptionKey : getOptionLabel(option),\n tabIndex: -1,\n role: 'option',\n id: `${id}-option-${index}`,\n onMouseMove: handleOptionMouseMove,\n onClick: handleOptionClick,\n onTouchStart: handleOptionTouchStart,\n 'data-option-index': index,\n 'aria-disabled': disabled,\n 'aria-selected': selected\n };\n },\n id,\n inputValue,\n value,\n dirty,\n expanded: popupOpen && anchorEl,\n popupOpen,\n focused: focused || focusedTag !== -1,\n anchorEl,\n setAnchorEl,\n focusedTag,\n groupedOptions\n };\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { isHostComponent } from './isHostComponent';\n\n/**\n * Type of the ownerState based on the type of an element it applies to.\n * This resolves to the provided OwnerState for React components and `undefined` for host components.\n * Falls back to `OwnerState | undefined` when the exact type can't be determined in development time.\n */\n\n/**\n * Appends the ownerState object to the props, merging with the existing one if necessary.\n *\n * @param elementType Type of the element that owns the `existingProps`. If the element is a DOM node or undefined, `ownerState` is not applied.\n * @param otherProps Props of the element.\n * @param ownerState\n */\nexport function appendOwnerState(elementType, otherProps, ownerState) {\n if (elementType === undefined || isHostComponent(elementType)) {\n return otherProps;\n }\n return _extends({}, otherProps, {\n ownerState: _extends({}, otherProps.ownerState, ownerState)\n });\n}","/**\n * Extracts event handlers from a given object.\n * A prop is considered an event handler if it is a function and its name starts with `on`.\n *\n * @param object An object to extract event handlers from.\n * @param excludeKeys An array of keys to exclude from the returned object.\n */\nexport function extractEventHandlers(object, excludeKeys = []) {\n if (object === undefined) {\n return {};\n }\n const result = {};\n Object.keys(object).filter(prop => prop.match(/^on[A-Z]/) && typeof object[prop] === 'function' && !excludeKeys.includes(prop)).forEach(prop => {\n result[prop] = object[prop];\n });\n return result;\n}","/**\n * Determines if a given element is a DOM element name (i.e. not a React component).\n */\nexport function isHostComponent(element) {\n return typeof element === 'string';\n}","/**\n * Removes event handlers from the given object.\n * A field is considered an event handler if it is a function with a name beginning with `on`.\n *\n * @param object Object to remove event handlers from.\n * @returns Object with event handlers removed.\n */\nexport function omitEventHandlers(object) {\n if (object === undefined) {\n return {};\n }\n const result = {};\n Object.keys(object).filter(prop => !(prop.match(/^on[A-Z]/) && typeof object[prop] === 'function')).forEach(prop => {\n result[prop] = object[prop];\n });\n return result;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport clsx from 'clsx';\nimport { extractEventHandlers } from './extractEventHandlers';\nimport { omitEventHandlers } from './omitEventHandlers';\n/**\n * Merges the slot component internal props (usually coming from a hook)\n * with the externally provided ones.\n *\n * The merge order is (the latter overrides the former):\n * 1. The internal props (specified as a getter function to work with get*Props hook result)\n * 2. Additional props (specified internally on a Base UI component)\n * 3. External props specified on the owner component. These should only be used on a root slot.\n * 4. External props specified in the `slotProps.*` prop.\n * 5. The `className` prop - combined from all the above.\n * @param parameters\n * @returns\n */\nexport function mergeSlotProps(parameters) {\n const {\n getSlotProps,\n additionalProps,\n externalSlotProps,\n externalForwardedProps,\n className\n } = parameters;\n if (!getSlotProps) {\n // The simpler case - getSlotProps is not defined, so no internal event handlers are defined,\n // so we can simply merge all the props without having to worry about extracting event handlers.\n const joinedClasses = clsx(additionalProps == null ? void 0 : additionalProps.className, className, externalForwardedProps == null ? void 0 : externalForwardedProps.className, externalSlotProps == null ? void 0 : externalSlotProps.className);\n const mergedStyle = _extends({}, additionalProps == null ? void 0 : additionalProps.style, externalForwardedProps == null ? void 0 : externalForwardedProps.style, externalSlotProps == null ? void 0 : externalSlotProps.style);\n const props = _extends({}, additionalProps, externalForwardedProps, externalSlotProps);\n if (joinedClasses.length > 0) {\n props.className = joinedClasses;\n }\n if (Object.keys(mergedStyle).length > 0) {\n props.style = mergedStyle;\n }\n return {\n props,\n internalRef: undefined\n };\n }\n\n // In this case, getSlotProps is responsible for calling the external event handlers.\n // We don't need to include them in the merged props because of this.\n\n const eventHandlers = extractEventHandlers(_extends({}, externalForwardedProps, externalSlotProps));\n const componentsPropsWithoutEventHandlers = omitEventHandlers(externalSlotProps);\n const otherPropsWithoutEventHandlers = omitEventHandlers(externalForwardedProps);\n const internalSlotProps = getSlotProps(eventHandlers);\n\n // The order of classes is important here.\n // Emotion (that we use in libraries consuming Base UI) depends on this order\n // to properly override style. It requires the most important classes to be last\n // (see https://github.com/mui/material-ui/pull/33205) for the related discussion.\n const joinedClasses = clsx(internalSlotProps == null ? void 0 : internalSlotProps.className, additionalProps == null ? void 0 : additionalProps.className, className, externalForwardedProps == null ? void 0 : externalForwardedProps.className, externalSlotProps == null ? void 0 : externalSlotProps.className);\n const mergedStyle = _extends({}, internalSlotProps == null ? void 0 : internalSlotProps.style, additionalProps == null ? void 0 : additionalProps.style, externalForwardedProps == null ? void 0 : externalForwardedProps.style, externalSlotProps == null ? void 0 : externalSlotProps.style);\n const props = _extends({}, internalSlotProps, additionalProps, otherPropsWithoutEventHandlers, componentsPropsWithoutEventHandlers);\n if (joinedClasses.length > 0) {\n props.className = joinedClasses;\n }\n if (Object.keys(mergedStyle).length > 0) {\n props.style = mergedStyle;\n }\n return {\n props,\n internalRef: internalSlotProps.ref\n };\n}","/**\n * If `componentProps` is a function, calls it with the provided `ownerState`.\n * Otherwise, just returns `componentProps`.\n */\nexport function resolveComponentProps(componentProps, ownerState, slotState) {\n if (typeof componentProps === 'function') {\n return componentProps(ownerState, slotState);\n }\n return componentProps;\n}","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"elementType\", \"externalSlotProps\", \"ownerState\", \"skipResolvingSlotProps\"];\nimport { unstable_useForkRef as useForkRef } from '@mui/utils';\nimport { appendOwnerState } from './appendOwnerState';\nimport { mergeSlotProps } from './mergeSlotProps';\nimport { resolveComponentProps } from './resolveComponentProps';\n/**\n * @ignore - do not document.\n * Builds the props to be passed into the slot of an unstyled component.\n * It merges the internal props of the component with the ones supplied by the user, allowing to customize the behavior.\n * If the slot component is not a host component, it also merges in the `ownerState`.\n *\n * @param parameters.getSlotProps - A function that returns the props to be passed to the slot component.\n */\nexport function useSlotProps(parameters) {\n var _parameters$additiona;\n const {\n elementType,\n externalSlotProps,\n ownerState,\n skipResolvingSlotProps = false\n } = parameters,\n rest = _objectWithoutPropertiesLoose(parameters, _excluded);\n const resolvedComponentsProps = skipResolvingSlotProps ? {} : resolveComponentProps(externalSlotProps, ownerState);\n const {\n props: mergedProps,\n internalRef\n } = mergeSlotProps(_extends({}, rest, {\n externalSlotProps: resolvedComponentsProps\n }));\n const ref = useForkRef(internalRef, resolvedComponentsProps == null ? void 0 : resolvedComponentsProps.ref, (_parameters$additiona = parameters.additionalProps) == null ? void 0 : _parameters$additiona.ref);\n const props = appendOwnerState(elementType, _extends({}, mergedProps, {\n ref\n }), ownerState);\n return props;\n}","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4zm-1-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8\"\n}), 'AddCircleOutline');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2M9 17H7v-7h2zm4 0h-2V7h2zm4 0h-2v-4h2z\"\n}), 'Assessment');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M14.06 9.94 12 9l2.06-.94L15 6l.94 2.06L18 9l-2.06.94L15 12zM4 14l.94-2.06L7 11l-2.06-.94L4 8l-.94 2.06L1 11l2.06.94zm4.5-5 1.09-2.41L12 5.5 9.59 4.41 8.5 2 7.41 4.41 5 5.5l2.41 1.09zm-4 11.5 6-6.01 4 4L23 8.93l-1.41-1.41-7.09 7.97-4-4L3 19z\"\n}), 'AutoGraphOutlined');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"\n}), 'Check');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"\n}), 'Clear');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"\n}), 'Close');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2m0 16H8V7h11z\"\n}), 'ContentCopy');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M19 2h-4.18C14.4.84 13.3 0 12 0c-1.3 0-2.4.84-2.82 2H5c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2m-7 0c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1m7 18H5V4h2v3h10V4h2z\"\n}), 'ContentPaste');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M12 7V3H2v18h20V7zm-2 12H4v-2h6zm0-4H4v-2h6zm0-4H4V9h6zm0-4H4V5h6zm10 12h-8V9h8zm-2-8h-4v2h4zm0 4h-4v2h4z\"\n}), 'CorporateFareOutlined');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M14.12 10.47 12 12.59l-2.13-2.12-1.41 1.41L10.59 14l-2.12 2.12 1.41 1.41L12 15.41l2.12 2.12 1.41-1.41L13.41 14l2.12-2.12zM15.5 4l-1-1h-5l-1 1H5v2h14V4zM6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM8 9h8v10H8z\"\n}), 'DeleteForeverOutlined');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M5 20h14v-2H5zM19 9h-4V3H9v6H5l7 7z\"\n}), 'Download');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M3 10h11v2H3zm0-2h11V6H3zm0 8h7v-2H3zm15.01-3.13.71-.71c.39-.39 1.02-.39 1.41 0l.71.71c.39.39.39 1.02 0 1.41l-.71.71zm-.71.71-5.3 5.3V21h2.12l5.3-5.3z\"\n}), 'EditNote');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(\"g\", {\n fillRule: \"evenodd\",\n children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M20 3H4c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2m0 16H4V5h16z\"\n }), /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M19.41 10.42 17.99 9l-3.17 3.17-1.41-1.42L12 12.16 14.82 15zM5 7h5v2H5zm0 4h5v2H5zm0 4h5v2H5z\"\n })]\n}), 'FactCheckOutlined');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M18 15v3H6v-3H4v3c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-3zm-1-4-1.41-1.41L13 12.17V4h-2v8.17L8.41 9.59 7 11l5 5z\"\n}), 'FileDownloadOutlined');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h9v-2H4V8l8 5 8-5v5h2V6c0-1.1-.9-2-2-2m-8 7L4 6h16zm7 4 4 4-4 4v-3h-4v-2h4z\"\n}), 'ForwardToInboxOutlined');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M12 12.75c1.63 0 3.07.39 4.24.9 1.08.48 1.76 1.56 1.76 2.73V18H6v-1.61c0-1.18.68-2.26 1.76-2.73 1.17-.52 2.61-.91 4.24-.91M4 13c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2m1.13 1.1c-.37-.06-.74-.1-1.13-.1-.99 0-1.93.21-2.78.58C.48 14.9 0 15.62 0 16.43V18h4.5v-1.61c0-.83.23-1.61.63-2.29M20 13c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2m4 3.43c0-.81-.48-1.53-1.22-1.85-.85-.37-1.79-.58-2.78-.58-.39 0-.76.04-1.13.1.4.68.63 1.46.63 2.29V18H24zM12 6c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3\"\n}), 'Groups');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M9 17H7v-7h2zm4 0h-2V7h2zm4 0h-2v-4h2zm2.5 2.1h-15V5h15zm0-16.1h-15c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h15c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2\"\n}), 'InsertChartOutlined');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M9.5 6.5v3h-3v-3zM11 5H5v6h6zm-1.5 9.5v3h-3v-3zM11 13H5v6h6zm6.5-6.5v3h-3v-3zM19 5h-6v6h6zm-6 8h1.5v1.5H13zm1.5 1.5H16V16h-1.5zM16 13h1.5v1.5H16zm-3 3h1.5v1.5H13zm1.5 1.5H16V19h-1.5zM16 16h1.5v1.5H16zm1.5-1.5H19V16h-1.5zm0 3H19V19h-1.5zM22 7h-2V4h-3V2h5zm0 15v-5h-2v3h-3v2zM2 22h5v-2H4v-3H2zM2 2v5h2V4h3V2z\"\n}), 'QrCodeScanner');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)([/*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M4 6H2v14c0 1.1.9 2 2 2h14v-2H4z\"\n}, \"0\"), /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M20 2H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2m-5.99 13c-.59 0-1.05-.47-1.05-1.05 0-.59.47-1.04 1.05-1.04.59 0 1.04.45 1.04 1.04-.01.58-.45 1.05-1.04 1.05m2.5-6.17c-.63.93-1.23 1.21-1.56 1.81-.13.24-.18.4-.18 1.18h-1.52c0-.41-.06-1.08.26-1.65.41-.73 1.18-1.16 1.63-1.8.48-.68.21-1.94-1.14-1.94-.88 0-1.32.67-1.5 1.23l-1.37-.57C11.51 5.96 12.52 5 13.99 5c1.23 0 2.08.56 2.51 1.26.37.61.58 1.73.01 2.57\"\n}, \"1\")], 'Quiz');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M19 12v7H5v-7H3v7c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-7zm-6 .67 2.59-2.58L17 11.5l-5 5-5-5 1.41-1.41L11 12.67V3h2z\"\n}), 'SaveAlt');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14\"\n}), 'Search');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8zm4 18H6V4h7v5h5zM8 15.01l1.41 1.41L11 14.84V19h2v-4.16l1.59 1.59L16 15.01 12.01 11z\"\n}), 'UploadFile');","\"use client\";\n\nimport createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M20 2h2v20h-2zM2 10h16V7H2zm6 7h10v-3H8z\"\n}), 'AlignHorizontalRight');","\"use client\";\n\nimport createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon([/*#__PURE__*/_jsx(\"path\", {\n d: \"M7 19c-1.1 0-2 .9-2 2h14c0-1.1-.9-2-2-2h-4v-2h3c1.1 0 2-.9 2-2h-8c-1.66 0-3-1.34-3-3 0-1.09.59-2.04 1.46-2.56C8.17 9.03 8 8.54 8 8c0-.21.04-.42.09-.62C6.28 8.13 5 9.92 5 12c0 2.76 2.24 5 5 5v2z\"\n}, \"0\"), /*#__PURE__*/_jsx(\"path\", {\n d: \"M10.56 5.51C11.91 5.54 13 6.64 13 8c0 .75-.33 1.41-.85 1.87l.59 1.62.94-.34.34.94 1.88-.68-.34-.94.94-.34-2.74-7.53-.94.34-.34-.94-1.88.68.34.94-.94.35z\"\n}, \"1\"), /*#__PURE__*/_jsx(\"circle\", {\n cx: \"10.5\",\n cy: \"8\",\n r: \"1.5\"\n}, \"2\")], 'Biotech');","\"use client\";\n\nimport createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M4 6H2v14c0 1.1.9 2 2 2h14v-2H4zm16-4H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2m0 14H8V4h12zm-6.49-5.84c.41-.73 1.18-1.16 1.63-1.8.48-.68.21-1.94-1.14-1.94-.88 0-1.32.67-1.5 1.23l-1.37-.57C11.51 5.96 12.52 5 13.99 5c1.23 0 2.08.56 2.51 1.26.37.6.58 1.73.01 2.57-.63.93-1.23 1.21-1.56 1.81-.13.24-.18.4-.18 1.18h-1.52c.01-.41-.06-1.08.26-1.66m-.56 3.79c0-.59.47-1.04 1.05-1.04.59 0 1.04.45 1.04 1.04 0 .58-.44 1.05-1.04 1.05-.58 0-1.05-.47-1.05-1.05\"\n}), 'QuizOutlined');","\"use client\";\n\nimport createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5M12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5m0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3\"\n}), 'Visibility');","\"use client\";\n\nimport createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7M2 4.27l2.28 2.28.46.46C3.08 8.3 1.78 10.02 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3zM7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2m4.31-.78 3.15 3.15.02-.16c0-1.66-1.34-3-3-3z\"\n}), 'VisibilityOff');","\"use strict\";\n'use client';\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nObject.defineProperty(exports, \"default\", {\n enumerable: true,\n get: function () {\n return _utils.createSvgIcon;\n }\n});\nvar _utils = require(\"@mui/material/utils\");","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getListSubheaderUtilityClass(slot) {\n return generateUtilityClass('MuiListSubheader', slot);\n}\nconst listSubheaderClasses = generateUtilityClasses('MuiListSubheader', ['root', 'colorPrimary', 'colorInherit', 'gutters', 'inset', 'sticky']);\nexport default listSubheaderClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"className\", \"color\", \"component\", \"disableGutters\", \"disableSticky\", \"inset\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport composeClasses from '@mui/utils/composeClasses';\nimport styled from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport capitalize from '../utils/capitalize';\nimport { getListSubheaderUtilityClass } from './listSubheaderClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n color,\n disableGutters,\n inset,\n disableSticky\n } = ownerState;\n const slots = {\n root: ['root', color !== 'default' && `color${capitalize(color)}`, !disableGutters && 'gutters', inset && 'inset', !disableSticky && 'sticky']\n };\n return composeClasses(slots, getListSubheaderUtilityClass, classes);\n};\nconst ListSubheaderRoot = styled('li', {\n name: 'MuiListSubheader',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, ownerState.color !== 'default' && styles[`color${capitalize(ownerState.color)}`], !ownerState.disableGutters && styles.gutters, ownerState.inset && styles.inset, !ownerState.disableSticky && styles.sticky];\n }\n})(({\n theme,\n ownerState\n}) => _extends({\n boxSizing: 'border-box',\n lineHeight: '48px',\n listStyle: 'none',\n color: (theme.vars || theme).palette.text.secondary,\n fontFamily: theme.typography.fontFamily,\n fontWeight: theme.typography.fontWeightMedium,\n fontSize: theme.typography.pxToRem(14)\n}, ownerState.color === 'primary' && {\n color: (theme.vars || theme).palette.primary.main\n}, ownerState.color === 'inherit' && {\n color: 'inherit'\n}, !ownerState.disableGutters && {\n paddingLeft: 16,\n paddingRight: 16\n}, ownerState.inset && {\n paddingLeft: 72\n}, !ownerState.disableSticky && {\n position: 'sticky',\n top: 0,\n zIndex: 1,\n backgroundColor: (theme.vars || theme).palette.background.paper\n}));\nconst ListSubheader = /*#__PURE__*/React.forwardRef(function ListSubheader(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiListSubheader'\n });\n const {\n className,\n color = 'default',\n component = 'li',\n disableGutters = false,\n disableSticky = false,\n inset = false\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n color,\n component,\n disableGutters,\n disableSticky,\n inset\n });\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(ListSubheaderRoot, _extends({\n as: component,\n className: clsx(classes.root, className),\n ref: ref,\n ownerState: ownerState\n }, other));\n});\nListSubheader.muiSkipListHighlight = true;\nprocess.env.NODE_ENV !== \"production\" ? ListSubheader.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * The color of the component. It supports those theme colors that make sense for this component.\n * @default 'default'\n */\n color: PropTypes.oneOf(['default', 'inherit', 'primary']),\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes.elementType,\n /**\n * If `true`, the List Subheader will not have gutters.\n * @default false\n */\n disableGutters: PropTypes.bool,\n /**\n * If `true`, the List Subheader will not stick to the top during scroll.\n * @default false\n */\n disableSticky: PropTypes.bool,\n /**\n * If `true`, the List Subheader is indented.\n * @default false\n */\n inset: PropTypes.bool,\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])\n} : void 0;\nexport default ListSubheader;","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getAutocompleteUtilityClass(slot) {\n return generateUtilityClass('MuiAutocomplete', slot);\n}\nconst autocompleteClasses = generateUtilityClasses('MuiAutocomplete', ['root', 'expanded', 'fullWidth', 'focused', 'focusVisible', 'tag', 'tagSizeSmall', 'tagSizeMedium', 'hasPopupIcon', 'hasClearIcon', 'inputRoot', 'input', 'inputFocused', 'endAdornment', 'clearIndicator', 'popupIndicator', 'popupIndicatorOpen', 'popper', 'popperDisablePortal', 'paper', 'listbox', 'loading', 'noOptions', 'option', 'groupLabel', 'groupUl']);\nexport default autocompleteClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nvar _ClearIcon, _ArrowDropDownIcon;\nconst _excluded = [\"autoComplete\", \"autoHighlight\", \"autoSelect\", \"blurOnSelect\", \"ChipProps\", \"className\", \"clearIcon\", \"clearOnBlur\", \"clearOnEscape\", \"clearText\", \"closeText\", \"componentsProps\", \"defaultValue\", \"disableClearable\", \"disableCloseOnSelect\", \"disabled\", \"disabledItemsFocusable\", \"disableListWrap\", \"disablePortal\", \"filterOptions\", \"filterSelectedOptions\", \"forcePopupIcon\", \"freeSolo\", \"fullWidth\", \"getLimitTagsText\", \"getOptionDisabled\", \"getOptionKey\", \"getOptionLabel\", \"isOptionEqualToValue\", \"groupBy\", \"handleHomeEndKeys\", \"id\", \"includeInputInList\", \"inputValue\", \"limitTags\", \"ListboxComponent\", \"ListboxProps\", \"loading\", \"loadingText\", \"multiple\", \"noOptionsText\", \"onChange\", \"onClose\", \"onHighlightChange\", \"onInputChange\", \"onOpen\", \"open\", \"openOnFocus\", \"openText\", \"options\", \"PaperComponent\", \"PopperComponent\", \"popupIcon\", \"readOnly\", \"renderGroup\", \"renderInput\", \"renderOption\", \"renderTags\", \"selectOnFocus\", \"size\", \"slotProps\", \"value\"],\n _excluded2 = [\"ref\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport integerPropType from '@mui/utils/integerPropType';\nimport chainPropTypes from '@mui/utils/chainPropTypes';\nimport { useAutocomplete, createFilterOptions } from '@mui/base';\nimport composeClasses from '@mui/utils/composeClasses';\nimport { alpha } from '@mui/system/colorManipulator';\nimport Popper from '../Popper';\nimport ListSubheader from '../ListSubheader';\nimport Paper from '../Paper';\nimport IconButton from '../IconButton';\nimport Chip from '../Chip';\nimport inputClasses from '../Input/inputClasses';\nimport inputBaseClasses from '../InputBase/inputBaseClasses';\nimport outlinedInputClasses from '../OutlinedInput/outlinedInputClasses';\nimport filledInputClasses from '../FilledInput/filledInputClasses';\nimport ClearIcon from '../internal/svg-icons/Close';\nimport ArrowDropDownIcon from '../internal/svg-icons/ArrowDropDown';\nimport { styled, createUseThemeProps } from '../zero-styled';\nimport autocompleteClasses, { getAutocompleteUtilityClass } from './autocompleteClasses';\nimport capitalize from '../utils/capitalize';\nimport useForkRef from '../utils/useForkRef';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { createElement as _createElement } from \"react\";\nconst useThemeProps = createUseThemeProps('MuiAutocomplete');\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n disablePortal,\n expanded,\n focused,\n fullWidth,\n hasClearIcon,\n hasPopupIcon,\n inputFocused,\n popupOpen,\n size\n } = ownerState;\n const slots = {\n root: ['root', expanded && 'expanded', focused && 'focused', fullWidth && 'fullWidth', hasClearIcon && 'hasClearIcon', hasPopupIcon && 'hasPopupIcon'],\n inputRoot: ['inputRoot'],\n input: ['input', inputFocused && 'inputFocused'],\n tag: ['tag', `tagSize${capitalize(size)}`],\n endAdornment: ['endAdornment'],\n clearIndicator: ['clearIndicator'],\n popupIndicator: ['popupIndicator', popupOpen && 'popupIndicatorOpen'],\n popper: ['popper', disablePortal && 'popperDisablePortal'],\n paper: ['paper'],\n listbox: ['listbox'],\n loading: ['loading'],\n noOptions: ['noOptions'],\n option: ['option'],\n groupLabel: ['groupLabel'],\n groupUl: ['groupUl']\n };\n return composeClasses(slots, getAutocompleteUtilityClass, classes);\n};\nconst AutocompleteRoot = styled('div', {\n name: 'MuiAutocomplete',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n const {\n fullWidth,\n hasClearIcon,\n hasPopupIcon,\n inputFocused,\n size\n } = ownerState;\n return [{\n [`& .${autocompleteClasses.tag}`]: styles.tag\n }, {\n [`& .${autocompleteClasses.tag}`]: styles[`tagSize${capitalize(size)}`]\n }, {\n [`& .${autocompleteClasses.inputRoot}`]: styles.inputRoot\n }, {\n [`& .${autocompleteClasses.input}`]: styles.input\n }, {\n [`& .${autocompleteClasses.input}`]: inputFocused && styles.inputFocused\n }, styles.root, fullWidth && styles.fullWidth, hasPopupIcon && styles.hasPopupIcon, hasClearIcon && styles.hasClearIcon];\n }\n})({\n [`&.${autocompleteClasses.focused} .${autocompleteClasses.clearIndicator}`]: {\n visibility: 'visible'\n },\n /* Avoid double tap issue on iOS */\n '@media (pointer: fine)': {\n [`&:hover .${autocompleteClasses.clearIndicator}`]: {\n visibility: 'visible'\n }\n },\n [`& .${autocompleteClasses.tag}`]: {\n margin: 3,\n maxWidth: 'calc(100% - 6px)'\n },\n [`& .${autocompleteClasses.inputRoot}`]: {\n flexWrap: 'wrap',\n [`.${autocompleteClasses.hasPopupIcon}&, .${autocompleteClasses.hasClearIcon}&`]: {\n paddingRight: 26 + 4\n },\n [`.${autocompleteClasses.hasPopupIcon}.${autocompleteClasses.hasClearIcon}&`]: {\n paddingRight: 52 + 4\n },\n [`& .${autocompleteClasses.input}`]: {\n width: 0,\n minWidth: 30\n }\n },\n [`& .${inputClasses.root}`]: {\n paddingBottom: 1,\n '& .MuiInput-input': {\n padding: '4px 4px 4px 0px'\n }\n },\n [`& .${inputClasses.root}.${inputBaseClasses.sizeSmall}`]: {\n [`& .${inputClasses.input}`]: {\n padding: '2px 4px 3px 0'\n }\n },\n [`& .${outlinedInputClasses.root}`]: {\n padding: 9,\n [`.${autocompleteClasses.hasPopupIcon}&, .${autocompleteClasses.hasClearIcon}&`]: {\n paddingRight: 26 + 4 + 9\n },\n [`.${autocompleteClasses.hasPopupIcon}.${autocompleteClasses.hasClearIcon}&`]: {\n paddingRight: 52 + 4 + 9\n },\n [`& .${autocompleteClasses.input}`]: {\n padding: '7.5px 4px 7.5px 5px'\n },\n [`& .${autocompleteClasses.endAdornment}`]: {\n right: 9\n }\n },\n [`& .${outlinedInputClasses.root}.${inputBaseClasses.sizeSmall}`]: {\n // Don't specify paddingRight, as it overrides the default value set when there is only\n // one of the popup or clear icon as the specificity is equal so the latter one wins\n paddingTop: 6,\n paddingBottom: 6,\n paddingLeft: 6,\n [`& .${autocompleteClasses.input}`]: {\n padding: '2.5px 4px 2.5px 8px'\n }\n },\n [`& .${filledInputClasses.root}`]: {\n paddingTop: 19,\n paddingLeft: 8,\n [`.${autocompleteClasses.hasPopupIcon}&, .${autocompleteClasses.hasClearIcon}&`]: {\n paddingRight: 26 + 4 + 9\n },\n [`.${autocompleteClasses.hasPopupIcon}.${autocompleteClasses.hasClearIcon}&`]: {\n paddingRight: 52 + 4 + 9\n },\n [`& .${filledInputClasses.input}`]: {\n padding: '7px 4px'\n },\n [`& .${autocompleteClasses.endAdornment}`]: {\n right: 9\n }\n },\n [`& .${filledInputClasses.root}.${inputBaseClasses.sizeSmall}`]: {\n paddingBottom: 1,\n [`& .${filledInputClasses.input}`]: {\n padding: '2.5px 4px'\n }\n },\n [`& .${inputBaseClasses.hiddenLabel}`]: {\n paddingTop: 8\n },\n [`& .${filledInputClasses.root}.${inputBaseClasses.hiddenLabel}`]: {\n paddingTop: 0,\n paddingBottom: 0,\n [`& .${autocompleteClasses.input}`]: {\n paddingTop: 16,\n paddingBottom: 17\n }\n },\n [`& .${filledInputClasses.root}.${inputBaseClasses.hiddenLabel}.${inputBaseClasses.sizeSmall}`]: {\n [`& .${autocompleteClasses.input}`]: {\n paddingTop: 8,\n paddingBottom: 9\n }\n },\n [`& .${autocompleteClasses.input}`]: {\n flexGrow: 1,\n textOverflow: 'ellipsis',\n opacity: 0\n },\n variants: [{\n props: {\n fullWidth: true\n },\n style: {\n width: '100%'\n }\n }, {\n props: {\n size: 'small'\n },\n style: {\n [`& .${autocompleteClasses.tag}`]: {\n margin: 2,\n maxWidth: 'calc(100% - 4px)'\n }\n }\n }, {\n props: {\n inputFocused: true\n },\n style: {\n [`& .${autocompleteClasses.input}`]: {\n opacity: 1\n }\n }\n }]\n});\nconst AutocompleteEndAdornment = styled('div', {\n name: 'MuiAutocomplete',\n slot: 'EndAdornment',\n overridesResolver: (props, styles) => styles.endAdornment\n})({\n // We use a position absolute to support wrapping tags.\n position: 'absolute',\n right: 0,\n top: '50%',\n transform: 'translate(0, -50%)'\n});\nconst AutocompleteClearIndicator = styled(IconButton, {\n name: 'MuiAutocomplete',\n slot: 'ClearIndicator',\n overridesResolver: (props, styles) => styles.clearIndicator\n})({\n marginRight: -2,\n padding: 4,\n visibility: 'hidden'\n});\nconst AutocompletePopupIndicator = styled(IconButton, {\n name: 'MuiAutocomplete',\n slot: 'PopupIndicator',\n overridesResolver: ({\n ownerState\n }, styles) => _extends({}, styles.popupIndicator, ownerState.popupOpen && styles.popupIndicatorOpen)\n})({\n padding: 2,\n marginRight: -2,\n variants: [{\n props: {\n popupOpen: true\n },\n style: {\n transform: 'rotate(180deg)'\n }\n }]\n});\nconst AutocompletePopper = styled(Popper, {\n name: 'MuiAutocomplete',\n slot: 'Popper',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [{\n [`& .${autocompleteClasses.option}`]: styles.option\n }, styles.popper, ownerState.disablePortal && styles.popperDisablePortal];\n }\n})(({\n theme\n}) => ({\n zIndex: (theme.vars || theme).zIndex.modal,\n variants: [{\n props: {\n disablePortal: true\n },\n style: {\n position: 'absolute'\n }\n }]\n}));\nconst AutocompletePaper = styled(Paper, {\n name: 'MuiAutocomplete',\n slot: 'Paper',\n overridesResolver: (props, styles) => styles.paper\n})(({\n theme\n}) => _extends({}, theme.typography.body1, {\n overflow: 'auto'\n}));\nconst AutocompleteLoading = styled('div', {\n name: 'MuiAutocomplete',\n slot: 'Loading',\n overridesResolver: (props, styles) => styles.loading\n})(({\n theme\n}) => ({\n color: (theme.vars || theme).palette.text.secondary,\n padding: '14px 16px'\n}));\nconst AutocompleteNoOptions = styled('div', {\n name: 'MuiAutocomplete',\n slot: 'NoOptions',\n overridesResolver: (props, styles) => styles.noOptions\n})(({\n theme\n}) => ({\n color: (theme.vars || theme).palette.text.secondary,\n padding: '14px 16px'\n}));\nconst AutocompleteListbox = styled('div', {\n name: 'MuiAutocomplete',\n slot: 'Listbox',\n overridesResolver: (props, styles) => styles.listbox\n})(({\n theme\n}) => ({\n listStyle: 'none',\n margin: 0,\n padding: '8px 0',\n maxHeight: '40vh',\n overflow: 'auto',\n position: 'relative',\n [`& .${autocompleteClasses.option}`]: {\n minHeight: 48,\n display: 'flex',\n overflow: 'hidden',\n justifyContent: 'flex-start',\n alignItems: 'center',\n cursor: 'pointer',\n paddingTop: 6,\n boxSizing: 'border-box',\n outline: '0',\n WebkitTapHighlightColor: 'transparent',\n paddingBottom: 6,\n paddingLeft: 16,\n paddingRight: 16,\n [theme.breakpoints.up('sm')]: {\n minHeight: 'auto'\n },\n [`&.${autocompleteClasses.focused}`]: {\n backgroundColor: (theme.vars || theme).palette.action.hover,\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n },\n '&[aria-disabled=\"true\"]': {\n opacity: (theme.vars || theme).palette.action.disabledOpacity,\n pointerEvents: 'none'\n },\n [`&.${autocompleteClasses.focusVisible}`]: {\n backgroundColor: (theme.vars || theme).palette.action.focus\n },\n '&[aria-selected=\"true\"]': {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity),\n [`&.${autocompleteClasses.focused}`]: {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.hoverOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: (theme.vars || theme).palette.action.selected\n }\n },\n [`&.${autocompleteClasses.focusVisible}`]: {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)\n }\n }\n }\n}));\nconst AutocompleteGroupLabel = styled(ListSubheader, {\n name: 'MuiAutocomplete',\n slot: 'GroupLabel',\n overridesResolver: (props, styles) => styles.groupLabel\n})(({\n theme\n}) => ({\n backgroundColor: (theme.vars || theme).palette.background.paper,\n top: -8\n}));\nconst AutocompleteGroupUl = styled('ul', {\n name: 'MuiAutocomplete',\n slot: 'GroupUl',\n overridesResolver: (props, styles) => styles.groupUl\n})({\n padding: 0,\n [`& .${autocompleteClasses.option}`]: {\n paddingLeft: 24\n }\n});\nexport { createFilterOptions };\nconst Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps, ref) {\n var _slotProps$clearIndic, _slotProps$paper, _slotProps$popper, _slotProps$popupIndic;\n const props = useThemeProps({\n props: inProps,\n name: 'MuiAutocomplete'\n });\n\n /* eslint-disable @typescript-eslint/no-unused-vars */\n const {\n autoComplete = false,\n autoHighlight = false,\n autoSelect = false,\n blurOnSelect = false,\n ChipProps,\n className,\n clearIcon = _ClearIcon || (_ClearIcon = /*#__PURE__*/_jsx(ClearIcon, {\n fontSize: \"small\"\n })),\n clearOnBlur = !props.freeSolo,\n clearOnEscape = false,\n clearText = 'Clear',\n closeText = 'Close',\n componentsProps = {},\n defaultValue = props.multiple ? [] : null,\n disableClearable = false,\n disableCloseOnSelect = false,\n disabled = false,\n disabledItemsFocusable = false,\n disableListWrap = false,\n disablePortal = false,\n filterSelectedOptions = false,\n forcePopupIcon = 'auto',\n freeSolo = false,\n fullWidth = false,\n getLimitTagsText = more => `+${more}`,\n getOptionLabel: getOptionLabelProp,\n groupBy,\n handleHomeEndKeys = !props.freeSolo,\n includeInputInList = false,\n limitTags = -1,\n ListboxComponent = 'ul',\n ListboxProps,\n loading = false,\n loadingText = 'Loading…',\n multiple = false,\n noOptionsText = 'No options',\n openOnFocus = false,\n openText = 'Open',\n PaperComponent = Paper,\n PopperComponent = Popper,\n popupIcon = _ArrowDropDownIcon || (_ArrowDropDownIcon = /*#__PURE__*/_jsx(ArrowDropDownIcon, {})),\n readOnly = false,\n renderGroup: renderGroupProp,\n renderInput,\n renderOption: renderOptionProp,\n renderTags,\n selectOnFocus = !props.freeSolo,\n size = 'medium',\n slotProps = {}\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n /* eslint-enable @typescript-eslint/no-unused-vars */\n\n const {\n getRootProps,\n getInputProps,\n getInputLabelProps,\n getPopupIndicatorProps,\n getClearProps,\n getTagProps,\n getListboxProps,\n getOptionProps,\n value,\n dirty,\n expanded,\n id,\n popupOpen,\n focused,\n focusedTag,\n anchorEl,\n setAnchorEl,\n inputValue,\n groupedOptions\n } = useAutocomplete(_extends({}, props, {\n componentName: 'Autocomplete'\n }));\n const hasClearIcon = !disableClearable && !disabled && dirty && !readOnly;\n const hasPopupIcon = (!freeSolo || forcePopupIcon === true) && forcePopupIcon !== false;\n const {\n onMouseDown: handleInputMouseDown\n } = getInputProps();\n const {\n ref: externalListboxRef\n } = ListboxProps != null ? ListboxProps : {};\n const _getListboxProps = getListboxProps(),\n {\n ref: listboxRef\n } = _getListboxProps,\n otherListboxProps = _objectWithoutPropertiesLoose(_getListboxProps, _excluded2);\n const combinedListboxRef = useForkRef(listboxRef, externalListboxRef);\n const defaultGetOptionLabel = option => {\n var _option$label;\n return (_option$label = option.label) != null ? _option$label : option;\n };\n const getOptionLabel = getOptionLabelProp || defaultGetOptionLabel;\n\n // If you modify this, make sure to keep the `AutocompleteOwnerState` type in sync.\n const ownerState = _extends({}, props, {\n disablePortal,\n expanded,\n focused,\n fullWidth,\n getOptionLabel,\n hasClearIcon,\n hasPopupIcon,\n inputFocused: focusedTag === -1,\n popupOpen,\n size\n });\n const classes = useUtilityClasses(ownerState);\n let startAdornment;\n if (multiple && value.length > 0) {\n const getCustomizedTagProps = params => _extends({\n className: classes.tag,\n disabled\n }, getTagProps(params));\n if (renderTags) {\n startAdornment = renderTags(value, getCustomizedTagProps, ownerState);\n } else {\n startAdornment = value.map((option, index) => /*#__PURE__*/_jsx(Chip, _extends({\n label: getOptionLabel(option),\n size: size\n }, getCustomizedTagProps({\n index\n }), ChipProps)));\n }\n }\n if (limitTags > -1 && Array.isArray(startAdornment)) {\n const more = startAdornment.length - limitTags;\n if (!focused && more > 0) {\n startAdornment = startAdornment.splice(0, limitTags);\n startAdornment.push( /*#__PURE__*/_jsx(\"span\", {\n className: classes.tag,\n children: getLimitTagsText(more)\n }, startAdornment.length));\n }\n }\n const defaultRenderGroup = params => /*#__PURE__*/_jsxs(\"li\", {\n children: [/*#__PURE__*/_jsx(AutocompleteGroupLabel, {\n className: classes.groupLabel,\n ownerState: ownerState,\n component: \"div\",\n children: params.group\n }), /*#__PURE__*/_jsx(AutocompleteGroupUl, {\n className: classes.groupUl,\n ownerState: ownerState,\n children: params.children\n })]\n }, params.key);\n const renderGroup = renderGroupProp || defaultRenderGroup;\n const defaultRenderOption = (props2, option) => {\n // Need to clearly apply key because of https://github.com/vercel/next.js/issues/55642\n return /*#__PURE__*/_createElement(\"li\", _extends({}, props2, {\n key: props2.key\n }), getOptionLabel(option));\n };\n const renderOption = renderOptionProp || defaultRenderOption;\n const renderListOption = (option, index) => {\n const optionProps = getOptionProps({\n option,\n index\n });\n return renderOption(_extends({}, optionProps, {\n className: classes.option\n }), option, {\n selected: optionProps['aria-selected'],\n index,\n inputValue\n }, ownerState);\n };\n const clearIndicatorSlotProps = (_slotProps$clearIndic = slotProps.clearIndicator) != null ? _slotProps$clearIndic : componentsProps.clearIndicator;\n const paperSlotProps = (_slotProps$paper = slotProps.paper) != null ? _slotProps$paper : componentsProps.paper;\n const popperSlotProps = (_slotProps$popper = slotProps.popper) != null ? _slotProps$popper : componentsProps.popper;\n const popupIndicatorSlotProps = (_slotProps$popupIndic = slotProps.popupIndicator) != null ? _slotProps$popupIndic : componentsProps.popupIndicator;\n const renderAutocompletePopperChildren = children => /*#__PURE__*/_jsx(AutocompletePopper, _extends({\n as: PopperComponent,\n disablePortal: disablePortal,\n style: {\n width: anchorEl ? anchorEl.clientWidth : null\n },\n ownerState: ownerState,\n role: \"presentation\",\n anchorEl: anchorEl,\n open: popupOpen\n }, popperSlotProps, {\n className: clsx(classes.popper, popperSlotProps == null ? void 0 : popperSlotProps.className),\n children: /*#__PURE__*/_jsx(AutocompletePaper, _extends({\n ownerState: ownerState,\n as: PaperComponent\n }, paperSlotProps, {\n className: clsx(classes.paper, paperSlotProps == null ? void 0 : paperSlotProps.className),\n children: children\n }))\n }));\n let autocompletePopper = null;\n if (groupedOptions.length > 0) {\n autocompletePopper = renderAutocompletePopperChildren( /*#__PURE__*/_jsx(AutocompleteListbox, _extends({\n as: ListboxComponent,\n className: classes.listbox,\n ownerState: ownerState\n }, otherListboxProps, ListboxProps, {\n ref: combinedListboxRef,\n children: groupedOptions.map((option, index) => {\n if (groupBy) {\n return renderGroup({\n key: option.key,\n group: option.group,\n children: option.options.map((option2, index2) => renderListOption(option2, option.index + index2))\n });\n }\n return renderListOption(option, index);\n })\n })));\n } else if (loading && groupedOptions.length === 0) {\n autocompletePopper = renderAutocompletePopperChildren( /*#__PURE__*/_jsx(AutocompleteLoading, {\n className: classes.loading,\n ownerState: ownerState,\n children: loadingText\n }));\n } else if (groupedOptions.length === 0 && !freeSolo && !loading) {\n autocompletePopper = renderAutocompletePopperChildren( /*#__PURE__*/_jsx(AutocompleteNoOptions, {\n className: classes.noOptions,\n ownerState: ownerState,\n role: \"presentation\",\n onMouseDown: event => {\n // Prevent input blur when interacting with the \"no options\" content\n event.preventDefault();\n },\n children: noOptionsText\n }));\n }\n return /*#__PURE__*/_jsxs(React.Fragment, {\n children: [/*#__PURE__*/_jsx(AutocompleteRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className),\n ownerState: ownerState\n }, getRootProps(other), {\n children: renderInput({\n id,\n disabled,\n fullWidth: true,\n size: size === 'small' ? 'small' : undefined,\n InputLabelProps: getInputLabelProps(),\n InputProps: _extends({\n ref: setAnchorEl,\n className: classes.inputRoot,\n startAdornment,\n onClick: event => {\n if (event.target === event.currentTarget) {\n handleInputMouseDown(event);\n }\n }\n }, (hasClearIcon || hasPopupIcon) && {\n endAdornment: /*#__PURE__*/_jsxs(AutocompleteEndAdornment, {\n className: classes.endAdornment,\n ownerState: ownerState,\n children: [hasClearIcon ? /*#__PURE__*/_jsx(AutocompleteClearIndicator, _extends({}, getClearProps(), {\n \"aria-label\": clearText,\n title: clearText,\n ownerState: ownerState\n }, clearIndicatorSlotProps, {\n className: clsx(classes.clearIndicator, clearIndicatorSlotProps == null ? void 0 : clearIndicatorSlotProps.className),\n children: clearIcon\n })) : null, hasPopupIcon ? /*#__PURE__*/_jsx(AutocompletePopupIndicator, _extends({}, getPopupIndicatorProps(), {\n disabled: disabled,\n \"aria-label\": popupOpen ? closeText : openText,\n title: popupOpen ? closeText : openText,\n ownerState: ownerState\n }, popupIndicatorSlotProps, {\n className: clsx(classes.popupIndicator, popupIndicatorSlotProps == null ? void 0 : popupIndicatorSlotProps.className),\n children: popupIcon\n })) : null]\n })\n }),\n inputProps: _extends({\n className: classes.input,\n disabled,\n readOnly\n }, getInputProps())\n })\n })), anchorEl ? autocompletePopper : null]\n });\n});\nprocess.env.NODE_ENV !== \"production\" ? Autocomplete.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * If `true`, the portion of the selected suggestion that the user hasn't typed,\n * known as the completion string, appears inline after the input cursor in the textbox.\n * The inline completion string is visually highlighted and has a selected state.\n * @default false\n */\n autoComplete: PropTypes.bool,\n /**\n * If `true`, the first option is automatically highlighted.\n * @default false\n */\n autoHighlight: PropTypes.bool,\n /**\n * If `true`, the selected option becomes the value of the input\n * when the Autocomplete loses focus unless the user chooses\n * a different option or changes the character string in the input.\n *\n * When using the `freeSolo` mode, the typed value will be the input value\n * if the Autocomplete loses focus without highlighting an option.\n * @default false\n */\n autoSelect: PropTypes.bool,\n /**\n * Control if the input should be blurred when an option is selected:\n *\n * - `false` the input is not blurred.\n * - `true` the input is always blurred.\n * - `touch` the input is blurred after a touch event.\n * - `mouse` the input is blurred after a mouse event.\n * @default false\n */\n blurOnSelect: PropTypes.oneOfType([PropTypes.oneOf(['mouse', 'touch']), PropTypes.bool]),\n /**\n * Props applied to the [`Chip`](/material-ui/api/chip/) element.\n */\n ChipProps: PropTypes.object,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * The icon to display in place of the default clear icon.\n * @default