\n {children}\n \n);\n\nexport default TextBlock;\n","import styled from 'styled-components';\nimport tw from 'twin.macro';\n\nimport _TextBlock from '@taboola/venus-core/src/components/text-block/text-block';\n\nconst TextBlock = styled(_TextBlock)`\n &.alt-editors-note > p {\n ${tw`text-xs opacity-75 mt-0`}\n }\n`;\n\nexport default TextBlock;\n","import React from 'react';\n\nimport TextBlock from '../../text-block/text-block';\nimport * as textBlocks from './context';\nimport isEmpty from '../../../utils/node/is-empty';\n\nconst TextBlockShortcode = ({ slug, ...rest }) => {\n const Block = textBlocks?.[slug];\n\n if (!Block || isEmpty(Block()?.props?.children)) {\n return null;\n }\n\n // TODO: Find a way to print informative error message when text block is not found and fail the build\n return (\n \n \n \n );\n};\n\nexport default TextBlockShortcode;\n","import { useState, useEffect, useContext } from 'react';\n\nimport { PreviewContext } from '../../../cms/preview-templates/preview-context';\nimport { VariableResolver } from './variable-resolver';\n\nconst parseString = (str) =>\n VariableResolver.isVariableFormat(str)\n ? VariableResolver.parseText(str)\n : str;\n\nconst parseInput = (input) => {\n if (!input) {\n return input;\n }\n\n if (typeof input === 'string') {\n return parseString(input);\n } else if (typeof input === 'object') {\n const parsedProps = {};\n for (const key in input) {\n if (Object.hasOwnProperty.call(input, key)) {\n parsedProps[key] = parseString(input[key]);\n }\n }\n return parsedProps;\n } else {\n return input;\n }\n};\n\nexport const useParsedText = (input) => {\n const isPreview = useContext(PreviewContext);\n const [parsedInput, setParsedInput] = useState(parseInput(input));\n const useEffectDeps = isPreview ? [JSON.stringify(input)] : [];\n\n useEffect(() => {\n const resolveInput = async () => {\n try {\n await VariableResolver.populateApiData();\n setParsedInput(parseInput(input));\n } catch (e) {\n setParsedInput(input);\n console.error(e);\n }\n };\n\n resolveInput();\n }, useEffectDeps);\n\n return parsedInput;\n};\n","import React, { useEffect, useContext } from 'react';\nimport kebabCase from 'lodash/kebabCase';\nimport { useStaticQuery, graphql } from 'gatsby';\nimport { Skeleton } from '@mui/material';\n\nimport 'twin.macro';\n\nimport { withPreviewPlaceholder } from '../../../cms/utils/with-preview-placeholder';\nimport { getFeed } from '../../../utils/third-parties/taboola-feed';\nimport { TaboolaFeedPageType } from '../../../model';\nimport { ArticleDataContext } from '../../../templates/article-template/article-data-context';\n\nconst query = graphql`\n query NoTaboolaFeedArticlesQuery {\n mdx(fields: { slug: { eq: \"no-taboola-feed-articles\" } }) {\n frontmatter {\n entities {\n article {\n childMdx {\n slug\n }\n }\n }\n }\n }\n }\n`;\n\nconst Container = ({\n className,\n mode,\n placement,\n pageType = TaboolaFeedPageType.ARTICLE,\n}) => {\n const excludeList = useStaticQuery(query)?.mdx?.frontmatter?.entities?.map(\n ({ article }) => article?.childMdx?.slug\n );\n const slug = useContext(ArticleDataContext)?.slug;\n\n if (excludeList?.includes(slug)) {\n return null;\n }\n\n const containerId = placement ? kebabCase(placement) : `taboola-below-${pageType}-thumbnails-feed`;\n\n useEffect(() => {\n getFeed({\n mode,\n containerId,\n pageType,\n placement,\n });\n }, []);\n\n return (\n \n );\n};\n\nconst Placeholder = () => (\n \n);\n\nexport default withPreviewPlaceholder(Container, Placeholder);\n","type Dates = {\n createdAt: Date;\n updatedAt: Date;\n publishedAt: Date;\n};\n\ntype Entity = {\n slug: string;\n} & Dates;\n\ntype BaseImage = {\n // TODO: replace with type from gatsby\n imageFile: object;\n};\n\ntype Image = {\n altText: string;\n title: string;\n} & BaseImage;\n\ntype SEO = {\n noindex: boolean;\n nofollow: boolean;\n title: string;\n description: string;\n canonicalSlug: string;\n datePublished: Date;\n dateModified: Date;\n} & BaseImage;\n\ntype Page = {\n body: string;\n aside: AsideBlock[];\n excerpt: string;\n timeToRead: number;\n seo: SEO;\n} & Entity;\n\nexport type CuratedList = {\n name: string;\n entities: (ICategory | IArticle | CuratedList | ITextBlock)[];\n} & Entity;\n\nexport type ITextBlock = {\n name: string;\n body: string;\n} & Entity;\n\nexport type IAuthor = {\n name: string;\n socialLinks: string[];\n image: Image;\n articles: IArticle[];\n description: string;\n} & Page;\n\nexport type ICategory = {\n name: string;\n parentCategory: ICategory;\n childCategories: ICategory[];\n articles: IArticle[];\n} & Page;\n\nexport type IGeneralPage = {\n title: string;\n} & Page;\n\nexport type ILandingPage = {\n title: string;\n} & Page;\n\nexport type IArticle = {\n title: string;\n description: string;\n categories: ICategory[];\n author: IAuthor;\n tags: string[];\n related: RelatedArticleData[];\n hero: string;\n content: string;\n image: Image;\n // TODO:\n // variants\n} & Page;\n\nexport type RelatedArticleData = {\n id: string;\n title: string;\n slug: string;\n author: {\n name: string;\n };\n};\n\nexport type IAffiliateLink = {\n shortcode: string;\n href: string;\n tooltip: string;\n nofollow: boolean;\n newwindow: boolean;\n};\n\nexport type AsideBlock = {\n type: AsideBlockType;\n entity: ITextBlock | CuratedList | string;\n items: AsideBlock[];\n};\n\nexport enum AsideBlockType {\n TextBlock = 'TextBlock',\n CuratedList = 'CuratedList',\n AsidePlaceholder = 'AsidePlaceholder',\n}\n\nexport type QuinStreetListing = {\n accountId: string;\n clickurl: string;\n company: string;\n cpc: string;\n displayname: string;\n imp_pixel: string;\n logo: string;\n rank: string;\n title: string;\n};\n\nexport enum QuinStreetGoal {\n CLICKS = 'clicks',\n LEADS = 'leads',\n}\n\nexport enum QuinStreetProducts {\n AUTO = 'auto',\n CREDIT_CARDS = 'credit-cards',\n BANKING = 'banking',\n HOME = 'home',\n}\n\nexport enum QuinStreetBankingProducts {\n SAVINGS = 'savings',\n CHECKING = 'checking',\n CD = 'cd',\n MMA = 'mma',\n INVESTING = 'investing',\n BANKING = 'banking',\n}\n\nexport type ToggleOption = {\n value: string;\n label: string;\n};\n\nexport enum TaboolaFeedPageType {\n ARTICLE = 'article',\n HOME = 'home',\n CATEGORY = 'category',\n VIDEO = 'video',\n}\n\nexport enum VideoAspectRatio {\n '1:1' = '1:1',\n '2:1' = '2:1',\n '3:2' = '3:2',\n '4:3' = '4:3',\n '16:9' = '16:9',\n '21:9' = '21:9',\n}\n\nexport enum MediaAlphaProducts {\n AUTO = 'auto',\n}\n\nexport enum MediaAlphaUiTypes {\n AD_UNIT = 'ad_unit',\n FORM = 'form',\n}\n\nexport enum EvenFinancialProducts {\n LOANS = 'loan',\n SAVINGS = 'savings',\n ALR = 'alr',\n}\n\nexport enum SmartAssetProducts {\n INVESTMENT = 'investment',\n MORTGAGE = 'mortgage',\n CONTENT = 'content-block',\n RETIREMENT = 'retirement-calculator'\n}\n\nexport enum Sizes {\n SMALL = 'small',\n MEDIUM = 'medium',\n LARGE = 'large',\n}\n\nexport enum QuinStreetUi {\n WHITE_LABEL = 'whitelabel',\n LIGHTBOX = 'lightbox',\n ZIP = 'zip',\n}\n\nexport const QuinStreetBankingRps = {\n [QuinStreetBankingProducts.CD]: 3,\n [QuinStreetBankingProducts.MMA]: 5,\n [QuinStreetBankingProducts.SAVINGS]: 7,\n [QuinStreetBankingProducts.INVESTING]: 16,\n [QuinStreetBankingProducts.BANKING]: 17,\n [QuinStreetBankingProducts.CHECKING]: 18,\n};\n\nexport type PropsWithClassName = P & { className?: string | undefined };\n","import React, { createContext, PropsWithChildren } from 'react';\nimport { GraphqlProduct } from '../../components/shortcodes/product-card/libs/models';\n\nexport type ArticleDataContextProps = {\n products?: GraphqlProduct[];\n};\n\nexport type ArticleDataContextProviderProps = PropsWithChildren<{\n value: ArticleDataContextProps;\n}>;\n\nexport const ArticleDataContext = createContext({});\n\nexport const ArticleDataContextProvider = ({\n value,\n children,\n}: ArticleDataContextProviderProps) => (\n \n {children}\n \n);\n","import { useContext } from 'react';\nimport styled from 'styled-components';\nimport tw from 'twin.macro';\n\nimport { IAuthor, ICategory } from '../../model';\nimport { useParsedText } from '../../components/shortcodes/variable-resolver/use-parsed-text';\nimport { flattenAsideItems } from '../../utils/model/aside';\nimport { getSrc } from '../../components/image';\nimport { resolveUrl } from '../../utils/node/url';\nimport { ArticleDataContext } from './article-data-context';\n\nconst getArticleHero = (article) => article?.hero?.childMdx?.slug;\n\nconst getArticleImage = (article) => {\n const imageFile = article?.image?.imageFile;\n const gatsbyImageData = imageFile?.childImageSharp?.gatsbyImageData || imageFile?.childImageSharp?.image;\n\n return gatsbyImageData ?? imageFile;\n};\n\nconst getArticleCategory = (article) => article?.categories?.[0];\n\nconst getTopArticleCategory = (article) => {\n const category = getArticleCategory(article);\n\n return category?.parentCategory || category;\n};\n\nconst getArticleCategoryNamesList = (article, separator = ', ') => {\n if (!article || !article?.categories) {\n return [];\n }\n\n return article.categories\n ?.reduce((acc, curr) => [...acc, curr?.name], [])\n ?.join(separator);\n};\n\nconst getArticleAuthor = (article) => article?.authors?.[0] || article?.author;\n\nconst getArticleUrls = (article, siteMetadata) => {\n const imgSharp = getArticleImage(article);\n\n return {\n pageUrl: resolveUrl(`/article/${article.slug}`, true),\n // getSrc function handles the pathPrefix on its own\n imageUrl: imgSharp && resolveUrl(getSrc(imgSharp), true, true),\n siteImageUrl: resolveUrl(siteMetadata?.image, true),\n };\n};\n\nconst flattenAuthors = (authors) =>\n authors?.map((author) => {\n const authorSlug = author?.childMdx?.slug;\n const authorBody = author?.childMdx?.body;\n const authorFrontmatter = author?.childMdx?.frontmatter;\n\n return {\n slug: authorSlug,\n body: authorBody,\n ...authorFrontmatter,\n };\n });\n\nconst flattenCategories = (categories) => categories?.map((category) => {\n const categorySlug = category?.childMdx?.slug;\n const categoryFrontmatter = category?.childMdx?.frontmatter;\n const parentCategorySlug = categoryFrontmatter?.parentCategory?.childMdx?.slug;\n const parentCategoryFrontmatter = categoryFrontmatter?.parentCategory?.childMdx?.frontmatter;\n const parentCategory = parentCategorySlug && {\n parentCategory: {\n slug: parentCategorySlug,\n ...parentCategoryFrontmatter,\n },\n };\n\n return {\n slug: categorySlug,\n ...categoryFrontmatter,\n ...parentCategory,\n };\n});\n\nconst flattenArticles = (articles) =>\n articles?.map((article) => {\n const slug = article?.slug;\n const tableOfContents = article?.childContent?.childMdx?.tableOfContents || article?.tableOfContents;\n const timeToRead = article?.timeToRead;\n const frontmatter = article?.frontmatter;\n const createdAt = article?.fields?.datePublished;\n const updatedAt = article?.fields?.dateModified;\n const title = useParsedText(frontmatter?.title);\n const authors: [IAuthor] = flattenAuthors(frontmatter?.authors);\n const author: IAuthor = authors?.[0];\n const editors: [IAuthor] = flattenAuthors(frontmatter?.editors);\n const categories: [ICategory] = flattenCategories(frontmatter?.categories);\n const aside = flattenAsideItems(frontmatter?.aside);\n\n return {\n slug,\n tableOfContents,\n timeToRead,\n ...frontmatter,\n createdAt,\n updatedAt,\n title,\n author,\n authors,\n editors,\n categories,\n aside,\n };\n });\n\nconst ArticleSeparator = styled.hr(({ $category, $isFirst }) => [\n tw`border-t-2 my-16`,\n $category === 'Car Insurance' && tw`border-car`,\n $category === 'Home Insurance' && tw`border-home`,\n $category === 'Health Insurance' && tw`border-health`,\n $category === 'Life Insurance' && tw`border-life`,\n $category === 'Other Insurance' && tw`border-other`,\n $isFirst && tw`md:hidden`,\n]);\n\nconst getCardIndexFromArticleContext = () => {\n const articleContext = useContext(ArticleDataContext);\n let productCardId = 0;\n try {\n productCardId = ++articleContext.renderedItems.productCards;\n } catch (e) {\n // Do nothing\n }\n\n return productCardId;\n};\n\nconst flattenInlineImages = (images) =>\n // TODO: graphql resolver\n images?.map(({ imageFile }) => {\n const relativePath = imageFile?.relativePath;\n const path = relativePath && `../images/${relativePath}`;\n const gatsbyImages = imageFile?.childImageSharp;\n\n return {\n path,\n gatsbyImages,\n };\n });\n\nexport {\n ArticleSeparator,\n getArticleImage,\n getArticleUrls,\n getArticleCategory,\n getTopArticleCategory,\n getArticleCategoryNamesList,\n getArticleAuthor,\n flattenArticles,\n flattenCategories,\n flattenAuthors,\n flattenInlineImages,\n getArticleHero,\n getCardIndexFromArticleContext,\n};\n","import isTruthy from './node/isTruthy';\nimport isNotNil from './node/is-not-nil';\nimport nullOrNumber from './node/null-or-number';\n\nexport {\n isNotNil,\n nullOrNumber,\n isTruthy,\n};\n\n// legacy\nexport default isNotNil;\n","import flattenDeep from 'lodash/flattenDeep';\nimport { AsideBlockType } from '../../model';\n\nexport const flattenAsideItems = (items) => {\n if (!items) {\n return null;\n }\n\n return flattenDeep(items.map((item) => {\n if (item.curatedList) {\n return flattenAsideItems(item.curatedList?.childMdx?.frontmatter?.entities);\n }\n if (item.textBlock) {\n return {\n type: AsideBlockType.TextBlock,\n slug: item?.textBlock?.childMdx?.slug,\n }\n }\n\n return null;\n }));\n}","import startCase from 'lodash/startCase';\n\nimport { siteMetadata } from '../../config/siteMetadata';\nimport { TaboolaFeedPageType } from '../../model';\n\nconst pathPrefix = siteMetadata?.pathPrefix;\nconst ACCOUNT_NAME = siteMetadata?.taboola?.feed;\n\nexport const SCRIPT_URL =\n ACCOUNT_NAME && `https://cdn.taboola.com/libtrc/${ACCOUNT_NAME}/loader.js`;\n\nconst getPageType = (pagePath) => {\n let pageType = TaboolaFeedPageType.ARTICLE;\n\n if (`${pathPrefix || ''}/` === pagePath) {\n pageType = TaboolaFeedPageType.HOME;\n }\n\n if (pagePath.includes('/category/') || pagePath.includes('/author/')) {\n pageType = TaboolaFeedPageType.CATEGORY;\n }\n\n return pageType;\n};\n\nconst getFeedManager = () => {\n window._taboola = window?._taboola || [];\n return window._taboola;\n};\n\nexport const initFeed = () => {\n getFeedManager();\n window?.performance?.mark('tbl_ic');\n};\n\nexport const getFeed = ({ mode, containerId, placement, pageType }) => {\n const feedManager = getFeedManager();\n\n feedManager.push({\n mode: mode || 'thumbnails-feed-a',\n container: containerId,\n placement: placement || `Below ${startCase(pageType)} Thumbnails Feed`,\n target_type: 'mix',\n });\n\n feedManager.push({\n flush: true,\n });\n};\n\nexport const notifyRouteChange = (location, isInitialLoad) => {\n const feedManager = getFeedManager();\n const pageType = getPageType(location?.pathname);\n\n if (!isInitialLoad) {\n feedManager.push({\n notify: 'newPageLoad',\n });\n }\n\n feedManager.push({\n [pageType]: 'auto',\n url: location?.href,\n });\n};\n","import { siteMetadata } from '../../config/siteMetadata';\n\nconst ACCOUNT_ID = siteMetadata?.facebook?.adsAccountId;\n\nconst EVENTS = {\n PAGE_VIEW: 'page_view',\n PARTNER_CLICK: 'vns_partner_click',\n INTERACTION: 'vns_funnel_interaction',\n TRANSITION: 'vns_funnel_transition',\n READ_MORE: 'read_more_click',\n};\n\nconst INIT_SCRIPT_CONTENT = ACCOUNT_ID && `\n !function(f,b,e,v,n,t,s)\n {if(f.fbq)return;n=f.fbq=function(){n.callMethod?\n n.callMethod.apply(n,arguments):n.queue.push(arguments)};\n if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';\n n.queue=[];}(window, document);\n fbq('init', '${ACCOUNT_ID}');\n fbq('track', 'PageView'); \n`;\n\nconst SCRIPT_URL = ACCOUNT_ID && 'https://connect.facebook.net/en_US/fbevents.js';\n\nconst sendEvent = ({ name, ...rest }) => {\n window.fbq && window.fbq('trackCustom', name, rest);\n}\n\nexport {\n EVENTS,\n SCRIPT_URL,\n INIT_SCRIPT_CONTENT,\n sendEvent,\n};","import { siteMetadata } from '../../config/siteMetadata';\nimport { sendEvent as taboolaPixelSendEvent, EVENTS } from './taboola-pixel';\n\nconst ECOMM_ACCOUNT_ID = siteMetadata?.taboola?.ecommPixel;\n\nconst GENERIC_EVENT_NAME = 'LEAD';\n\nconst NOTIFY_TYPE = 'ecevent';\n\nconst ALLOWED_EVENTS = [EVENTS.TRANSITION, EVENTS.PARTNER_CLICK];\n\nconst UNKNOWN_PRODUCT = 'UNKNOWN';\n\nexport const sendEvent = ({ name, funnel, target_url }) =>\n ECOMM_ACCOUNT_ID &&\n ALLOWED_EVENTS.includes(name) &&\n taboolaPixelSendEvent({\n id: ECOMM_ACCOUNT_ID,\n notify: NOTIFY_TYPE,\n name: GENERIC_EVENT_NAME,\n productIds: [funnel || UNKNOWN_PRODUCT],\n additionalInfo: {\n targetUrl: target_url,\n },\n });\n","import pick from 'lodash/pick';\n\nimport { resolveUrl } from '../node/url';\nimport isEmpty from '../node/is-empty';\nimport isNil from '../node/is-empty';\nimport * as GOOGLE from './google';\nimport * as TABOOLA_PIXEL from './taboola-pixel';\nimport * as TABOOLA_ECOMM_PIXEL from './taboola-ecomm-pixel';\nimport * as FACEBOOK from './facebook';\n\nconst EVENTS = {\n ...FACEBOOK.EVENTS,\n ...GOOGLE.EVENTS,\n ...TABOOLA_PIXEL.EVENTS,\n};\n\nconst TRACKING_PROVIDERS = [GOOGLE, TABOOLA_PIXEL, TABOOLA_ECOMM_PIXEL, FACEBOOK];\n\n// custom methods\nconst trackExperiments = (data) => {\n const experimentsData = isEmpty(data) ? [] : data.map((varData) => pick(varData, ['layer', 'variant']));\n const exp = isEmpty(data) ? '' : data.map(({ variant, externalExperimentId, externalIndex }) => {\n const variantIndex = variant === 'DEFAULT' ? '0' : externalIndex;\n\n if (!isEmpty(externalExperimentId) && !isNil(variantIndex)) {\n return externalExperimentId.map((expId) => `${expId}.${variantIndex}`).join('!');\n }\n\n return null;\n }).filter(Boolean).join('!');\n\n TABOOLA_PIXEL.updateGlobalParams({ experimentsData });\n GOOGLE.updateDataLayer({ exp });\n};\n\nconst trackAdBlockers = ({ isBlocked }) => {\n if (isBlocked) {\n GOOGLE.updateDataLayer({ event: 'ad-block-detected' });\n fetch(resolveUrl('/blocked.gif'));\n } else {\n fetch(resolveUrl('/not-blocked.gif'));\n }\n};\n\nconst trackPageView = () => {\n TABOOLA_PIXEL.sendPageView();\n GOOGLE.sendPageView();\n};\n\n// general events tracking\nconst trackEvent = (data) => TRACKING_PROVIDERS.forEach(({ sendEvent }) => sendEvent(data));\n\nconst trackPartnerClick = (data) => trackEvent({ ...data, name: EVENTS.PARTNER_CLICK });\n\nconst trackInteraction = (data) => trackEvent({ ...data, name: EVENTS.INTERACTION });\n\nconst trackTransition = (data) => trackEvent({ ...data, name: EVENTS.TRANSITION });\n\nconst trackReadMoreClick = (data) => trackEvent({ ...data, name: EVENTS.READ_MORE });\n\nconst trackVisibility = (data) => GOOGLE.sendVisibility(data);\n\nconst trackError = (data) => GOOGLE.sendError(data);\n\n// This is es5 syntax on purpose. DO NOT CHANGE.\nconst updatePageMetadata = function (data) {\n window.Venus = window.Venus || {};\n window.Venus.pageMetadata = data;\n};\n\nconst updatePageMetadataSsr = (data) => `(${updatePageMetadata.toString()})(${JSON.stringify(data)})`;\n\nexport {\n EVENTS,\n trackPartnerClick,\n trackExperiments,\n trackInteraction,\n trackTransition,\n trackPageView,\n trackReadMoreClick,\n trackAdBlockers,\n updatePageMetadata,\n updatePageMetadataSsr,\n trackVisibility,\n trackError,\n};\n","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getCardUtilityClass(slot) {\n return generateUtilityClass('MuiCard', slot);\n}\nconst cardClasses = generateUtilityClasses('MuiCard', ['root']);\nexport default cardClasses;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\", \"raised\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport chainPropTypes from '@mui/utils/chainPropTypes';\nimport composeClasses from '@mui/utils/composeClasses';\nimport styled from '../styles/styled';\nimport { useDefaultProps } from '../DefaultPropsProvider';\nimport Paper from '../Paper';\nimport { getCardUtilityClass } from './cardClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['root']\n };\n return composeClasses(slots, getCardUtilityClass, classes);\n};\nconst CardRoot = styled(Paper, {\n name: 'MuiCard',\n slot: 'Root',\n overridesResolver: (props, styles) => styles.root\n})(() => {\n return {\n overflow: 'hidden'\n };\n});\nconst Card = /*#__PURE__*/React.forwardRef(function Card(inProps, ref) {\n const props = useDefaultProps({\n props: inProps,\n name: 'MuiCard'\n });\n const {\n className,\n raised = false\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n raised\n });\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(CardRoot, _extends({\n className: clsx(classes.root, className),\n elevation: raised ? 8 : undefined,\n ref: ref,\n ownerState: ownerState\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? Card.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * If `true`, the card will use raised styling.\n * @default false\n */\n raised: chainPropTypes(PropTypes.bool, props => {\n if (props.raised && props.variant === 'outlined') {\n return new Error('MUI: Combining `raised={true}` with `variant=\"outlined\"` has no effect.');\n }\n return null;\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} : void 0;\nexport default Card;","import React from 'react';\nimport classnames from 'classnames';\nimport _Card from '@mui/material/Card';\nimport styled from 'styled-components';\nimport tw from 'twin.macro';\n\nimport { Link as _Link } from '@taboola/venus-core/src/components/link';\nimport _Image from '@taboola/venus-core/src/components/image';\nimport { getArticleImage } from '@taboola/venus-core/src/templates/article-template/article-utils';\n\nimport { displayArticleDate } from '../../../../utils/article';\n\nconst Card = styled(_Card)`\n ${tw`rounded-none shadow-none bg-transparent lg:(mt-0)`}\n`;\n\nconst Image = styled(_Image)`\n ${({ variant }) => [\n variant === 'horizontal' && tw`w-[86px] h-[86px] md:(w-[250px] h-[165px])`,\n variant === 'vertical' && tw`w-full`,\n ]}\n`;\n\nconst Link = styled(_Link)`\n ${tw`text-black border-none`}\n`;\n\nconst CardContent = styled.div`\n ${({ variant }) => variant === 'horizontal' && tw`flex border-b-[1px] border-[#ddd] pt-4`}\n`;\n\nconst Metadata = styled.div`\n ${tw`flex flex-wrap mt-0 text-[0.875rem]`}\n\n ${({ variant }) => [\n variant === 'horizontal' && tw`font-roboto font-bold text-[12px]`,\n variant === 'vertical' && tw`font-primary uppercase`,\n ]}\n \n span.article-date {\n ${({ variant }) => variant === 'horizontal' && tw`text-red-300`}\n }\n\n span.time-to-read {\n ${({ variant }) => variant === 'horizontal' && tw`hidden`}\n }\n`;\n\nconst Details = styled.div`\n ${tw`flex flex-col font-roboto`}\n\n ${({ variant }) => variant === 'horizontal' && tw`justify-between pb-5`}\n \n h2, h3 {\n ${tw`text-[1.25rem] leading-6 font-heading normal-case mb-2 mt-0 md:(mt-2 text-[1.25rem]) hover:text-red-100`}\n\n ${({ variant }) => [\n variant === 'horizontal' && tw`font-bold`,\n variant === 'vertical' && tw`font-medium mt-2`,\n ]}\n }\n\n h3.description {\n ${tw`hidden sm:(block) font-medium font-secondary text-[16px] leading-5 text-[#4d4d4d] hover:(text-[#4d4d4d]) flex-1`}\n }\n`;\n\nconst ArticleCard = (props) => {\n const {\n article,\n className,\n showImage = true,\n showDescription = true,\n showAuthor = false,\n linkToAuthor = false,\n showDate = true,\n onClick,\n variant = 'vertical',\n queryString,\n } = props;\n const { author, slug, description, title, seo } = article;\n const imageData = getArticleImage(article);\n const alt = article?.image?.alt;\n const imageTitle = article?.image?.title;\n const fallbackImageData = seo?.imageFile?.childImageSharp?.gatsbyImageData || seo?.imageFile;\n const resolvedImageData = imageData || fallbackImageData;\n const articleLink = `/article/${slug}${queryString || ''}`;\n\n return (\n \n \n {showImage && (\n \n \n \n )}\n \n \n {variant === 'vertical' && {title}
}\n {variant === 'horizontal' && {title}
}\n \n {showDescription && {description}
}\n \n {showAuthor && (\n \n By {author.name}\n \n )}\n {showDate && showAuthor && • }\n \n {showDate && displayArticleDate(article)} \n \n \n \n \n \n );\n};\n\nexport default ArticleCard;\n","import React from 'react';\nimport classnames from 'classnames';\nimport styled from 'styled-components';\nimport tw from 'twin.macro';\n\nimport ArticleCard from './article-card';\n\ninterface Props {\n className?: string;\n cardKeyPrefix: string;\n articles: any;\n header: string;\n headerElement?: 'h1' | 'h2';\n variant?: string;\n cardVariant?: string;\n}\n\nconst Container = styled.div(({ variant }) => [\n tw`flex flex-wrap md:flex-nowrap space-y-10`,\n variant === 'horizontal' ? tw`md:(space-x-10 space-y-0)` : tw`flex-col`,\n]);\n\nconst Grid = ({\n className,\n cardKeyPrefix,\n articles,\n header,\n headerElement: HeaderElement = 'h1',\n variant = 'vertical',\n cardVariant,\n ...rest\n}: Props) => (\n \n {header &&
{header}}\n
\n {articles.map((article) => (\n \n ))}\n \n
\n {children}\n
\n);\n\nexport const StyledMDXdWrapper = ({ children, before, after, ...rest }) => (\n \n {before && before}\n {children}\n {after && after}\n \n);\n","import { useMemo } from 'react';\nimport { isNotEmpty } from '../../utils/collections';\nimport { useParsedText } from '../shortcodes/variable-resolver/use-parsed-text';\n\nconst flattenCategories = (entities = []) =>\n entities\n ?.filter(({ category }) => isNotEmpty(category))\n ?.map(({ category, title }) => ({\n slug: category?.childMdx?.slug,\n name: title || category?.childMdx?.frontmatter?.name,\n }));\n\nconst flattenArticles = (entities = []) =>\n entities\n ?.filter(({ article }) => isNotEmpty(article))\n ?.map(({ article, title }) => ({\n slug: article?.childMdx?.slug,\n timeToRead: article?.childMdx?.timeToRead,\n ...article?.childMdx?.frontmatter,\n author: article?.childMdx?.frontmatter?.authors?.[0]?.childMdx?.frontmatter,\n title: title || article?.childMdx?.frontmatter?.title,\n }));\n\nexport const useCategories = (data) =>\n useMemo(\n () =>\n flattenCategories(data?.mdx?.frontmatter?.entities).map((category) => ({\n ...category,\n name: category.name.replace(' Insurance', ''),\n })),\n [data],\n );\n\nexport const useLists = (data) => {\n const memoizedData = useMemo(\n () =>\n data?.mdx?.frontmatter?.entities\n ?.filter(({curatedList}) => isNotEmpty(curatedList))\n ?.map(({curatedList}) => {\n const categories = flattenCategories(curatedList?.childMdx?.frontmatter?.entities);\n const articles = flattenArticles(curatedList?.childMdx?.frontmatter?.entities);\n return {\n key: curatedList?.childMdx?.slug,\n title: curatedList?.childMdx?.frontmatter?.title,\n categories,\n articles,\n };\n }),\n [data],\n );\n\n return memoizedData?.map((list) => ({\n ...list,\n articles: list.articles.map((article) => ({\n ...article,\n title: useParsedText(article.title),\n })),\n }));\n}","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/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 composeClasses from '@mui/utils/composeClasses';\nimport styled from '../styles/styled';\nimport { useDefaultProps } from '../DefaultPropsProvider';\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 }, !['inherit', 'transparent'].includes(ownerState.color) && {\n backgroundColor: 'var(--AppBar-background)'\n }, {\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 = useDefaultProps({\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 `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * The color of the component.\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 React from 'react';\n\nimport { siteMetadata } from '@taboola/venus-core/src/config/siteMetadata';\nimport { resolveUrl } from '@taboola/venus-core/src/utils/node/url';\n\nconst Logo = ({ alt, title, ...rest }) => (\n \n);\n\nexport default Logo;\n","import startCase from 'lodash/startCase';\nimport kebabCase from 'lodash/kebabCase';\n\nimport { siteMetadata } from '@taboola/venus-core/src/config/siteMetadata';\nimport isEmpty from '@taboola/venus-core/src/utils/node/is-empty';\n\nexport const convertInternalToExternal = ({ categories, listsByCategory }) => {\n if (isEmpty(categories) || isEmpty(listsByCategory)) {\n return {};\n }\n\n return {\n text: startCase(siteMetadata?.pathPrefix?.slice(1)),\n href: '/',\n isInternal: true,\n children: categories?.map(({ name, slug }) => ({\n text: name,\n href: slug && `/category/${slug}`,\n isInternal: true,\n children: listsByCategory\n ?.find(([category]) => slug === category)?.[1]\n ?.map(({ title, articles }) => ({\n text: title,\n isInternal: true,\n children: articles?.map(({ slug, title }) => ({\n text: title,\n href: slug && `/article/${slug}`,\n isInternal: true,\n })),\n })),\n })),\n };\n};\n\nexport const generateSectionId = (parentId, sectionName) => {\n const sectionIdSuf = kebabCase(sectionName);\n\n return !parentId || parentId === kebabCase(sectionName) ? sectionIdSuf : `${parentId}-${sectionIdSuf}`;\n};\n","import React from 'react';\nimport classnames from 'classnames';\nimport 'twin.macro';\n\nconst SectionBase = ({ className, children }) => (\n \n);\n\nexport default SectionBase;\n","import React from 'react';\nimport { BsChevronRight } from '@react-icons/all-files/bs/BsChevronRight';\nimport { BsChevronLeft } from '@react-icons/all-files/bs/BsChevronLeft';\nimport IconButton from '@mui/material/IconButton';\nimport 'twin.macro';\n\nconst Button = ({ right, onClick, name }) => (\n \n {right ? (\n \n ) : (\n \n )}\n \n);\n\nexport default Button;\n","import React from 'react';\nimport classnames from 'classnames';\n\nimport { Link } from '@taboola/venus-core/src/components/link';\n\nimport Button from './button';\n\nconst ListItem = ({\n className,\n text,\n href,\n isInternal,\n hasButton,\n onButtonClick,\n onLinkClick,\n}) => (\n \n {href ? (\n isInternal ? (\n \n {text}\n \n ) : (\n \n {text}\n \n )\n ) : (\n {text}\n )}\n {hasButton && }\n \n);\n\nexport default ListItem;\n","import React from 'react';\nimport styled from 'styled-components';\nimport tw from 'twin.macro';\n\nimport { Link as _Link } from '@taboola/venus-core/src/components/link';\n\nimport Button from './button';\n\nconst Link = styled(_Link)`\n ${tw`hover:text-red-200`}\n`;\n\nconst Label = ({\n className,\n text,\n href,\n hasButton,\n onLinkClick,\n onButtonClick,\n}) => (\n \n {hasButton && }\n \n
\n);\n\nexport default Label;\n","import React from 'react';\nimport styled from 'styled-components';\nimport tw from 'twin.macro';\n\nimport { isNotEmpty } from '@taboola/venus-core/src/utils/collections';\nimport { useParsedText } from '@taboola/venus-core/src/components/shortcodes/variable-resolver/use-parsed-text';\n\nimport { generateSectionId } from '../../utils/header';\nimport _SectionBase from './section-base';\nimport ListItem from './list-item';\nimport Label from './label';\n\nconst SectionBase = styled(_SectionBase)`\n transform: translate3d(-100vw, 0, 0);\n transition: transform 0.2s ease-in-out;\n\n ${({ $isVisible }) => $isVisible && 'transform: translateZ(0);'}\n ${({ $isVisible }) => !$isVisible && tw`absolute top-20 z-0`}\n`;\n\nconst Section = ({\n id,\n text,\n href,\n children,\n onLinkClick,\n onMenuNavigation,\n hasButton,\n activeSectionId,\n parentSectionId,\n}) => {\n const parents = children?.filter(({ children }) => isNotEmpty(children));\n\n return (\n <>\n \n onMenuNavigation(parentSectionId)}\n />\n \n {children?.map(\n ({ text: cText, href: cHref, children: cChildren, isInternal }) => {\n const cId = generateSectionId(id, cText);\n\n return (\n onMenuNavigation(cId)}\n onLinkClick={onLinkClick}\n />\n );\n }\n )}\n
\n \n {parents?.map(({ text: pText, href: pHref, children: pChildren }) => {\n const pId = generateSectionId(id, pText);\n\n return (\n \n );\n })}\n \n );\n};\n\nexport default Section;\n","import React, { useEffect, useState } from 'react';\n\nimport { generateSectionId } from '../../utils/header';\nimport Section from './section';\n\nconst SectionManager = ({ text, href, children, isMenuOpen, onClose }) => {\n const [id] = useState(generateSectionId('', text));\n const [activeSectionId, setActiveSectionId] = useState(id);\n\n useEffect(() => {\n if (!isMenuOpen) {\n setActiveSectionId(id);\n }\n }, [isMenuOpen]);\n\n return (\n \n );\n};\n\nexport default SectionManager;\n","import React from 'react';\nimport 'twin.macro';\n\nimport { siteMetadata } from '@taboola/venus-core/src/config/siteMetadata';\nimport { resolveUrl } from '@taboola/venus-core/src/utils/node/url';\nimport { withPreviewPlaceholder } from '@taboola/venus-core/src/cms/utils/with-preview-placeholder';\nimport ExternalLink from '@taboola/venus-core/src/components/external-link/external-link';\n\nconst PLATFORMS = ['facebook', 'instagram', 'twitter', 'pinterest'];\n\nconst SocialLinks = ({ className }) => (\n \n {PLATFORMS.map((platform) => (\n
\n \n \n ))}\n \n \n \n \n \n \n \n {newsLetterURL && }\n
\n);\n\nexport default Content;\n","import React, { useState } from 'react';\nimport classnames from 'classnames';\nimport { Helmet } from 'react-helmet-async';\nimport AppBar from '@mui/material/AppBar';\nimport 'twin.macro';\n\nimport { siteMetadata } from '@taboola/venus-core/src/config/siteMetadata';\nimport { withPreviewPlaceholder } from '@taboola/venus-core/src/cms/utils/with-preview-placeholder';\n\nimport Menu from '../../navigation-menu/navigation-menu';\nimport Content from './content';\n\nconst title = siteMetadata?.title;\n\nconst HelmetWithPlaceholder = withPreviewPlaceholder(Helmet, null);\n\nconst Header = ({ navigationLinks }) => {\n const [isOpen, setIsOpen] = useState(false);\n const toggleIsOpen = () => setIsOpen(!isOpen);\n const closeDrawer = () => setIsOpen(false);\n\n return (\n <>\n \n \n \n \n \n \n );\n};\n\nexport default Header;\n","import React from 'react';\nimport 'twin.macro';\n\nimport { Link } from '../link';\n\nconst MenuItem = ({ className, children, slug, onClick, ...rest }) => (\n \n \n {children}\n \n
\n);\n\nexport default MenuItem;\n","var _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nvar SvgDownArrow = function SvgDownArrow(props) {\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n xmlns: \"http://www.w3.org/2000/svg\",\n viewBox: \"0 0 8.897 5.504\"\n }, props), _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#0d0d0d\",\n stroke: \"#000\",\n strokeWidth: 0.5,\n d: \"M8.531.35a.273.273 0 0 0-.417 0L4.451 4.467.779.35a.273.273 0 0 0-.417 0 .36.36 0 0 0 0 .467L4.233 5.16a.27.27 0 0 0 .208.1.28.28 0 0 0 .208-.1L8.52.817A.35.35 0 0 0 8.531.35z\"\n })));\n};\nexport default SvgDownArrow;","import React from 'react';\nimport styled from 'styled-components';\nimport tw from 'twin.macro';\n\nimport _MenuItem from '@taboola/venus-core/src/components/navigation-menu/menu-item';\nimport DownArrow from '@taboola/venus-core/static/down-arrow.svg';\n\nconst Bar = styled.div`\n ${tw`\n hidden xl:(flex)\n w-full\n text-center overflow-auto whitespace-nowrap\n pb-0\n space-x-8\n `}\n`;\n\nconst AnimatedDownArrow = styled(DownArrow)`\n ${tw`\n w-2.5 h-2.5\n transform transition-all\n `}\n\n ${({ $isActive }) => $isActive && tw`rotate-180`}\n`;\n\nconst MenuItem = styled(_MenuItem)`\n ${tw`\n font-primary text-base uppercase\n flex-shrink-0\n my-0 space-x-1\n `}\n\n ${({ $isActive }) => !$isActive && tw`opacity-50`}\n`;\n\nconst MenuBar = ({\n categories,\n setOpen,\n setClose,\n setActiveKey,\n activeKey,\n}) => {\n const hoverHandler = (slug) => () => {\n setActiveKey(slug);\n setOpen();\n };\n\n return (\n \n {categories.map(({ name, slug }) => (\n \n {name}\n \n \n ))}\n \n );\n};\n\nexport default MenuBar;\n","import { useState, useEffect } from 'react';\n\nconst VARIANTS = {\n PERSISTENT: 'persistent',\n TEMPORARY: 'temporary',\n};\n\nconst useDrawerCustomSSR = () => {\n const [variant, setVariant] = useState(VARIANTS.PERSISTENT);\n\n useEffect(() => {\n setVariant(VARIANTS.TEMPORARY);\n }, []);\n\n return variant;\n};\n\nexport default useDrawerCustomSSR;\n","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"value\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst RtlContext = /*#__PURE__*/React.createContext();\nfunction RtlProvider(_ref) {\n let {\n value\n } = _ref,\n props = _objectWithoutPropertiesLoose(_ref, _excluded);\n return /*#__PURE__*/_jsx(RtlContext.Provider, _extends({\n value: value != null ? value : true\n }, props));\n}\nprocess.env.NODE_ENV !== \"production\" ? RtlProvider.propTypes = {\n children: PropTypes.node,\n value: PropTypes.bool\n} : void 0;\nexport const useRtl = () => {\n const value = React.useContext(RtlContext);\n return value != null ? value : false;\n};\nexport default RtlProvider;","import * as React from 'react';\n\n/**\n * Returns the ref of a React element handling differences between React 19 and older versions.\n * It will throw runtime error if the element is not a valid React element.\n *\n * @param element React.ReactElement\n * @returns React.Ref | null\n */\nexport default function getReactElementRef(element) {\n // 'ref' is passed as prop in React 19, whereas 'ref' is directly attached to children in older versions\n if (parseInt(React.version, 10) >= 19) {\n var _element$props;\n return (element == null || (_element$props = element.props) == null ? void 0 : _element$props.ref) || null;\n }\n // @ts-expect-error element.ref is not included in the ReactElement type\n // https://github.com/DefinitelyTyped/DefinitelyTyped/discussions/70189\n return (element == null ? void 0 : element.ref) || null;\n}","'use client';\n\n/* eslint-disable consistent-return, jsx-a11y/no-noninteractive-tabindex */\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { exactProp, elementAcceptingRef, unstable_useForkRef as useForkRef, unstable_ownerDocument as ownerDocument, unstable_getReactElementRef as getReactElementRef } from '@mui/utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\n// Inspired by https://github.com/focus-trap/tabbable\nconst candidatesSelector = ['input', 'select', 'textarea', 'a[href]', 'button', '[tabindex]', 'audio[controls]', 'video[controls]', '[contenteditable]:not([contenteditable=\"false\"])'].join(',');\nfunction getTabIndex(node) {\n const tabindexAttr = parseInt(node.getAttribute('tabindex') || '', 10);\n if (!Number.isNaN(tabindexAttr)) {\n return tabindexAttr;\n }\n\n // Browsers do not return `tabIndex` correctly for contentEditable nodes;\n // https://bugs.chromium.org/p/chromium/issues/detail?id=661108&q=contenteditable%20tabindex&can=2\n // so if they don't have a tabindex attribute specifically set, assume it's 0.\n // in Chrome, \n * I'm a fade Transition!\n *
\n * )}\n * \n * );\n * ```\n *\n * There are 4 main states a Transition can be in:\n * - `'entering'`\n * - `'entered'`\n * - `'exiting'`\n * - `'exited'`\n *\n * Transition state is toggled via the `in` prop. When `true` the component\n * begins the \"Enter\" stage. During this stage, the component will shift from\n * its current transition state, to `'entering'` for the duration of the\n * transition and then to the `'entered'` stage once it's complete. Let's take\n * the following example (we'll use the\n * [useState](https://reactjs.org/docs/hooks-reference.html#usestate) hook):\n *\n * ```jsx\n * function App() {\n * const [inProp, setInProp] = useState(false);\n * return (\n * \n * \n * {state => (\n * // ...\n * )}\n * \n * \n *
\n * );\n * }\n * ```\n *\n * When the button is clicked the component will shift to the `'entering'` state\n * and stay there for 500ms (the value of `timeout`) before it finally switches\n * to `'entered'`.\n *\n * When `in` is `false` the same thing happens except the state moves from\n * `'exiting'` to `'exited'`.\n */\n\nvar Transition = /*#__PURE__*/function (_React$Component) {\n _inheritsLoose(Transition, _React$Component);\n\n function Transition(props, context) {\n var _this;\n\n _this = _React$Component.call(this, props, context) || this;\n var parentGroup = context; // In the context of a TransitionGroup all enters are really appears\n\n var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;\n var initialStatus;\n _this.appearStatus = null;\n\n if (props.in) {\n if (appear) {\n initialStatus = EXITED;\n _this.appearStatus = ENTERING;\n } else {\n initialStatus = ENTERED;\n }\n } else {\n if (props.unmountOnExit || props.mountOnEnter) {\n initialStatus = UNMOUNTED;\n } else {\n initialStatus = EXITED;\n }\n }\n\n _this.state = {\n status: initialStatus\n };\n _this.nextCallback = null;\n return _this;\n }\n\n Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {\n var nextIn = _ref.in;\n\n if (nextIn && prevState.status === UNMOUNTED) {\n return {\n status: EXITED\n };\n }\n\n return null;\n } // getSnapshotBeforeUpdate(prevProps) {\n // let nextStatus = null\n // if (prevProps !== this.props) {\n // const { status } = this.state\n // if (this.props.in) {\n // if (status !== ENTERING && status !== ENTERED) {\n // nextStatus = ENTERING\n // }\n // } else {\n // if (status === ENTERING || status === ENTERED) {\n // nextStatus = EXITING\n // }\n // }\n // }\n // return { nextStatus }\n // }\n ;\n\n var _proto = Transition.prototype;\n\n _proto.componentDidMount = function componentDidMount() {\n this.updateStatus(true, this.appearStatus);\n };\n\n _proto.componentDidUpdate = function componentDidUpdate(prevProps) {\n var nextStatus = null;\n\n if (prevProps !== this.props) {\n var status = this.state.status;\n\n if (this.props.in) {\n if (status !== ENTERING && status !== ENTERED) {\n nextStatus = ENTERING;\n }\n } else {\n if (status === ENTERING || status === ENTERED) {\n nextStatus = EXITING;\n }\n }\n }\n\n this.updateStatus(false, nextStatus);\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n this.cancelNextCallback();\n };\n\n _proto.getTimeouts = function getTimeouts() {\n var timeout = this.props.timeout;\n var exit, enter, appear;\n exit = enter = appear = timeout;\n\n if (timeout != null && typeof timeout !== 'number') {\n exit = timeout.exit;\n enter = timeout.enter; // TODO: remove fallback for next major\n\n appear = timeout.appear !== undefined ? timeout.appear : enter;\n }\n\n return {\n exit: exit,\n enter: enter,\n appear: appear\n };\n };\n\n _proto.updateStatus = function updateStatus(mounting, nextStatus) {\n if (mounting === void 0) {\n mounting = false;\n }\n\n if (nextStatus !== null) {\n // nextStatus will always be ENTERING or EXITING.\n this.cancelNextCallback();\n\n if (nextStatus === ENTERING) {\n if (this.props.unmountOnExit || this.props.mountOnEnter) {\n var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this); // https://github.com/reactjs/react-transition-group/pull/749\n // With unmountOnExit or mountOnEnter, the enter animation should happen at the transition between `exited` and `entering`.\n // To make the animation happen, we have to separate each rendering and avoid being processed as batched.\n\n if (node) forceReflow(node);\n }\n\n this.performEnter(mounting);\n } else {\n this.performExit();\n }\n } else if (this.props.unmountOnExit && this.state.status === EXITED) {\n this.setState({\n status: UNMOUNTED\n });\n }\n };\n\n _proto.performEnter = function performEnter(mounting) {\n var _this2 = this;\n\n var enter = this.props.enter;\n var appearing = this.context ? this.context.isMounting : mounting;\n\n var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM.findDOMNode(this), appearing],\n maybeNode = _ref2[0],\n maybeAppearing = _ref2[1];\n\n var timeouts = this.getTimeouts();\n var enterTimeout = appearing ? timeouts.appear : timeouts.enter; // no enter animation skip right to ENTERED\n // if we are mounting and running this it means appear _must_ be set\n\n if (!mounting && !enter || config.disabled) {\n this.safeSetState({\n status: ENTERED\n }, function () {\n _this2.props.onEntered(maybeNode);\n });\n return;\n }\n\n this.props.onEnter(maybeNode, maybeAppearing);\n this.safeSetState({\n status: ENTERING\n }, function () {\n _this2.props.onEntering(maybeNode, maybeAppearing);\n\n _this2.onTransitionEnd(enterTimeout, function () {\n _this2.safeSetState({\n status: ENTERED\n }, function () {\n _this2.props.onEntered(maybeNode, maybeAppearing);\n });\n });\n });\n };\n\n _proto.performExit = function performExit() {\n var _this3 = this;\n\n var exit = this.props.exit;\n var timeouts = this.getTimeouts();\n var maybeNode = this.props.nodeRef ? undefined : ReactDOM.findDOMNode(this); // no exit animation skip right to EXITED\n\n if (!exit || config.disabled) {\n this.safeSetState({\n status: EXITED\n }, function () {\n _this3.props.onExited(maybeNode);\n });\n return;\n }\n\n this.props.onExit(maybeNode);\n this.safeSetState({\n status: EXITING\n }, function () {\n _this3.props.onExiting(maybeNode);\n\n _this3.onTransitionEnd(timeouts.exit, function () {\n _this3.safeSetState({\n status: EXITED\n }, function () {\n _this3.props.onExited(maybeNode);\n });\n });\n });\n };\n\n _proto.cancelNextCallback = function cancelNextCallback() {\n if (this.nextCallback !== null) {\n this.nextCallback.cancel();\n this.nextCallback = null;\n }\n };\n\n _proto.safeSetState = function safeSetState(nextState, callback) {\n // This shouldn't be necessary, but there are weird race conditions with\n // setState callbacks and unmounting in testing, so always make sure that\n // we can cancel any pending setState callbacks after we unmount.\n callback = this.setNextCallback(callback);\n this.setState(nextState, callback);\n };\n\n _proto.setNextCallback = function setNextCallback(callback) {\n var _this4 = this;\n\n var active = true;\n\n this.nextCallback = function (event) {\n if (active) {\n active = false;\n _this4.nextCallback = null;\n callback(event);\n }\n };\n\n this.nextCallback.cancel = function () {\n active = false;\n };\n\n return this.nextCallback;\n };\n\n _proto.onTransitionEnd = function onTransitionEnd(timeout, handler) {\n this.setNextCallback(handler);\n var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this);\n var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;\n\n if (!node || doesNotHaveTimeoutOrListener) {\n setTimeout(this.nextCallback, 0);\n return;\n }\n\n if (this.props.addEndListener) {\n var _ref3 = this.props.nodeRef ? [this.nextCallback] : [node, this.nextCallback],\n maybeNode = _ref3[0],\n maybeNextCallback = _ref3[1];\n\n this.props.addEndListener(maybeNode, maybeNextCallback);\n }\n\n if (timeout != null) {\n setTimeout(this.nextCallback, timeout);\n }\n };\n\n _proto.render = function render() {\n var status = this.state.status;\n\n if (status === UNMOUNTED) {\n return null;\n }\n\n var _this$props = this.props,\n children = _this$props.children,\n _in = _this$props.in,\n _mountOnEnter = _this$props.mountOnEnter,\n _unmountOnExit = _this$props.unmountOnExit,\n _appear = _this$props.appear,\n _enter = _this$props.enter,\n _exit = _this$props.exit,\n _timeout = _this$props.timeout,\n _addEndListener = _this$props.addEndListener,\n _onEnter = _this$props.onEnter,\n _onEntering = _this$props.onEntering,\n _onEntered = _this$props.onEntered,\n _onExit = _this$props.onExit,\n _onExiting = _this$props.onExiting,\n _onExited = _this$props.onExited,\n _nodeRef = _this$props.nodeRef,\n childProps = _objectWithoutPropertiesLoose(_this$props, [\"children\", \"in\", \"mountOnEnter\", \"unmountOnExit\", \"appear\", \"enter\", \"exit\", \"timeout\", \"addEndListener\", \"onEnter\", \"onEntering\", \"onEntered\", \"onExit\", \"onExiting\", \"onExited\", \"nodeRef\"]);\n\n return (\n /*#__PURE__*/\n // allows for nested Transitions\n React.createElement(TransitionGroupContext.Provider, {\n value: null\n }, typeof children === 'function' ? children(status, childProps) : React.cloneElement(React.Children.only(children), childProps))\n );\n };\n\n return Transition;\n}(React.Component);\n\nTransition.contextType = TransitionGroupContext;\nTransition.propTypes = process.env.NODE_ENV !== \"production\" ? {\n /**\n * A React reference to DOM element that need to transition:\n * https://stackoverflow.com/a/51127130/4671932\n *\n * - When `nodeRef` prop is used, `node` is not passed to callback functions\n * (e.g. `onEnter`) because user already has direct access to the node.\n * - When changing `key` prop of `Transition` in a `TransitionGroup` a new\n * `nodeRef` need to be provided to `Transition` with changed `key` prop\n * (see\n * [test/CSSTransition-test.js](https://github.com/reactjs/react-transition-group/blob/13435f897b3ab71f6e19d724f145596f5910581c/test/CSSTransition-test.js#L362-L437)).\n */\n nodeRef: PropTypes.shape({\n current: typeof Element === 'undefined' ? PropTypes.any : function (propValue, key, componentName, location, propFullName, secret) {\n var value = propValue[key];\n return PropTypes.instanceOf(value && 'ownerDocument' in value ? value.ownerDocument.defaultView.Element : Element)(propValue, key, componentName, location, propFullName, secret);\n }\n }),\n\n /**\n * A `function` child can be used instead of a React element. This function is\n * called with the current transition status (`'entering'`, `'entered'`,\n * `'exiting'`, `'exited'`), which can be used to apply context\n * specific props to a component.\n *\n * ```jsx\n * \n * {state => (\n * \n * )}\n * \n * ```\n */\n children: PropTypes.oneOfType([PropTypes.func.isRequired, PropTypes.element.isRequired]).isRequired,\n\n /**\n * Show the component; triggers the enter or exit states\n */\n in: PropTypes.bool,\n\n /**\n * By default the child component is mounted immediately along with\n * the parent `Transition` component. If you want to \"lazy mount\" the component on the\n * first `in={true}` you can set `mountOnEnter`. After the first enter transition the component will stay\n * mounted, even on \"exited\", unless you also specify `unmountOnExit`.\n */\n mountOnEnter: PropTypes.bool,\n\n /**\n * By default the child component stays mounted after it reaches the `'exited'` state.\n * Set `unmountOnExit` if you'd prefer to unmount the component after it finishes exiting.\n */\n unmountOnExit: PropTypes.bool,\n\n /**\n * By default the child component does not perform the enter transition when\n * it first mounts, regardless of the value of `in`. If you want this\n * behavior, set both `appear` and `in` to `true`.\n *\n * > **Note**: there are no special appear states like `appearing`/`appeared`, this prop\n * > only adds an additional enter transition. However, in the\n * > `` component that first enter transition does result in\n * > additional `.appear-*` classes, that way you can choose to style it\n * > differently.\n */\n appear: PropTypes.bool,\n\n /**\n * Enable or disable enter transitions.\n */\n enter: PropTypes.bool,\n\n /**\n * Enable or disable exit transitions.\n */\n exit: PropTypes.bool,\n\n /**\n * The duration of the transition, in milliseconds.\n * Required unless `addEndListener` is provided.\n *\n * You may specify a single timeout for all transitions:\n *\n * ```jsx\n * timeout={500}\n * ```\n *\n * or individually:\n *\n * ```jsx\n * timeout={{\n * appear: 500,\n * enter: 300,\n * exit: 500,\n * }}\n * ```\n *\n * - `appear` defaults to the value of `enter`\n * - `enter` defaults to `0`\n * - `exit` defaults to `0`\n *\n * @type {number | { enter?: number, exit?: number, appear?: number }}\n */\n timeout: function timeout(props) {\n var pt = timeoutsShape;\n if (!props.addEndListener) pt = pt.isRequired;\n\n for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n args[_key - 1] = arguments[_key];\n }\n\n return pt.apply(void 0, [props].concat(args));\n },\n\n /**\n * Add a custom transition end trigger. Called with the transitioning\n * DOM node and a `done` callback. Allows for more fine grained transition end\n * logic. Timeouts are still used as a fallback if provided.\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * ```jsx\n * addEndListener={(node, done) => {\n * // use the css transitionend event to mark the finish of a transition\n * node.addEventListener('transitionend', done, false);\n * }}\n * ```\n */\n addEndListener: PropTypes.func,\n\n /**\n * Callback fired before the \"entering\" status is applied. An extra parameter\n * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * @type Function(node: HtmlElement, isAppearing: bool) -> void\n */\n onEnter: PropTypes.func,\n\n /**\n * Callback fired after the \"entering\" status is applied. An extra parameter\n * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * @type Function(node: HtmlElement, isAppearing: bool)\n */\n onEntering: PropTypes.func,\n\n /**\n * Callback fired after the \"entered\" status is applied. An extra parameter\n * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * @type Function(node: HtmlElement, isAppearing: bool) -> void\n */\n onEntered: PropTypes.func,\n\n /**\n * Callback fired before the \"exiting\" status is applied.\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * @type Function(node: HtmlElement) -> void\n */\n onExit: PropTypes.func,\n\n /**\n * Callback fired after the \"exiting\" status is applied.\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * @type Function(node: HtmlElement) -> void\n */\n onExiting: PropTypes.func,\n\n /**\n * Callback fired after the \"exited\" status is applied.\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed\n *\n * @type Function(node: HtmlElement) -> void\n */\n onExited: PropTypes.func\n} : {}; // Name the function so it is clearer in the documentation\n\nfunction noop() {}\n\nTransition.defaultProps = {\n in: false,\n mountOnEnter: false,\n unmountOnExit: false,\n appear: false,\n enter: true,\n exit: true,\n onEnter: noop,\n onEntering: noop,\n onEntered: noop,\n onExit: noop,\n onExiting: noop,\n onExited: noop\n};\nTransition.UNMOUNTED = UNMOUNTED;\nTransition.EXITED = EXITED;\nTransition.ENTERING = ENTERING;\nTransition.ENTERED = ENTERED;\nTransition.EXITING = EXITING;\nexport default Transition;","'use client';\n\nimport * as React from 'react';\nimport { ThemeContext } from '@mui/styled-engine';\nfunction isObjectEmpty(obj) {\n return Object.keys(obj).length === 0;\n}\nfunction useTheme(defaultTheme = null) {\n const contextTheme = React.useContext(ThemeContext);\n return !contextTheme || isObjectEmpty(contextTheme) ? defaultTheme : contextTheme;\n}\nexport default useTheme;","'use client';\n\nimport createTheme from './createTheme';\nimport useThemeWithoutDefault from './useThemeWithoutDefault';\nexport const systemDefaultTheme = createTheme();\nfunction useTheme(defaultTheme = systemDefaultTheme) {\n return useThemeWithoutDefault(defaultTheme);\n}\nexport default useTheme;","'use client';\n\nimport * as React from 'react';\nimport { useTheme as useThemeSystem } from '@mui/system';\nimport defaultTheme from './defaultTheme';\nimport THEME_ID from './identifier';\nexport default function useTheme() {\n const theme = useThemeSystem(defaultTheme);\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useDebugValue(theme);\n }\n return theme[THEME_ID] || theme;\n}","export const reflow = node => node.scrollTop;\nexport function getTransitionProps(props, options) {\n var _style$transitionDura, _style$transitionTimi;\n const {\n timeout,\n easing,\n style = {}\n } = props;\n return {\n duration: (_style$transitionDura = style.transitionDuration) != null ? _style$transitionDura : typeof timeout === 'number' ? timeout : timeout[options.mode] || 0,\n easing: (_style$transitionTimi = style.transitionTimingFunction) != null ? _style$transitionTimi : typeof easing === 'object' ? easing[options.mode] : easing,\n delay: style.transitionDelay\n };\n}","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"addEndListener\", \"appear\", \"children\", \"easing\", \"in\", \"onEnter\", \"onEntered\", \"onEntering\", \"onExit\", \"onExited\", \"onExiting\", \"style\", \"timeout\", \"TransitionComponent\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { Transition } from 'react-transition-group';\nimport elementAcceptingRef from '@mui/utils/elementAcceptingRef';\nimport getReactElementRef from '@mui/utils/getReactElementRef';\nimport useTheme from '../styles/useTheme';\nimport { reflow, getTransitionProps } from '../transitions/utils';\nimport useForkRef from '../utils/useForkRef';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst styles = {\n entering: {\n opacity: 1\n },\n entered: {\n opacity: 1\n }\n};\n\n/**\n * The Fade transition is used by the [Modal](/material-ui/react-modal/) component.\n * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.\n */\nconst Fade = /*#__PURE__*/React.forwardRef(function Fade(props, ref) {\n const theme = useTheme();\n const defaultTimeout = {\n enter: theme.transitions.duration.enteringScreen,\n exit: theme.transitions.duration.leavingScreen\n };\n const {\n addEndListener,\n appear = true,\n children,\n easing,\n in: inProp,\n onEnter,\n onEntered,\n onEntering,\n onExit,\n onExited,\n onExiting,\n style,\n timeout = defaultTimeout,\n // eslint-disable-next-line react/prop-types\n TransitionComponent = Transition\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const enableStrictModeCompat = true;\n const nodeRef = React.useRef(null);\n const handleRef = useForkRef(nodeRef, getReactElementRef(children), ref);\n const normalizedTransitionCallback = callback => maybeIsAppearing => {\n if (callback) {\n const node = nodeRef.current;\n\n // onEnterXxx and onExitXxx callbacks have a different arguments.length value.\n if (maybeIsAppearing === undefined) {\n callback(node);\n } else {\n callback(node, maybeIsAppearing);\n }\n }\n };\n const handleEntering = normalizedTransitionCallback(onEntering);\n const handleEnter = normalizedTransitionCallback((node, isAppearing) => {\n reflow(node); // So the animation always start from the start.\n\n const transitionProps = getTransitionProps({\n style,\n timeout,\n easing\n }, {\n mode: 'enter'\n });\n node.style.webkitTransition = theme.transitions.create('opacity', transitionProps);\n node.style.transition = theme.transitions.create('opacity', transitionProps);\n if (onEnter) {\n onEnter(node, isAppearing);\n }\n });\n const handleEntered = normalizedTransitionCallback(onEntered);\n const handleExiting = normalizedTransitionCallback(onExiting);\n const handleExit = normalizedTransitionCallback(node => {\n const transitionProps = getTransitionProps({\n style,\n timeout,\n easing\n }, {\n mode: 'exit'\n });\n node.style.webkitTransition = theme.transitions.create('opacity', transitionProps);\n node.style.transition = theme.transitions.create('opacity', transitionProps);\n if (onExit) {\n onExit(node);\n }\n });\n const handleExited = normalizedTransitionCallback(onExited);\n const handleAddEndListener = next => {\n if (addEndListener) {\n // Old call signature before `react-transition-group` implemented `nodeRef`\n addEndListener(nodeRef.current, next);\n }\n };\n return /*#__PURE__*/_jsx(TransitionComponent, _extends({\n appear: appear,\n in: inProp,\n nodeRef: enableStrictModeCompat ? nodeRef : undefined,\n onEnter: handleEnter,\n onEntered: handleEntered,\n onEntering: handleEntering,\n onExit: handleExit,\n onExited: handleExited,\n onExiting: handleExiting,\n addEndListener: handleAddEndListener,\n timeout: timeout\n }, other, {\n children: (state, childProps) => {\n return /*#__PURE__*/React.cloneElement(children, _extends({\n style: _extends({\n opacity: 0,\n visibility: state === 'exited' && !inProp ? 'hidden' : undefined\n }, styles[state], style, children.props.style),\n ref: handleRef\n }, childProps));\n }\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Fade.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * Add a custom transition end trigger. Called with the transitioning DOM\n * node and a done callback. Allows for more fine grained transition end\n * logic. Note: Timeouts are still used as a fallback if provided.\n */\n addEndListener: PropTypes.func,\n /**\n * Perform the enter transition when it first mounts if `in` is also `true`.\n * Set this to `false` to disable this behavior.\n * @default true\n */\n appear: PropTypes.bool,\n /**\n * A single child content element.\n */\n children: elementAcceptingRef.isRequired,\n /**\n * The transition timing function.\n * You may specify a single easing or a object containing enter and exit values.\n */\n easing: PropTypes.oneOfType([PropTypes.shape({\n enter: PropTypes.string,\n exit: PropTypes.string\n }), PropTypes.string]),\n /**\n * If `true`, the component will transition in.\n */\n in: PropTypes.bool,\n /**\n * @ignore\n */\n onEnter: PropTypes.func,\n /**\n * @ignore\n */\n onEntered: PropTypes.func,\n /**\n * @ignore\n */\n onEntering: PropTypes.func,\n /**\n * @ignore\n */\n onExit: PropTypes.func,\n /**\n * @ignore\n */\n onExited: PropTypes.func,\n /**\n * @ignore\n */\n onExiting: PropTypes.func,\n /**\n * @ignore\n */\n style: PropTypes.object,\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 * @default {\n * enter: theme.transitions.duration.enteringScreen,\n * exit: theme.transitions.duration.leavingScreen,\n * }\n */\n timeout: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({\n appear: PropTypes.number,\n enter: PropTypes.number,\n exit: PropTypes.number\n })])\n} : void 0;\nexport default Fade;","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/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 composeClasses from '@mui/utils/composeClasses';\nimport styled from '../styles/styled';\nimport { useDefaultProps } from '../DefaultPropsProvider';\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 = useDefaultProps({\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 `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * The 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;","// A change of the browser zoom change the scrollbar size.\n// Credit https://github.com/twbs/bootstrap/blob/488fd8afc535ca3a6ad4dc581f5e89217b6a36ac/js/src/util/scrollbar.js#L14-L18\nexport default function getScrollbarSize(doc) {\n // https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth#usage_notes\n const documentWidth = doc.documentElement.clientWidth;\n return Math.abs(window.innerWidth - documentWidth);\n}","import { unstable_ownerWindow as ownerWindow, unstable_ownerDocument as ownerDocument, unstable_getScrollbarSize as getScrollbarSize } from '@mui/utils';\n// Is a vertical scrollbar displayed?\nfunction isOverflowing(container) {\n const doc = ownerDocument(container);\n if (doc.body === container) {\n return ownerWindow(container).innerWidth > doc.documentElement.clientWidth;\n }\n return container.scrollHeight > container.clientHeight;\n}\nexport function ariaHidden(element, show) {\n if (show) {\n element.setAttribute('aria-hidden', 'true');\n } else {\n element.removeAttribute('aria-hidden');\n }\n}\nfunction getPaddingRight(element) {\n return parseInt(ownerWindow(element).getComputedStyle(element).paddingRight, 10) || 0;\n}\nfunction isAriaHiddenForbiddenOnElement(element) {\n // The forbidden HTML tags are the ones from ARIA specification that\n // can be children of body and can't have aria-hidden attribute.\n // cf. https://www.w3.org/TR/html-aria/#docconformance\n const forbiddenTagNames = ['TEMPLATE', 'SCRIPT', 'STYLE', 'LINK', 'MAP', 'META', 'NOSCRIPT', 'PICTURE', 'COL', 'COLGROUP', 'PARAM', 'SLOT', 'SOURCE', 'TRACK'];\n const isForbiddenTagName = forbiddenTagNames.indexOf(element.tagName) !== -1;\n const isInputHidden = element.tagName === 'INPUT' && element.getAttribute('type') === 'hidden';\n return isForbiddenTagName || isInputHidden;\n}\nfunction ariaHiddenSiblings(container, mountElement, currentElement, elementsToExclude, show) {\n const blacklist = [mountElement, currentElement, ...elementsToExclude];\n [].forEach.call(container.children, element => {\n const isNotExcludedElement = blacklist.indexOf(element) === -1;\n const isNotForbiddenElement = !isAriaHiddenForbiddenOnElement(element);\n if (isNotExcludedElement && isNotForbiddenElement) {\n ariaHidden(element, show);\n }\n });\n}\nfunction findIndexOf(items, callback) {\n let idx = -1;\n items.some((item, index) => {\n if (callback(item)) {\n idx = index;\n return true;\n }\n return false;\n });\n return idx;\n}\nfunction handleContainer(containerInfo, props) {\n const restoreStyle = [];\n const container = containerInfo.container;\n if (!props.disableScrollLock) {\n if (isOverflowing(container)) {\n // Compute the size before applying overflow hidden to avoid any scroll jumps.\n const scrollbarSize = getScrollbarSize(ownerDocument(container));\n restoreStyle.push({\n value: container.style.paddingRight,\n property: 'padding-right',\n el: container\n });\n // Use computed style, here to get the real padding to add our scrollbar width.\n container.style.paddingRight = `${getPaddingRight(container) + scrollbarSize}px`;\n\n // .mui-fixed is a global helper.\n const fixedElements = ownerDocument(container).querySelectorAll('.mui-fixed');\n [].forEach.call(fixedElements, element => {\n restoreStyle.push({\n value: element.style.paddingRight,\n property: 'padding-right',\n el: element\n });\n element.style.paddingRight = `${getPaddingRight(element) + scrollbarSize}px`;\n });\n }\n let scrollContainer;\n if (container.parentNode instanceof DocumentFragment) {\n scrollContainer = ownerDocument(container).body;\n } else {\n // Support html overflow-y: auto for scroll stability between pages\n // https://css-tricks.com/snippets/css/force-vertical-scrollbar/\n const parent = container.parentElement;\n const containerWindow = ownerWindow(container);\n scrollContainer = (parent == null ? void 0 : parent.nodeName) === 'HTML' && containerWindow.getComputedStyle(parent).overflowY === 'scroll' ? parent : container;\n }\n\n // Block the scroll even if no scrollbar is visible to account for mobile keyboard\n // screensize shrink.\n restoreStyle.push({\n value: scrollContainer.style.overflow,\n property: 'overflow',\n el: scrollContainer\n }, {\n value: scrollContainer.style.overflowX,\n property: 'overflow-x',\n el: scrollContainer\n }, {\n value: scrollContainer.style.overflowY,\n property: 'overflow-y',\n el: scrollContainer\n });\n scrollContainer.style.overflow = 'hidden';\n }\n const restore = () => {\n restoreStyle.forEach(({\n value,\n el,\n property\n }) => {\n if (value) {\n el.style.setProperty(property, value);\n } else {\n el.style.removeProperty(property);\n }\n });\n };\n return restore;\n}\nfunction getHiddenSiblings(container) {\n const hiddenSiblings = [];\n [].forEach.call(container.children, element => {\n if (element.getAttribute('aria-hidden') === 'true') {\n hiddenSiblings.push(element);\n }\n });\n return hiddenSiblings;\n}\n/**\n * @ignore - do not document.\n *\n * Proper state management for containers and the modals in those containers.\n * Simplified, but inspired by react-overlay's ModalManager class.\n * Used by the Modal to ensure proper styling of containers.\n */\nexport class ModalManager {\n constructor() {\n this.containers = void 0;\n this.modals = void 0;\n this.modals = [];\n this.containers = [];\n }\n add(modal, container) {\n let modalIndex = this.modals.indexOf(modal);\n if (modalIndex !== -1) {\n return modalIndex;\n }\n modalIndex = this.modals.length;\n this.modals.push(modal);\n\n // If the modal we are adding is already in the DOM.\n if (modal.modalRef) {\n ariaHidden(modal.modalRef, false);\n }\n const hiddenSiblings = getHiddenSiblings(container);\n ariaHiddenSiblings(container, modal.mount, modal.modalRef, hiddenSiblings, true);\n const containerIndex = findIndexOf(this.containers, item => item.container === container);\n if (containerIndex !== -1) {\n this.containers[containerIndex].modals.push(modal);\n return modalIndex;\n }\n this.containers.push({\n modals: [modal],\n container,\n restore: null,\n hiddenSiblings\n });\n return modalIndex;\n }\n mount(modal, props) {\n const containerIndex = findIndexOf(this.containers, item => item.modals.indexOf(modal) !== -1);\n const containerInfo = this.containers[containerIndex];\n if (!containerInfo.restore) {\n containerInfo.restore = handleContainer(containerInfo, props);\n }\n }\n remove(modal, ariaHiddenState = true) {\n const modalIndex = this.modals.indexOf(modal);\n if (modalIndex === -1) {\n return modalIndex;\n }\n const containerIndex = findIndexOf(this.containers, item => item.modals.indexOf(modal) !== -1);\n const containerInfo = this.containers[containerIndex];\n containerInfo.modals.splice(containerInfo.modals.indexOf(modal), 1);\n this.modals.splice(modalIndex, 1);\n\n // If that was the last modal in a container, clean up the container.\n if (containerInfo.modals.length === 0) {\n // The modal might be closed before it had the chance to be mounted in the DOM.\n if (containerInfo.restore) {\n containerInfo.restore();\n }\n if (modal.modalRef) {\n // In case the modal wasn't in the DOM yet.\n ariaHidden(modal.modalRef, ariaHiddenState);\n }\n ariaHiddenSiblings(containerInfo.container, modal.mount, modal.modalRef, containerInfo.hiddenSiblings, false);\n this.containers.splice(containerIndex, 1);\n } else {\n // Otherwise make sure the next top modal is visible to a screen reader.\n const nextTop = containerInfo.modals[containerInfo.modals.length - 1];\n // as soon as a modal is adding its modalRef is undefined. it can't set\n // aria-hidden because the dom element doesn't exist either\n // when modal was unmounted before modalRef gets null\n if (nextTop.modalRef) {\n ariaHidden(nextTop.modalRef, false);\n }\n }\n return modalIndex;\n }\n isTopModal(modal) {\n return this.modals.length > 0 && this.modals[this.modals.length - 1] === modal;\n }\n}","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { unstable_ownerDocument as ownerDocument, unstable_useForkRef as useForkRef, unstable_useEventCallback as useEventCallback, unstable_createChainedFunction as createChainedFunction } from '@mui/utils';\nimport extractEventHandlers from '@mui/utils/extractEventHandlers';\nimport { ModalManager, ariaHidden } from './ModalManager';\nfunction getContainer(container) {\n return typeof container === 'function' ? container() : container;\n}\nfunction getHasTransition(children) {\n return children ? children.props.hasOwnProperty('in') : false;\n}\n\n// A modal manager used to track and manage the state of open Modals.\n// Modals don't open on the server so this won't conflict with concurrent requests.\nconst defaultManager = new ModalManager();\n/**\n *\n * Demos:\n *\n * - [Modal](https://mui.com/base-ui/react-modal/#hook)\n *\n * API:\n *\n * - [useModal API](https://mui.com/base-ui/react-modal/hooks-api/#use-modal)\n */\nfunction useModal(parameters) {\n const {\n container,\n disableEscapeKeyDown = false,\n disableScrollLock = false,\n // @ts-ignore internal logic - Base UI supports the manager as a prop too\n manager = defaultManager,\n closeAfterTransition = false,\n onTransitionEnter,\n onTransitionExited,\n children,\n onClose,\n open,\n rootRef\n } = parameters;\n\n // @ts-ignore internal logic\n const modal = React.useRef({});\n const mountNodeRef = React.useRef(null);\n const modalRef = React.useRef(null);\n const handleRef = useForkRef(modalRef, rootRef);\n const [exited, setExited] = React.useState(!open);\n const hasTransition = getHasTransition(children);\n let ariaHiddenProp = true;\n if (parameters['aria-hidden'] === 'false' || parameters['aria-hidden'] === false) {\n ariaHiddenProp = false;\n }\n const getDoc = () => ownerDocument(mountNodeRef.current);\n const getModal = () => {\n modal.current.modalRef = modalRef.current;\n modal.current.mount = mountNodeRef.current;\n return modal.current;\n };\n const handleMounted = () => {\n manager.mount(getModal(), {\n disableScrollLock\n });\n\n // Fix a bug on Chrome where the scroll isn't initially 0.\n if (modalRef.current) {\n modalRef.current.scrollTop = 0;\n }\n };\n const handleOpen = useEventCallback(() => {\n const resolvedContainer = getContainer(container) || getDoc().body;\n manager.add(getModal(), resolvedContainer);\n\n // The element was already mounted.\n if (modalRef.current) {\n handleMounted();\n }\n });\n const isTopModal = React.useCallback(() => manager.isTopModal(getModal()), [manager]);\n const handlePortalRef = useEventCallback(node => {\n mountNodeRef.current = node;\n if (!node) {\n return;\n }\n if (open && isTopModal()) {\n handleMounted();\n } else if (modalRef.current) {\n ariaHidden(modalRef.current, ariaHiddenProp);\n }\n });\n const handleClose = React.useCallback(() => {\n manager.remove(getModal(), ariaHiddenProp);\n }, [ariaHiddenProp, manager]);\n React.useEffect(() => {\n return () => {\n handleClose();\n };\n }, [handleClose]);\n React.useEffect(() => {\n if (open) {\n handleOpen();\n } else if (!hasTransition || !closeAfterTransition) {\n handleClose();\n }\n }, [open, handleClose, hasTransition, closeAfterTransition, handleOpen]);\n const createHandleKeyDown = otherHandlers => event => {\n var _otherHandlers$onKeyD;\n (_otherHandlers$onKeyD = otherHandlers.onKeyDown) == null || _otherHandlers$onKeyD.call(otherHandlers, event);\n\n // The handler doesn't take event.defaultPrevented into account:\n //\n // event.preventDefault() is meant to stop default behaviors like\n // clicking a checkbox to check it, hitting a button to submit a form,\n // and hitting left arrow to move the cursor in a text input etc.\n // Only special HTML elements have these default behaviors.\n if (event.key !== 'Escape' || event.which === 229 ||\n // Wait until IME is settled.\n !isTopModal()) {\n return;\n }\n if (!disableEscapeKeyDown) {\n // Swallow the event, in case someone is listening for the escape key on the body.\n event.stopPropagation();\n if (onClose) {\n onClose(event, 'escapeKeyDown');\n }\n }\n };\n const createHandleBackdropClick = otherHandlers => event => {\n var _otherHandlers$onClic;\n (_otherHandlers$onClic = otherHandlers.onClick) == null || _otherHandlers$onClic.call(otherHandlers, event);\n if (event.target !== event.currentTarget) {\n return;\n }\n if (onClose) {\n onClose(event, 'backdropClick');\n }\n };\n const getRootProps = (otherHandlers = {}) => {\n const propsEventHandlers = extractEventHandlers(parameters);\n\n // The custom event handlers shouldn't be spread on the root element\n delete propsEventHandlers.onTransitionEnter;\n delete propsEventHandlers.onTransitionExited;\n const externalEventHandlers = _extends({}, propsEventHandlers, otherHandlers);\n return _extends({\n role: 'presentation'\n }, externalEventHandlers, {\n onKeyDown: createHandleKeyDown(externalEventHandlers),\n ref: handleRef\n });\n };\n const getBackdropProps = (otherHandlers = {}) => {\n const externalEventHandlers = otherHandlers;\n return _extends({\n 'aria-hidden': true\n }, externalEventHandlers, {\n onClick: createHandleBackdropClick(externalEventHandlers),\n open\n });\n };\n const getTransitionProps = () => {\n const handleEnter = () => {\n setExited(false);\n if (onTransitionEnter) {\n onTransitionEnter();\n }\n };\n const handleExited = () => {\n setExited(true);\n if (onTransitionExited) {\n onTransitionExited();\n }\n if (closeAfterTransition) {\n handleClose();\n }\n };\n return {\n onEnter: createChainedFunction(handleEnter, children == null ? void 0 : children.props.onEnter),\n onExited: createChainedFunction(handleExited, children == null ? void 0 : children.props.onExited)\n };\n };\n return {\n getRootProps,\n getBackdropProps,\n getTransitionProps,\n rootRef: handleRef,\n portalRef: handlePortalRef,\n isTopModal,\n exited,\n hasTransition\n };\n}\nexport default useModal;","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getModalUtilityClass(slot) {\n return generateUtilityClass('MuiModal', slot);\n}\nconst modalClasses = generateUtilityClasses('MuiModal', ['root', 'hidden', 'backdrop']);\nexport default modalClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"BackdropComponent\", \"BackdropProps\", \"classes\", \"className\", \"closeAfterTransition\", \"children\", \"container\", \"component\", \"components\", \"componentsProps\", \"disableAutoFocus\", \"disableEnforceFocus\", \"disableEscapeKeyDown\", \"disablePortal\", \"disableRestoreFocus\", \"disableScrollLock\", \"hideBackdrop\", \"keepMounted\", \"onBackdropClick\", \"onClose\", \"onTransitionEnter\", \"onTransitionExited\", \"open\", \"slotProps\", \"slots\", \"theme\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport HTMLElementType from '@mui/utils/HTMLElementType';\nimport elementAcceptingRef from '@mui/utils/elementAcceptingRef';\nimport composeClasses from '@mui/utils/composeClasses';\nimport useSlotProps from '@mui/utils/useSlotProps';\nimport FocusTrap from '../Unstable_TrapFocus';\nimport Portal from '../Portal';\nimport styled from '../styles/styled';\nimport { useDefaultProps } from '../DefaultPropsProvider';\nimport Backdrop from '../Backdrop';\nimport useModal from './useModal';\nimport { getModalUtilityClass } from './modalClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n open,\n exited,\n classes\n } = ownerState;\n const slots = {\n root: ['root', !open && exited && 'hidden'],\n backdrop: ['backdrop']\n };\n return composeClasses(slots, getModalUtilityClass, classes);\n};\nconst ModalRoot = styled('div', {\n name: 'MuiModal',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, !ownerState.open && ownerState.exited && styles.hidden];\n }\n})(({\n theme,\n ownerState\n}) => _extends({\n position: 'fixed',\n zIndex: (theme.vars || theme).zIndex.modal,\n right: 0,\n bottom: 0,\n top: 0,\n left: 0\n}, !ownerState.open && ownerState.exited && {\n visibility: 'hidden'\n}));\nconst ModalBackdrop = styled(Backdrop, {\n name: 'MuiModal',\n slot: 'Backdrop',\n overridesResolver: (props, styles) => {\n return styles.backdrop;\n }\n})({\n zIndex: -1\n});\n\n/**\n * Modal is a lower-level construct that is leveraged by the following components:\n *\n * - [Dialog](/material-ui/api/dialog/)\n * - [Drawer](/material-ui/api/drawer/)\n * - [Menu](/material-ui/api/menu/)\n * - [Popover](/material-ui/api/popover/)\n *\n * If you are creating a modal dialog, you probably want to use the [Dialog](/material-ui/api/dialog/) component\n * rather than directly using Modal.\n *\n * This component shares many concepts with [react-overlays](https://react-bootstrap.github.io/react-overlays/#modals).\n */\nconst Modal = /*#__PURE__*/React.forwardRef(function Modal(inProps, ref) {\n var _ref, _slots$root, _ref2, _slots$backdrop, _slotProps$root, _slotProps$backdrop;\n const props = useDefaultProps({\n name: 'MuiModal',\n props: inProps\n });\n const {\n BackdropComponent = ModalBackdrop,\n BackdropProps,\n className,\n closeAfterTransition = false,\n children,\n container,\n component,\n components = {},\n componentsProps = {},\n disableAutoFocus = false,\n disableEnforceFocus = false,\n disableEscapeKeyDown = false,\n disablePortal = false,\n disableRestoreFocus = false,\n disableScrollLock = false,\n hideBackdrop = false,\n keepMounted = false,\n onBackdropClick,\n open,\n slotProps,\n slots\n // eslint-disable-next-line react/prop-types\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const propsWithDefaults = _extends({}, props, {\n closeAfterTransition,\n disableAutoFocus,\n disableEnforceFocus,\n disableEscapeKeyDown,\n disablePortal,\n disableRestoreFocus,\n disableScrollLock,\n hideBackdrop,\n keepMounted\n });\n const {\n getRootProps,\n getBackdropProps,\n getTransitionProps,\n portalRef,\n isTopModal,\n exited,\n hasTransition\n } = useModal(_extends({}, propsWithDefaults, {\n rootRef: ref\n }));\n const ownerState = _extends({}, propsWithDefaults, {\n exited\n });\n const classes = useUtilityClasses(ownerState);\n const childProps = {};\n if (children.props.tabIndex === undefined) {\n childProps.tabIndex = '-1';\n }\n\n // It's a Transition like component\n if (hasTransition) {\n const {\n onEnter,\n onExited\n } = getTransitionProps();\n childProps.onEnter = onEnter;\n childProps.onExited = onExited;\n }\n const RootSlot = (_ref = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components.Root) != null ? _ref : ModalRoot;\n const BackdropSlot = (_ref2 = (_slots$backdrop = slots == null ? void 0 : slots.backdrop) != null ? _slots$backdrop : components.Backdrop) != null ? _ref2 : BackdropComponent;\n const rootSlotProps = (_slotProps$root = slotProps == null ? void 0 : slotProps.root) != null ? _slotProps$root : componentsProps.root;\n const backdropSlotProps = (_slotProps$backdrop = slotProps == null ? void 0 : slotProps.backdrop) != null ? _slotProps$backdrop : componentsProps.backdrop;\n const rootProps = useSlotProps({\n elementType: RootSlot,\n externalSlotProps: rootSlotProps,\n externalForwardedProps: other,\n getSlotProps: getRootProps,\n additionalProps: {\n ref,\n as: component\n },\n ownerState,\n className: clsx(className, rootSlotProps == null ? void 0 : rootSlotProps.className, classes == null ? void 0 : classes.root, !ownerState.open && ownerState.exited && (classes == null ? void 0 : classes.hidden))\n });\n const backdropProps = useSlotProps({\n elementType: BackdropSlot,\n externalSlotProps: backdropSlotProps,\n additionalProps: BackdropProps,\n getSlotProps: otherHandlers => {\n return getBackdropProps(_extends({}, otherHandlers, {\n onClick: e => {\n if (onBackdropClick) {\n onBackdropClick(e);\n }\n if (otherHandlers != null && otherHandlers.onClick) {\n otherHandlers.onClick(e);\n }\n }\n }));\n },\n className: clsx(backdropSlotProps == null ? void 0 : backdropSlotProps.className, BackdropProps == null ? void 0 : BackdropProps.className, classes == null ? void 0 : classes.backdrop),\n ownerState\n });\n if (!keepMounted && !open && (!hasTransition || exited)) {\n return null;\n }\n return /*#__PURE__*/_jsx(Portal, {\n ref: portalRef,\n container: container,\n disablePortal: disablePortal,\n children: /*#__PURE__*/_jsxs(RootSlot, _extends({}, rootProps, {\n children: [!hideBackdrop && BackdropComponent ? /*#__PURE__*/_jsx(BackdropSlot, _extends({}, backdropProps)) : null, /*#__PURE__*/_jsx(FocusTrap, {\n disableEnforceFocus: disableEnforceFocus,\n disableAutoFocus: disableAutoFocus,\n disableRestoreFocus: disableRestoreFocus,\n isEnabled: isTopModal,\n open: open,\n children: /*#__PURE__*/React.cloneElement(children, childProps)\n })]\n }))\n });\n});\nprocess.env.NODE_ENV !== \"production\" ? Modal.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * A backdrop component. This prop enables custom backdrop rendering.\n * @deprecated Use `slots.backdrop` instead. While this prop currently works, it will be removed in the next major version.\n * Use the `slots.backdrop` prop to make your application ready for the next version of Material UI.\n * @default styled(Backdrop, {\n * name: 'MuiModal',\n * slot: 'Backdrop',\n * overridesResolver: (props, styles) => {\n * return styles.backdrop;\n * },\n * })({\n * zIndex: -1,\n * })\n */\n BackdropComponent: PropTypes.elementType,\n /**\n * Props applied to the [`Backdrop`](/material-ui/api/backdrop/) element.\n * @deprecated Use `slotProps.backdrop` instead.\n */\n BackdropProps: PropTypes.object,\n /**\n * A single child content element.\n */\n children: elementAcceptingRef.isRequired,\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 * When set to true the Modal waits until a nested Transition is completed before closing.\n * @default false\n */\n closeAfterTransition: PropTypes.bool,\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 Backdrop: 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 backdrop: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),\n root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])\n }),\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 * If `true`, the modal 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 modal children that have the `disableAutoFocus` prop.\n *\n * Generally this should never be set to `true` as it makes the modal less\n * accessible to assistive technologies, like screen readers.\n * @default false\n */\n disableAutoFocus: PropTypes.bool,\n /**\n * If `true`, the modal will not prevent focus from leaving the modal while open.\n *\n * Generally this should never be set to `true` as it makes the modal less\n * accessible to assistive technologies, like screen readers.\n * @default false\n */\n disableEnforceFocus: PropTypes.bool,\n /**\n * If `true`, hitting escape will not fire the `onClose` callback.\n * @default false\n */\n disableEscapeKeyDown: PropTypes.bool,\n /**\n * The `children` will be under the DOM hierarchy of the parent component.\n * @default false\n */\n disablePortal: PropTypes.bool,\n /**\n * If `true`, the modal will not restore focus to previously focused element once\n * modal is hidden or unmounted.\n * @default false\n */\n disableRestoreFocus: PropTypes.bool,\n /**\n * Disable the scroll lock behavior.\n * @default false\n */\n disableScrollLock: PropTypes.bool,\n /**\n * If `true`, the backdrop is not rendered.\n * @default false\n */\n hideBackdrop: PropTypes.bool,\n /**\n * Always keep the children in the DOM.\n * This prop can be useful in SEO situation or\n * when you want to maximize the responsiveness of the Modal.\n * @default false\n */\n keepMounted: PropTypes.bool,\n /**\n * Callback fired when the backdrop is clicked.\n * @deprecated Use the `onClose` prop with the `reason` argument to handle the `backdropClick` events.\n */\n onBackdropClick: PropTypes.func,\n /**\n * Callback fired when the component requests to be closed.\n * The `reason` parameter can optionally be used to control the response to `onClose`.\n *\n * @param {object} event The event source of the callback.\n * @param {string} reason Can be: `\"escapeKeyDown\"`, `\"backdropClick\"`.\n */\n onClose: PropTypes.func,\n /**\n * A function called when a transition enters.\n */\n onTransitionEnter: PropTypes.func,\n /**\n * A function called when a transition has exited.\n */\n onTransitionExited: PropTypes.func,\n /**\n * If `true`, the component is shown.\n */\n open: PropTypes.bool.isRequired,\n /**\n * The props used for each slot inside the Modal.\n * @default {}\n */\n slotProps: PropTypes.shape({\n backdrop: 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 Modal.\n * Either a string to use a HTML element or a component.\n * @default {}\n */\n slots: PropTypes.shape({\n backdrop: 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} : void 0;\nexport default Modal;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"addEndListener\", \"appear\", \"children\", \"container\", \"direction\", \"easing\", \"in\", \"onEnter\", \"onEntered\", \"onEntering\", \"onExit\", \"onExited\", \"onExiting\", \"style\", \"timeout\", \"TransitionComponent\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { Transition } from 'react-transition-group';\nimport chainPropTypes from '@mui/utils/chainPropTypes';\nimport HTMLElementType from '@mui/utils/HTMLElementType';\nimport elementAcceptingRef from '@mui/utils/elementAcceptingRef';\nimport getReactElementRef from '@mui/utils/getReactElementRef';\nimport debounce from '../utils/debounce';\nimport useForkRef from '../utils/useForkRef';\nimport useTheme from '../styles/useTheme';\nimport { reflow, getTransitionProps } from '../transitions/utils';\nimport { ownerWindow } from '../utils';\n\n// Translate the node so it can't be seen on the screen.\n// Later, we're going to translate the node back to its original location with `none`.\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction getTranslateValue(direction, node, resolvedContainer) {\n const rect = node.getBoundingClientRect();\n const containerRect = resolvedContainer && resolvedContainer.getBoundingClientRect();\n const containerWindow = ownerWindow(node);\n let transform;\n if (node.fakeTransform) {\n transform = node.fakeTransform;\n } else {\n const computedStyle = containerWindow.getComputedStyle(node);\n transform = computedStyle.getPropertyValue('-webkit-transform') || computedStyle.getPropertyValue('transform');\n }\n let offsetX = 0;\n let offsetY = 0;\n if (transform && transform !== 'none' && typeof transform === 'string') {\n const transformValues = transform.split('(')[1].split(')')[0].split(',');\n offsetX = parseInt(transformValues[4], 10);\n offsetY = parseInt(transformValues[5], 10);\n }\n if (direction === 'left') {\n if (containerRect) {\n return `translateX(${containerRect.right + offsetX - rect.left}px)`;\n }\n return `translateX(${containerWindow.innerWidth + offsetX - rect.left}px)`;\n }\n if (direction === 'right') {\n if (containerRect) {\n return `translateX(-${rect.right - containerRect.left - offsetX}px)`;\n }\n return `translateX(-${rect.left + rect.width - offsetX}px)`;\n }\n if (direction === 'up') {\n if (containerRect) {\n return `translateY(${containerRect.bottom + offsetY - rect.top}px)`;\n }\n return `translateY(${containerWindow.innerHeight + offsetY - rect.top}px)`;\n }\n\n // direction === 'down'\n if (containerRect) {\n return `translateY(-${rect.top - containerRect.top + rect.height - offsetY}px)`;\n }\n return `translateY(-${rect.top + rect.height - offsetY}px)`;\n}\nfunction resolveContainer(containerPropProp) {\n return typeof containerPropProp === 'function' ? containerPropProp() : containerPropProp;\n}\nexport function setTranslateValue(direction, node, containerProp) {\n const resolvedContainer = resolveContainer(containerProp);\n const transform = getTranslateValue(direction, node, resolvedContainer);\n if (transform) {\n node.style.webkitTransform = transform;\n node.style.transform = transform;\n }\n}\n\n/**\n * The Slide transition is used by the [Drawer](/material-ui/react-drawer/) component.\n * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.\n */\nconst Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {\n const theme = useTheme();\n const defaultEasing = {\n enter: theme.transitions.easing.easeOut,\n exit: theme.transitions.easing.sharp\n };\n const defaultTimeout = {\n enter: theme.transitions.duration.enteringScreen,\n exit: theme.transitions.duration.leavingScreen\n };\n const {\n addEndListener,\n appear = true,\n children,\n container: containerProp,\n direction = 'down',\n easing: easingProp = defaultEasing,\n in: inProp,\n onEnter,\n onEntered,\n onEntering,\n onExit,\n onExited,\n onExiting,\n style,\n timeout = defaultTimeout,\n // eslint-disable-next-line react/prop-types\n TransitionComponent = Transition\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const childrenRef = React.useRef(null);\n const handleRef = useForkRef(getReactElementRef(children), childrenRef, ref);\n const normalizedTransitionCallback = callback => isAppearing => {\n if (callback) {\n // onEnterXxx and onExitXxx callbacks have a different arguments.length value.\n if (isAppearing === undefined) {\n callback(childrenRef.current);\n } else {\n callback(childrenRef.current, isAppearing);\n }\n }\n };\n const handleEnter = normalizedTransitionCallback((node, isAppearing) => {\n setTranslateValue(direction, node, containerProp);\n reflow(node);\n if (onEnter) {\n onEnter(node, isAppearing);\n }\n });\n const handleEntering = normalizedTransitionCallback((node, isAppearing) => {\n const transitionProps = getTransitionProps({\n timeout,\n style,\n easing: easingProp\n }, {\n mode: 'enter'\n });\n node.style.webkitTransition = theme.transitions.create('-webkit-transform', _extends({}, transitionProps));\n node.style.transition = theme.transitions.create('transform', _extends({}, transitionProps));\n node.style.webkitTransform = 'none';\n node.style.transform = 'none';\n if (onEntering) {\n onEntering(node, isAppearing);\n }\n });\n const handleEntered = normalizedTransitionCallback(onEntered);\n const handleExiting = normalizedTransitionCallback(onExiting);\n const handleExit = normalizedTransitionCallback(node => {\n const transitionProps = getTransitionProps({\n timeout,\n style,\n easing: easingProp\n }, {\n mode: 'exit'\n });\n node.style.webkitTransition = theme.transitions.create('-webkit-transform', transitionProps);\n node.style.transition = theme.transitions.create('transform', transitionProps);\n setTranslateValue(direction, node, containerProp);\n if (onExit) {\n onExit(node);\n }\n });\n const handleExited = normalizedTransitionCallback(node => {\n // No need for transitions when the component is hidden\n node.style.webkitTransition = '';\n node.style.transition = '';\n if (onExited) {\n onExited(node);\n }\n });\n const handleAddEndListener = next => {\n if (addEndListener) {\n // Old call signature before `react-transition-group` implemented `nodeRef`\n addEndListener(childrenRef.current, next);\n }\n };\n const updatePosition = React.useCallback(() => {\n if (childrenRef.current) {\n setTranslateValue(direction, childrenRef.current, containerProp);\n }\n }, [direction, containerProp]);\n React.useEffect(() => {\n // Skip configuration where the position is screen size invariant.\n if (inProp || direction === 'down' || direction === 'right') {\n return undefined;\n }\n const handleResize = debounce(() => {\n if (childrenRef.current) {\n setTranslateValue(direction, childrenRef.current, containerProp);\n }\n });\n const containerWindow = ownerWindow(childrenRef.current);\n containerWindow.addEventListener('resize', handleResize);\n return () => {\n handleResize.clear();\n containerWindow.removeEventListener('resize', handleResize);\n };\n }, [direction, inProp, containerProp]);\n React.useEffect(() => {\n if (!inProp) {\n // We need to update the position of the drawer when the direction change and\n // when it's hidden.\n updatePosition();\n }\n }, [inProp, updatePosition]);\n return /*#__PURE__*/_jsx(TransitionComponent, _extends({\n nodeRef: childrenRef,\n onEnter: handleEnter,\n onEntered: handleEntered,\n onEntering: handleEntering,\n onExit: handleExit,\n onExited: handleExited,\n onExiting: handleExiting,\n addEndListener: handleAddEndListener,\n appear: appear,\n in: inProp,\n timeout: timeout\n }, other, {\n children: (state, childProps) => {\n return /*#__PURE__*/React.cloneElement(children, _extends({\n ref: handleRef,\n style: _extends({\n visibility: state === 'exited' && !inProp ? 'hidden' : undefined\n }, style, children.props.style)\n }, childProps));\n }\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Slide.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * Add a custom transition end trigger. Called with the transitioning DOM\n * node and a done callback. Allows for more fine grained transition end\n * logic. Note: Timeouts are still used as a fallback if provided.\n */\n addEndListener: PropTypes.func,\n /**\n * Perform the enter transition when it first mounts if `in` is also `true`.\n * Set this to `false` to disable this behavior.\n * @default true\n */\n appear: PropTypes.bool,\n /**\n * A single child content element.\n */\n children: elementAcceptingRef.isRequired,\n /**\n * An HTML element, or a function that returns one.\n * It's used to set the container the Slide is transitioning from.\n */\n container: chainPropTypes(PropTypes.oneOfType([HTMLElementType, PropTypes.func]), props => {\n if (props.open) {\n const resolvedContainer = resolveContainer(props.container);\n if (resolvedContainer && resolvedContainer.nodeType === 1) {\n const box = resolvedContainer.getBoundingClientRect();\n if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {\n return new Error(['MUI: The `container` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', \"Make sure the element is present in the document or that it's not display none.\"].join('\\n'));\n }\n } else if (!resolvedContainer || typeof resolvedContainer.getBoundingClientRect !== 'function' || resolvedContainer.contextElement != null && resolvedContainer.contextElement.nodeType !== 1) {\n return new Error(['MUI: The `container` prop provided to the component is invalid.', 'It should be an HTML element instance.'].join('\\n'));\n }\n }\n return null;\n }),\n /**\n * Direction the child node will enter from.\n * @default 'down'\n */\n direction: PropTypes.oneOf(['down', 'left', 'right', 'up']),\n /**\n * The transition timing function.\n * You may specify a single easing or a object containing enter and exit values.\n * @default {\n * enter: theme.transitions.easing.easeOut,\n * exit: theme.transitions.easing.sharp,\n * }\n */\n easing: PropTypes.oneOfType([PropTypes.shape({\n enter: PropTypes.string,\n exit: PropTypes.string\n }), PropTypes.string]),\n /**\n * If `true`, the component will transition in.\n */\n in: PropTypes.bool,\n /**\n * @ignore\n */\n onEnter: PropTypes.func,\n /**\n * @ignore\n */\n onEntered: PropTypes.func,\n /**\n * @ignore\n */\n onEntering: PropTypes.func,\n /**\n * @ignore\n */\n onExit: PropTypes.func,\n /**\n * @ignore\n */\n onExited: PropTypes.func,\n /**\n * @ignore\n */\n onExiting: PropTypes.func,\n /**\n * @ignore\n */\n style: PropTypes.object,\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 * @default {\n * enter: theme.transitions.duration.enteringScreen,\n * exit: theme.transitions.duration.leavingScreen,\n * }\n */\n timeout: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({\n appear: PropTypes.number,\n enter: PropTypes.number,\n exit: PropTypes.number\n })])\n} : void 0;\nexport default Slide;","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getDrawerUtilityClass(slot) {\n return generateUtilityClass('MuiDrawer', slot);\n}\nconst drawerClasses = generateUtilityClasses('MuiDrawer', ['root', 'docked', 'paper', 'paperAnchorLeft', 'paperAnchorRight', 'paperAnchorTop', 'paperAnchorBottom', 'paperAnchorDockedLeft', 'paperAnchorDockedRight', 'paperAnchorDockedTop', 'paperAnchorDockedBottom', 'modal']);\nexport default drawerClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"BackdropProps\"],\n _excluded2 = [\"anchor\", \"BackdropProps\", \"children\", \"className\", \"elevation\", \"hideBackdrop\", \"ModalProps\", \"onClose\", \"open\", \"PaperProps\", \"SlideProps\", \"TransitionComponent\", \"transitionDuration\", \"variant\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport integerPropType from '@mui/utils/integerPropType';\nimport composeClasses from '@mui/utils/composeClasses';\nimport { useRtl } from '@mui/system/RtlProvider';\nimport Modal from '../Modal';\nimport Slide from '../Slide';\nimport Paper from '../Paper';\nimport capitalize from '../utils/capitalize';\nimport useTheme from '../styles/useTheme';\nimport { useDefaultProps } from '../DefaultPropsProvider';\nimport styled, { rootShouldForwardProp } from '../styles/styled';\nimport { getDrawerUtilityClass } from './drawerClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst overridesResolver = (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, (ownerState.variant === 'permanent' || ownerState.variant === 'persistent') && styles.docked, styles.modal];\n};\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n anchor,\n variant\n } = ownerState;\n const slots = {\n root: ['root'],\n docked: [(variant === 'permanent' || variant === 'persistent') && 'docked'],\n modal: ['modal'],\n paper: ['paper', `paperAnchor${capitalize(anchor)}`, variant !== 'temporary' && `paperAnchorDocked${capitalize(anchor)}`]\n };\n return composeClasses(slots, getDrawerUtilityClass, classes);\n};\nconst DrawerRoot = styled(Modal, {\n name: 'MuiDrawer',\n slot: 'Root',\n overridesResolver\n})(({\n theme\n}) => ({\n zIndex: (theme.vars || theme).zIndex.drawer\n}));\nconst DrawerDockedRoot = styled('div', {\n shouldForwardProp: rootShouldForwardProp,\n name: 'MuiDrawer',\n slot: 'Docked',\n skipVariantsResolver: false,\n overridesResolver\n})({\n flex: '0 0 auto'\n});\nconst DrawerPaper = styled(Paper, {\n name: 'MuiDrawer',\n slot: 'Paper',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.paper, styles[`paperAnchor${capitalize(ownerState.anchor)}`], ownerState.variant !== 'temporary' && styles[`paperAnchorDocked${capitalize(ownerState.anchor)}`]];\n }\n})(({\n theme,\n ownerState\n}) => _extends({\n overflowY: 'auto',\n display: 'flex',\n flexDirection: 'column',\n height: '100%',\n flex: '1 0 auto',\n zIndex: (theme.vars || theme).zIndex.drawer,\n // Add iOS momentum scrolling for iOS < 13.0\n WebkitOverflowScrolling: 'touch',\n // temporary style\n position: 'fixed',\n top: 0,\n // We disable the focus ring for mouse, touch and keyboard users.\n // At some point, it would be better to keep it for keyboard users.\n // :focus-ring CSS pseudo-class will help.\n outline: 0\n}, ownerState.anchor === 'left' && {\n left: 0\n}, ownerState.anchor === 'top' && {\n top: 0,\n left: 0,\n right: 0,\n height: 'auto',\n maxHeight: '100%'\n}, ownerState.anchor === 'right' && {\n right: 0\n}, ownerState.anchor === 'bottom' && {\n top: 'auto',\n left: 0,\n bottom: 0,\n right: 0,\n height: 'auto',\n maxHeight: '100%'\n}, ownerState.anchor === 'left' && ownerState.variant !== 'temporary' && {\n borderRight: `1px solid ${(theme.vars || theme).palette.divider}`\n}, ownerState.anchor === 'top' && ownerState.variant !== 'temporary' && {\n borderBottom: `1px solid ${(theme.vars || theme).palette.divider}`\n}, ownerState.anchor === 'right' && ownerState.variant !== 'temporary' && {\n borderLeft: `1px solid ${(theme.vars || theme).palette.divider}`\n}, ownerState.anchor === 'bottom' && ownerState.variant !== 'temporary' && {\n borderTop: `1px solid ${(theme.vars || theme).palette.divider}`\n}));\nconst oppositeDirection = {\n left: 'right',\n right: 'left',\n top: 'down',\n bottom: 'up'\n};\nexport function isHorizontal(anchor) {\n return ['left', 'right'].indexOf(anchor) !== -1;\n}\nexport function getAnchor({\n direction\n}, anchor) {\n return direction === 'rtl' && isHorizontal(anchor) ? oppositeDirection[anchor] : anchor;\n}\n\n/**\n * The props of the [Modal](/material-ui/api/modal/) component are available\n * when `variant=\"temporary\"` is set.\n */\nconst Drawer = /*#__PURE__*/React.forwardRef(function Drawer(inProps, ref) {\n const props = useDefaultProps({\n props: inProps,\n name: 'MuiDrawer'\n });\n const theme = useTheme();\n const isRtl = useRtl();\n const defaultTransitionDuration = {\n enter: theme.transitions.duration.enteringScreen,\n exit: theme.transitions.duration.leavingScreen\n };\n const {\n anchor: anchorProp = 'left',\n BackdropProps,\n children,\n className,\n elevation = 16,\n hideBackdrop = false,\n ModalProps: {\n BackdropProps: BackdropPropsProp\n } = {},\n onClose,\n open = false,\n PaperProps = {},\n SlideProps,\n // eslint-disable-next-line react/prop-types\n TransitionComponent = Slide,\n transitionDuration = defaultTransitionDuration,\n variant = 'temporary'\n } = props,\n ModalProps = _objectWithoutPropertiesLoose(props.ModalProps, _excluded),\n other = _objectWithoutPropertiesLoose(props, _excluded2);\n\n // Let's assume that the Drawer will always be rendered on user space.\n // We use this state is order to skip the appear transition during the\n // initial mount of the component.\n const mounted = React.useRef(false);\n React.useEffect(() => {\n mounted.current = true;\n }, []);\n const anchorInvariant = getAnchor({\n direction: isRtl ? 'rtl' : 'ltr'\n }, anchorProp);\n const anchor = anchorProp;\n const ownerState = _extends({}, props, {\n anchor,\n elevation,\n open,\n variant\n }, other);\n const classes = useUtilityClasses(ownerState);\n const drawer = /*#__PURE__*/_jsx(DrawerPaper, _extends({\n elevation: variant === 'temporary' ? elevation : 0,\n square: true\n }, PaperProps, {\n className: clsx(classes.paper, PaperProps.className),\n ownerState: ownerState,\n children: children\n }));\n if (variant === 'permanent') {\n return /*#__PURE__*/_jsx(DrawerDockedRoot, _extends({\n className: clsx(classes.root, classes.docked, className),\n ownerState: ownerState,\n ref: ref\n }, other, {\n children: drawer\n }));\n }\n const slidingDrawer = /*#__PURE__*/_jsx(TransitionComponent, _extends({\n in: open,\n direction: oppositeDirection[anchorInvariant],\n timeout: transitionDuration,\n appear: mounted.current\n }, SlideProps, {\n children: drawer\n }));\n if (variant === 'persistent') {\n return /*#__PURE__*/_jsx(DrawerDockedRoot, _extends({\n className: clsx(classes.root, classes.docked, className),\n ownerState: ownerState,\n ref: ref\n }, other, {\n children: slidingDrawer\n }));\n }\n\n // variant === temporary\n return /*#__PURE__*/_jsx(DrawerRoot, _extends({\n BackdropProps: _extends({}, BackdropProps, BackdropPropsProp, {\n transitionDuration\n }),\n className: clsx(classes.root, classes.modal, className),\n open: open,\n ownerState: ownerState,\n onClose: onClose,\n hideBackdrop: hideBackdrop,\n ref: ref\n }, other, ModalProps, {\n children: slidingDrawer\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Drawer.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * Side from which the drawer will appear.\n * @default 'left'\n */\n anchor: PropTypes.oneOf(['bottom', 'left', 'right', 'top']),\n /**\n * @ignore\n */\n BackdropProps: PropTypes.object,\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 elevation of the drawer.\n * @default 16\n */\n elevation: integerPropType,\n /**\n * If `true`, the backdrop is not rendered.\n * @default false\n */\n hideBackdrop: PropTypes.bool,\n /**\n * Props applied to the [`Modal`](/material-ui/api/modal/) element.\n * @default {}\n */\n ModalProps: PropTypes.object,\n /**\n * Callback fired when the component requests to be closed.\n * The `reason` parameter can optionally be used to control the response to `onClose`.\n *\n * @param {object} event The event source of the callback.\n * @param {string} reason Can be: `\"escapeKeyDown\"`, `\"backdropClick\"`.\n */\n onClose: PropTypes.func,\n /**\n * If `true`, the component is shown.\n * @default false\n */\n open: PropTypes.bool,\n /**\n * Props applied to the [`Paper`](/material-ui/api/paper/) element.\n * @default {}\n */\n PaperProps: PropTypes.object,\n /**\n * Props applied to the [`Slide`](/material-ui/api/slide/) element.\n */\n SlideProps: PropTypes.object,\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 duration for the transition, in milliseconds.\n * You may specify a single timeout for all transitions, or individually with an object.\n * @default {\n * enter: theme.transitions.duration.enteringScreen,\n * exit: theme.transitions.duration.leavingScreen,\n * }\n */\n transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({\n appear: PropTypes.number,\n enter: PropTypes.number,\n exit: PropTypes.number\n })]),\n /**\n * The variant to use.\n * @default 'temporary'\n */\n variant: PropTypes.oneOf(['permanent', 'persistent', 'temporary'])\n} : void 0;\nexport default Drawer;","import * as React from 'react';\nconst ThemeContext = /*#__PURE__*/React.createContext(null);\nif (process.env.NODE_ENV !== 'production') {\n ThemeContext.displayName = 'ThemeContext';\n}\nexport default ThemeContext;","import * as React from 'react';\nimport ThemeContext from './ThemeContext';\nexport default function useTheme() {\n const theme = React.useContext(ThemeContext);\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useDebugValue(theme);\n }\n return theme;\n}","const hasSymbol = typeof Symbol === 'function' && Symbol.for;\nexport default hasSymbol ? Symbol.for('mui.nested') : '__THEME_NESTED__';","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { exactProp } from '@mui/utils';\nimport ThemeContext from '../useTheme/ThemeContext';\nimport useTheme from '../useTheme';\nimport nested from './nested';\n\n// To support composition of theme.\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction mergeOuterLocalTheme(outerTheme, localTheme) {\n if (typeof localTheme === 'function') {\n const mergedTheme = localTheme(outerTheme);\n if (process.env.NODE_ENV !== 'production') {\n if (!mergedTheme) {\n console.error(['MUI: You should return an object from your theme function, i.e.', ' ({})} />'].join('\\n'));\n }\n }\n return mergedTheme;\n }\n return _extends({}, outerTheme, localTheme);\n}\n\n/**\n * This component takes a `theme` prop.\n * It makes the `theme` available down the React tree thanks to React context.\n * This component should preferably be used at **the root of your component tree**.\n */\nfunction ThemeProvider(props) {\n const {\n children,\n theme: localTheme\n } = props;\n const outerTheme = useTheme();\n if (process.env.NODE_ENV !== 'production') {\n if (outerTheme === null && typeof localTheme === 'function') {\n console.error(['MUI: You are providing a theme function prop to the ThemeProvider component:', ' outerTheme} />', '', 'However, no outer theme is present.', 'Make sure a theme is already injected higher in the React tree ' + 'or provide a theme object.'].join('\\n'));\n }\n }\n const theme = React.useMemo(() => {\n const output = outerTheme === null ? localTheme : mergeOuterLocalTheme(outerTheme, localTheme);\n if (output != null) {\n output[nested] = outerTheme !== null;\n }\n return output;\n }, [localTheme, outerTheme]);\n return /*#__PURE__*/_jsx(ThemeContext.Provider, {\n value: theme,\n children: children\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? ThemeProvider.propTypes = {\n /**\n * Your component tree.\n */\n children: PropTypes.node,\n /**\n * A theme object. You can provide a function to extend the outer theme.\n */\n theme: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).isRequired\n} : void 0;\nif (process.env.NODE_ENV !== 'production') {\n process.env.NODE_ENV !== \"production\" ? ThemeProvider.propTypes = exactProp(ThemeProvider.propTypes) : void 0;\n}\nexport default ThemeProvider;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { ThemeProvider as MuiThemeProvider, useTheme as usePrivateTheme } from '@mui/private-theming';\nimport exactProp from '@mui/utils/exactProp';\nimport { ThemeContext as StyledEngineThemeContext } from '@mui/styled-engine';\nimport useThemeWithoutDefault from '../useThemeWithoutDefault';\nimport RtlProvider from '../RtlProvider';\nimport DefaultPropsProvider from '../DefaultPropsProvider';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst EMPTY_THEME = {};\nfunction useThemeScoping(themeId, upperTheme, localTheme, isPrivate = false) {\n return React.useMemo(() => {\n const resolvedTheme = themeId ? upperTheme[themeId] || upperTheme : upperTheme;\n if (typeof localTheme === 'function') {\n const mergedTheme = localTheme(resolvedTheme);\n const result = themeId ? _extends({}, upperTheme, {\n [themeId]: mergedTheme\n }) : mergedTheme;\n // must return a function for the private theme to NOT merge with the upper theme.\n // see the test case \"use provided theme from a callback\" in ThemeProvider.test.js\n if (isPrivate) {\n return () => result;\n }\n return result;\n }\n return themeId ? _extends({}, upperTheme, {\n [themeId]: localTheme\n }) : _extends({}, upperTheme, localTheme);\n }, [themeId, upperTheme, localTheme, isPrivate]);\n}\n\n/**\n * This component makes the `theme` available down the React tree.\n * It should preferably be used at **the root of your component tree**.\n *\n * // existing use case\n * // theme scoping\n */\nfunction ThemeProvider(props) {\n const {\n children,\n theme: localTheme,\n themeId\n } = props;\n const upperTheme = useThemeWithoutDefault(EMPTY_THEME);\n const upperPrivateTheme = usePrivateTheme() || EMPTY_THEME;\n if (process.env.NODE_ENV !== 'production') {\n if (upperTheme === null && typeof localTheme === 'function' || themeId && upperTheme && !upperTheme[themeId] && typeof localTheme === 'function') {\n console.error(['MUI: You are providing a theme function prop to the ThemeProvider component:', ' outerTheme} />', '', 'However, no outer theme is present.', 'Make sure a theme is already injected higher in the React tree ' + 'or provide a theme object.'].join('\\n'));\n }\n }\n const engineTheme = useThemeScoping(themeId, upperTheme, localTheme);\n const privateTheme = useThemeScoping(themeId, upperPrivateTheme, localTheme, true);\n const rtlValue = engineTheme.direction === 'rtl';\n return /*#__PURE__*/_jsx(MuiThemeProvider, {\n theme: privateTheme,\n children: /*#__PURE__*/_jsx(StyledEngineThemeContext.Provider, {\n value: engineTheme,\n children: /*#__PURE__*/_jsx(RtlProvider, {\n value: rtlValue,\n children: /*#__PURE__*/_jsx(DefaultPropsProvider, {\n value: engineTheme == null ? void 0 : engineTheme.components,\n children: children\n })\n })\n })\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? ThemeProvider.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * Your component tree.\n */\n children: PropTypes.node,\n /**\n * A theme object. You can provide a function to extend the outer theme.\n */\n theme: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).isRequired,\n /**\n * The design system's unique id for getting the corresponded theme when there are multiple design systems.\n */\n themeId: PropTypes.string\n} : void 0;\nif (process.env.NODE_ENV !== 'production') {\n process.env.NODE_ENV !== \"production\" ? ThemeProvider.propTypes = exactProp(ThemeProvider.propTypes) : void 0;\n}\nexport default ThemeProvider;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"theme\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { ThemeProvider as SystemThemeProvider } from '@mui/system';\nimport THEME_ID from './identifier';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default function ThemeProvider(_ref) {\n let {\n theme: themeInput\n } = _ref,\n props = _objectWithoutPropertiesLoose(_ref, _excluded);\n const scopedTheme = themeInput[THEME_ID];\n return /*#__PURE__*/_jsx(SystemThemeProvider, _extends({}, props, {\n themeId: scopedTheme ? THEME_ID : undefined,\n theme: scopedTheme || themeInput\n }));\n}\nprocess.env.NODE_ENV !== \"production\" ? ThemeProvider.propTypes = {\n /**\n * Your component tree.\n */\n children: PropTypes.node,\n /**\n * A theme object. You can provide a function to extend the outer theme.\n */\n theme: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).isRequired\n} : void 0;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { useDefaultProps } from '../DefaultPropsProvider';\nimport GlobalStyles from '../GlobalStyles';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nexport const html = (theme, enableColorScheme) => _extends({\n WebkitFontSmoothing: 'antialiased',\n // Antialiasing.\n MozOsxFontSmoothing: 'grayscale',\n // Antialiasing.\n // Change from `box-sizing: content-box` so that `width`\n // is not affected by `padding` or `border`.\n boxSizing: 'border-box',\n // Fix font resize problem in iOS\n WebkitTextSizeAdjust: '100%'\n}, enableColorScheme && !theme.vars && {\n colorScheme: theme.palette.mode\n});\nexport const body = theme => _extends({\n color: (theme.vars || theme).palette.text.primary\n}, theme.typography.body1, {\n backgroundColor: (theme.vars || theme).palette.background.default,\n '@media print': {\n // Save printer ink.\n backgroundColor: (theme.vars || theme).palette.common.white\n }\n});\nexport const styles = (theme, enableColorScheme = false) => {\n var _theme$components;\n const colorSchemeStyles = {};\n if (enableColorScheme && theme.colorSchemes) {\n Object.entries(theme.colorSchemes).forEach(([key, scheme]) => {\n var _scheme$palette;\n colorSchemeStyles[theme.getColorSchemeSelector(key).replace(/\\s*&/, '')] = {\n colorScheme: (_scheme$palette = scheme.palette) == null ? void 0 : _scheme$palette.mode\n };\n });\n }\n let defaultStyles = _extends({\n html: html(theme, enableColorScheme),\n '*, *::before, *::after': {\n boxSizing: 'inherit'\n },\n 'strong, b': {\n fontWeight: theme.typography.fontWeightBold\n },\n body: _extends({\n margin: 0\n }, body(theme), {\n // Add support for document.body.requestFullScreen().\n // Other elements, if background transparent, are not supported.\n '&::backdrop': {\n backgroundColor: (theme.vars || theme).palette.background.default\n }\n })\n }, colorSchemeStyles);\n const themeOverrides = (_theme$components = theme.components) == null || (_theme$components = _theme$components.MuiCssBaseline) == null ? void 0 : _theme$components.styleOverrides;\n if (themeOverrides) {\n defaultStyles = [defaultStyles, themeOverrides];\n }\n return defaultStyles;\n};\n\n/**\n * Kickstart an elegant, consistent, and simple baseline to build upon.\n */\nfunction CssBaseline(inProps) {\n const props = useDefaultProps({\n props: inProps,\n name: 'MuiCssBaseline'\n });\n const {\n children,\n enableColorScheme = false\n } = props;\n return /*#__PURE__*/_jsxs(React.Fragment, {\n children: [/*#__PURE__*/_jsx(GlobalStyles, {\n styles: theme => styles(theme, enableColorScheme)\n }), children]\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? CssBaseline.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * You can wrap a node.\n */\n children: PropTypes.node,\n /**\n * Enable `color-scheme` CSS property to use `theme.palette.mode`.\n * For more details, check out https://developer.mozilla.org/en-US/docs/Web/CSS/color-scheme\n * For browser support, check out https://caniuse.com/?search=color-scheme\n * @default false\n */\n enableColorScheme: PropTypes.bool\n} : void 0;\nexport default CssBaseline;","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getScopedCssBaselineUtilityClass(slot) {\n return generateUtilityClass('MuiScopedCssBaseline', slot);\n}\nconst scopedCssBaselineClasses = generateUtilityClasses('MuiScopedCssBaseline', ['root']);\nexport default scopedCssBaselineClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"className\", \"component\", \"enableColorScheme\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport composeClasses from '@mui/utils/composeClasses';\nimport { useDefaultProps } from '../DefaultPropsProvider';\nimport styled from '../styles/styled';\nimport { html, body } from '../CssBaseline/CssBaseline';\nimport { getScopedCssBaselineUtilityClass } from './scopedCssBaselineClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['root']\n };\n return composeClasses(slots, getScopedCssBaselineUtilityClass, classes);\n};\nconst ScopedCssBaselineRoot = styled('div', {\n name: 'MuiScopedCssBaseline',\n slot: 'Root',\n overridesResolver: (props, styles) => styles.root\n})(({\n theme,\n ownerState\n}) => {\n const colorSchemeStyles = {};\n if (ownerState.enableColorScheme && theme.colorSchemes) {\n Object.entries(theme.colorSchemes).forEach(([key, scheme]) => {\n var _scheme$palette;\n colorSchemeStyles[`&${theme.getColorSchemeSelector(key).replace(/\\s*&/, '')}`] = {\n colorScheme: (_scheme$palette = scheme.palette) == null ? void 0 : _scheme$palette.mode\n };\n });\n }\n return _extends({}, html(theme, ownerState.enableColorScheme), body(theme), {\n '& *, & *::before, & *::after': {\n boxSizing: 'inherit'\n },\n '& strong, & b': {\n fontWeight: theme.typography.fontWeightBold\n }\n }, colorSchemeStyles);\n});\nconst ScopedCssBaseline = /*#__PURE__*/React.forwardRef(function ScopedCssBaseline(inProps, ref) {\n const props = useDefaultProps({\n props: inProps,\n name: 'MuiScopedCssBaseline'\n });\n const {\n className,\n component = 'div'\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n component\n });\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(ScopedCssBaselineRoot, _extends({\n as: component,\n className: clsx(classes.root, className),\n ref: ref,\n ownerState: ownerState\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? ScopedCssBaseline.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * The 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 * Enable `color-scheme` CSS property to use `theme.palette.mode`.\n * For more details, check out https://developer.mozilla.org/en-US/docs/Web/CSS/color-scheme\n * For browser support, check out https://caniuse.com/?search=color-scheme\n */\n enableColorScheme: PropTypes.bool,\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])\n} : void 0;\nexport default ScopedCssBaseline;","import React from 'react';\nimport resolveConfig from 'tailwindcss/resolveConfig'\nimport { ThemeProvider, createTheme } from '@mui/material/styles';\nimport { SimplePaletteColorOptions, ColorPartial } from '@mui/material/styles/createPalette';\nimport ScopedCssBaseline from '@mui/material/ScopedCssBaseline';\nimport tw from 'twin.macro';\nimport styled from 'styled-components';\n\nimport tailwindConfig from '../../src/tailwind.config';\n\ntype TWColorType = { DEFAULT: string } & ColorPartial;\n\nconst venusTheme = resolveConfig(tailwindConfig)?.theme;\n\nconst getMUIColor = (color: TWColorType, textColor: TWColorType): SimplePaletteColorOptions => ({\n light: color[500],\n main: color[800],\n dark: color[900],\n contrastText: textColor[100],\n});\n\nconst typographyDefaults = {\n body1: tw`font-primary text-base text-black subpixel-antialiased`,\n body2: tw`font-primary text-base text-black subpixel-antialiased`,\n h1: tw`font-heading subpixel-antialiased text-4xl font-semibold tracking-wide`,\n h2: tw`font-heading subpixel-antialiased text-3xl font-semibold tracking-wide`,\n h3: tw`font-heading subpixel-antialiased text-2xl font-semibold tracking-wide`,\n h4: tw`font-heading subpixel-antialiased text-lg font-semibold`,\n h5: tw`font-secondary lining-nums text-lg underline text-primary`,\n h6: tw`font-secondary lining-nums text-sm font-bold`,\n subtitle1: tw`font-heading`,\n subtitle2: tw`font-heading`,\n button: tw`font-secondary uppercase`,\n caption: tw`font-secondary`,\n overline: tw`font-secondary`,\n a: tw`hover:underline`,\n};\n\nconst VenusCssBaseLine = styled(ScopedCssBaseline)`\n \n .alt {\n ${typographyDefaults.body2} \n }\n\n .alt2 {\n ${tw`text-primary text-center`} \n }\n \n .subtitle {\n ${typographyDefaults.subtitle1}\n \n &.alt {\n ${typographyDefaults.subtitle2}\n }\n }\n \n h1 {\n ${typographyDefaults.h1}\n ${tw`clear-both`}\n }\n \n h2 {\n ${typographyDefaults.h2}\n ${tw`clear-both`}\n }\n \n h3 {\n ${typographyDefaults.h3} \n ${tw`clear-both`}\n }\n \n h4 {\n ${typographyDefaults.h4}\n }\n \n h5 {\n ${typographyDefaults.h5}\n }\n \n h6 {\n ${typographyDefaults.h6}\n }\n \n a {\n ${typographyDefaults.a}\n }\n \n button {\n ${typographyDefaults.button}\n }\n\n pre {\n ${tw`break-words overflow-x-auto whitespace-pre-wrap`}\n }\n\n img {\n ${tw`my-0`}\n }\n`;\n\nconst theme = createTheme({\n palette: {\n type: 'light',\n contrastThreshold: 3,\n tonalOffset: 0.2,\n primary: getMUIColor(venusTheme.colors.primary, venusTheme.colors['default-color']),\n secondary: getMUIColor(venusTheme.colors.secondary, venusTheme.colors['default-color']),\n info: getMUIColor(venusTheme.colors.info, venusTheme.colors['default-color']),\n warning: getMUIColor(venusTheme.colors.warning, venusTheme.colors['default-color']),\n error: getMUIColor(venusTheme.colors.error, venusTheme.colors['default-color']),\n },\n typography: typographyDefaults,\n});\n\nconst VenusThemeProvider = ({ children }) => (\n \n {children}\n \n);\n\nexport {\n VenusThemeProvider,\n typographyDefaults,\n};\n","import React from 'react';\nimport Drawer from '@mui/material/Drawer';\n\nimport { VenusThemeProvider } from '../../styles/venus-style';\n\nconst DrawerWrapper = ({ children, ...rest }) => (\n \n {children}\n \n);\n\nexport default DrawerWrapper;\n","import React from 'react';\nimport styled from 'styled-components';\nimport tw from 'twin.macro';\n\nimport { Link as _Link } from '@taboola/venus-core/src/components/link';\n\nconst Link = styled(_Link)`\n ${tw`\n flex flex-col\n hover:bg-gray-100\n py-3 px-2 xl:px-5\n `}\n`;\n\nconst Item = ({ article, onClick }) => {\n const slug = article?.slug;\n const title = article?.title;\n\n return (\n \n \n \n {title}\n
\n \n \n );\n};\n\nexport default Item;\n","import React from 'react';\nimport tw from 'twin.macro';\nimport styled from 'styled-components';\n\nimport ListItem from './list-item';\nimport { isNotEmpty } from '../../utils/collections';\n\nconst Container = styled.div`\n ${tw`\n xl:w-1/4\n space-y-2 xl:space-y-5 \n `}\n`;\n\nconst Header = styled.h3`\n ${tw`\n xl:px-4\n text-other\n text-lg \n `}\n`;\n\nconst List = ({ title, items, onLinkClick }) => (\n \n \n \n {items.filter(isNotEmpty).map((article) => (\n \n ))}\n
\n \n);\n\nexport default List;\n","import React from 'react';\nimport { FaBars } from '@react-icons/all-files/fa/FaBars';\nimport { FaTimes } from '@react-icons/all-files/fa/FaTimes';\n\nimport IconButton from '../mui-wrappers/icon-button-wrapper';\n\nconst MenuButton = ({ isOpen, ...rest }) => (\n \n {isOpen ? : }\n \n);\n\nexport default MenuButton;\n","import React from 'react';\nimport tw from 'twin.macro';\nimport styled from 'styled-components';\n\nimport { isNotEmpty } from '../../utils/collections';\nimport useDrawerCustomSSR from '../../hooks/useDrawerCustomSSR';\nimport { ArticleCard } from '../articles';\nimport _Drawer from './drawer-wrapper';\nimport NavLinkList from './list';\nimport CloseButton from './menu-button';\n\nconst Drawer = styled(_Drawer)`\n ${tw`hidden xl:block`}\n \n .MuiPaper-root {\n ${tw`\n w-full 2xl:w-5/6\n mt-24 mx-auto\n shadow-2xl rounded-b-md\n `}\n }\n`;\n\nconst Hideable = styled.div`\n ${tw`flex`}\n ${({ $isHidden }) => $isHidden && tw`hidden`}\n`;\n\nconst Container = styled.div`\n ${tw`\n relative\n flex flex-col\n `}\n`;\n\nconst SectionWrapper = styled.div`\n ${tw`py-8`}\n`;\n\nconst Section = styled(Hideable)`\n ${tw`divide-x`}\n`;\n\nconst FeaturedArticle = styled(ArticleCard)`\n ${tw`w-7/12 m-auto`}\n \n .image {\n // https://github.com/gatsbyjs/gatsby/issues/30952\n ${tw`w-1/4 pointer-events-none`}\n }\n\n .title {\n ${tw`text-base`}\n }\n\n .details {\n ${tw`text-xs w-3/4 py-1`}\n }\n`;\n\nconst DesktopDrawer = ({ featured, className, links, setClose, setOpen, isOpen, setActiveKey, activeKey }) => {\n const variant = useDrawerCustomSSR();\n const openHandler = () => {\n setActiveKey(activeKey);\n setOpen();\n };\n\n return (\n \n \n \n \n
\n {isNotEmpty(featured) && (\n \n {featured.map(([slug, [article]]) => (\n \n ))}\n \n )}\n {isNotEmpty(links) && (\n \n {links.map(([slug, lists]) => (\n \n {lists.filter(isNotEmpty).map(({ key, title, articles }) => (\n \n ))}\n \n ))}\n \n )}\n \n \n );\n};\n\nexport default DesktopDrawer;\n","import styled from 'styled-components';\nimport tw from 'twin.macro';\n\nimport _DesktopDrawer from '@taboola/venus-core/src/components/navigation-menu/desktop-drawer';\n\nconst DesktopDrawer = styled(_DesktopDrawer)`\n .MuiPaper-root {\n ${tw`w-full xl:(container) mt-[11.3rem]`}\n }\n\n h3.menu-section-title {\n ${tw`text-black font-primary uppercase text-lg my-0`}\n }\n\n span {\n ${tw`font-heading text-sm`}\n }\n`;\n\nexport default DesktopDrawer;\n","import React from 'react';\nimport 'twin.macro';\n\nimport MenuBar from '@taboola/venus-core/src/components/navigation-menu/menu-bar';\n\nimport DesktopDrawer from './desktop-drawer';\n\nconst NavMenu = (props) => (\n \n);\n\nexport default NavMenu;\n","export default function getWindow(node) {\n if (node == null) {\n return window;\n }\n\n if (node.toString() !== '[object Window]') {\n var ownerDocument = node.ownerDocument;\n return ownerDocument ? ownerDocument.defaultView || window : window;\n }\n\n return node;\n}","import getWindow from \"./getWindow.js\";\n\nfunction isElement(node) {\n var OwnElement = getWindow(node).Element;\n return node instanceof OwnElement || node instanceof Element;\n}\n\nfunction isHTMLElement(node) {\n var OwnElement = getWindow(node).HTMLElement;\n return node instanceof OwnElement || node instanceof HTMLElement;\n}\n\nfunction isShadowRoot(node) {\n // IE 11 has no ShadowRoot\n if (typeof ShadowRoot === 'undefined') {\n return false;\n }\n\n var OwnElement = getWindow(node).ShadowRoot;\n return node instanceof OwnElement || node instanceof ShadowRoot;\n}\n\nexport { isElement, isHTMLElement, isShadowRoot };","export var max = Math.max;\nexport var min = Math.min;\nexport var round = Math.round;","export default function getUAString() {\n var uaData = navigator.userAgentData;\n\n if (uaData != null && uaData.brands && Array.isArray(uaData.brands)) {\n return uaData.brands.map(function (item) {\n return item.brand + \"/\" + item.version;\n }).join(' ');\n }\n\n return navigator.userAgent;\n}","import getUAString from \"../utils/userAgent.js\";\nexport default function isLayoutViewport() {\n return !/^((?!chrome|android).)*safari/i.test(getUAString());\n}","import { isElement, isHTMLElement } from \"./instanceOf.js\";\nimport { round } from \"../utils/math.js\";\nimport getWindow from \"./getWindow.js\";\nimport isLayoutViewport from \"./isLayoutViewport.js\";\nexport default function getBoundingClientRect(element, includeScale, isFixedStrategy) {\n if (includeScale === void 0) {\n includeScale = false;\n }\n\n if (isFixedStrategy === void 0) {\n isFixedStrategy = false;\n }\n\n var clientRect = element.getBoundingClientRect();\n var scaleX = 1;\n var scaleY = 1;\n\n if (includeScale && isHTMLElement(element)) {\n scaleX = element.offsetWidth > 0 ? round(clientRect.width) / element.offsetWidth || 1 : 1;\n scaleY = element.offsetHeight > 0 ? round(clientRect.height) / element.offsetHeight || 1 : 1;\n }\n\n var _ref = isElement(element) ? getWindow(element) : window,\n visualViewport = _ref.visualViewport;\n\n var addVisualOffsets = !isLayoutViewport() && isFixedStrategy;\n var x = (clientRect.left + (addVisualOffsets && visualViewport ? visualViewport.offsetLeft : 0)) / scaleX;\n var y = (clientRect.top + (addVisualOffsets && visualViewport ? visualViewport.offsetTop : 0)) / scaleY;\n var width = clientRect.width / scaleX;\n var height = clientRect.height / scaleY;\n return {\n width: width,\n height: height,\n top: y,\n right: x + width,\n bottom: y + height,\n left: x,\n x: x,\n y: y\n };\n}","import getWindow from \"./getWindow.js\";\nexport default function getWindowScroll(node) {\n var win = getWindow(node);\n var scrollLeft = win.pageXOffset;\n var scrollTop = win.pageYOffset;\n return {\n scrollLeft: scrollLeft,\n scrollTop: scrollTop\n };\n}","export default function getNodeName(element) {\n return element ? (element.nodeName || '').toLowerCase() : null;\n}","import { isElement } from \"./instanceOf.js\";\nexport default function getDocumentElement(element) {\n // $FlowFixMe[incompatible-return]: assume body is always available\n return ((isElement(element) ? element.ownerDocument : // $FlowFixMe[prop-missing]\n element.document) || window.document).documentElement;\n}","import getBoundingClientRect from \"./getBoundingClientRect.js\";\nimport getDocumentElement from \"./getDocumentElement.js\";\nimport getWindowScroll from \"./getWindowScroll.js\";\nexport default function getWindowScrollBarX(element) {\n // If has a CSS width greater than the viewport, then this will be\n // incorrect for RTL.\n // Popper 1 is broken in this case and never had a bug report so let's assume\n // it's not an issue. I don't think anyone ever specifies width on \n // anyway.\n // Browsers where the left scrollbar doesn't cause an issue report `0` for\n // this (e.g. Edge 2019, IE11, Safari)\n return getBoundingClientRect(getDocumentElement(element)).left + getWindowScroll(element).scrollLeft;\n}","import getWindow from \"./getWindow.js\";\nexport default function getComputedStyle(element) {\n return getWindow(element).getComputedStyle(element);\n}","import getComputedStyle from \"./getComputedStyle.js\";\nexport default function isScrollParent(element) {\n // Firefox wants us to check `-x` and `-y` variations as well\n var _getComputedStyle = getComputedStyle(element),\n overflow = _getComputedStyle.overflow,\n overflowX = _getComputedStyle.overflowX,\n overflowY = _getComputedStyle.overflowY;\n\n return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);\n}","import getBoundingClientRect from \"./getBoundingClientRect.js\";\nimport getNodeScroll from \"./getNodeScroll.js\";\nimport getNodeName from \"./getNodeName.js\";\nimport { isHTMLElement } from \"./instanceOf.js\";\nimport getWindowScrollBarX from \"./getWindowScrollBarX.js\";\nimport getDocumentElement from \"./getDocumentElement.js\";\nimport isScrollParent from \"./isScrollParent.js\";\nimport { round } from \"../utils/math.js\";\n\nfunction isElementScaled(element) {\n var rect = element.getBoundingClientRect();\n var scaleX = round(rect.width) / element.offsetWidth || 1;\n var scaleY = round(rect.height) / element.offsetHeight || 1;\n return scaleX !== 1 || scaleY !== 1;\n} // Returns the composite rect of an element relative to its offsetParent.\n// Composite means it takes into account transforms as well as layout.\n\n\nexport default function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {\n if (isFixed === void 0) {\n isFixed = false;\n }\n\n var isOffsetParentAnElement = isHTMLElement(offsetParent);\n var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);\n var documentElement = getDocumentElement(offsetParent);\n var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled, isFixed);\n var scroll = {\n scrollLeft: 0,\n scrollTop: 0\n };\n var offsets = {\n x: 0,\n y: 0\n };\n\n if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {\n if (getNodeName(offsetParent) !== 'body' || // https://github.com/popperjs/popper-core/issues/1078\n isScrollParent(documentElement)) {\n scroll = getNodeScroll(offsetParent);\n }\n\n if (isHTMLElement(offsetParent)) {\n offsets = getBoundingClientRect(offsetParent, true);\n offsets.x += offsetParent.clientLeft;\n offsets.y += offsetParent.clientTop;\n } else if (documentElement) {\n offsets.x = getWindowScrollBarX(documentElement);\n }\n }\n\n return {\n x: rect.left + scroll.scrollLeft - offsets.x,\n y: rect.top + scroll.scrollTop - offsets.y,\n width: rect.width,\n height: rect.height\n };\n}","import getWindowScroll from \"./getWindowScroll.js\";\nimport getWindow from \"./getWindow.js\";\nimport { isHTMLElement } from \"./instanceOf.js\";\nimport getHTMLElementScroll from \"./getHTMLElementScroll.js\";\nexport default function getNodeScroll(node) {\n if (node === getWindow(node) || !isHTMLElement(node)) {\n return getWindowScroll(node);\n } else {\n return getHTMLElementScroll(node);\n }\n}","export default function getHTMLElementScroll(element) {\n return {\n scrollLeft: element.scrollLeft,\n scrollTop: element.scrollTop\n };\n}","import getBoundingClientRect from \"./getBoundingClientRect.js\"; // Returns the layout rect of an element relative to its offsetParent. Layout\n// means it doesn't take into account transforms.\n\nexport default function getLayoutRect(element) {\n var clientRect = getBoundingClientRect(element); // Use the clientRect sizes if it's not been transformed.\n // Fixes https://github.com/popperjs/popper-core/issues/1223\n\n var width = element.offsetWidth;\n var height = element.offsetHeight;\n\n if (Math.abs(clientRect.width - width) <= 1) {\n width = clientRect.width;\n }\n\n if (Math.abs(clientRect.height - height) <= 1) {\n height = clientRect.height;\n }\n\n return {\n x: element.offsetLeft,\n y: element.offsetTop,\n width: width,\n height: height\n };\n}","import getNodeName from \"./getNodeName.js\";\nimport getDocumentElement from \"./getDocumentElement.js\";\nimport { isShadowRoot } from \"./instanceOf.js\";\nexport default function getParentNode(element) {\n if (getNodeName(element) === 'html') {\n return element;\n }\n\n return (// this is a quicker (but less type safe) way to save quite some bytes from the bundle\n // $FlowFixMe[incompatible-return]\n // $FlowFixMe[prop-missing]\n element.assignedSlot || // step into the shadow DOM of the parent of a slotted node\n element.parentNode || ( // DOM Element detected\n isShadowRoot(element) ? element.host : null) || // ShadowRoot detected\n // $FlowFixMe[incompatible-call]: HTMLElement is a Node\n getDocumentElement(element) // fallback\n\n );\n}","import getParentNode from \"./getParentNode.js\";\nimport isScrollParent from \"./isScrollParent.js\";\nimport getNodeName from \"./getNodeName.js\";\nimport { isHTMLElement } from \"./instanceOf.js\";\nexport default function getScrollParent(node) {\n if (['html', 'body', '#document'].indexOf(getNodeName(node)) >= 0) {\n // $FlowFixMe[incompatible-return]: assume body is always available\n return node.ownerDocument.body;\n }\n\n if (isHTMLElement(node) && isScrollParent(node)) {\n return node;\n }\n\n return getScrollParent(getParentNode(node));\n}","import getScrollParent from \"./getScrollParent.js\";\nimport getParentNode from \"./getParentNode.js\";\nimport getWindow from \"./getWindow.js\";\nimport isScrollParent from \"./isScrollParent.js\";\n/*\ngiven a DOM element, return the list of all scroll parents, up the list of ancesors\nuntil we get to the top window object. This list is what we attach scroll listeners\nto, because if any of these parent elements scroll, we'll need to re-calculate the\nreference element's position.\n*/\n\nexport default function listScrollParents(element, list) {\n var _element$ownerDocumen;\n\n if (list === void 0) {\n list = [];\n }\n\n var scrollParent = getScrollParent(element);\n var isBody = scrollParent === ((_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body);\n var win = getWindow(scrollParent);\n var target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;\n var updatedList = list.concat(target);\n return isBody ? updatedList : // $FlowFixMe[incompatible-call]: isBody tells us target will be an HTMLElement here\n updatedList.concat(listScrollParents(getParentNode(target)));\n}","import getNodeName from \"./getNodeName.js\";\nexport default function isTableElement(element) {\n return ['table', 'td', 'th'].indexOf(getNodeName(element)) >= 0;\n}","import getWindow from \"./getWindow.js\";\nimport getNodeName from \"./getNodeName.js\";\nimport getComputedStyle from \"./getComputedStyle.js\";\nimport { isHTMLElement, isShadowRoot } from \"./instanceOf.js\";\nimport isTableElement from \"./isTableElement.js\";\nimport getParentNode from \"./getParentNode.js\";\nimport getUAString from \"../utils/userAgent.js\";\n\nfunction getTrueOffsetParent(element) {\n if (!isHTMLElement(element) || // https://github.com/popperjs/popper-core/issues/837\n getComputedStyle(element).position === 'fixed') {\n return null;\n }\n\n return element.offsetParent;\n} // `.offsetParent` reports `null` for fixed elements, while absolute elements\n// return the containing block\n\n\nfunction getContainingBlock(element) {\n var isFirefox = /firefox/i.test(getUAString());\n var isIE = /Trident/i.test(getUAString());\n\n if (isIE && isHTMLElement(element)) {\n // In IE 9, 10 and 11 fixed elements containing block is always established by the viewport\n var elementCss = getComputedStyle(element);\n\n if (elementCss.position === 'fixed') {\n return null;\n }\n }\n\n var currentNode = getParentNode(element);\n\n if (isShadowRoot(currentNode)) {\n currentNode = currentNode.host;\n }\n\n while (isHTMLElement(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {\n var css = getComputedStyle(currentNode); // This is non-exhaustive but covers the most common CSS properties that\n // create a containing block.\n // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block\n\n if (css.transform !== 'none' || css.perspective !== 'none' || css.contain === 'paint' || ['transform', 'perspective'].indexOf(css.willChange) !== -1 || isFirefox && css.willChange === 'filter' || isFirefox && css.filter && css.filter !== 'none') {\n return currentNode;\n } else {\n currentNode = currentNode.parentNode;\n }\n }\n\n return null;\n} // Gets the closest ancestor positioned element. Handles some edge cases,\n// such as table ancestors and cross browser bugs.\n\n\nexport default function getOffsetParent(element) {\n var window = getWindow(element);\n var offsetParent = getTrueOffsetParent(element);\n\n while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {\n offsetParent = getTrueOffsetParent(offsetParent);\n }\n\n if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static')) {\n return window;\n }\n\n return offsetParent || getContainingBlock(element) || window;\n}","export var top = 'top';\nexport var bottom = 'bottom';\nexport var right = 'right';\nexport var left = 'left';\nexport var auto = 'auto';\nexport var basePlacements = [top, bottom, right, left];\nexport var start = 'start';\nexport var end = 'end';\nexport var clippingParents = 'clippingParents';\nexport var viewport = 'viewport';\nexport var popper = 'popper';\nexport var reference = 'reference';\nexport var variationPlacements = /*#__PURE__*/basePlacements.reduce(function (acc, placement) {\n return acc.concat([placement + \"-\" + start, placement + \"-\" + end]);\n}, []);\nexport var placements = /*#__PURE__*/[].concat(basePlacements, [auto]).reduce(function (acc, placement) {\n return acc.concat([placement, placement + \"-\" + start, placement + \"-\" + end]);\n}, []); // modifiers that need to read the DOM\n\nexport var beforeRead = 'beforeRead';\nexport var read = 'read';\nexport var afterRead = 'afterRead'; // pure-logic modifiers\n\nexport var beforeMain = 'beforeMain';\nexport var main = 'main';\nexport var afterMain = 'afterMain'; // modifier with the purpose to write to the DOM (or write into a framework state)\n\nexport var beforeWrite = 'beforeWrite';\nexport var write = 'write';\nexport var afterWrite = 'afterWrite';\nexport var modifierPhases = [beforeRead, read, afterRead, beforeMain, main, afterMain, beforeWrite, write, afterWrite];","import { modifierPhases } from \"../enums.js\"; // source: https://stackoverflow.com/questions/49875255\n\nfunction order(modifiers) {\n var map = new Map();\n var visited = new Set();\n var result = [];\n modifiers.forEach(function (modifier) {\n map.set(modifier.name, modifier);\n }); // On visiting object, check for its dependencies and visit them recursively\n\n function sort(modifier) {\n visited.add(modifier.name);\n var requires = [].concat(modifier.requires || [], modifier.requiresIfExists || []);\n requires.forEach(function (dep) {\n if (!visited.has(dep)) {\n var depModifier = map.get(dep);\n\n if (depModifier) {\n sort(depModifier);\n }\n }\n });\n result.push(modifier);\n }\n\n modifiers.forEach(function (modifier) {\n if (!visited.has(modifier.name)) {\n // check for visited object\n sort(modifier);\n }\n });\n return result;\n}\n\nexport default function orderModifiers(modifiers) {\n // order based on dependencies\n var orderedModifiers = order(modifiers); // order based on phase\n\n return modifierPhases.reduce(function (acc, phase) {\n return acc.concat(orderedModifiers.filter(function (modifier) {\n return modifier.phase === phase;\n }));\n }, []);\n}","import getCompositeRect from \"./dom-utils/getCompositeRect.js\";\nimport getLayoutRect from \"./dom-utils/getLayoutRect.js\";\nimport listScrollParents from \"./dom-utils/listScrollParents.js\";\nimport getOffsetParent from \"./dom-utils/getOffsetParent.js\";\nimport orderModifiers from \"./utils/orderModifiers.js\";\nimport debounce from \"./utils/debounce.js\";\nimport mergeByName from \"./utils/mergeByName.js\";\nimport detectOverflow from \"./utils/detectOverflow.js\";\nimport { isElement } from \"./dom-utils/instanceOf.js\";\nvar DEFAULT_OPTIONS = {\n placement: 'bottom',\n modifiers: [],\n strategy: 'absolute'\n};\n\nfunction areValidElements() {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n return !args.some(function (element) {\n return !(element && typeof element.getBoundingClientRect === 'function');\n });\n}\n\nexport function popperGenerator(generatorOptions) {\n if (generatorOptions === void 0) {\n generatorOptions = {};\n }\n\n var _generatorOptions = generatorOptions,\n _generatorOptions$def = _generatorOptions.defaultModifiers,\n defaultModifiers = _generatorOptions$def === void 0 ? [] : _generatorOptions$def,\n _generatorOptions$def2 = _generatorOptions.defaultOptions,\n defaultOptions = _generatorOptions$def2 === void 0 ? DEFAULT_OPTIONS : _generatorOptions$def2;\n return function createPopper(reference, popper, options) {\n if (options === void 0) {\n options = defaultOptions;\n }\n\n var state = {\n placement: 'bottom',\n orderedModifiers: [],\n options: Object.assign({}, DEFAULT_OPTIONS, defaultOptions),\n modifiersData: {},\n elements: {\n reference: reference,\n popper: popper\n },\n attributes: {},\n styles: {}\n };\n var effectCleanupFns = [];\n var isDestroyed = false;\n var instance = {\n state: state,\n setOptions: function setOptions(setOptionsAction) {\n var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;\n cleanupModifierEffects();\n state.options = Object.assign({}, defaultOptions, state.options, options);\n state.scrollParents = {\n reference: isElement(reference) ? listScrollParents(reference) : reference.contextElement ? listScrollParents(reference.contextElement) : [],\n popper: listScrollParents(popper)\n }; // Orders the modifiers based on their dependencies and `phase`\n // properties\n\n var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers, state.options.modifiers))); // Strip out disabled modifiers\n\n state.orderedModifiers = orderedModifiers.filter(function (m) {\n return m.enabled;\n });\n runModifierEffects();\n return instance.update();\n },\n // Sync update – it will always be executed, even if not necessary. This\n // is useful for low frequency updates where sync behavior simplifies the\n // logic.\n // For high frequency updates (e.g. `resize` and `scroll` events), always\n // prefer the async Popper#update method\n forceUpdate: function forceUpdate() {\n if (isDestroyed) {\n return;\n }\n\n var _state$elements = state.elements,\n reference = _state$elements.reference,\n popper = _state$elements.popper; // Don't proceed if `reference` or `popper` are not valid elements\n // anymore\n\n if (!areValidElements(reference, popper)) {\n return;\n } // Store the reference and popper rects to be read by modifiers\n\n\n state.rects = {\n reference: getCompositeRect(reference, getOffsetParent(popper), state.options.strategy === 'fixed'),\n popper: getLayoutRect(popper)\n }; // Modifiers have the ability to reset the current update cycle. The\n // most common use case for this is the `flip` modifier changing the\n // placement, which then needs to re-run all the modifiers, because the\n // logic was previously ran for the previous placement and is therefore\n // stale/incorrect\n\n state.reset = false;\n state.placement = state.options.placement; // On each update cycle, the `modifiersData` property for each modifier\n // is filled with the initial data specified by the modifier. This means\n // it doesn't persist and is fresh on each update.\n // To ensure persistent data, use `${name}#persistent`\n\n state.orderedModifiers.forEach(function (modifier) {\n return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);\n });\n\n for (var index = 0; index < state.orderedModifiers.length; index++) {\n if (state.reset === true) {\n state.reset = false;\n index = -1;\n continue;\n }\n\n var _state$orderedModifie = state.orderedModifiers[index],\n fn = _state$orderedModifie.fn,\n _state$orderedModifie2 = _state$orderedModifie.options,\n _options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2,\n name = _state$orderedModifie.name;\n\n if (typeof fn === 'function') {\n state = fn({\n state: state,\n options: _options,\n name: name,\n instance: instance\n }) || state;\n }\n }\n },\n // Async and optimistically optimized update – it will not be executed if\n // not necessary (debounced to run at most once-per-tick)\n update: debounce(function () {\n return new Promise(function (resolve) {\n instance.forceUpdate();\n resolve(state);\n });\n }),\n destroy: function destroy() {\n cleanupModifierEffects();\n isDestroyed = true;\n }\n };\n\n if (!areValidElements(reference, popper)) {\n return instance;\n }\n\n instance.setOptions(options).then(function (state) {\n if (!isDestroyed && options.onFirstUpdate) {\n options.onFirstUpdate(state);\n }\n }); // Modifiers have the ability to execute arbitrary code before the first\n // update cycle runs. They will be executed in the same order as the update\n // cycle. This is useful when a modifier adds some persistent data that\n // other modifiers need to use, but the modifier is run after the dependent\n // one.\n\n function runModifierEffects() {\n state.orderedModifiers.forEach(function (_ref) {\n var name = _ref.name,\n _ref$options = _ref.options,\n options = _ref$options === void 0 ? {} : _ref$options,\n effect = _ref.effect;\n\n if (typeof effect === 'function') {\n var cleanupFn = effect({\n state: state,\n name: name,\n instance: instance,\n options: options\n });\n\n var noopFn = function noopFn() {};\n\n effectCleanupFns.push(cleanupFn || noopFn);\n }\n });\n }\n\n function cleanupModifierEffects() {\n effectCleanupFns.forEach(function (fn) {\n return fn();\n });\n effectCleanupFns = [];\n }\n\n return instance;\n };\n}\nexport var createPopper = /*#__PURE__*/popperGenerator(); // eslint-disable-next-line import/no-unused-modules\n\nexport { detectOverflow };","export default function debounce(fn) {\n var pending;\n return function () {\n if (!pending) {\n pending = new Promise(function (resolve) {\n Promise.resolve().then(function () {\n pending = undefined;\n resolve(fn());\n });\n });\n }\n\n return pending;\n };\n}","export default function mergeByName(modifiers) {\n var merged = modifiers.reduce(function (merged, current) {\n var existing = merged[current.name];\n merged[current.name] = existing ? Object.assign({}, existing, current, {\n options: Object.assign({}, existing.options, current.options),\n data: Object.assign({}, existing.data, current.data)\n }) : current;\n return merged;\n }, {}); // IE11 does not support Object.values\n\n return Object.keys(merged).map(function (key) {\n return merged[key];\n });\n}","import getWindow from \"../dom-utils/getWindow.js\"; // eslint-disable-next-line import/no-unused-modules\n\nvar passive = {\n passive: true\n};\n\nfunction effect(_ref) {\n var state = _ref.state,\n instance = _ref.instance,\n options = _ref.options;\n var _options$scroll = options.scroll,\n scroll = _options$scroll === void 0 ? true : _options$scroll,\n _options$resize = options.resize,\n resize = _options$resize === void 0 ? true : _options$resize;\n var window = getWindow(state.elements.popper);\n var scrollParents = [].concat(state.scrollParents.reference, state.scrollParents.popper);\n\n if (scroll) {\n scrollParents.forEach(function (scrollParent) {\n scrollParent.addEventListener('scroll', instance.update, passive);\n });\n }\n\n if (resize) {\n window.addEventListener('resize', instance.update, passive);\n }\n\n return function () {\n if (scroll) {\n scrollParents.forEach(function (scrollParent) {\n scrollParent.removeEventListener('scroll', instance.update, passive);\n });\n }\n\n if (resize) {\n window.removeEventListener('resize', instance.update, passive);\n }\n };\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'eventListeners',\n enabled: true,\n phase: 'write',\n fn: function fn() {},\n effect: effect,\n data: {}\n};","import { auto } from \"../enums.js\";\nexport default function getBasePlacement(placement) {\n return placement.split('-')[0];\n}","export default function getVariation(placement) {\n return placement.split('-')[1];\n}","export default function getMainAxisFromPlacement(placement) {\n return ['top', 'bottom'].indexOf(placement) >= 0 ? 'x' : 'y';\n}","import getBasePlacement from \"./getBasePlacement.js\";\nimport getVariation from \"./getVariation.js\";\nimport getMainAxisFromPlacement from \"./getMainAxisFromPlacement.js\";\nimport { top, right, bottom, left, start, end } from \"../enums.js\";\nexport default function computeOffsets(_ref) {\n var reference = _ref.reference,\n element = _ref.element,\n placement = _ref.placement;\n var basePlacement = placement ? getBasePlacement(placement) : null;\n var variation = placement ? getVariation(placement) : null;\n var commonX = reference.x + reference.width / 2 - element.width / 2;\n var commonY = reference.y + reference.height / 2 - element.height / 2;\n var offsets;\n\n switch (basePlacement) {\n case top:\n offsets = {\n x: commonX,\n y: reference.y - element.height\n };\n break;\n\n case bottom:\n offsets = {\n x: commonX,\n y: reference.y + reference.height\n };\n break;\n\n case right:\n offsets = {\n x: reference.x + reference.width,\n y: commonY\n };\n break;\n\n case left:\n offsets = {\n x: reference.x - element.width,\n y: commonY\n };\n break;\n\n default:\n offsets = {\n x: reference.x,\n y: reference.y\n };\n }\n\n var mainAxis = basePlacement ? getMainAxisFromPlacement(basePlacement) : null;\n\n if (mainAxis != null) {\n var len = mainAxis === 'y' ? 'height' : 'width';\n\n switch (variation) {\n case start:\n offsets[mainAxis] = offsets[mainAxis] - (reference[len] / 2 - element[len] / 2);\n break;\n\n case end:\n offsets[mainAxis] = offsets[mainAxis] + (reference[len] / 2 - element[len] / 2);\n break;\n\n default:\n }\n }\n\n return offsets;\n}","import computeOffsets from \"../utils/computeOffsets.js\";\n\nfunction popperOffsets(_ref) {\n var state = _ref.state,\n name = _ref.name;\n // Offsets are the actual position the popper needs to have to be\n // properly positioned near its reference element\n // This is the most basic placement, and will be adjusted by\n // the modifiers in the next step\n state.modifiersData[name] = computeOffsets({\n reference: state.rects.reference,\n element: state.rects.popper,\n strategy: 'absolute',\n placement: state.placement\n });\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'popperOffsets',\n enabled: true,\n phase: 'read',\n fn: popperOffsets,\n data: {}\n};","import { top, left, right, bottom, end } from \"../enums.js\";\nimport getOffsetParent from \"../dom-utils/getOffsetParent.js\";\nimport getWindow from \"../dom-utils/getWindow.js\";\nimport getDocumentElement from \"../dom-utils/getDocumentElement.js\";\nimport getComputedStyle from \"../dom-utils/getComputedStyle.js\";\nimport getBasePlacement from \"../utils/getBasePlacement.js\";\nimport getVariation from \"../utils/getVariation.js\";\nimport { round } from \"../utils/math.js\"; // eslint-disable-next-line import/no-unused-modules\n\nvar unsetSides = {\n top: 'auto',\n right: 'auto',\n bottom: 'auto',\n left: 'auto'\n}; // Round the offsets to the nearest suitable subpixel based on the DPR.\n// Zooming can change the DPR, but it seems to report a value that will\n// cleanly divide the values into the appropriate subpixels.\n\nfunction roundOffsetsByDPR(_ref, win) {\n var x = _ref.x,\n y = _ref.y;\n var dpr = win.devicePixelRatio || 1;\n return {\n x: round(x * dpr) / dpr || 0,\n y: round(y * dpr) / dpr || 0\n };\n}\n\nexport function mapToStyles(_ref2) {\n var _Object$assign2;\n\n var popper = _ref2.popper,\n popperRect = _ref2.popperRect,\n placement = _ref2.placement,\n variation = _ref2.variation,\n offsets = _ref2.offsets,\n position = _ref2.position,\n gpuAcceleration = _ref2.gpuAcceleration,\n adaptive = _ref2.adaptive,\n roundOffsets = _ref2.roundOffsets,\n isFixed = _ref2.isFixed;\n var _offsets$x = offsets.x,\n x = _offsets$x === void 0 ? 0 : _offsets$x,\n _offsets$y = offsets.y,\n y = _offsets$y === void 0 ? 0 : _offsets$y;\n\n var _ref3 = typeof roundOffsets === 'function' ? roundOffsets({\n x: x,\n y: y\n }) : {\n x: x,\n y: y\n };\n\n x = _ref3.x;\n y = _ref3.y;\n var hasX = offsets.hasOwnProperty('x');\n var hasY = offsets.hasOwnProperty('y');\n var sideX = left;\n var sideY = top;\n var win = window;\n\n if (adaptive) {\n var offsetParent = getOffsetParent(popper);\n var heightProp = 'clientHeight';\n var widthProp = 'clientWidth';\n\n if (offsetParent === getWindow(popper)) {\n offsetParent = getDocumentElement(popper);\n\n if (getComputedStyle(offsetParent).position !== 'static' && position === 'absolute') {\n heightProp = 'scrollHeight';\n widthProp = 'scrollWidth';\n }\n } // $FlowFixMe[incompatible-cast]: force type refinement, we compare offsetParent with window above, but Flow doesn't detect it\n\n\n offsetParent = offsetParent;\n\n if (placement === top || (placement === left || placement === right) && variation === end) {\n sideY = bottom;\n var offsetY = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.height : // $FlowFixMe[prop-missing]\n offsetParent[heightProp];\n y -= offsetY - popperRect.height;\n y *= gpuAcceleration ? 1 : -1;\n }\n\n if (placement === left || (placement === top || placement === bottom) && variation === end) {\n sideX = right;\n var offsetX = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.width : // $FlowFixMe[prop-missing]\n offsetParent[widthProp];\n x -= offsetX - popperRect.width;\n x *= gpuAcceleration ? 1 : -1;\n }\n }\n\n var commonStyles = Object.assign({\n position: position\n }, adaptive && unsetSides);\n\n var _ref4 = roundOffsets === true ? roundOffsetsByDPR({\n x: x,\n y: y\n }, getWindow(popper)) : {\n x: x,\n y: y\n };\n\n x = _ref4.x;\n y = _ref4.y;\n\n if (gpuAcceleration) {\n var _Object$assign;\n\n return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? '0' : '', _Object$assign[sideX] = hasX ? '0' : '', _Object$assign.transform = (win.devicePixelRatio || 1) <= 1 ? \"translate(\" + x + \"px, \" + y + \"px)\" : \"translate3d(\" + x + \"px, \" + y + \"px, 0)\", _Object$assign));\n }\n\n return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + \"px\" : '', _Object$assign2[sideX] = hasX ? x + \"px\" : '', _Object$assign2.transform = '', _Object$assign2));\n}\n\nfunction computeStyles(_ref5) {\n var state = _ref5.state,\n options = _ref5.options;\n var _options$gpuAccelerat = options.gpuAcceleration,\n gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,\n _options$adaptive = options.adaptive,\n adaptive = _options$adaptive === void 0 ? true : _options$adaptive,\n _options$roundOffsets = options.roundOffsets,\n roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;\n var commonStyles = {\n placement: getBasePlacement(state.placement),\n variation: getVariation(state.placement),\n popper: state.elements.popper,\n popperRect: state.rects.popper,\n gpuAcceleration: gpuAcceleration,\n isFixed: state.options.strategy === 'fixed'\n };\n\n if (state.modifiersData.popperOffsets != null) {\n state.styles.popper = Object.assign({}, state.styles.popper, mapToStyles(Object.assign({}, commonStyles, {\n offsets: state.modifiersData.popperOffsets,\n position: state.options.strategy,\n adaptive: adaptive,\n roundOffsets: roundOffsets\n })));\n }\n\n if (state.modifiersData.arrow != null) {\n state.styles.arrow = Object.assign({}, state.styles.arrow, mapToStyles(Object.assign({}, commonStyles, {\n offsets: state.modifiersData.arrow,\n position: 'absolute',\n adaptive: false,\n roundOffsets: roundOffsets\n })));\n }\n\n state.attributes.popper = Object.assign({}, state.attributes.popper, {\n 'data-popper-placement': state.placement\n });\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'computeStyles',\n enabled: true,\n phase: 'beforeWrite',\n fn: computeStyles,\n data: {}\n};","import getNodeName from \"../dom-utils/getNodeName.js\";\nimport { isHTMLElement } from \"../dom-utils/instanceOf.js\"; // This modifier takes the styles prepared by the `computeStyles` modifier\n// and applies them to the HTMLElements such as popper and arrow\n\nfunction applyStyles(_ref) {\n var state = _ref.state;\n Object.keys(state.elements).forEach(function (name) {\n var style = state.styles[name] || {};\n var attributes = state.attributes[name] || {};\n var element = state.elements[name]; // arrow is optional + virtual elements\n\n if (!isHTMLElement(element) || !getNodeName(element)) {\n return;\n } // Flow doesn't support to extend this property, but it's the most\n // effective way to apply styles to an HTMLElement\n // $FlowFixMe[cannot-write]\n\n\n Object.assign(element.style, style);\n Object.keys(attributes).forEach(function (name) {\n var value = attributes[name];\n\n if (value === false) {\n element.removeAttribute(name);\n } else {\n element.setAttribute(name, value === true ? '' : value);\n }\n });\n });\n}\n\nfunction effect(_ref2) {\n var state = _ref2.state;\n var initialStyles = {\n popper: {\n position: state.options.strategy,\n left: '0',\n top: '0',\n margin: '0'\n },\n arrow: {\n position: 'absolute'\n },\n reference: {}\n };\n Object.assign(state.elements.popper.style, initialStyles.popper);\n state.styles = initialStyles;\n\n if (state.elements.arrow) {\n Object.assign(state.elements.arrow.style, initialStyles.arrow);\n }\n\n return function () {\n Object.keys(state.elements).forEach(function (name) {\n var element = state.elements[name];\n var attributes = state.attributes[name] || {};\n var styleProperties = Object.keys(state.styles.hasOwnProperty(name) ? state.styles[name] : initialStyles[name]); // Set all values to an empty string to unset them\n\n var style = styleProperties.reduce(function (style, property) {\n style[property] = '';\n return style;\n }, {}); // arrow is optional + virtual elements\n\n if (!isHTMLElement(element) || !getNodeName(element)) {\n return;\n }\n\n Object.assign(element.style, style);\n Object.keys(attributes).forEach(function (attribute) {\n element.removeAttribute(attribute);\n });\n });\n };\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'applyStyles',\n enabled: true,\n phase: 'write',\n fn: applyStyles,\n effect: effect,\n requires: ['computeStyles']\n};","import getBasePlacement from \"../utils/getBasePlacement.js\";\nimport { top, left, right, placements } from \"../enums.js\"; // eslint-disable-next-line import/no-unused-modules\n\nexport function distanceAndSkiddingToXY(placement, rects, offset) {\n var basePlacement = getBasePlacement(placement);\n var invertDistance = [left, top].indexOf(basePlacement) >= 0 ? -1 : 1;\n\n var _ref = typeof offset === 'function' ? offset(Object.assign({}, rects, {\n placement: placement\n })) : offset,\n skidding = _ref[0],\n distance = _ref[1];\n\n skidding = skidding || 0;\n distance = (distance || 0) * invertDistance;\n return [left, right].indexOf(basePlacement) >= 0 ? {\n x: distance,\n y: skidding\n } : {\n x: skidding,\n y: distance\n };\n}\n\nfunction offset(_ref2) {\n var state = _ref2.state,\n options = _ref2.options,\n name = _ref2.name;\n var _options$offset = options.offset,\n offset = _options$offset === void 0 ? [0, 0] : _options$offset;\n var data = placements.reduce(function (acc, placement) {\n acc[placement] = distanceAndSkiddingToXY(placement, state.rects, offset);\n return acc;\n }, {});\n var _data$state$placement = data[state.placement],\n x = _data$state$placement.x,\n y = _data$state$placement.y;\n\n if (state.modifiersData.popperOffsets != null) {\n state.modifiersData.popperOffsets.x += x;\n state.modifiersData.popperOffsets.y += y;\n }\n\n state.modifiersData[name] = data;\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'offset',\n enabled: true,\n phase: 'main',\n requires: ['popperOffsets'],\n fn: offset\n};","var hash = {\n left: 'right',\n right: 'left',\n bottom: 'top',\n top: 'bottom'\n};\nexport default function getOppositePlacement(placement) {\n return placement.replace(/left|right|bottom|top/g, function (matched) {\n return hash[matched];\n });\n}","var hash = {\n start: 'end',\n end: 'start'\n};\nexport default function getOppositeVariationPlacement(placement) {\n return placement.replace(/start|end/g, function (matched) {\n return hash[matched];\n });\n}","import { isShadowRoot } from \"./instanceOf.js\";\nexport default function contains(parent, child) {\n var rootNode = child.getRootNode && child.getRootNode(); // First, attempt with faster native method\n\n if (parent.contains(child)) {\n return true;\n } // then fallback to custom implementation with Shadow DOM support\n else if (rootNode && isShadowRoot(rootNode)) {\n var next = child;\n\n do {\n if (next && parent.isSameNode(next)) {\n return true;\n } // $FlowFixMe[prop-missing]: need a better way to handle this...\n\n\n next = next.parentNode || next.host;\n } while (next);\n } // Give up, the result is false\n\n\n return false;\n}","export default function rectToClientRect(rect) {\n return Object.assign({}, rect, {\n left: rect.x,\n top: rect.y,\n right: rect.x + rect.width,\n bottom: rect.y + rect.height\n });\n}","import { viewport } from \"../enums.js\";\nimport getViewportRect from \"./getViewportRect.js\";\nimport getDocumentRect from \"./getDocumentRect.js\";\nimport listScrollParents from \"./listScrollParents.js\";\nimport getOffsetParent from \"./getOffsetParent.js\";\nimport getDocumentElement from \"./getDocumentElement.js\";\nimport getComputedStyle from \"./getComputedStyle.js\";\nimport { isElement, isHTMLElement } from \"./instanceOf.js\";\nimport getBoundingClientRect from \"./getBoundingClientRect.js\";\nimport getParentNode from \"./getParentNode.js\";\nimport contains from \"./contains.js\";\nimport getNodeName from \"./getNodeName.js\";\nimport rectToClientRect from \"../utils/rectToClientRect.js\";\nimport { max, min } from \"../utils/math.js\";\n\nfunction getInnerBoundingClientRect(element, strategy) {\n var rect = getBoundingClientRect(element, false, strategy === 'fixed');\n rect.top = rect.top + element.clientTop;\n rect.left = rect.left + element.clientLeft;\n rect.bottom = rect.top + element.clientHeight;\n rect.right = rect.left + element.clientWidth;\n rect.width = element.clientWidth;\n rect.height = element.clientHeight;\n rect.x = rect.left;\n rect.y = rect.top;\n return rect;\n}\n\nfunction getClientRectFromMixedType(element, clippingParent, strategy) {\n return clippingParent === viewport ? rectToClientRect(getViewportRect(element, strategy)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent, strategy) : rectToClientRect(getDocumentRect(getDocumentElement(element)));\n} // A \"clipping parent\" is an overflowable container with the characteristic of\n// clipping (or hiding) overflowing elements with a position different from\n// `initial`\n\n\nfunction getClippingParents(element) {\n var clippingParents = listScrollParents(getParentNode(element));\n var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle(element).position) >= 0;\n var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;\n\n if (!isElement(clipperElement)) {\n return [];\n } // $FlowFixMe[incompatible-return]: https://github.com/facebook/flow/issues/1414\n\n\n return clippingParents.filter(function (clippingParent) {\n return isElement(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== 'body';\n });\n} // Gets the maximum area that the element is visible in due to any number of\n// clipping parents\n\n\nexport default function getClippingRect(element, boundary, rootBoundary, strategy) {\n var mainClippingParents = boundary === 'clippingParents' ? getClippingParents(element) : [].concat(boundary);\n var clippingParents = [].concat(mainClippingParents, [rootBoundary]);\n var firstClippingParent = clippingParents[0];\n var clippingRect = clippingParents.reduce(function (accRect, clippingParent) {\n var rect = getClientRectFromMixedType(element, clippingParent, strategy);\n accRect.top = max(rect.top, accRect.top);\n accRect.right = min(rect.right, accRect.right);\n accRect.bottom = min(rect.bottom, accRect.bottom);\n accRect.left = max(rect.left, accRect.left);\n return accRect;\n }, getClientRectFromMixedType(element, firstClippingParent, strategy));\n clippingRect.width = clippingRect.right - clippingRect.left;\n clippingRect.height = clippingRect.bottom - clippingRect.top;\n clippingRect.x = clippingRect.left;\n clippingRect.y = clippingRect.top;\n return clippingRect;\n}","import getWindow from \"./getWindow.js\";\nimport getDocumentElement from \"./getDocumentElement.js\";\nimport getWindowScrollBarX from \"./getWindowScrollBarX.js\";\nimport isLayoutViewport from \"./isLayoutViewport.js\";\nexport default function getViewportRect(element, strategy) {\n var win = getWindow(element);\n var html = getDocumentElement(element);\n var visualViewport = win.visualViewport;\n var width = html.clientWidth;\n var height = html.clientHeight;\n var x = 0;\n var y = 0;\n\n if (visualViewport) {\n width = visualViewport.width;\n height = visualViewport.height;\n var layoutViewport = isLayoutViewport();\n\n if (layoutViewport || !layoutViewport && strategy === 'fixed') {\n x = visualViewport.offsetLeft;\n y = visualViewport.offsetTop;\n }\n }\n\n return {\n width: width,\n height: height,\n x: x + getWindowScrollBarX(element),\n y: y\n };\n}","import getDocumentElement from \"./getDocumentElement.js\";\nimport getComputedStyle from \"./getComputedStyle.js\";\nimport getWindowScrollBarX from \"./getWindowScrollBarX.js\";\nimport getWindowScroll from \"./getWindowScroll.js\";\nimport { max } from \"../utils/math.js\"; // Gets the entire size of the scrollable document area, even extending outside\n// of the `` and `` rect bounds if horizontally scrollable\n\nexport default function getDocumentRect(element) {\n var _element$ownerDocumen;\n\n var html = getDocumentElement(element);\n var winScroll = getWindowScroll(element);\n var body = (_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body;\n var width = max(html.scrollWidth, html.clientWidth, body ? body.scrollWidth : 0, body ? body.clientWidth : 0);\n var height = max(html.scrollHeight, html.clientHeight, body ? body.scrollHeight : 0, body ? body.clientHeight : 0);\n var x = -winScroll.scrollLeft + getWindowScrollBarX(element);\n var y = -winScroll.scrollTop;\n\n if (getComputedStyle(body || html).direction === 'rtl') {\n x += max(html.clientWidth, body ? body.clientWidth : 0) - width;\n }\n\n return {\n width: width,\n height: height,\n x: x,\n y: y\n };\n}","import getFreshSideObject from \"./getFreshSideObject.js\";\nexport default function mergePaddingObject(paddingObject) {\n return Object.assign({}, getFreshSideObject(), paddingObject);\n}","export default function getFreshSideObject() {\n return {\n top: 0,\n right: 0,\n bottom: 0,\n left: 0\n };\n}","export default function expandToHashMap(value, keys) {\n return keys.reduce(function (hashMap, key) {\n hashMap[key] = value;\n return hashMap;\n }, {});\n}","import getClippingRect from \"../dom-utils/getClippingRect.js\";\nimport getDocumentElement from \"../dom-utils/getDocumentElement.js\";\nimport getBoundingClientRect from \"../dom-utils/getBoundingClientRect.js\";\nimport computeOffsets from \"./computeOffsets.js\";\nimport rectToClientRect from \"./rectToClientRect.js\";\nimport { clippingParents, reference, popper, bottom, top, right, basePlacements, viewport } from \"../enums.js\";\nimport { isElement } from \"../dom-utils/instanceOf.js\";\nimport mergePaddingObject from \"./mergePaddingObject.js\";\nimport expandToHashMap from \"./expandToHashMap.js\"; // eslint-disable-next-line import/no-unused-modules\n\nexport default function detectOverflow(state, options) {\n if (options === void 0) {\n options = {};\n }\n\n var _options = options,\n _options$placement = _options.placement,\n placement = _options$placement === void 0 ? state.placement : _options$placement,\n _options$strategy = _options.strategy,\n strategy = _options$strategy === void 0 ? state.strategy : _options$strategy,\n _options$boundary = _options.boundary,\n boundary = _options$boundary === void 0 ? clippingParents : _options$boundary,\n _options$rootBoundary = _options.rootBoundary,\n rootBoundary = _options$rootBoundary === void 0 ? viewport : _options$rootBoundary,\n _options$elementConte = _options.elementContext,\n elementContext = _options$elementConte === void 0 ? popper : _options$elementConte,\n _options$altBoundary = _options.altBoundary,\n altBoundary = _options$altBoundary === void 0 ? false : _options$altBoundary,\n _options$padding = _options.padding,\n padding = _options$padding === void 0 ? 0 : _options$padding;\n var paddingObject = mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));\n var altContext = elementContext === popper ? reference : popper;\n var popperRect = state.rects.popper;\n var element = state.elements[altBoundary ? altContext : elementContext];\n var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary, strategy);\n var referenceClientRect = getBoundingClientRect(state.elements.reference);\n var popperOffsets = computeOffsets({\n reference: referenceClientRect,\n element: popperRect,\n strategy: 'absolute',\n placement: placement\n });\n var popperClientRect = rectToClientRect(Object.assign({}, popperRect, popperOffsets));\n var elementClientRect = elementContext === popper ? popperClientRect : referenceClientRect; // positive = overflowing the clipping rect\n // 0 or negative = within the clipping rect\n\n var overflowOffsets = {\n top: clippingClientRect.top - elementClientRect.top + paddingObject.top,\n bottom: elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,\n left: clippingClientRect.left - elementClientRect.left + paddingObject.left,\n right: elementClientRect.right - clippingClientRect.right + paddingObject.right\n };\n var offsetData = state.modifiersData.offset; // Offsets can be applied only to the popper element\n\n if (elementContext === popper && offsetData) {\n var offset = offsetData[placement];\n Object.keys(overflowOffsets).forEach(function (key) {\n var multiply = [right, bottom].indexOf(key) >= 0 ? 1 : -1;\n var axis = [top, bottom].indexOf(key) >= 0 ? 'y' : 'x';\n overflowOffsets[key] += offset[axis] * multiply;\n });\n }\n\n return overflowOffsets;\n}","import getOppositePlacement from \"../utils/getOppositePlacement.js\";\nimport getBasePlacement from \"../utils/getBasePlacement.js\";\nimport getOppositeVariationPlacement from \"../utils/getOppositeVariationPlacement.js\";\nimport detectOverflow from \"../utils/detectOverflow.js\";\nimport computeAutoPlacement from \"../utils/computeAutoPlacement.js\";\nimport { bottom, top, start, right, left, auto } from \"../enums.js\";\nimport getVariation from \"../utils/getVariation.js\"; // eslint-disable-next-line import/no-unused-modules\n\nfunction getExpandedFallbackPlacements(placement) {\n if (getBasePlacement(placement) === auto) {\n return [];\n }\n\n var oppositePlacement = getOppositePlacement(placement);\n return [getOppositeVariationPlacement(placement), oppositePlacement, getOppositeVariationPlacement(oppositePlacement)];\n}\n\nfunction flip(_ref) {\n var state = _ref.state,\n options = _ref.options,\n name = _ref.name;\n\n if (state.modifiersData[name]._skip) {\n return;\n }\n\n var _options$mainAxis = options.mainAxis,\n checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,\n _options$altAxis = options.altAxis,\n checkAltAxis = _options$altAxis === void 0 ? true : _options$altAxis,\n specifiedFallbackPlacements = options.fallbackPlacements,\n padding = options.padding,\n boundary = options.boundary,\n rootBoundary = options.rootBoundary,\n altBoundary = options.altBoundary,\n _options$flipVariatio = options.flipVariations,\n flipVariations = _options$flipVariatio === void 0 ? true : _options$flipVariatio,\n allowedAutoPlacements = options.allowedAutoPlacements;\n var preferredPlacement = state.options.placement;\n var basePlacement = getBasePlacement(preferredPlacement);\n var isBasePlacement = basePlacement === preferredPlacement;\n var fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipVariations ? [getOppositePlacement(preferredPlacement)] : getExpandedFallbackPlacements(preferredPlacement));\n var placements = [preferredPlacement].concat(fallbackPlacements).reduce(function (acc, placement) {\n return acc.concat(getBasePlacement(placement) === auto ? computeAutoPlacement(state, {\n placement: placement,\n boundary: boundary,\n rootBoundary: rootBoundary,\n padding: padding,\n flipVariations: flipVariations,\n allowedAutoPlacements: allowedAutoPlacements\n }) : placement);\n }, []);\n var referenceRect = state.rects.reference;\n var popperRect = state.rects.popper;\n var checksMap = new Map();\n var makeFallbackChecks = true;\n var firstFittingPlacement = placements[0];\n\n for (var i = 0; i < placements.length; i++) {\n var placement = placements[i];\n\n var _basePlacement = getBasePlacement(placement);\n\n var isStartVariation = getVariation(placement) === start;\n var isVertical = [top, bottom].indexOf(_basePlacement) >= 0;\n var len = isVertical ? 'width' : 'height';\n var overflow = detectOverflow(state, {\n placement: placement,\n boundary: boundary,\n rootBoundary: rootBoundary,\n altBoundary: altBoundary,\n padding: padding\n });\n var mainVariationSide = isVertical ? isStartVariation ? right : left : isStartVariation ? bottom : top;\n\n if (referenceRect[len] > popperRect[len]) {\n mainVariationSide = getOppositePlacement(mainVariationSide);\n }\n\n var altVariationSide = getOppositePlacement(mainVariationSide);\n var checks = [];\n\n if (checkMainAxis) {\n checks.push(overflow[_basePlacement] <= 0);\n }\n\n if (checkAltAxis) {\n checks.push(overflow[mainVariationSide] <= 0, overflow[altVariationSide] <= 0);\n }\n\n if (checks.every(function (check) {\n return check;\n })) {\n firstFittingPlacement = placement;\n makeFallbackChecks = false;\n break;\n }\n\n checksMap.set(placement, checks);\n }\n\n if (makeFallbackChecks) {\n // `2` may be desired in some cases – research later\n var numberOfChecks = flipVariations ? 3 : 1;\n\n var _loop = function _loop(_i) {\n var fittingPlacement = placements.find(function (placement) {\n var checks = checksMap.get(placement);\n\n if (checks) {\n return checks.slice(0, _i).every(function (check) {\n return check;\n });\n }\n });\n\n if (fittingPlacement) {\n firstFittingPlacement = fittingPlacement;\n return \"break\";\n }\n };\n\n for (var _i = numberOfChecks; _i > 0; _i--) {\n var _ret = _loop(_i);\n\n if (_ret === \"break\") break;\n }\n }\n\n if (state.placement !== firstFittingPlacement) {\n state.modifiersData[name]._skip = true;\n state.placement = firstFittingPlacement;\n state.reset = true;\n }\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'flip',\n enabled: true,\n phase: 'main',\n fn: flip,\n requiresIfExists: ['offset'],\n data: {\n _skip: false\n }\n};","import getVariation from \"./getVariation.js\";\nimport { variationPlacements, basePlacements, placements as allPlacements } from \"../enums.js\";\nimport detectOverflow from \"./detectOverflow.js\";\nimport getBasePlacement from \"./getBasePlacement.js\";\nexport default function computeAutoPlacement(state, options) {\n if (options === void 0) {\n options = {};\n }\n\n var _options = options,\n placement = _options.placement,\n boundary = _options.boundary,\n rootBoundary = _options.rootBoundary,\n padding = _options.padding,\n flipVariations = _options.flipVariations,\n _options$allowedAutoP = _options.allowedAutoPlacements,\n allowedAutoPlacements = _options$allowedAutoP === void 0 ? allPlacements : _options$allowedAutoP;\n var variation = getVariation(placement);\n var placements = variation ? flipVariations ? variationPlacements : variationPlacements.filter(function (placement) {\n return getVariation(placement) === variation;\n }) : basePlacements;\n var allowedPlacements = placements.filter(function (placement) {\n return allowedAutoPlacements.indexOf(placement) >= 0;\n });\n\n if (allowedPlacements.length === 0) {\n allowedPlacements = placements;\n } // $FlowFixMe[incompatible-type]: Flow seems to have problems with two array unions...\n\n\n var overflows = allowedPlacements.reduce(function (acc, placement) {\n acc[placement] = detectOverflow(state, {\n placement: placement,\n boundary: boundary,\n rootBoundary: rootBoundary,\n padding: padding\n })[getBasePlacement(placement)];\n return acc;\n }, {});\n return Object.keys(overflows).sort(function (a, b) {\n return overflows[a] - overflows[b];\n });\n}","import { max as mathMax, min as mathMin } from \"./math.js\";\nexport function within(min, value, max) {\n return mathMax(min, mathMin(value, max));\n}\nexport function withinMaxClamp(min, value, max) {\n var v = within(min, value, max);\n return v > max ? max : v;\n}","import { top, left, right, bottom, start } from \"../enums.js\";\nimport getBasePlacement from \"../utils/getBasePlacement.js\";\nimport getMainAxisFromPlacement from \"../utils/getMainAxisFromPlacement.js\";\nimport getAltAxis from \"../utils/getAltAxis.js\";\nimport { within, withinMaxClamp } from \"../utils/within.js\";\nimport getLayoutRect from \"../dom-utils/getLayoutRect.js\";\nimport getOffsetParent from \"../dom-utils/getOffsetParent.js\";\nimport detectOverflow from \"../utils/detectOverflow.js\";\nimport getVariation from \"../utils/getVariation.js\";\nimport getFreshSideObject from \"../utils/getFreshSideObject.js\";\nimport { min as mathMin, max as mathMax } from \"../utils/math.js\";\n\nfunction preventOverflow(_ref) {\n var state = _ref.state,\n options = _ref.options,\n name = _ref.name;\n var _options$mainAxis = options.mainAxis,\n checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,\n _options$altAxis = options.altAxis,\n checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis,\n boundary = options.boundary,\n rootBoundary = options.rootBoundary,\n altBoundary = options.altBoundary,\n padding = options.padding,\n _options$tether = options.tether,\n tether = _options$tether === void 0 ? true : _options$tether,\n _options$tetherOffset = options.tetherOffset,\n tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;\n var overflow = detectOverflow(state, {\n boundary: boundary,\n rootBoundary: rootBoundary,\n padding: padding,\n altBoundary: altBoundary\n });\n var basePlacement = getBasePlacement(state.placement);\n var variation = getVariation(state.placement);\n var isBasePlacement = !variation;\n var mainAxis = getMainAxisFromPlacement(basePlacement);\n var altAxis = getAltAxis(mainAxis);\n var popperOffsets = state.modifiersData.popperOffsets;\n var referenceRect = state.rects.reference;\n var popperRect = state.rects.popper;\n var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {\n placement: state.placement\n })) : tetherOffset;\n var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {\n mainAxis: tetherOffsetValue,\n altAxis: tetherOffsetValue\n } : Object.assign({\n mainAxis: 0,\n altAxis: 0\n }, tetherOffsetValue);\n var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;\n var data = {\n x: 0,\n y: 0\n };\n\n if (!popperOffsets) {\n return;\n }\n\n if (checkMainAxis) {\n var _offsetModifierState$;\n\n var mainSide = mainAxis === 'y' ? top : left;\n var altSide = mainAxis === 'y' ? bottom : right;\n var len = mainAxis === 'y' ? 'height' : 'width';\n var offset = popperOffsets[mainAxis];\n var min = offset + overflow[mainSide];\n var max = offset - overflow[altSide];\n var additive = tether ? -popperRect[len] / 2 : 0;\n var minLen = variation === start ? referenceRect[len] : popperRect[len];\n var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go\n // outside the reference bounds\n\n var arrowElement = state.elements.arrow;\n var arrowRect = tether && arrowElement ? getLayoutRect(arrowElement) : {\n width: 0,\n height: 0\n };\n var arrowPaddingObject = state.modifiersData['arrow#persistent'] ? state.modifiersData['arrow#persistent'].padding : getFreshSideObject();\n var arrowPaddingMin = arrowPaddingObject[mainSide];\n var arrowPaddingMax = arrowPaddingObject[altSide]; // If the reference length is smaller than the arrow length, we don't want\n // to include its full size in the calculation. If the reference is small\n // and near the edge of a boundary, the popper can overflow even if the\n // reference is not overflowing as well (e.g. virtual elements with no\n // width or height)\n\n var arrowLen = within(0, referenceRect[len], arrowRect[len]);\n var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;\n var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;\n var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);\n var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;\n var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;\n var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;\n var tetherMax = offset + maxOffset - offsetModifierValue;\n var preventedOffset = within(tether ? mathMin(min, tetherMin) : min, offset, tether ? mathMax(max, tetherMax) : max);\n popperOffsets[mainAxis] = preventedOffset;\n data[mainAxis] = preventedOffset - offset;\n }\n\n if (checkAltAxis) {\n var _offsetModifierState$2;\n\n var _mainSide = mainAxis === 'x' ? top : left;\n\n var _altSide = mainAxis === 'x' ? bottom : right;\n\n var _offset = popperOffsets[altAxis];\n\n var _len = altAxis === 'y' ? 'height' : 'width';\n\n var _min = _offset + overflow[_mainSide];\n\n var _max = _offset - overflow[_altSide];\n\n var isOriginSide = [top, left].indexOf(basePlacement) !== -1;\n\n var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;\n\n var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;\n\n var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;\n\n var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);\n\n popperOffsets[altAxis] = _preventedOffset;\n data[altAxis] = _preventedOffset - _offset;\n }\n\n state.modifiersData[name] = data;\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'preventOverflow',\n enabled: true,\n phase: 'main',\n fn: preventOverflow,\n requiresIfExists: ['offset']\n};","export default function getAltAxis(axis) {\n return axis === 'x' ? 'y' : 'x';\n}","import getBasePlacement from \"../utils/getBasePlacement.js\";\nimport getLayoutRect from \"../dom-utils/getLayoutRect.js\";\nimport contains from \"../dom-utils/contains.js\";\nimport getOffsetParent from \"../dom-utils/getOffsetParent.js\";\nimport getMainAxisFromPlacement from \"../utils/getMainAxisFromPlacement.js\";\nimport { within } from \"../utils/within.js\";\nimport mergePaddingObject from \"../utils/mergePaddingObject.js\";\nimport expandToHashMap from \"../utils/expandToHashMap.js\";\nimport { left, right, basePlacements, top, bottom } from \"../enums.js\"; // eslint-disable-next-line import/no-unused-modules\n\nvar toPaddingObject = function toPaddingObject(padding, state) {\n padding = typeof padding === 'function' ? padding(Object.assign({}, state.rects, {\n placement: state.placement\n })) : padding;\n return mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));\n};\n\nfunction arrow(_ref) {\n var _state$modifiersData$;\n\n var state = _ref.state,\n name = _ref.name,\n options = _ref.options;\n var arrowElement = state.elements.arrow;\n var popperOffsets = state.modifiersData.popperOffsets;\n var basePlacement = getBasePlacement(state.placement);\n var axis = getMainAxisFromPlacement(basePlacement);\n var isVertical = [left, right].indexOf(basePlacement) >= 0;\n var len = isVertical ? 'height' : 'width';\n\n if (!arrowElement || !popperOffsets) {\n return;\n }\n\n var paddingObject = toPaddingObject(options.padding, state);\n var arrowRect = getLayoutRect(arrowElement);\n var minProp = axis === 'y' ? top : left;\n var maxProp = axis === 'y' ? bottom : right;\n var endDiff = state.rects.reference[len] + state.rects.reference[axis] - popperOffsets[axis] - state.rects.popper[len];\n var startDiff = popperOffsets[axis] - state.rects.reference[axis];\n var arrowOffsetParent = getOffsetParent(arrowElement);\n var clientSize = arrowOffsetParent ? axis === 'y' ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;\n var centerToReference = endDiff / 2 - startDiff / 2; // Make sure the arrow doesn't overflow the popper if the center point is\n // outside of the popper bounds\n\n var min = paddingObject[minProp];\n var max = clientSize - arrowRect[len] - paddingObject[maxProp];\n var center = clientSize / 2 - arrowRect[len] / 2 + centerToReference;\n var offset = within(min, center, max); // Prevents breaking syntax highlighting...\n\n var axisProp = axis;\n state.modifiersData[name] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset, _state$modifiersData$.centerOffset = offset - center, _state$modifiersData$);\n}\n\nfunction effect(_ref2) {\n var state = _ref2.state,\n options = _ref2.options;\n var _options$element = options.element,\n arrowElement = _options$element === void 0 ? '[data-popper-arrow]' : _options$element;\n\n if (arrowElement == null) {\n return;\n } // CSS selector\n\n\n if (typeof arrowElement === 'string') {\n arrowElement = state.elements.popper.querySelector(arrowElement);\n\n if (!arrowElement) {\n return;\n }\n }\n\n if (!contains(state.elements.popper, arrowElement)) {\n return;\n }\n\n state.elements.arrow = arrowElement;\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'arrow',\n enabled: true,\n phase: 'main',\n fn: arrow,\n effect: effect,\n requires: ['popperOffsets'],\n requiresIfExists: ['preventOverflow']\n};","import { top, bottom, left, right } from \"../enums.js\";\nimport detectOverflow from \"../utils/detectOverflow.js\";\n\nfunction getSideOffsets(overflow, rect, preventedOffsets) {\n if (preventedOffsets === void 0) {\n preventedOffsets = {\n x: 0,\n y: 0\n };\n }\n\n return {\n top: overflow.top - rect.height - preventedOffsets.y,\n right: overflow.right - rect.width + preventedOffsets.x,\n bottom: overflow.bottom - rect.height + preventedOffsets.y,\n left: overflow.left - rect.width - preventedOffsets.x\n };\n}\n\nfunction isAnySideFullyClipped(overflow) {\n return [top, right, bottom, left].some(function (side) {\n return overflow[side] >= 0;\n });\n}\n\nfunction hide(_ref) {\n var state = _ref.state,\n name = _ref.name;\n var referenceRect = state.rects.reference;\n var popperRect = state.rects.popper;\n var preventedOffsets = state.modifiersData.preventOverflow;\n var referenceOverflow = detectOverflow(state, {\n elementContext: 'reference'\n });\n var popperAltOverflow = detectOverflow(state, {\n altBoundary: true\n });\n var referenceClippingOffsets = getSideOffsets(referenceOverflow, referenceRect);\n var popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets);\n var isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets);\n var hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets);\n state.modifiersData[name] = {\n referenceClippingOffsets: referenceClippingOffsets,\n popperEscapeOffsets: popperEscapeOffsets,\n isReferenceHidden: isReferenceHidden,\n hasPopperEscaped: hasPopperEscaped\n };\n state.attributes.popper = Object.assign({}, state.attributes.popper, {\n 'data-popper-reference-hidden': isReferenceHidden,\n 'data-popper-escaped': hasPopperEscaped\n });\n} // eslint-disable-next-line import/no-unused-modules\n\n\nexport default {\n name: 'hide',\n enabled: true,\n phase: 'main',\n requiresIfExists: ['preventOverflow'],\n fn: hide\n};","import { popperGenerator, detectOverflow } from \"./createPopper.js\";\nimport eventListeners from \"./modifiers/eventListeners.js\";\nimport popperOffsets from \"./modifiers/popperOffsets.js\";\nimport computeStyles from \"./modifiers/computeStyles.js\";\nimport applyStyles from \"./modifiers/applyStyles.js\";\nimport offset from \"./modifiers/offset.js\";\nimport flip from \"./modifiers/flip.js\";\nimport preventOverflow from \"./modifiers/preventOverflow.js\";\nimport arrow from \"./modifiers/arrow.js\";\nimport hide from \"./modifiers/hide.js\";\nvar defaultModifiers = [eventListeners, popperOffsets, computeStyles, applyStyles, offset, flip, preventOverflow, arrow, hide];\nvar createPopper = /*#__PURE__*/popperGenerator({\n defaultModifiers: defaultModifiers\n}); // eslint-disable-next-line import/no-unused-modules\n\nexport { createPopper, popperGenerator, defaultModifiers, detectOverflow }; // eslint-disable-next-line import/no-unused-modules\n\nexport { createPopper as createPopperLite } from \"./popper-lite.js\"; // eslint-disable-next-line import/no-unused-modules\n\nexport * from \"./modifiers/index.js\";","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getPopperUtilityClass(slot) {\n return generateUtilityClass('MuiPopper', slot);\n}\nconst popperClasses = generateUtilityClasses('MuiPopper', ['root']);\nexport default popperClasses;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"anchorEl\", \"children\", \"direction\", \"disablePortal\", \"modifiers\", \"open\", \"placement\", \"popperOptions\", \"popperRef\", \"slotProps\", \"slots\", \"TransitionProps\", \"ownerState\"],\n _excluded2 = [\"anchorEl\", \"children\", \"container\", \"direction\", \"disablePortal\", \"keepMounted\", \"modifiers\", \"open\", \"placement\", \"popperOptions\", \"popperRef\", \"style\", \"transition\", \"slotProps\", \"slots\"];\nimport * as React from 'react';\nimport { chainPropTypes, HTMLElementType, refType, unstable_ownerDocument as ownerDocument, unstable_useEnhancedEffect as useEnhancedEffect, unstable_useForkRef as useForkRef } from '@mui/utils';\nimport { createPopper } from '@popperjs/core';\nimport PropTypes from 'prop-types';\nimport composeClasses from '@mui/utils/composeClasses';\nimport useSlotProps from '@mui/utils/useSlotProps';\nimport Portal from '../Portal';\nimport { getPopperUtilityClass } from './popperClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction flipPlacement(placement, direction) {\n if (direction === 'ltr') {\n return placement;\n }\n switch (placement) {\n case 'bottom-end':\n return 'bottom-start';\n case 'bottom-start':\n return 'bottom-end';\n case 'top-end':\n return 'top-start';\n case 'top-start':\n return 'top-end';\n default:\n return placement;\n }\n}\nfunction resolveAnchorEl(anchorEl) {\n return typeof anchorEl === 'function' ? anchorEl() : anchorEl;\n}\nfunction isHTMLElement(element) {\n return element.nodeType !== undefined;\n}\nfunction isVirtualElement(element) {\n return !isHTMLElement(element);\n}\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['root']\n };\n return composeClasses(slots, getPopperUtilityClass, classes);\n};\nconst defaultPopperOptions = {};\nconst PopperTooltip = /*#__PURE__*/React.forwardRef(function PopperTooltip(props, forwardedRef) {\n var _slots$root;\n const {\n anchorEl,\n children,\n direction,\n disablePortal,\n modifiers,\n open,\n placement: initialPlacement,\n popperOptions,\n popperRef: popperRefProp,\n slotProps = {},\n slots = {},\n TransitionProps\n // @ts-ignore internal logic\n // prevent from spreading to DOM, it can come from the parent component e.g. Select.\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const tooltipRef = React.useRef(null);\n const ownRef = useForkRef(tooltipRef, forwardedRef);\n const popperRef = React.useRef(null);\n const handlePopperRef = useForkRef(popperRef, popperRefProp);\n const handlePopperRefRef = React.useRef(handlePopperRef);\n useEnhancedEffect(() => {\n handlePopperRefRef.current = handlePopperRef;\n }, [handlePopperRef]);\n React.useImperativeHandle(popperRefProp, () => popperRef.current, []);\n const rtlPlacement = flipPlacement(initialPlacement, direction);\n /**\n * placement initialized from prop but can change during lifetime if modifiers.flip.\n * modifiers.flip is essentially a flip for controlled/uncontrolled behavior\n */\n const [placement, setPlacement] = React.useState(rtlPlacement);\n const [resolvedAnchorElement, setResolvedAnchorElement] = React.useState(resolveAnchorEl(anchorEl));\n React.useEffect(() => {\n if (popperRef.current) {\n popperRef.current.forceUpdate();\n }\n });\n React.useEffect(() => {\n if (anchorEl) {\n setResolvedAnchorElement(resolveAnchorEl(anchorEl));\n }\n }, [anchorEl]);\n useEnhancedEffect(() => {\n if (!resolvedAnchorElement || !open) {\n return undefined;\n }\n const handlePopperUpdate = data => {\n setPlacement(data.placement);\n };\n if (process.env.NODE_ENV !== 'production') {\n if (resolvedAnchorElement && isHTMLElement(resolvedAnchorElement) && resolvedAnchorElement.nodeType === 1) {\n const box = resolvedAnchorElement.getBoundingClientRect();\n if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {\n console.warn(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', \"Make sure the element is present in the document or that it's not display none.\"].join('\\n'));\n }\n }\n }\n let popperModifiers = [{\n name: 'preventOverflow',\n options: {\n altBoundary: disablePortal\n }\n }, {\n name: 'flip',\n options: {\n altBoundary: disablePortal\n }\n }, {\n name: 'onUpdate',\n enabled: true,\n phase: 'afterWrite',\n fn: ({\n state\n }) => {\n handlePopperUpdate(state);\n }\n }];\n if (modifiers != null) {\n popperModifiers = popperModifiers.concat(modifiers);\n }\n if (popperOptions && popperOptions.modifiers != null) {\n popperModifiers = popperModifiers.concat(popperOptions.modifiers);\n }\n const popper = createPopper(resolvedAnchorElement, tooltipRef.current, _extends({\n placement: rtlPlacement\n }, popperOptions, {\n modifiers: popperModifiers\n }));\n handlePopperRefRef.current(popper);\n return () => {\n popper.destroy();\n handlePopperRefRef.current(null);\n };\n }, [resolvedAnchorElement, disablePortal, modifiers, open, popperOptions, rtlPlacement]);\n const childProps = {\n placement: placement\n };\n if (TransitionProps !== null) {\n childProps.TransitionProps = TransitionProps;\n }\n const classes = useUtilityClasses(props);\n const Root = (_slots$root = slots.root) != null ? _slots$root : 'div';\n const rootProps = useSlotProps({\n elementType: Root,\n externalSlotProps: slotProps.root,\n externalForwardedProps: other,\n additionalProps: {\n role: 'tooltip',\n ref: ownRef\n },\n ownerState: props,\n className: classes.root\n });\n return /*#__PURE__*/_jsx(Root, _extends({}, rootProps, {\n children: typeof children === 'function' ? children(childProps) : children\n }));\n});\n\n/**\n * @ignore - internal component.\n */\nconst Popper = /*#__PURE__*/React.forwardRef(function Popper(props, forwardedRef) {\n const {\n anchorEl,\n children,\n container: containerProp,\n direction = 'ltr',\n disablePortal = false,\n keepMounted = false,\n modifiers,\n open,\n placement = 'bottom',\n popperOptions = defaultPopperOptions,\n popperRef,\n style,\n transition = false,\n slotProps = {},\n slots = {}\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded2);\n const [exited, setExited] = React.useState(true);\n const handleEnter = () => {\n setExited(false);\n };\n const handleExited = () => {\n setExited(true);\n };\n if (!keepMounted && !open && (!transition || exited)) {\n return null;\n }\n\n // If the container prop is provided, use that\n // If the anchorEl prop is provided, use its parent body element as the container\n // If neither are provided let the Modal take care of choosing the container\n let container;\n if (containerProp) {\n container = containerProp;\n } else if (anchorEl) {\n const resolvedAnchorEl = resolveAnchorEl(anchorEl);\n container = resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) ? ownerDocument(resolvedAnchorEl).body : ownerDocument(null).body;\n }\n const display = !open && keepMounted && (!transition || exited) ? 'none' : undefined;\n const transitionProps = transition ? {\n in: open,\n onEnter: handleEnter,\n onExited: handleExited\n } : undefined;\n return /*#__PURE__*/_jsx(Portal, {\n disablePortal: disablePortal,\n container: container,\n children: /*#__PURE__*/_jsx(PopperTooltip, _extends({\n anchorEl: anchorEl,\n direction: direction,\n disablePortal: disablePortal,\n modifiers: modifiers,\n ref: forwardedRef,\n open: transition ? !exited : open,\n placement: placement,\n popperOptions: popperOptions,\n popperRef: popperRef,\n slotProps: slotProps,\n slots: slots\n }, other, {\n style: _extends({\n // Prevents scroll issue, waiting for Popper.js to add this style once initiated.\n position: 'fixed',\n // Fix Popper.js display issue\n top: 0,\n left: 0,\n display\n }, style),\n TransitionProps: transitionProps,\n children: children\n }))\n });\n});\nprocess.env.NODE_ENV !== \"production\" ? Popper.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * An HTML element, [virtualElement](https://popper.js.org/docs/v2/virtual-elements/),\n * or a function that returns either.\n * It's used to set the position of the popper.\n * The return value will passed as the reference object of the Popper instance.\n */\n anchorEl: chainPropTypes(PropTypes.oneOfType([HTMLElementType, PropTypes.object, PropTypes.func]), props => {\n if (props.open) {\n const resolvedAnchorEl = resolveAnchorEl(props.anchorEl);\n if (resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) && resolvedAnchorEl.nodeType === 1) {\n const box = resolvedAnchorEl.getBoundingClientRect();\n if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {\n return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', \"Make sure the element is present in the document or that it's not display none.\"].join('\\n'));\n }\n } else if (!resolvedAnchorEl || typeof resolvedAnchorEl.getBoundingClientRect !== 'function' || isVirtualElement(resolvedAnchorEl) && resolvedAnchorEl.contextElement != null && resolvedAnchorEl.contextElement.nodeType !== 1) {\n return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', 'It should be an HTML element instance or a virtualElement ', '(https://popper.js.org/docs/v2/virtual-elements/).'].join('\\n'));\n }\n }\n return null;\n }),\n /**\n * Popper render function or node.\n */\n children: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.node, PropTypes.func]),\n /**\n * An HTML element or function that returns one.\n * The `container` will have the portal children appended to it.\n *\n * You can also provide a callback, which is called in a React layout effect.\n * This lets you set the container from a ref, and also makes server-side rendering possible.\n *\n * By default, it uses the body of the top-level document object,\n * so it's simply `document.body` most of the time.\n */\n container: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([HTMLElementType, PropTypes.func]),\n /**\n * Direction of the text.\n * @default 'ltr'\n */\n direction: PropTypes.oneOf(['ltr', 'rtl']),\n /**\n * The `children` will be under the DOM hierarchy of the parent component.\n * @default false\n */\n disablePortal: PropTypes.bool,\n /**\n * Always keep the children in the DOM.\n * This prop can be useful in SEO situation or\n * when you want to maximize the responsiveness of the Popper.\n * @default false\n */\n keepMounted: PropTypes.bool,\n /**\n * Popper.js is based on a \"plugin-like\" architecture,\n * most of its features are fully encapsulated \"modifiers\".\n *\n * A modifier is a function that is called each time Popper.js needs to\n * compute the position of the popper.\n * For this reason, modifiers should be very performant to avoid bottlenecks.\n * To learn how to create a modifier, [read the modifiers documentation](https://popper.js.org/docs/v2/modifiers/).\n */\n modifiers: PropTypes.arrayOf(PropTypes.shape({\n data: PropTypes.object,\n effect: PropTypes.func,\n enabled: PropTypes.bool,\n fn: PropTypes.func,\n name: PropTypes.any,\n options: PropTypes.object,\n phase: PropTypes.oneOf(['afterMain', 'afterRead', 'afterWrite', 'beforeMain', 'beforeRead', 'beforeWrite', 'main', 'read', 'write']),\n requires: PropTypes.arrayOf(PropTypes.string),\n requiresIfExists: PropTypes.arrayOf(PropTypes.string)\n })),\n /**\n * If `true`, the component is shown.\n */\n open: PropTypes.bool.isRequired,\n /**\n * Popper placement.\n * @default 'bottom'\n */\n placement: PropTypes.oneOf(['auto-end', 'auto-start', 'auto', 'bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),\n /**\n * Options provided to the [`Popper.js`](https://popper.js.org/docs/v2/constructors/#options) instance.\n * @default {}\n */\n popperOptions: PropTypes.shape({\n modifiers: PropTypes.array,\n onFirstUpdate: PropTypes.func,\n placement: PropTypes.oneOf(['auto-end', 'auto-start', 'auto', 'bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),\n strategy: PropTypes.oneOf(['absolute', 'fixed'])\n }),\n /**\n * A ref that points to the used popper instance.\n */\n popperRef: refType,\n /**\n * The props used for each slot inside the Popper.\n * @default {}\n */\n slotProps: PropTypes.shape({\n root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])\n }),\n /**\n * The components used for each slot inside the Popper.\n * Either a string to use a HTML element or a component.\n * @default {}\n */\n slots: PropTypes.shape({\n root: PropTypes.elementType\n }),\n /**\n * Help supporting a react-transition-group/Transition component.\n * @default false\n */\n transition: PropTypes.bool\n} : void 0;\nexport default Popper;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"anchorEl\", \"component\", \"components\", \"componentsProps\", \"container\", \"disablePortal\", \"keepMounted\", \"modifiers\", \"open\", \"placement\", \"popperOptions\", \"popperRef\", \"transition\", \"slots\", \"slotProps\"];\nimport useTheme from '@mui/system/useThemeWithoutDefault';\nimport refType from '@mui/utils/refType';\nimport HTMLElementType from '@mui/utils/HTMLElementType';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport BasePopper from './BasePopper';\nimport { styled } from '../styles';\nimport { useDefaultProps } from '../DefaultPropsProvider';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst PopperRoot = styled(BasePopper, {\n name: 'MuiPopper',\n slot: 'Root',\n overridesResolver: (props, styles) => styles.root\n})({});\n\n/**\n *\n * Demos:\n *\n * - [Autocomplete](https://mui.com/material-ui/react-autocomplete/)\n * - [Menu](https://mui.com/material-ui/react-menu/)\n * - [Popper](https://mui.com/material-ui/react-popper/)\n *\n * API:\n *\n * - [Popper API](https://mui.com/material-ui/api/popper/)\n */\nconst Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {\n var _slots$root;\n const theme = useTheme();\n const props = useDefaultProps({\n props: inProps,\n name: 'MuiPopper'\n });\n const {\n anchorEl,\n component,\n components,\n componentsProps,\n container,\n disablePortal,\n keepMounted,\n modifiers,\n open,\n placement,\n popperOptions,\n popperRef,\n transition,\n slots,\n slotProps\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const RootComponent = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components == null ? void 0 : components.Root;\n const otherProps = _extends({\n anchorEl,\n container,\n disablePortal,\n keepMounted,\n modifiers,\n open,\n placement,\n popperOptions,\n popperRef,\n transition\n }, other);\n return /*#__PURE__*/_jsx(PopperRoot, _extends({\n as: component,\n direction: theme == null ? void 0 : theme.direction,\n slots: {\n root: RootComponent\n },\n slotProps: slotProps != null ? slotProps : componentsProps\n }, otherProps, {\n ref: ref\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Popper.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * An HTML element, [virtualElement](https://popper.js.org/docs/v2/virtual-elements/),\n * or a function that returns either.\n * It's used to set the position of the popper.\n * The return value will passed as the reference object of the Popper instance.\n */\n anchorEl: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([HTMLElementType, PropTypes.object, PropTypes.func]),\n /**\n * Popper render function or node.\n */\n children: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.node, PropTypes.func]),\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 the Popper.\n * Either a string to use a HTML element or a component.\n * @default {}\n */\n components: PropTypes.shape({\n Root: PropTypes.elementType\n }),\n /**\n * The props used for each slot inside the Popper.\n * @default {}\n */\n componentsProps: PropTypes.shape({\n root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])\n }),\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 /**\n * Always keep the children in the DOM.\n * This prop can be useful in SEO situation or\n * when you want to maximize the responsiveness of the Popper.\n * @default false\n */\n keepMounted: PropTypes.bool,\n /**\n * Popper.js is based on a \"plugin-like\" architecture,\n * most of its features are fully encapsulated \"modifiers\".\n *\n * A modifier is a function that is called each time Popper.js needs to\n * compute the position of the popper.\n * For this reason, modifiers should be very performant to avoid bottlenecks.\n * To learn how to create a modifier, [read the modifiers documentation](https://popper.js.org/docs/v2/modifiers/).\n */\n modifiers: PropTypes.arrayOf(PropTypes.shape({\n data: PropTypes.object,\n effect: PropTypes.func,\n enabled: PropTypes.bool,\n fn: PropTypes.func,\n name: PropTypes.any,\n options: PropTypes.object,\n phase: PropTypes.oneOf(['afterMain', 'afterRead', 'afterWrite', 'beforeMain', 'beforeRead', 'beforeWrite', 'main', 'read', 'write']),\n requires: PropTypes.arrayOf(PropTypes.string),\n requiresIfExists: PropTypes.arrayOf(PropTypes.string)\n })),\n /**\n * If `true`, the component is shown.\n */\n open: PropTypes.bool.isRequired,\n /**\n * Popper placement.\n * @default 'bottom'\n */\n placement: PropTypes.oneOf(['auto-end', 'auto-start', 'auto', 'bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),\n /**\n * Options provided to the [`Popper.js`](https://popper.js.org/docs/v2/constructors/#options) instance.\n * @default {}\n */\n popperOptions: PropTypes.shape({\n modifiers: PropTypes.array,\n onFirstUpdate: PropTypes.func,\n placement: PropTypes.oneOf(['auto-end', 'auto-start', 'auto', 'bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),\n strategy: PropTypes.oneOf(['absolute', 'fixed'])\n }),\n /**\n * A ref that points to the used popper instance.\n */\n popperRef: refType,\n /**\n * The props used for each slot inside the Popper.\n * @default {}\n */\n slotProps: PropTypes.shape({\n root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])\n }),\n /**\n * The components used for each slot inside the Popper.\n * Either a string to use a HTML element or a component.\n * @default {}\n */\n slots: PropTypes.shape({\n root: PropTypes.elementType\n }),\n /**\n * 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 * Help supporting a react-transition-group/Transition component.\n * @default false\n */\n transition: PropTypes.bool\n} : void 0;\nexport default Popper;","'use client';\n\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { elementAcceptingRef, exactProp, unstable_ownerDocument as ownerDocument, unstable_useForkRef as useForkRef, unstable_useEventCallback as useEventCallback } from '@mui/utils';\nimport getReactElementRef from '@mui/utils/getReactElementRef';\n\n// TODO: return `EventHandlerName extends `on${infer EventName}` ? Lowercase : never` once generatePropTypes runs with TS 4.1\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction mapEventPropToEvent(eventProp) {\n return eventProp.substring(2).toLowerCase();\n}\nfunction clickedRootScrollbar(event, doc) {\n return doc.documentElement.clientWidth < event.clientX || doc.documentElement.clientHeight < event.clientY;\n}\n/**\n * Listen for click events that occur somewhere in the document, outside of the element itself.\n * For instance, if you need to hide a menu when people click anywhere else on your page.\n *\n * Demos:\n *\n * - [Click-Away Listener](https://mui.com/material-ui/react-click-away-listener/)\n * - [Menu](https://mui.com/material-ui/react-menu/)\n *\n * API:\n *\n * - [ClickAwayListener API](https://mui.com/material-ui/api/click-away-listener/)\n */\nfunction ClickAwayListener(props) {\n const {\n children,\n disableReactTree = false,\n mouseEvent = 'onClick',\n onClickAway,\n touchEvent = 'onTouchEnd'\n } = props;\n const movedRef = React.useRef(false);\n const nodeRef = React.useRef(null);\n const activatedRef = React.useRef(false);\n const syntheticEventRef = React.useRef(false);\n React.useEffect(() => {\n // Ensure that this component is not \"activated\" synchronously.\n // https://github.com/facebook/react/issues/20074\n setTimeout(() => {\n activatedRef.current = true;\n }, 0);\n return () => {\n activatedRef.current = false;\n };\n }, []);\n const handleRef = useForkRef(getReactElementRef(children), nodeRef);\n\n // The handler doesn't take event.defaultPrevented into account:\n //\n // event.preventDefault() is meant to stop default behaviors like\n // clicking a checkbox to check it, hitting a button to submit a form,\n // and hitting left arrow to move the cursor in a text input etc.\n // Only special HTML elements have these default behaviors.\n const handleClickAway = useEventCallback(event => {\n // Given developers can stop the propagation of the synthetic event,\n // we can only be confident with a positive value.\n const insideReactTree = syntheticEventRef.current;\n syntheticEventRef.current = false;\n const doc = ownerDocument(nodeRef.current);\n\n // 1. IE11 support, which trigger the handleClickAway even after the unbind\n // 2. The child might render null.\n // 3. Behave like a blur listener.\n if (!activatedRef.current || !nodeRef.current || 'clientX' in event && clickedRootScrollbar(event, doc)) {\n return;\n }\n\n // Do not act if user performed touchmove\n if (movedRef.current) {\n movedRef.current = false;\n return;\n }\n let insideDOM;\n\n // If not enough, can use https://github.com/DieterHolvoet/event-propagation-path/blob/master/propagationPath.js\n if (event.composedPath) {\n insideDOM = event.composedPath().indexOf(nodeRef.current) > -1;\n } else {\n insideDOM = !doc.documentElement.contains(\n // @ts-expect-error returns `false` as intended when not dispatched from a Node\n event.target) || nodeRef.current.contains(\n // @ts-expect-error returns `false` as intended when not dispatched from a Node\n event.target);\n }\n if (!insideDOM && (disableReactTree || !insideReactTree)) {\n onClickAway(event);\n }\n });\n\n // Keep track of mouse/touch events that bubbled up through the portal.\n const createHandleSynthetic = handlerName => event => {\n syntheticEventRef.current = true;\n const childrenPropsHandler = children.props[handlerName];\n if (childrenPropsHandler) {\n childrenPropsHandler(event);\n }\n };\n const childrenProps = {\n ref: handleRef\n };\n if (touchEvent !== false) {\n childrenProps[touchEvent] = createHandleSynthetic(touchEvent);\n }\n React.useEffect(() => {\n if (touchEvent !== false) {\n const mappedTouchEvent = mapEventPropToEvent(touchEvent);\n const doc = ownerDocument(nodeRef.current);\n const handleTouchMove = () => {\n movedRef.current = true;\n };\n doc.addEventListener(mappedTouchEvent, handleClickAway);\n doc.addEventListener('touchmove', handleTouchMove);\n return () => {\n doc.removeEventListener(mappedTouchEvent, handleClickAway);\n doc.removeEventListener('touchmove', handleTouchMove);\n };\n }\n return undefined;\n }, [handleClickAway, touchEvent]);\n if (mouseEvent !== false) {\n childrenProps[mouseEvent] = createHandleSynthetic(mouseEvent);\n }\n React.useEffect(() => {\n if (mouseEvent !== false) {\n const mappedMouseEvent = mapEventPropToEvent(mouseEvent);\n const doc = ownerDocument(nodeRef.current);\n doc.addEventListener(mappedMouseEvent, handleClickAway);\n return () => {\n doc.removeEventListener(mappedMouseEvent, handleClickAway);\n };\n }\n return undefined;\n }, [handleClickAway, mouseEvent]);\n return /*#__PURE__*/_jsx(React.Fragment, {\n children: /*#__PURE__*/React.cloneElement(children, childrenProps)\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? ClickAwayListener.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * The wrapped element.\n */\n children: elementAcceptingRef.isRequired,\n /**\n * If `true`, the React tree is ignored and only the DOM tree is considered.\n * This prop changes how portaled elements are handled.\n * @default false\n */\n disableReactTree: PropTypes.bool,\n /**\n * The mouse event to listen to. You can disable the listener by providing `false`.\n * @default 'onClick'\n */\n mouseEvent: PropTypes.oneOf(['onClick', 'onMouseDown', 'onMouseUp', 'onPointerDown', 'onPointerUp', false]),\n /**\n * Callback fired when a \"click away\" event is detected.\n */\n onClickAway: PropTypes.func.isRequired,\n /**\n * The touch event to listen to. You can disable the listener by providing `false`.\n * @default 'onTouchEnd'\n */\n touchEvent: PropTypes.oneOf(['onTouchEnd', 'onTouchStart', false])\n} : void 0;\nif (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line\n ClickAwayListener['propTypes' + ''] = exactProp(ClickAwayListener.propTypes);\n}\nexport { ClickAwayListener };","import React, { useState } from 'react';\nimport classnames from 'classnames';\nimport isEmpty from 'lodash/isEmpty';\nimport Popper from '@mui/material/Popper';\nimport Fade from '@mui/material/Fade';\nimport Paper from '@mui/material/Paper';\nimport ClickAwayListener from '@mui/material/ClickAwayListener';\n\ntype Props = {\n className?: string;\n title: string;\n children: React.ReactNode;\n};\n\nconst PopperText = ({ className, title, children }: Props) => {\n const [isOpen, setIsOpen] = useState(false);\n const [anchorEl, setAnchorEl] = useState(null);\n\n const handler =\n (forceClose) =>\n ({ currentTarget }) => {\n setIsOpen(!forceClose);\n setAnchorEl(forceClose ? null : currentTarget);\n };\n\n return (\n <>\n \n {title}\n \n {isEmpty(children) ? null : (\n \n {({ TransitionProps }) => (\n \n \n \n {children}
\n \n \n \n )}\n \n )}\n \n );\n};\n\nexport default PopperText;\n","import React from 'react';\nimport { graphql, useStaticQuery } from 'gatsby';\nimport styled, { css } from 'styled-components';\nimport tw from 'twin.macro';\n\nimport { withPreviewPlaceholder } from '../../cms/utils/with-preview-placeholder';\nimport { StyledMDXdWrapper } from '../mdx-styled-renderer';\nimport PopperText from '../popper-text/popper-text';\nimport * as textBlocks from '../shortcodes/text-block/context';\n\nconst query = graphql`\n query AdvertiserDisclosureQuery {\n mdx(fields: { slug: { eq: \"advertiser-disclosure\" } }) {\n frontmatter {\n name\n }\n }\n }\n`;\n\nconst disclosureStyle = css`\n &.title {\n ${tw`underline cursor-pointer text-xs md:text-sm text-right`}\n }\n\n &.container {\n .content-container {\n ${tw`p-4 w-80 text-sm bg-primary-50`}\n }\n\n .disclosure-body {\n ${tw`prose-sm font-primary leading-5`}\n }\n }\n`;\n\nconst _Disclosure = ({ children, className, title }) => (\n \n {children}\n \n);\n\nconst DisclosureWithGraphQL = ({ className }) => {\n const data = useStaticQuery(query);\n const title = data?.mdx?.frontmatter?.name;\n const DisclosureTextBlock = textBlocks['advertiser-disclosure'];\n\n return (\n <_Disclosure className={className} title={title}>\n \n \n \n \n );\n};\nconst StyledDisclosureWithGraphQL = styled(DisclosureWithGraphQL)`\n ${disclosureStyle}\n`;\n\nconst StyledDisclosure = styled(_Disclosure)`\n ${disclosureStyle}\n`;\n\nconst Placeholder = ({\n className,\n title = 'Advertiser Disclosure',\n content = 'Advertiser Disclosure Placeholder Text',\n ...rest\n}) => ;\n\nexport const Disclosure = withPreviewPlaceholder(DisclosureWithGraphQL, Placeholder);\n\nexport const DisclosureWithContent = withPreviewPlaceholder(StyledDisclosure, Placeholder);\n\nexport default withPreviewPlaceholder(StyledDisclosureWithGraphQL, Placeholder);\n","import React, { useMemo, useState } from 'react';\nimport debounce from 'lodash/debounce';\nimport startCase from 'lodash/startCase';\nimport styled from 'styled-components';\nimport tw from 'twin.macro';\n\nimport { siteMetadata } from '@taboola/venus-core/src/config/siteMetadata';\nimport Menu from '@taboola/venus-core/src/components/navigation-menu/nav-menu';\nimport _Disclosure from '@taboola/venus-core/src/components/disclosure';\n\nconst formattedPrefix = startCase(siteMetadata?.pathPrefix);\n\nconst Disclosure = styled(_Disclosure)`\n ${tw`text-[#8b8d91] text-sm ml-auto pr-3 mb-[-20px] z-[1400] xl:(pr-0 mb-0)`}\n\n &.title {\n ${tw`uppercase text-[10px] xl:text-xs font-heading self-end`}\n }\n\n .disclosure-body p {\n ${tw`text-sm`}\n }\n`;\n\nconst Header = ({ categories, links }) => {\n const [isDrawerOpen, setIsDrawerOpen] = useState(false);\n const [activeCategory, setActiveCategory] = useState('');\n\n const debounceSetIsDrawerOpen = useMemo(\n () => debounce(setIsDrawerOpen, 200),\n []\n );\n const debounceSetActiveCategory = useMemo(\n () => debounce(setActiveCategory, 200),\n []\n );\n\n const openDrawer = () => {\n // TODO: find other solution if possible\n if (window) {\n window.scrollTo(0, 0);\n }\n debounceSetIsDrawerOpen(true);\n };\n const closeDrawer = () => {\n debounceSetIsDrawerOpen(false);\n debounceSetActiveCategory('');\n };\n\n return (\n \n );\n};\n\nexport default Header;\n","import React from 'react';\nimport groupBy from 'lodash/groupBy';\nimport { graphql, useStaticQuery } from 'gatsby';\nimport 'twin.macro';\n\nimport { withPreviewPlaceholder } from '@taboola/venus-core/src/cms/utils/with-preview-placeholder';\nimport {\n useCategories,\n useLists,\n} from '@taboola/venus-core/src/components/header/hooks';\n\nimport ExternalHeader from '../../../../components/header/external/header';\nimport InternalHeader from '../../../../components/header/internal/header';\nimport { convertInternalToExternal } from '../../../../utils/header';\n\nexport const query = graphql`\n query TimeNavigationCategories {\n internalNavigationLinks: mdx(\n fields: { slug: { eq: \"navigation-categories\" } }\n ) {\n frontmatter {\n entities {\n title\n category {\n childMdx {\n slug\n frontmatter {\n name\n }\n }\n }\n curatedList {\n childMdx {\n slug\n frontmatter {\n title\n entities {\n title\n category {\n childMdx {\n slug\n frontmatter {\n name\n }\n }\n }\n article {\n childMdx {\n slug\n timeToRead\n frontmatter {\n title\n authors {\n childMdx {\n frontmatter {\n name\n }\n }\n }\n }\n }\n }\n }\n }\n }\n }\n }\n }\n }\n externalNavigationLinks {\n header {\n text\n children {\n href\n text\n }\n }\n }\n }\n`;\n\nconst HeaderBase = ({ externalNavigationLinks = [], internalNavigationLinks = [] }) => {\n const categories = useCategories(internalNavigationLinks);\n const lists = useLists(internalNavigationLinks);\n const listsByCategory = Object.entries(groupBy(lists, (list) => list.categories[0].slug));\n const convertedInternalLinks = convertInternalToExternal({ categories, listsByCategory });\n const unifiedNavigationLinks = [\n convertedInternalLinks,\n ...externalNavigationLinks,\n ];\n\n return (\n <>\n \n \n \n );\n};\n\nconst Header = () => {\n const { internalNavigationLinks, externalNavigationLinks } = useStaticQuery(query);\n\n return (\n \n );\n};\n\nexport default withPreviewPlaceholder(Header, HeaderBase);\n","import React from 'react';\nimport styled from 'styled-components';\nimport tw from 'twin.macro';\n\nconst Link = styled.a`\n ${tw`text-[#78170f]!`}\n`;\n\nconst onKetchClick = () => window?.ketch?.('showPreferences');\n\nconst CopyrightNotice = ({ className }) => (\n \n © 2024 TIME USA, LLC. All Rights Reserved. Use of this site constitutes acceptance of our Terms of Service, Privacy Policy (Your Privacy Rights) and Do Not Sell or Share My Personal\n Information.
TIME may receive compensation for some links to products and services on this website. Offers\n may be subject to change without notice.\n
\n);\n\nexport default CopyrightNotice;\n","import React from 'react';\nimport { useStaticQuery, graphql } from 'gatsby';\nimport 'twin.macro';\n\nimport { siteMetadata } from '@taboola/venus-core/src/config/siteMetadata';\nimport isEmpty from '@taboola/venus-core/src/utils/node/is-empty';\nimport { withPreviewPlaceholder } from '@taboola/venus-core/src/cms/utils/with-preview-placeholder';\nimport SocialLinks from '@taboola/venus-core/src/components/social-links';\nimport Logo from '@taboola/venus-core/src/components/logo';\nimport ExternalLink from '@taboola/venus-core/src/components/external-link/external-link';\n\nimport Disclaimer from '../../../../components/disclaimer/disclaimer';\nimport CopyrightNotice from './copyright-notice';\n\nconst siteUrl = siteMetadata?.siteUrl;\n\nconst query = graphql`\n query BottomQueryTime {\n externalNavigationLinks {\n footer {\n children {\n href\n text\n }\n }\n }\n }\n`;\n\nconst Separator = () =>
;\n\nconst FooterNavigation = ({ links }) =>\n isEmpty(links) ? null : (\n \n {links.map((link, index) => (\n
\n {link.text}\n \n {link.children.map((child, childIndex) => (\n \n \n {child.text}\n \n \n ))}\n
\n