![\"logo\"](\"/assets/icons/realix_logo.png\"){kind=icon}
\n \n );\n\n if (disabledLink) {\n return logo;\n }\n\n return (\n \n {logo}\n \n );\n});\n\nLogo.propTypes = {\n disabledLink: PropTypes.bool,\n sx: PropTypes.object,\n};\n\nexport default Logo;\n","import PropTypes from 'prop-types';\nimport { forwardRef } from 'react';\n\nimport Box from '@mui/material/Box';\nimport Link from '@mui/material/Link';\nimport { useTheme } from '@mui/material/styles';\n\nimport { RouterLink } from 'src/routes/components';\n\n// ----------------------------------------------------------------------\n\nconst LogoFull = forwardRef(({ disabledLink = false, sx, ...other }, ref) => {\n const logo = (\n ![\"logo\"](\"/assets/icons/realix-full-logo.png\"){kind=icon}
\n \n );\n\n if (disabledLink) {\n return logo;\n }\n\n return (\n \n {logo}\n \n );\n});\n\nLogoFull.propTypes = {\n disabledLink: PropTypes.bool,\n sx: PropTypes.object,\n};\n\nexport default LogoFull;\n","import PropTypes from 'prop-types';\nimport { forwardRef } from 'react';\n\nimport Box from '@mui/material/Box';\nimport Link from '@mui/material/Link';\nimport Tooltip from '@mui/material/Tooltip';\nimport { alpha, styled } from '@mui/material/styles';\nimport ListItemButton from '@mui/material/ListItemButton';\n\nimport { RouterLink } from 'src/routes/components';\n\nimport Iconify from '../../iconify';\n\n// ----------------------------------------------------------------------\n\nconst NavItem = forwardRef(\n (\n {\n title,\n path,\n icon,\n info,\n disabled,\n caption,\n roles,\n //\n open,\n depth,\n active,\n hasChild,\n externalLink,\n currentRole = 'admin',\n ...other\n },\n ref\n ) => {\n const subItem = depth !== 1;\n\n const renderContent = (\n Try checking for typos or using complete words.\n
\n \n Mode\n \n\n settings.onUpdate('themeMode', newValue)}\n options={['light', 'dark']}\n icons={['sun', 'moon']}\n />\n
\n );\n\n const renderContrast = (\n \n \n Contrast\n \n\n settings.onUpdate('themeContrast', newValue)}\n options={['default', 'bold']}\n icons={['contrast', 'contrast_bold']}\n />\n
\n );\n\n const renderDirection = (\n \n \n Direction\n \n\n settings.onUpdate('themeDirection', newValue)}\n options={['ltr', 'rtl']}\n icons={['align_left', 'align_right']}\n />\n
\n );\n\n const renderLayout = (\n \n \n Layout\n \n\n settings.onUpdate('themeLayout', newValue)}\n options={['vertical', 'horizontal', 'mini']}\n />\n
\n );\n\n const renderStretch = (\n \n \n Stretch\n 1600px (xl)\">\n \n \n\n settings.onUpdate('themeStretch', !settings.themeStretch)}\n />\n
\n );\n\n const renderPresets = (\n \n \n Presets\n \n\n settings.onUpdate('themeColorPresets', newValue)}\n />\n
\n );\n\n return (\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 // e.g. 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 TypeScript types and run \"yarn 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 };","'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 TypeScript types and run \"yarn 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 };","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 * 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}","/**\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}","'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}","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}","import generateUtilityClass from '@mui/material/generateUtilityClass';\nimport generateUtilityClasses from '@mui/material/generateUtilityClasses';\nexport function getLoadingButtonUtilityClass(slot) {\n return generateUtilityClass('MuiLoadingButton', slot);\n}\nconst loadingButtonClasses = generateUtilityClasses('MuiLoadingButton', ['root', 'loading', 'loadingIndicator', 'loadingIndicatorCenter', 'loadingIndicatorStart', 'loadingIndicatorEnd', 'endIconLoadingEnd', 'startIconLoadingStart']);\nexport default loadingButtonClasses;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getAccordionUtilityClass(slot) {\n return generateUtilityClass('MuiAccordion', slot);\n}\nconst accordionClasses = generateUtilityClasses('MuiAccordion', ['root', 'rounded', 'expanded', 'disabled', 'gutters', 'region']);\nexport default accordionClasses;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getAccordionSummaryUtilityClass(slot) {\n return generateUtilityClass('MuiAccordionSummary', slot);\n}\nconst accordionSummaryClasses = generateUtilityClasses('MuiAccordionSummary', ['root', 'expanded', 'focusVisible', 'disabled', 'gutters', 'contentGutters', 'content', 'expandIconWrapper']);\nexport default accordionSummaryClasses;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getAlertUtilityClass(slot) {\n return generateUtilityClass('MuiAlert', slot);\n}\nconst alertClasses = generateUtilityClasses('MuiAlert', ['root', 'action', 'icon', 'message', 'filled', 'filledSuccess', 'filledInfo', 'filledWarning', 'filledError', 'outlined', 'outlinedSuccess', 'outlinedInfo', 'outlinedWarning', 'outlinedError', 'standard', 'standardSuccess', 'standardInfo', 'standardWarning', 'standardError']);\nexport default alertClasses;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getAppBarUtilityClass(slot) {\n return generateUtilityClass('MuiAppBar', slot);\n}\nconst appBarClasses = generateUtilityClasses('MuiAppBar', ['root', 'positionFixed', 'positionAbsolute', 'positionSticky', 'positionStatic', 'positionRelative', 'colorDefault', 'colorPrimary', 'colorSecondary', 'colorInherit', 'colorTransparent', 'colorError', 'colorInfo', 'colorSuccess', 'colorWarning']);\nexport default appBarClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"className\", \"color\", \"enableColorOnDark\", \"position\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';\nimport styled from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport capitalize from '../utils/capitalize';\nimport Paper from '../Paper';\nimport { getAppBarUtilityClass } from './appBarClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n color,\n position,\n classes\n } = ownerState;\n const slots = {\n root: ['root', `color${capitalize(color)}`, `position${capitalize(position)}`]\n };\n return composeClasses(slots, getAppBarUtilityClass, classes);\n};\n\n// var2 is the fallback.\n// Ex. var1: 'var(--a)', var2: 'var(--b)'; return: 'var(--a, var(--b))'\nconst joinVars = (var1, var2) => var1 ? `${var1 == null ? void 0 : var1.replace(')', '')}, ${var2})` : var2;\nconst AppBarRoot = styled(Paper, {\n name: 'MuiAppBar',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, styles[`position${capitalize(ownerState.position)}`], styles[`color${capitalize(ownerState.color)}`]];\n }\n})(({\n theme,\n ownerState\n}) => {\n const backgroundColorDefault = theme.palette.mode === 'light' ? theme.palette.grey[100] : theme.palette.grey[900];\n return _extends({\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n boxSizing: 'border-box',\n // Prevent padding issue with the Modal and fixed positioned AppBar.\n flexShrink: 0\n }, ownerState.position === 'fixed' && {\n position: 'fixed',\n zIndex: (theme.vars || theme).zIndex.appBar,\n top: 0,\n left: 'auto',\n right: 0,\n '@media print': {\n // Prevent the app bar to be visible on each printed page.\n position: 'absolute'\n }\n }, ownerState.position === 'absolute' && {\n position: 'absolute',\n zIndex: (theme.vars || theme).zIndex.appBar,\n top: 0,\n left: 'auto',\n right: 0\n }, ownerState.position === 'sticky' && {\n // ⚠️ sticky is not supported by IE11.\n position: 'sticky',\n zIndex: (theme.vars || theme).zIndex.appBar,\n top: 0,\n left: 'auto',\n right: 0\n }, ownerState.position === 'static' && {\n position: 'static'\n }, ownerState.position === 'relative' && {\n position: 'relative'\n }, !theme.vars && _extends({}, ownerState.color === 'default' && {\n backgroundColor: backgroundColorDefault,\n color: theme.palette.getContrastText(backgroundColorDefault)\n }, ownerState.color && ownerState.color !== 'default' && ownerState.color !== 'inherit' && ownerState.color !== 'transparent' && {\n backgroundColor: theme.palette[ownerState.color].main,\n color: theme.palette[ownerState.color].contrastText\n }, ownerState.color === 'inherit' && {\n color: 'inherit'\n }, theme.palette.mode === 'dark' && !ownerState.enableColorOnDark && {\n backgroundColor: null,\n color: null\n }, ownerState.color === 'transparent' && _extends({\n backgroundColor: 'transparent',\n color: 'inherit'\n }, theme.palette.mode === 'dark' && {\n backgroundImage: 'none'\n })), theme.vars && _extends({}, ownerState.color === 'default' && {\n '--AppBar-background': ownerState.enableColorOnDark ? theme.vars.palette.AppBar.defaultBg : joinVars(theme.vars.palette.AppBar.darkBg, theme.vars.palette.AppBar.defaultBg),\n '--AppBar-color': ownerState.enableColorOnDark ? theme.vars.palette.text.primary : joinVars(theme.vars.palette.AppBar.darkColor, theme.vars.palette.text.primary)\n }, ownerState.color && !ownerState.color.match(/^(default|inherit|transparent)$/) && {\n '--AppBar-background': ownerState.enableColorOnDark ? theme.vars.palette[ownerState.color].main : joinVars(theme.vars.palette.AppBar.darkBg, theme.vars.palette[ownerState.color].main),\n '--AppBar-color': ownerState.enableColorOnDark ? theme.vars.palette[ownerState.color].contrastText : joinVars(theme.vars.palette.AppBar.darkColor, theme.vars.palette[ownerState.color].contrastText)\n }, {\n backgroundColor: 'var(--AppBar-background)',\n color: ownerState.color === 'inherit' ? 'inherit' : 'var(--AppBar-color)'\n }, ownerState.color === 'transparent' && {\n backgroundImage: 'none',\n backgroundColor: 'transparent',\n color: 'inherit'\n }));\n});\nconst AppBar = /*#__PURE__*/React.forwardRef(function AppBar(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiAppBar'\n });\n const {\n className,\n color = 'primary',\n enableColorOnDark = false,\n position = 'fixed'\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n color,\n position,\n enableColorOnDark\n });\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(AppBarRoot, _extends({\n square: true,\n component: \"header\",\n ownerState: ownerState,\n elevation: 4,\n className: clsx(classes.root, className, position === 'fixed' && 'mui-fixed'),\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? AppBar.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 \"yarn 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.\n * It supports both default and custom theme colors, which can be added as shown in the\n * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).\n * @default 'primary'\n */\n color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['default', 'inherit', 'primary', 'secondary', 'transparent', 'error', 'info', 'success', 'warning']), PropTypes.string]),\n /**\n * If true, the `color` prop is applied in dark mode.\n * @default false\n */\n enableColorOnDark: PropTypes.bool,\n /**\n * The positioning type. The behavior of the different options is described\n * [in the MDN web docs](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Positioning).\n * Note: `sticky` is not universally supported and will fall back to `static` when unavailable.\n * @default 'fixed'\n */\n position: PropTypes.oneOf(['absolute', 'fixed', 'relative', 'static', 'sticky']),\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 AppBar;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../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 * as React from 'react';\nimport createSvgIcon from '../../utils/createSvgIcon';\n\n/**\n * @ignore - internal component.\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\"\n}), 'Person');","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"alt\", \"children\", \"className\", \"component\", \"imgProps\", \"sizes\", \"src\", \"srcSet\", \"variant\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';\nimport styled from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport Person from '../internal/svg-icons/Person';\nimport { getAvatarUtilityClass } from './avatarClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n variant,\n colorDefault\n } = ownerState;\n const slots = {\n root: ['root', variant, colorDefault && 'colorDefault'],\n img: ['img'],\n fallback: ['fallback']\n };\n return composeClasses(slots, getAvatarUtilityClass, classes);\n};\nconst AvatarRoot = styled('div', {\n name: 'MuiAvatar',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, styles[ownerState.variant], ownerState.colorDefault && styles.colorDefault];\n }\n})(({\n theme,\n ownerState\n}) => _extends({\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n width: 40,\n height: 40,\n fontFamily: theme.typography.fontFamily,\n fontSize: theme.typography.pxToRem(20),\n lineHeight: 1,\n borderRadius: '50%',\n overflow: 'hidden',\n userSelect: 'none'\n}, ownerState.variant === 'rounded' && {\n borderRadius: (theme.vars || theme).shape.borderRadius\n}, ownerState.variant === 'square' && {\n borderRadius: 0\n}, ownerState.colorDefault && _extends({\n color: (theme.vars || theme).palette.background.default\n}, theme.vars ? {\n backgroundColor: theme.vars.palette.Avatar.defaultBg\n} : {\n backgroundColor: theme.palette.mode === 'light' ? theme.palette.grey[400] : theme.palette.grey[600]\n})));\nconst AvatarImg = styled('img', {\n name: 'MuiAvatar',\n slot: 'Img',\n overridesResolver: (props, styles) => styles.img\n})({\n width: '100%',\n height: '100%',\n textAlign: 'center',\n // Handle non-square image. The property isn't supported by IE11.\n objectFit: 'cover',\n // Hide alt text.\n color: 'transparent',\n // Hide the image broken icon, only works on Chrome.\n textIndent: 10000\n});\nconst AvatarFallback = styled(Person, {\n name: 'MuiAvatar',\n slot: 'Fallback',\n overridesResolver: (props, styles) => styles.fallback\n})({\n width: '75%',\n height: '75%'\n});\nfunction useLoaded({\n crossOrigin,\n referrerPolicy,\n src,\n srcSet\n}) {\n const [loaded, setLoaded] = React.useState(false);\n React.useEffect(() => {\n if (!src && !srcSet) {\n return undefined;\n }\n setLoaded(false);\n let active = true;\n const image = new Image();\n image.onload = () => {\n if (!active) {\n return;\n }\n setLoaded('loaded');\n };\n image.onerror = () => {\n if (!active) {\n return;\n }\n setLoaded('error');\n };\n image.crossOrigin = crossOrigin;\n image.referrerPolicy = referrerPolicy;\n image.src = src;\n if (srcSet) {\n image.srcset = srcSet;\n }\n return () => {\n active = false;\n };\n }, [crossOrigin, referrerPolicy, src, srcSet]);\n return loaded;\n}\nconst Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiAvatar'\n });\n const {\n alt,\n children: childrenProp,\n className,\n component = 'div',\n imgProps,\n sizes,\n src,\n srcSet,\n variant = 'circular'\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n let children = null;\n\n // Use a hook instead of onError on the img element to support server-side rendering.\n const loaded = useLoaded(_extends({}, imgProps, {\n src,\n srcSet\n }));\n const hasImg = src || srcSet;\n const hasImgNotFailing = hasImg && loaded !== 'error';\n const ownerState = _extends({}, props, {\n colorDefault: !hasImgNotFailing,\n component,\n variant\n });\n const classes = useUtilityClasses(ownerState);\n if (hasImgNotFailing) {\n children = /*#__PURE__*/_jsx(AvatarImg, _extends({\n alt: alt,\n srcSet: srcSet,\n src: src,\n sizes: sizes,\n ownerState: ownerState,\n className: classes.img\n }, imgProps));\n } else if (childrenProp != null) {\n children = childrenProp;\n } else if (hasImg && alt) {\n children = alt[0];\n } else {\n children = /*#__PURE__*/_jsx(AvatarFallback, {\n ownerState: ownerState,\n className: classes.fallback\n });\n }\n return /*#__PURE__*/_jsx(AvatarRoot, _extends({\n as: component,\n ownerState: ownerState,\n className: clsx(classes.root, className),\n ref: ref\n }, other, {\n children: children\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Avatar.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 \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * Used in combination with `src` or `srcSet` to\n * provide an alt attribute for the rendered `img` element.\n */\n alt: PropTypes.string,\n /**\n * Used to render icon or text elements inside the Avatar if `src` is not set.\n * This can be an element, or just a string.\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 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 * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.\n * It can be used to listen for the loading error event.\n */\n imgProps: PropTypes.object,\n /**\n * The `sizes` attribute for the `img` element.\n */\n sizes: PropTypes.string,\n /**\n * The `src` attribute for the `img` element.\n */\n src: PropTypes.string,\n /**\n * The `srcSet` attribute for the `img` element.\n * Use this attribute for responsive image display.\n */\n srcSet: PropTypes.string,\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 /**\n * The shape of the avatar.\n * @default 'circular'\n */\n variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['circular', 'rounded', 'square']), PropTypes.string])\n} : void 0;\nexport default Avatar;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getAvatarUtilityClass(slot) {\n return generateUtilityClass('MuiAvatar', slot);\n}\nconst avatarClasses = generateUtilityClasses('MuiAvatar', ['root', 'colorDefault', 'circular', 'rounded', 'square', 'img', 'fallback']);\nexport default avatarClasses;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getAvatarGroupUtilityClass(slot) {\n return generateUtilityClass('MuiAvatarGroup', slot);\n}\nconst avatarGroupClasses = generateUtilityClasses('MuiAvatarGroup', ['root', 'avatar']);\nexport default avatarGroupClasses;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getBackdropUtilityClass(slot) {\n return generateUtilityClass('MuiBackdrop', slot);\n}\nconst backdropClasses = generateUtilityClasses('MuiBackdrop', ['root', 'invisible']);\nexport default backdropClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"children\", \"className\", \"component\", \"components\", \"componentsProps\", \"invisible\", \"open\", \"slotProps\", \"slots\", \"TransitionComponent\", \"transitionDuration\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';\nimport styled from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport Fade from '../Fade';\nimport { getBackdropUtilityClass } from './backdropClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n invisible\n } = ownerState;\n const slots = {\n root: ['root', invisible && 'invisible']\n };\n return composeClasses(slots, getBackdropUtilityClass, classes);\n};\nconst BackdropRoot = styled('div', {\n name: 'MuiBackdrop',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, ownerState.invisible && styles.invisible];\n }\n})(({\n ownerState\n}) => _extends({\n position: 'fixed',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n right: 0,\n bottom: 0,\n top: 0,\n left: 0,\n backgroundColor: 'rgba(0, 0, 0, 0.5)',\n WebkitTapHighlightColor: 'transparent'\n}, ownerState.invisible && {\n backgroundColor: 'transparent'\n}));\nconst Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(inProps, ref) {\n var _slotProps$root, _ref, _slots$root;\n const props = useThemeProps({\n props: inProps,\n name: 'MuiBackdrop'\n });\n const {\n children,\n className,\n component = 'div',\n components = {},\n componentsProps = {},\n invisible = false,\n open,\n slotProps = {},\n slots = {},\n TransitionComponent = Fade,\n transitionDuration\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n component,\n invisible\n });\n const classes = useUtilityClasses(ownerState);\n const rootSlotProps = (_slotProps$root = slotProps.root) != null ? _slotProps$root : componentsProps.root;\n return /*#__PURE__*/_jsx(TransitionComponent, _extends({\n in: open,\n timeout: transitionDuration\n }, other, {\n children: /*#__PURE__*/_jsx(BackdropRoot, _extends({\n \"aria-hidden\": true\n }, rootSlotProps, {\n as: (_ref = (_slots$root = slots.root) != null ? _slots$root : components.Root) != null ? _ref : component,\n className: clsx(classes.root, className, rootSlotProps == null ? void 0 : rootSlotProps.className),\n ownerState: _extends({}, ownerState, rootSlotProps == null ? void 0 : rootSlotProps.ownerState),\n classes: classes,\n ref: ref,\n children: children\n }))\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Backdrop.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 \"yarn 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 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 * The components used for each slot inside.\n *\n * This prop is an alias for the `slots` prop.\n * It's recommended to use the `slots` prop instead.\n *\n * @default {}\n */\n components: PropTypes.shape({\n Root: PropTypes.elementType\n }),\n /**\n * The extra props for the slot components.\n * You can override the existing props or add new ones.\n *\n * This prop is an alias for the `slotProps` prop.\n * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.\n *\n * @default {}\n */\n componentsProps: PropTypes.shape({\n root: PropTypes.object\n }),\n /**\n * If `true`, the backdrop is invisible.\n * It can be used when rendering a popover or a custom select component.\n * @default false\n */\n invisible: PropTypes.bool,\n /**\n * If `true`, the component is shown.\n */\n open: PropTypes.bool.isRequired,\n /**\n * The extra props for the slot components.\n * You can override the existing props or add new ones.\n *\n * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.\n *\n * @default {}\n */\n slotProps: PropTypes.shape({\n root: PropTypes.object\n }),\n /**\n * The components used for each slot inside.\n *\n * This prop is an alias for the `components` prop, which will be deprecated in the future.\n *\n * @default {}\n */\n slots: PropTypes.shape({\n root: PropTypes.elementType\n }),\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 /**\n * The component used for the transition.\n * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.\n * @default Fade\n */\n TransitionComponent: PropTypes.elementType,\n /**\n * The duration for the transition, in milliseconds.\n * You may specify a single timeout for all transitions, or individually with an object.\n */\n transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({\n appear: PropTypes.number,\n enter: PropTypes.number,\n exit: PropTypes.number\n })])\n} : void 0;\nexport default Backdrop;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"anchorOrigin\", \"className\", \"classes\", \"component\", \"components\", \"componentsProps\", \"children\", \"overlap\", \"color\", \"invisible\", \"max\", \"badgeContent\", \"slots\", \"slotProps\", \"showZero\", \"variant\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { usePreviousProps } from '@mui/utils';\nimport { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';\nimport { useBadge } from '@mui/base/useBadge';\nimport { useSlotProps } from '@mui/base';\nimport styled from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport capitalize from '../utils/capitalize';\nimport badgeClasses, { getBadgeUtilityClass } from './badgeClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst RADIUS_STANDARD = 10;\nconst RADIUS_DOT = 4;\nconst useUtilityClasses = ownerState => {\n const {\n color,\n anchorOrigin,\n invisible,\n overlap,\n variant,\n classes = {}\n } = ownerState;\n const slots = {\n root: ['root'],\n badge: ['badge', variant, invisible && 'invisible', `anchorOrigin${capitalize(anchorOrigin.vertical)}${capitalize(anchorOrigin.horizontal)}`, `anchorOrigin${capitalize(anchorOrigin.vertical)}${capitalize(anchorOrigin.horizontal)}${capitalize(overlap)}`, `overlap${capitalize(overlap)}`, color !== 'default' && `color${capitalize(color)}`]\n };\n return composeClasses(slots, getBadgeUtilityClass, classes);\n};\nconst BadgeRoot = styled('span', {\n name: 'MuiBadge',\n slot: 'Root',\n overridesResolver: (props, styles) => styles.root\n})({\n position: 'relative',\n display: 'inline-flex',\n // For correct alignment with the text.\n verticalAlign: 'middle',\n flexShrink: 0\n});\nconst BadgeBadge = styled('span', {\n name: 'MuiBadge',\n slot: 'Badge',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.badge, styles[ownerState.variant], styles[`anchorOrigin${capitalize(ownerState.anchorOrigin.vertical)}${capitalize(ownerState.anchorOrigin.horizontal)}${capitalize(ownerState.overlap)}`], ownerState.color !== 'default' && styles[`color${capitalize(ownerState.color)}`], ownerState.invisible && styles.invisible];\n }\n})(({\n theme,\n ownerState\n}) => _extends({\n display: 'flex',\n flexDirection: 'row',\n flexWrap: 'wrap',\n justifyContent: 'center',\n alignContent: 'center',\n alignItems: 'center',\n position: 'absolute',\n boxSizing: 'border-box',\n fontFamily: theme.typography.fontFamily,\n fontWeight: theme.typography.fontWeightMedium,\n fontSize: theme.typography.pxToRem(12),\n minWidth: RADIUS_STANDARD * 2,\n lineHeight: 1,\n padding: '0 6px',\n height: RADIUS_STANDARD * 2,\n borderRadius: RADIUS_STANDARD,\n zIndex: 1,\n // Render the badge on top of potential ripples.\n transition: theme.transitions.create('transform', {\n easing: theme.transitions.easing.easeInOut,\n duration: theme.transitions.duration.enteringScreen\n })\n}, ownerState.color !== 'default' && {\n backgroundColor: (theme.vars || theme).palette[ownerState.color].main,\n color: (theme.vars || theme).palette[ownerState.color].contrastText\n}, ownerState.variant === 'dot' && {\n borderRadius: RADIUS_DOT,\n height: RADIUS_DOT * 2,\n minWidth: RADIUS_DOT * 2,\n padding: 0\n}, ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'rectangular' && {\n top: 0,\n right: 0,\n transform: 'scale(1) translate(50%, -50%)',\n transformOrigin: '100% 0%',\n [`&.${badgeClasses.invisible}`]: {\n transform: 'scale(0) translate(50%, -50%)'\n }\n}, ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'rectangular' && {\n bottom: 0,\n right: 0,\n transform: 'scale(1) translate(50%, 50%)',\n transformOrigin: '100% 100%',\n [`&.${badgeClasses.invisible}`]: {\n transform: 'scale(0) translate(50%, 50%)'\n }\n}, ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'rectangular' && {\n top: 0,\n left: 0,\n transform: 'scale(1) translate(-50%, -50%)',\n transformOrigin: '0% 0%',\n [`&.${badgeClasses.invisible}`]: {\n transform: 'scale(0) translate(-50%, -50%)'\n }\n}, ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'rectangular' && {\n bottom: 0,\n left: 0,\n transform: 'scale(1) translate(-50%, 50%)',\n transformOrigin: '0% 100%',\n [`&.${badgeClasses.invisible}`]: {\n transform: 'scale(0) translate(-50%, 50%)'\n }\n}, ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'circular' && {\n top: '14%',\n right: '14%',\n transform: 'scale(1) translate(50%, -50%)',\n transformOrigin: '100% 0%',\n [`&.${badgeClasses.invisible}`]: {\n transform: 'scale(0) translate(50%, -50%)'\n }\n}, ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'circular' && {\n bottom: '14%',\n right: '14%',\n transform: 'scale(1) translate(50%, 50%)',\n transformOrigin: '100% 100%',\n [`&.${badgeClasses.invisible}`]: {\n transform: 'scale(0) translate(50%, 50%)'\n }\n}, ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'circular' && {\n top: '14%',\n left: '14%',\n transform: 'scale(1) translate(-50%, -50%)',\n transformOrigin: '0% 0%',\n [`&.${badgeClasses.invisible}`]: {\n transform: 'scale(0) translate(-50%, -50%)'\n }\n}, ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'circular' && {\n bottom: '14%',\n left: '14%',\n transform: 'scale(1) translate(-50%, 50%)',\n transformOrigin: '0% 100%',\n [`&.${badgeClasses.invisible}`]: {\n transform: 'scale(0) translate(-50%, 50%)'\n }\n}, ownerState.invisible && {\n transition: theme.transitions.create('transform', {\n easing: theme.transitions.easing.easeInOut,\n duration: theme.transitions.duration.leavingScreen\n })\n}));\nconst Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {\n var _ref, _slots$root, _ref2, _slots$badge, _slotProps$root, _slotProps$badge;\n const props = useThemeProps({\n props: inProps,\n name: 'MuiBadge'\n });\n const {\n anchorOrigin: anchorOriginProp = {\n vertical: 'top',\n horizontal: 'right'\n },\n className,\n component,\n components = {},\n componentsProps = {},\n children,\n overlap: overlapProp = 'rectangular',\n color: colorProp = 'default',\n invisible: invisibleProp = false,\n max: maxProp = 99,\n badgeContent: badgeContentProp,\n slots,\n slotProps,\n showZero = false,\n variant: variantProp = 'standard'\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const {\n badgeContent,\n invisible: invisibleFromHook,\n max,\n displayValue: displayValueFromHook\n } = useBadge({\n max: maxProp,\n invisible: invisibleProp,\n badgeContent: badgeContentProp,\n showZero\n });\n const prevProps = usePreviousProps({\n anchorOrigin: anchorOriginProp,\n color: colorProp,\n overlap: overlapProp,\n variant: variantProp,\n badgeContent: badgeContentProp\n });\n const invisible = invisibleFromHook || badgeContent == null && variantProp !== 'dot';\n const {\n color = colorProp,\n overlap = overlapProp,\n anchorOrigin = anchorOriginProp,\n variant = variantProp\n } = invisible ? prevProps : props;\n const displayValue = variant !== 'dot' ? displayValueFromHook : undefined;\n const ownerState = _extends({}, props, {\n badgeContent,\n invisible,\n max,\n displayValue,\n showZero,\n anchorOrigin,\n color,\n overlap,\n variant\n });\n const classes = useUtilityClasses(ownerState);\n\n // support both `slots` and `components` for backward compatibility\n const RootSlot = (_ref = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components.Root) != null ? _ref : BadgeRoot;\n const BadgeSlot = (_ref2 = (_slots$badge = slots == null ? void 0 : slots.badge) != null ? _slots$badge : components.Badge) != null ? _ref2 : BadgeBadge;\n const rootSlotProps = (_slotProps$root = slotProps == null ? void 0 : slotProps.root) != null ? _slotProps$root : componentsProps.root;\n const badgeSlotProps = (_slotProps$badge = slotProps == null ? void 0 : slotProps.badge) != null ? _slotProps$badge : componentsProps.badge;\n const rootProps = useSlotProps({\n elementType: RootSlot,\n externalSlotProps: rootSlotProps,\n externalForwardedProps: other,\n additionalProps: {\n ref,\n as: component\n },\n ownerState,\n className: clsx(rootSlotProps == null ? void 0 : rootSlotProps.className, classes.root, className)\n });\n const badgeProps = useSlotProps({\n elementType: BadgeSlot,\n externalSlotProps: badgeSlotProps,\n ownerState,\n className: clsx(classes.badge, badgeSlotProps == null ? void 0 : badgeSlotProps.className)\n });\n return /*#__PURE__*/_jsxs(RootSlot, _extends({}, rootProps, {\n children: [children, /*#__PURE__*/_jsx(BadgeSlot, _extends({}, badgeProps, {\n children: displayValue\n }))]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Badge.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 \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * The anchor of the badge.\n * @default {\n * vertical: 'top',\n * horizontal: 'right',\n * }\n */\n anchorOrigin: PropTypes.shape({\n horizontal: PropTypes.oneOf(['left', 'right']).isRequired,\n vertical: PropTypes.oneOf(['bottom', 'top']).isRequired\n }),\n /**\n * The content rendered within the badge.\n */\n badgeContent: PropTypes.node,\n /**\n * The badge will be added relative to this node.\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.\n * It supports both default and custom theme colors, which can be added as shown in the\n * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).\n * @default 'default'\n */\n color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),\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 * The components used for each slot inside.\n *\n * This prop is an alias for the `slots` prop.\n * It's recommended to use the `slots` prop instead.\n *\n * @default {}\n */\n components: PropTypes.shape({\n Badge: PropTypes.elementType,\n Root: PropTypes.elementType\n }),\n /**\n * The extra props for the slot components.\n * You can override the existing props or add new ones.\n *\n * This prop is an alias for the `slotProps` prop.\n * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.\n *\n * @default {}\n */\n componentsProps: PropTypes.shape({\n badge: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),\n root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])\n }),\n /**\n * If `true`, the badge is invisible.\n * @default false\n */\n invisible: PropTypes.bool,\n /**\n * Max count to show.\n * @default 99\n */\n max: PropTypes.number,\n /**\n * Wrapped shape the badge should overlap.\n * @default 'rectangular'\n */\n overlap: PropTypes.oneOf(['circular', 'rectangular']),\n /**\n * Controls whether the badge is hidden when `badgeContent` is zero.\n * @default false\n */\n showZero: PropTypes.bool,\n /**\n * The props used for each slot inside the Badge.\n * @default {}\n */\n slotProps: PropTypes.shape({\n badge: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),\n root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])\n }),\n /**\n * The components used for each slot inside the Badge.\n * Either a string to use a HTML element or a component.\n * @default {}\n */\n slots: PropTypes.shape({\n badge: PropTypes.elementType,\n root: PropTypes.elementType\n }),\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 /**\n * The variant to use.\n * @default 'standard'\n */\n variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['dot', 'standard']), PropTypes.string])\n} : void 0;\nexport default Badge;","'use client';\n\nimport { usePreviousProps } from '@mui/utils';\n/**\n *\n * Demos:\n *\n * - [Badge](https://mui.com/base-ui/react-badge/#hook)\n *\n * API:\n *\n * - [useBadge API](https://mui.com/base-ui/react-badge/hooks-api/#use-badge)\n */\nexport function useBadge(parameters) {\n const {\n badgeContent: badgeContentProp,\n invisible: invisibleProp = false,\n max: maxProp = 99,\n showZero = false\n } = parameters;\n const prevProps = usePreviousProps({\n badgeContent: badgeContentProp,\n max: maxProp\n });\n let invisible = invisibleProp;\n if (invisibleProp === false && badgeContentProp === 0 && !showZero) {\n invisible = true;\n }\n const {\n badgeContent,\n max = maxProp\n } = invisible ? prevProps : parameters;\n const displayValue = badgeContent && Number(badgeContent) > max ? `${max}+` : badgeContent;\n return {\n badgeContent,\n invisible,\n max,\n displayValue\n };\n}","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getBadgeUtilityClass(slot) {\n return generateUtilityClass('MuiBadge', slot);\n}\nconst badgeClasses = generateUtilityClasses('MuiBadge', ['root', 'badge', 'dot', 'standard', 'anchorOriginTopRight', 'anchorOriginBottomRight', 'anchorOriginTopLeft', 'anchorOriginBottomLeft', 'invisible', 'colorError', 'colorInfo', 'colorPrimary', 'colorSecondary', 'colorSuccess', 'colorWarning', 'overlapRectangular', 'overlapCircular',\n// TODO: v6 remove the overlap value from these class keys\n'anchorOriginTopLeftCircular', 'anchorOriginTopLeftRectangular', 'anchorOriginTopRightCircular', 'anchorOriginTopRightRectangular', 'anchorOriginBottomLeftCircular', 'anchorOriginBottomLeftRectangular', 'anchorOriginBottomRightCircular', 'anchorOriginBottomRightRectangular']);\nexport default badgeClasses;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\", \"component\"];\nimport * as React from 'react';\nimport clsx from 'clsx';\nimport styled from '@mui/styled-engine';\nimport styleFunctionSx, { extendSxProp } from './styleFunctionSx';\nimport useTheme from './useTheme';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default function createBox(options = {}) {\n const {\n themeId,\n defaultTheme,\n defaultClassName = 'MuiBox-root',\n generateClassName\n } = options;\n const BoxRoot = styled('div', {\n shouldForwardProp: prop => prop !== 'theme' && prop !== 'sx' && prop !== 'as'\n })(styleFunctionSx);\n const Box = /*#__PURE__*/React.forwardRef(function Box(inProps, ref) {\n const theme = useTheme(defaultTheme);\n const _extendSxProp = extendSxProp(inProps),\n {\n className,\n component = 'div'\n } = _extendSxProp,\n other = _objectWithoutPropertiesLoose(_extendSxProp, _excluded);\n return /*#__PURE__*/_jsx(BoxRoot, _extends({\n as: component,\n ref: ref,\n className: clsx(className, generateClassName ? generateClassName(defaultClassName) : defaultClassName),\n theme: themeId ? theme[themeId] || theme : theme\n }, other));\n });\n return Box;\n}","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nconst boxClasses = generateUtilityClasses('MuiBox', ['root']);\nexport default boxClasses;","'use client';\n\nimport { createBox } from '@mui/system';\nimport PropTypes from 'prop-types';\nimport { unstable_ClassNameGenerator as ClassNameGenerator } from '../className';\nimport { createTheme } from '../styles';\nimport THEME_ID from '../styles/identifier';\nimport boxClasses from './boxClasses';\nconst defaultTheme = createTheme();\nconst Box = createBox({\n themeId: THEME_ID,\n defaultTheme,\n defaultClassName: boxClasses.root,\n generateClassName: ClassNameGenerator.generate\n});\nprocess.env.NODE_ENV !== \"production\" ? Box.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 \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * @ignore\n */\n children: PropTypes.node,\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 * 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 Box;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"children\", \"color\", \"component\", \"className\", \"disabled\", \"disableElevation\", \"disableFocusRipple\", \"endIcon\", \"focusVisibleClassName\", \"fullWidth\", \"size\", \"startIcon\", \"type\", \"variant\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { internal_resolveProps as resolveProps } from '@mui/utils';\nimport { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';\nimport { alpha } from '@mui/system';\nimport styled, { rootShouldForwardProp } from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport ButtonBase from '../ButtonBase';\nimport capitalize from '../utils/capitalize';\nimport buttonClasses, { getButtonUtilityClass } from './buttonClasses';\nimport ButtonGroupContext from '../ButtonGroup/ButtonGroupContext';\nimport ButtonGroupButtonContext from '../ButtonGroup/ButtonGroupButtonContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n color,\n disableElevation,\n fullWidth,\n size,\n variant,\n classes\n } = ownerState;\n const slots = {\n root: ['root', variant, `${variant}${capitalize(color)}`, `size${capitalize(size)}`, `${variant}Size${capitalize(size)}`, color === 'inherit' && 'colorInherit', disableElevation && 'disableElevation', fullWidth && 'fullWidth'],\n label: ['label'],\n startIcon: ['startIcon', `iconSize${capitalize(size)}`],\n endIcon: ['endIcon', `iconSize${capitalize(size)}`]\n };\n const composedClasses = composeClasses(slots, getButtonUtilityClass, classes);\n return _extends({}, classes, composedClasses);\n};\nconst commonIconStyles = ownerState => _extends({}, ownerState.size === 'small' && {\n '& > *:nth-of-type(1)': {\n fontSize: 18\n }\n}, ownerState.size === 'medium' && {\n '& > *:nth-of-type(1)': {\n fontSize: 20\n }\n}, ownerState.size === 'large' && {\n '& > *:nth-of-type(1)': {\n fontSize: 22\n }\n});\nconst ButtonRoot = styled(ButtonBase, {\n shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',\n name: 'MuiButton',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, styles[ownerState.variant], styles[`${ownerState.variant}${capitalize(ownerState.color)}`], styles[`size${capitalize(ownerState.size)}`], styles[`${ownerState.variant}Size${capitalize(ownerState.size)}`], ownerState.color === 'inherit' && styles.colorInherit, ownerState.disableElevation && styles.disableElevation, ownerState.fullWidth && styles.fullWidth];\n }\n})(({\n theme,\n ownerState\n}) => {\n var _theme$palette$getCon, _theme$palette;\n const inheritContainedBackgroundColor = theme.palette.mode === 'light' ? theme.palette.grey[300] : theme.palette.grey[800];\n const inheritContainedHoverBackgroundColor = theme.palette.mode === 'light' ? theme.palette.grey.A100 : theme.palette.grey[700];\n return _extends({}, theme.typography.button, {\n minWidth: 64,\n padding: '6px 16px',\n borderRadius: (theme.vars || theme).shape.borderRadius,\n transition: theme.transitions.create(['background-color', 'box-shadow', 'border-color', 'color'], {\n duration: theme.transitions.duration.short\n }),\n '&:hover': _extends({\n textDecoration: 'none',\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.text.primaryChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.text.primary, theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n }, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n }, ownerState.variant === 'outlined' && ownerState.color !== 'inherit' && {\n border: `1px solid ${(theme.vars || theme).palette[ownerState.color].main}`,\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n }, ownerState.variant === 'contained' && {\n backgroundColor: theme.vars ? theme.vars.palette.Button.inheritContainedHoverBg : inheritContainedHoverBackgroundColor,\n boxShadow: (theme.vars || theme).shadows[4],\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n boxShadow: (theme.vars || theme).shadows[2],\n backgroundColor: (theme.vars || theme).palette.grey[300]\n }\n }, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {\n backgroundColor: (theme.vars || theme).palette[ownerState.color].dark,\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: (theme.vars || theme).palette[ownerState.color].main\n }\n }),\n '&:active': _extends({}, ownerState.variant === 'contained' && {\n boxShadow: (theme.vars || theme).shadows[8]\n }),\n [`&.${buttonClasses.focusVisible}`]: _extends({}, ownerState.variant === 'contained' && {\n boxShadow: (theme.vars || theme).shadows[6]\n }),\n [`&.${buttonClasses.disabled}`]: _extends({\n color: (theme.vars || theme).palette.action.disabled\n }, ownerState.variant === 'outlined' && {\n border: `1px solid ${(theme.vars || theme).palette.action.disabledBackground}`\n }, ownerState.variant === 'contained' && {\n color: (theme.vars || theme).palette.action.disabled,\n boxShadow: (theme.vars || theme).shadows[0],\n backgroundColor: (theme.vars || theme).palette.action.disabledBackground\n })\n }, ownerState.variant === 'text' && {\n padding: '6px 8px'\n }, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {\n color: (theme.vars || theme).palette[ownerState.color].main\n }, ownerState.variant === 'outlined' && {\n padding: '5px 15px',\n border: '1px solid currentColor'\n }, ownerState.variant === 'outlined' && ownerState.color !== 'inherit' && {\n color: (theme.vars || theme).palette[ownerState.color].main,\n border: theme.vars ? `1px solid rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.5)` : `1px solid ${alpha(theme.palette[ownerState.color].main, 0.5)}`\n }, ownerState.variant === 'contained' && {\n color: theme.vars ?\n // this is safe because grey does not change between default light/dark mode\n theme.vars.palette.text.primary : (_theme$palette$getCon = (_theme$palette = theme.palette).getContrastText) == null ? void 0 : _theme$palette$getCon.call(_theme$palette, theme.palette.grey[300]),\n backgroundColor: theme.vars ? theme.vars.palette.Button.inheritContainedBg : inheritContainedBackgroundColor,\n boxShadow: (theme.vars || theme).shadows[2]\n }, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {\n color: (theme.vars || theme).palette[ownerState.color].contrastText,\n backgroundColor: (theme.vars || theme).palette[ownerState.color].main\n }, ownerState.color === 'inherit' && {\n color: 'inherit',\n borderColor: 'currentColor'\n }, ownerState.size === 'small' && ownerState.variant === 'text' && {\n padding: '4px 5px',\n fontSize: theme.typography.pxToRem(13)\n }, ownerState.size === 'large' && ownerState.variant === 'text' && {\n padding: '8px 11px',\n fontSize: theme.typography.pxToRem(15)\n }, ownerState.size === 'small' && ownerState.variant === 'outlined' && {\n padding: '3px 9px',\n fontSize: theme.typography.pxToRem(13)\n }, ownerState.size === 'large' && ownerState.variant === 'outlined' && {\n padding: '7px 21px',\n fontSize: theme.typography.pxToRem(15)\n }, ownerState.size === 'small' && ownerState.variant === 'contained' && {\n padding: '4px 10px',\n fontSize: theme.typography.pxToRem(13)\n }, ownerState.size === 'large' && ownerState.variant === 'contained' && {\n padding: '8px 22px',\n fontSize: theme.typography.pxToRem(15)\n }, ownerState.fullWidth && {\n width: '100%'\n });\n}, ({\n ownerState\n}) => ownerState.disableElevation && {\n boxShadow: 'none',\n '&:hover': {\n boxShadow: 'none'\n },\n [`&.${buttonClasses.focusVisible}`]: {\n boxShadow: 'none'\n },\n '&:active': {\n boxShadow: 'none'\n },\n [`&.${buttonClasses.disabled}`]: {\n boxShadow: 'none'\n }\n});\nconst ButtonStartIcon = styled('span', {\n name: 'MuiButton',\n slot: 'StartIcon',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.startIcon, styles[`iconSize${capitalize(ownerState.size)}`]];\n }\n})(({\n ownerState\n}) => _extends({\n display: 'inherit',\n marginRight: 8,\n marginLeft: -4\n}, ownerState.size === 'small' && {\n marginLeft: -2\n}, commonIconStyles(ownerState)));\nconst ButtonEndIcon = styled('span', {\n name: 'MuiButton',\n slot: 'EndIcon',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.endIcon, styles[`iconSize${capitalize(ownerState.size)}`]];\n }\n})(({\n ownerState\n}) => _extends({\n display: 'inherit',\n marginRight: -4,\n marginLeft: 8\n}, ownerState.size === 'small' && {\n marginRight: -2\n}, commonIconStyles(ownerState)));\nconst Button = /*#__PURE__*/React.forwardRef(function Button(inProps, ref) {\n // props priority: `inProps` > `contextProps` > `themeDefaultProps`\n const contextProps = React.useContext(ButtonGroupContext);\n const buttonGroupButtonContextPositionClassName = React.useContext(ButtonGroupButtonContext);\n const resolvedProps = resolveProps(contextProps, inProps);\n const props = useThemeProps({\n props: resolvedProps,\n name: 'MuiButton'\n });\n const {\n children,\n color = 'primary',\n component = 'button',\n className,\n disabled = false,\n disableElevation = false,\n disableFocusRipple = false,\n endIcon: endIconProp,\n focusVisibleClassName,\n fullWidth = false,\n size = 'medium',\n startIcon: startIconProp,\n type,\n variant = 'text'\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n color,\n component,\n disabled,\n disableElevation,\n disableFocusRipple,\n fullWidth,\n size,\n type,\n variant\n });\n const classes = useUtilityClasses(ownerState);\n const startIcon = startIconProp && /*#__PURE__*/_jsx(ButtonStartIcon, {\n className: classes.startIcon,\n ownerState: ownerState,\n children: startIconProp\n });\n const endIcon = endIconProp && /*#__PURE__*/_jsx(ButtonEndIcon, {\n className: classes.endIcon,\n ownerState: ownerState,\n children: endIconProp\n });\n const positionClassName = buttonGroupButtonContextPositionClassName || '';\n return /*#__PURE__*/_jsxs(ButtonRoot, _extends({\n ownerState: ownerState,\n className: clsx(contextProps.className, classes.root, className, positionClassName),\n component: component,\n disabled: disabled,\n focusRipple: !disableFocusRipple,\n focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName),\n ref: ref,\n type: type\n }, other, {\n classes: classes,\n children: [startIcon, children, endIcon]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Button.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 \"yarn 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.\n * It supports both default and custom theme colors, which can be added as shown in the\n * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).\n * @default 'primary'\n */\n color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'primary', 'secondary', 'success', 'error', 'info', 'warning']), PropTypes.string]),\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 component is disabled.\n * @default false\n */\n disabled: PropTypes.bool,\n /**\n * If `true`, no elevation is used.\n * @default false\n */\n disableElevation: PropTypes.bool,\n /**\n * If `true`, the keyboard focus ripple is disabled.\n * @default false\n */\n disableFocusRipple: PropTypes.bool,\n /**\n * If `true`, the ripple effect is disabled.\n *\n * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure\n * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.\n * @default false\n */\n disableRipple: PropTypes.bool,\n /**\n * Element placed after the children.\n */\n endIcon: PropTypes.node,\n /**\n * @ignore\n */\n focusVisibleClassName: PropTypes.string,\n /**\n * If `true`, the button will take up the full width of its container.\n * @default false\n */\n fullWidth: PropTypes.bool,\n /**\n * The URL to link to when the button is clicked.\n * If defined, an `a` element will be used as the root node.\n */\n href: PropTypes.string,\n /**\n * The size of the component.\n * `small` is equivalent to the dense button styling.\n * @default 'medium'\n */\n size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['small', 'medium', 'large']), PropTypes.string]),\n /**\n * Element placed before the children.\n */\n startIcon: PropTypes.node,\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 /**\n * @ignore\n */\n type: PropTypes.oneOfType([PropTypes.oneOf(['button', 'reset', 'submit']), PropTypes.string]),\n /**\n * The variant to use.\n * @default 'text'\n */\n variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['contained', 'outlined', 'text']), PropTypes.string])\n} : void 0;\nexport default Button;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getButtonUtilityClass(slot) {\n return generateUtilityClass('MuiButton', slot);\n}\nconst buttonClasses = generateUtilityClasses('MuiButton', ['root', 'text', 'textInherit', 'textPrimary', 'textSecondary', 'textSuccess', 'textError', 'textInfo', 'textWarning', 'outlined', 'outlinedInherit', 'outlinedPrimary', 'outlinedSecondary', 'outlinedSuccess', 'outlinedError', 'outlinedInfo', 'outlinedWarning', 'contained', 'containedInherit', 'containedPrimary', 'containedSecondary', 'containedSuccess', 'containedError', 'containedInfo', 'containedWarning', 'disableElevation', 'focusVisible', 'disabled', 'colorInherit', 'textSizeSmall', 'textSizeMedium', 'textSizeLarge', 'outlinedSizeSmall', 'outlinedSizeMedium', 'outlinedSizeLarge', 'containedSizeSmall', 'containedSizeMedium', 'containedSizeLarge', 'sizeMedium', 'sizeSmall', 'sizeLarge', 'fullWidth', 'startIcon', 'endIcon', 'iconSizeSmall', 'iconSizeMedium', 'iconSizeLarge']);\nexport default buttonClasses;","'use client';\n\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\n\n/**\n * @ignore - internal component.\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction Ripple(props) {\n const {\n className,\n classes,\n pulsate = false,\n rippleX,\n rippleY,\n rippleSize,\n in: inProp,\n onExited,\n timeout\n } = props;\n const [leaving, setLeaving] = React.useState(false);\n const rippleClassName = clsx(className, classes.ripple, classes.rippleVisible, pulsate && classes.ripplePulsate);\n const rippleStyles = {\n width: rippleSize,\n height: rippleSize,\n top: -(rippleSize / 2) + rippleY,\n left: -(rippleSize / 2) + rippleX\n };\n const childClassName = clsx(classes.child, leaving && classes.childLeaving, pulsate && classes.childPulsate);\n if (!inProp && !leaving) {\n setLeaving(true);\n }\n React.useEffect(() => {\n if (!inProp && onExited != null) {\n // react-transition-group#onExited\n const timeoutId = setTimeout(onExited, timeout);\n return () => {\n clearTimeout(timeoutId);\n };\n }\n return undefined;\n }, [onExited, inProp, timeout]);\n return /*#__PURE__*/_jsx(\"span\", {\n className: rippleClassName,\n style: rippleStyles,\n children: /*#__PURE__*/_jsx(\"span\", {\n className: childClassName\n })\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? Ripple.propTypes = {\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object.isRequired,\n className: PropTypes.string,\n /**\n * @ignore - injected from TransitionGroup\n */\n in: PropTypes.bool,\n /**\n * @ignore - injected from TransitionGroup\n */\n onExited: PropTypes.func,\n /**\n * If `true`, the ripple pulsates, typically indicating the keyboard focus state of an element.\n */\n pulsate: PropTypes.bool,\n /**\n * Diameter of the ripple.\n */\n rippleSize: PropTypes.number,\n /**\n * Horizontal position of the ripple center.\n */\n rippleX: PropTypes.number,\n /**\n * Vertical position of the ripple center.\n */\n rippleY: PropTypes.number,\n /**\n * exit delay\n */\n timeout: PropTypes.number.isRequired\n} : void 0;\nexport default Ripple;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getTouchRippleUtilityClass(slot) {\n return generateUtilityClass('MuiTouchRipple', slot);\n}\nconst touchRippleClasses = generateUtilityClasses('MuiTouchRipple', ['root', 'ripple', 'rippleVisible', 'ripplePulsate', 'child', 'childLeaving', 'childPulsate']);\nexport default touchRippleClasses;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"center\", \"classes\", \"className\"];\nlet _ = t => t,\n _t,\n _t2,\n _t3,\n _t4;\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { TransitionGroup } from 'react-transition-group';\nimport clsx from 'clsx';\nimport { keyframes } from '@mui/system';\nimport styled from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport Ripple from './Ripple';\nimport touchRippleClasses from './touchRippleClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst DURATION = 550;\nexport const DELAY_RIPPLE = 80;\nconst enterKeyframe = keyframes(_t || (_t = _`\n 0% {\n transform: scale(0);\n opacity: 0.1;\n }\n\n 100% {\n transform: scale(1);\n opacity: 0.3;\n }\n`));\nconst exitKeyframe = keyframes(_t2 || (_t2 = _`\n 0% {\n opacity: 1;\n }\n\n 100% {\n opacity: 0;\n }\n`));\nconst pulsateKeyframe = keyframes(_t3 || (_t3 = _`\n 0% {\n transform: scale(1);\n }\n\n 50% {\n transform: scale(0.92);\n }\n\n 100% {\n transform: scale(1);\n }\n`));\nexport const TouchRippleRoot = styled('span', {\n name: 'MuiTouchRipple',\n slot: 'Root'\n})({\n overflow: 'hidden',\n pointerEvents: 'none',\n position: 'absolute',\n zIndex: 0,\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n borderRadius: 'inherit'\n});\n\n// This `styled()` function invokes keyframes. `styled-components` only supports keyframes\n// in string templates. Do not convert these styles in JS object as it will break.\nexport const TouchRippleRipple = styled(Ripple, {\n name: 'MuiTouchRipple',\n slot: 'Ripple'\n})(_t4 || (_t4 = _`\n opacity: 0;\n position: absolute;\n\n &.${0} {\n opacity: 0.3;\n transform: scale(1);\n animation-name: ${0};\n animation-duration: ${0}ms;\n animation-timing-function: ${0};\n }\n\n &.${0} {\n animation-duration: ${0}ms;\n }\n\n & .${0} {\n opacity: 1;\n display: block;\n width: 100%;\n height: 100%;\n border-radius: 50%;\n background-color: currentColor;\n }\n\n & .${0} {\n opacity: 0;\n animation-name: ${0};\n animation-duration: ${0}ms;\n animation-timing-function: ${0};\n }\n\n & .${0} {\n position: absolute;\n /* @noflip */\n left: 0px;\n top: 0;\n animation-name: ${0};\n animation-duration: 2500ms;\n animation-timing-function: ${0};\n animation-iteration-count: infinite;\n animation-delay: 200ms;\n }\n`), touchRippleClasses.rippleVisible, enterKeyframe, DURATION, ({\n theme\n}) => theme.transitions.easing.easeInOut, touchRippleClasses.ripplePulsate, ({\n theme\n}) => theme.transitions.duration.shorter, touchRippleClasses.child, touchRippleClasses.childLeaving, exitKeyframe, DURATION, ({\n theme\n}) => theme.transitions.easing.easeInOut, touchRippleClasses.childPulsate, pulsateKeyframe, ({\n theme\n}) => theme.transitions.easing.easeInOut);\n\n/**\n * @ignore - internal component.\n *\n * TODO v5: Make private\n */\nconst TouchRipple = /*#__PURE__*/React.forwardRef(function TouchRipple(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiTouchRipple'\n });\n const {\n center: centerProp = false,\n classes = {},\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const [ripples, setRipples] = React.useState([]);\n const nextKey = React.useRef(0);\n const rippleCallback = React.useRef(null);\n React.useEffect(() => {\n if (rippleCallback.current) {\n rippleCallback.current();\n rippleCallback.current = null;\n }\n }, [ripples]);\n\n // Used to filter out mouse emulated events on mobile.\n const ignoringMouseDown = React.useRef(false);\n // We use a timer in order to only show the ripples for touch \"click\" like events.\n // We don't want to display the ripple for touch scroll events.\n const startTimer = React.useRef(0);\n\n // This is the hook called once the previous timeout is ready.\n const startTimerCommit = React.useRef(null);\n const container = React.useRef(null);\n React.useEffect(() => {\n return () => {\n if (startTimer.current) {\n clearTimeout(startTimer.current);\n }\n };\n }, []);\n const startCommit = React.useCallback(params => {\n const {\n pulsate,\n rippleX,\n rippleY,\n rippleSize,\n cb\n } = params;\n setRipples(oldRipples => [...oldRipples, /*#__PURE__*/_jsx(TouchRippleRipple, {\n classes: {\n ripple: clsx(classes.ripple, touchRippleClasses.ripple),\n rippleVisible: clsx(classes.rippleVisible, touchRippleClasses.rippleVisible),\n ripplePulsate: clsx(classes.ripplePulsate, touchRippleClasses.ripplePulsate),\n child: clsx(classes.child, touchRippleClasses.child),\n childLeaving: clsx(classes.childLeaving, touchRippleClasses.childLeaving),\n childPulsate: clsx(classes.childPulsate, touchRippleClasses.childPulsate)\n },\n timeout: DURATION,\n pulsate: pulsate,\n rippleX: rippleX,\n rippleY: rippleY,\n rippleSize: rippleSize\n }, nextKey.current)]);\n nextKey.current += 1;\n rippleCallback.current = cb;\n }, [classes]);\n const start = React.useCallback((event = {}, options = {}, cb = () => {}) => {\n const {\n pulsate = false,\n center = centerProp || options.pulsate,\n fakeElement = false // For test purposes\n } = options;\n if ((event == null ? void 0 : event.type) === 'mousedown' && ignoringMouseDown.current) {\n ignoringMouseDown.current = false;\n return;\n }\n if ((event == null ? void 0 : event.type) === 'touchstart') {\n ignoringMouseDown.current = true;\n }\n const element = fakeElement ? null : container.current;\n const rect = element ? element.getBoundingClientRect() : {\n width: 0,\n height: 0,\n left: 0,\n top: 0\n };\n\n // Get the size of the ripple\n let rippleX;\n let rippleY;\n let rippleSize;\n if (center || event === undefined || event.clientX === 0 && event.clientY === 0 || !event.clientX && !event.touches) {\n rippleX = Math.round(rect.width / 2);\n rippleY = Math.round(rect.height / 2);\n } else {\n const {\n clientX,\n clientY\n } = event.touches && event.touches.length > 0 ? event.touches[0] : event;\n rippleX = Math.round(clientX - rect.left);\n rippleY = Math.round(clientY - rect.top);\n }\n if (center) {\n rippleSize = Math.sqrt((2 * rect.width ** 2 + rect.height ** 2) / 3);\n\n // For some reason the animation is broken on Mobile Chrome if the size is even.\n if (rippleSize % 2 === 0) {\n rippleSize += 1;\n }\n } else {\n const sizeX = Math.max(Math.abs((element ? element.clientWidth : 0) - rippleX), rippleX) * 2 + 2;\n const sizeY = Math.max(Math.abs((element ? element.clientHeight : 0) - rippleY), rippleY) * 2 + 2;\n rippleSize = Math.sqrt(sizeX ** 2 + sizeY ** 2);\n }\n\n // Touche devices\n if (event != null && event.touches) {\n // check that this isn't another touchstart due to multitouch\n // otherwise we will only clear a single timer when unmounting while two\n // are running\n if (startTimerCommit.current === null) {\n // Prepare the ripple effect.\n startTimerCommit.current = () => {\n startCommit({\n pulsate,\n rippleX,\n rippleY,\n rippleSize,\n cb\n });\n };\n // Delay the execution of the ripple effect.\n startTimer.current = setTimeout(() => {\n if (startTimerCommit.current) {\n startTimerCommit.current();\n startTimerCommit.current = null;\n }\n }, DELAY_RIPPLE); // We have to make a tradeoff with this value.\n }\n } else {\n startCommit({\n pulsate,\n rippleX,\n rippleY,\n rippleSize,\n cb\n });\n }\n }, [centerProp, startCommit]);\n const pulsate = React.useCallback(() => {\n start({}, {\n pulsate: true\n });\n }, [start]);\n const stop = React.useCallback((event, cb) => {\n clearTimeout(startTimer.current);\n\n // The touch interaction occurs too quickly.\n // We still want to show ripple effect.\n if ((event == null ? void 0 : event.type) === 'touchend' && startTimerCommit.current) {\n startTimerCommit.current();\n startTimerCommit.current = null;\n startTimer.current = setTimeout(() => {\n stop(event, cb);\n });\n return;\n }\n startTimerCommit.current = null;\n setRipples(oldRipples => {\n if (oldRipples.length > 0) {\n return oldRipples.slice(1);\n }\n return oldRipples;\n });\n rippleCallback.current = cb;\n }, []);\n React.useImperativeHandle(ref, () => ({\n pulsate,\n start,\n stop\n }), [pulsate, start, stop]);\n return /*#__PURE__*/_jsx(TouchRippleRoot, _extends({\n className: clsx(touchRippleClasses.root, classes.root, className),\n ref: container\n }, other, {\n children: /*#__PURE__*/_jsx(TransitionGroup, {\n component: null,\n exit: true,\n children: ripples\n })\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? TouchRipple.propTypes = {\n /**\n * If `true`, the ripple starts at the center of the component\n * rather than at the point of interaction.\n */\n center: PropTypes.bool,\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string\n} : void 0;\nexport default TouchRipple;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getButtonBaseUtilityClass(slot) {\n return generateUtilityClass('MuiButtonBase', slot);\n}\nconst buttonBaseClasses = generateUtilityClasses('MuiButtonBase', ['root', 'disabled', 'focusVisible']);\nexport default buttonBaseClasses;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"action\", \"centerRipple\", \"children\", \"className\", \"component\", \"disabled\", \"disableRipple\", \"disableTouchRipple\", \"focusRipple\", \"focusVisibleClassName\", \"LinkComponent\", \"onBlur\", \"onClick\", \"onContextMenu\", \"onDragLeave\", \"onFocus\", \"onFocusVisible\", \"onKeyDown\", \"onKeyUp\", \"onMouseDown\", \"onMouseLeave\", \"onMouseUp\", \"onTouchEnd\", \"onTouchMove\", \"onTouchStart\", \"tabIndex\", \"TouchRippleProps\", \"touchRippleRef\", \"type\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { elementTypeAcceptingRef, refType } from '@mui/utils';\nimport { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';\nimport styled from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport useForkRef from '../utils/useForkRef';\nimport useEventCallback from '../utils/useEventCallback';\nimport useIsFocusVisible from '../utils/useIsFocusVisible';\nimport TouchRipple from './TouchRipple';\nimport buttonBaseClasses, { getButtonBaseUtilityClass } from './buttonBaseClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n disabled,\n focusVisible,\n focusVisibleClassName,\n classes\n } = ownerState;\n const slots = {\n root: ['root', disabled && 'disabled', focusVisible && 'focusVisible']\n };\n const composedClasses = composeClasses(slots, getButtonBaseUtilityClass, classes);\n if (focusVisible && focusVisibleClassName) {\n composedClasses.root += ` ${focusVisibleClassName}`;\n }\n return composedClasses;\n};\nexport const ButtonBaseRoot = styled('button', {\n name: 'MuiButtonBase',\n slot: 'Root',\n overridesResolver: (props, styles) => styles.root\n})({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n boxSizing: 'border-box',\n WebkitTapHighlightColor: 'transparent',\n backgroundColor: 'transparent',\n // Reset default value\n // We disable the focus ring for mouse, touch and keyboard users.\n outline: 0,\n border: 0,\n margin: 0,\n // Remove the margin in Safari\n borderRadius: 0,\n padding: 0,\n // Remove the padding in Firefox\n cursor: 'pointer',\n userSelect: 'none',\n verticalAlign: 'middle',\n MozAppearance: 'none',\n // Reset\n WebkitAppearance: 'none',\n // Reset\n textDecoration: 'none',\n // So we take precedent over the style of a native element.\n color: 'inherit',\n '&::-moz-focus-inner': {\n borderStyle: 'none' // Remove Firefox dotted outline.\n },\n\n [`&.${buttonBaseClasses.disabled}`]: {\n pointerEvents: 'none',\n // Disable link interactions\n cursor: 'default'\n },\n '@media print': {\n colorAdjust: 'exact'\n }\n});\n\n/**\n * `ButtonBase` contains as few styles as possible.\n * It aims to be a simple building block for creating a button.\n * It contains a load of style reset and some focus/ripple logic.\n */\nconst ButtonBase = /*#__PURE__*/React.forwardRef(function ButtonBase(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiButtonBase'\n });\n const {\n action,\n centerRipple = false,\n children,\n className,\n component = 'button',\n disabled = false,\n disableRipple = false,\n disableTouchRipple = false,\n focusRipple = false,\n LinkComponent = 'a',\n onBlur,\n onClick,\n onContextMenu,\n onDragLeave,\n onFocus,\n onFocusVisible,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onMouseLeave,\n onMouseUp,\n onTouchEnd,\n onTouchMove,\n onTouchStart,\n tabIndex = 0,\n TouchRippleProps,\n touchRippleRef,\n type\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const buttonRef = React.useRef(null);\n const rippleRef = React.useRef(null);\n const handleRippleRef = useForkRef(rippleRef, touchRippleRef);\n const {\n isFocusVisibleRef,\n onFocus: handleFocusVisible,\n onBlur: handleBlurVisible,\n ref: focusVisibleRef\n } = useIsFocusVisible();\n const [focusVisible, setFocusVisible] = React.useState(false);\n if (disabled && focusVisible) {\n setFocusVisible(false);\n }\n React.useImperativeHandle(action, () => ({\n focusVisible: () => {\n setFocusVisible(true);\n buttonRef.current.focus();\n }\n }), []);\n const [mountedState, setMountedState] = React.useState(false);\n React.useEffect(() => {\n setMountedState(true);\n }, []);\n const enableTouchRipple = mountedState && !disableRipple && !disabled;\n React.useEffect(() => {\n if (focusVisible && focusRipple && !disableRipple && mountedState) {\n rippleRef.current.pulsate();\n }\n }, [disableRipple, focusRipple, focusVisible, mountedState]);\n function useRippleHandler(rippleAction, eventCallback, skipRippleAction = disableTouchRipple) {\n return useEventCallback(event => {\n if (eventCallback) {\n eventCallback(event);\n }\n const ignore = skipRippleAction;\n if (!ignore && rippleRef.current) {\n rippleRef.current[rippleAction](event);\n }\n return true;\n });\n }\n const handleMouseDown = useRippleHandler('start', onMouseDown);\n const handleContextMenu = useRippleHandler('stop', onContextMenu);\n const handleDragLeave = useRippleHandler('stop', onDragLeave);\n const handleMouseUp = useRippleHandler('stop', onMouseUp);\n const handleMouseLeave = useRippleHandler('stop', event => {\n if (focusVisible) {\n event.preventDefault();\n }\n if (onMouseLeave) {\n onMouseLeave(event);\n }\n });\n const handleTouchStart = useRippleHandler('start', onTouchStart);\n const handleTouchEnd = useRippleHandler('stop', onTouchEnd);\n const handleTouchMove = useRippleHandler('stop', onTouchMove);\n const handleBlur = useRippleHandler('stop', event => {\n handleBlurVisible(event);\n if (isFocusVisibleRef.current === false) {\n setFocusVisible(false);\n }\n if (onBlur) {\n onBlur(event);\n }\n }, false);\n const handleFocus = useEventCallback(event => {\n // Fix for https://github.com/facebook/react/issues/7769\n if (!buttonRef.current) {\n buttonRef.current = event.currentTarget;\n }\n handleFocusVisible(event);\n if (isFocusVisibleRef.current === true) {\n setFocusVisible(true);\n if (onFocusVisible) {\n onFocusVisible(event);\n }\n }\n if (onFocus) {\n onFocus(event);\n }\n });\n const isNonNativeButton = () => {\n const button = buttonRef.current;\n return component && component !== 'button' && !(button.tagName === 'A' && button.href);\n };\n\n /**\n * IE11 shim for https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/repeat\n */\n const keydownRef = React.useRef(false);\n const handleKeyDown = useEventCallback(event => {\n // Check if key is already down to avoid repeats being counted as multiple activations\n if (focusRipple && !keydownRef.current && focusVisible && rippleRef.current && event.key === ' ') {\n keydownRef.current = true;\n rippleRef.current.stop(event, () => {\n rippleRef.current.start(event);\n });\n }\n if (event.target === event.currentTarget && isNonNativeButton() && event.key === ' ') {\n event.preventDefault();\n }\n if (onKeyDown) {\n onKeyDown(event);\n }\n\n // Keyboard accessibility for non interactive elements\n if (event.target === event.currentTarget && isNonNativeButton() && event.key === 'Enter' && !disabled) {\n event.preventDefault();\n if (onClick) {\n onClick(event);\n }\n }\n });\n const handleKeyUp = useEventCallback(event => {\n // calling preventDefault in keyUp on a