(our hidden element)\n // react-dom in dev mode will warn about this. There doesn't seem to be a way to render arbitrary\n // user Head without hitting this issue (our hidden element could be just \"new Document()\", but\n // this can only have 1 child, and we don't control what is being rendered so that's not an option)\n // instead we continue to render to
, and just silence warnings for and elements\n // https://github.com/facebook/react/blob/e2424f33b3ad727321fc12e75c5e94838e84c2b5/packages/react-dom-bindings/src/client/validateDOMNesting.js#L498-L520\n const originalConsoleError = console.error.bind(console)\n console.error = (...args) => {\n if (\n Array.isArray(args) &&\n args.length >= 2 &&\n args[0]?.includes?.(`validateDOMNesting(...): %s cannot appear as`) &&\n (args[1] === `` || args[1] === ``)\n ) {\n return undefined\n }\n return originalConsoleError(...args)\n }\n\n /* We set up observer to be able to regenerate after react-refresh\n updates our hidden element.\n */\n const observer = new MutationObserver(onHeadRendered)\n observer.observe(hiddenRoot, {\n attributes: true,\n childList: true,\n characterData: true,\n subtree: true,\n })\n}\n\nexport function headHandlerForBrowser({\n pageComponent,\n staticQueryResults,\n pageComponentProps,\n}) {\n useEffect(() => {\n if (pageComponent?.Head) {\n headExportValidator(pageComponent.Head)\n\n const { render } = reactDOMUtils()\n\n const HeadElement = (\n \n \n {WrapHeadElement} \n \n ,\n hiddenRoot\n )\n }\n\n return () => {\n removePrevHeadElements()\n removeHtmlAndBodyAttributes(keysOfHtmlAndBodyAttributes)\n }\n })\n}\n","import React, { Suspense, createElement } from \"react\"\nimport PropTypes from \"prop-types\"\nimport { apiRunner } from \"./api-runner-browser\"\nimport { grabMatchParams } from \"./find-path\"\nimport { headHandlerForBrowser } from \"./head/head-export-handler-for-browser\"\n\n// Renders page\nfunction PageRenderer(props) {\n const pageComponentProps = {\n ...props,\n params: {\n ...grabMatchParams(props.location.pathname),\n ...props.pageResources.json.pageContext.__params,\n },\n }\n\n const preferDefault = m => (m && m.default) || m\n\n let pageElement\n if (props.pageResources.partialHydration) {\n pageElement = props.pageResources.partialHydration\n } else {\n pageElement = createElement(preferDefault(props.pageResources.component), {\n ...pageComponentProps,\n key: props.path || props.pageResources.page.path,\n })\n }\n\n const pageComponent = props.pageResources.head\n\n headHandlerForBrowser({\n pageComponent,\n staticQueryResults: props.pageResources.staticQueryResults,\n pageComponentProps,\n })\n\n const wrappedPage = apiRunner(\n `wrapPageElement`,\n {\n element: pageElement,\n props: pageComponentProps,\n },\n pageElement,\n ({ result }) => {\n return { element: result, props: pageComponentProps }\n }\n ).pop()\n\n return wrappedPage\n}\n\nPageRenderer.propTypes = {\n location: PropTypes.object.isRequired,\n pageResources: PropTypes.object.isRequired,\n data: PropTypes.object,\n pageContext: PropTypes.object.isRequired,\n}\n\nexport default PageRenderer\n","// This is extracted to separate module because it's shared\n// between browser and SSR code\nexport const RouteAnnouncerProps = {\n id: `gatsby-announcer`,\n style: {\n position: `absolute`,\n top: 0,\n width: 1,\n height: 1,\n padding: 0,\n overflow: `hidden`,\n clip: `rect(0, 0, 0, 0)`,\n whiteSpace: `nowrap`,\n border: 0,\n },\n \"aria-live\": `assertive`,\n \"aria-atomic\": `true`,\n}\n","import React from \"react\"\nimport PropTypes from \"prop-types\"\nimport loader, { PageResourceStatus } from \"./loader\"\nimport { maybeGetBrowserRedirect } from \"./redirect-utils.js\"\nimport { apiRunner } from \"./api-runner-browser\"\nimport emitter from \"./emitter\"\nimport { RouteAnnouncerProps } from \"./route-announcer-props\"\nimport {\n navigate as reachNavigate,\n globalHistory,\n} from \"@gatsbyjs/reach-router\"\nimport { parsePath } from \"gatsby-link\"\n\nfunction maybeRedirect(pathname) {\n const redirect = maybeGetBrowserRedirect(pathname)\n const { hash, search } = window.location\n\n if (redirect != null) {\n window.___replace(redirect.toPath + search + hash)\n return true\n } else {\n return false\n }\n}\n\n// Catch unhandled chunk loading errors and force a restart of the app.\nlet nextRoute = ``\n\nwindow.addEventListener(`unhandledrejection`, event => {\n if (/loading chunk \\d* failed./i.test(event.reason)) {\n if (nextRoute) {\n window.location.pathname = nextRoute\n }\n }\n})\n\nconst onPreRouteUpdate = (location, prevLocation) => {\n if (!maybeRedirect(location.pathname)) {\n nextRoute = location.pathname\n apiRunner(`onPreRouteUpdate`, { location, prevLocation })\n }\n}\n\nconst onRouteUpdate = (location, prevLocation) => {\n if (!maybeRedirect(location.pathname)) {\n apiRunner(`onRouteUpdate`, { location, prevLocation })\n if (\n process.env.GATSBY_QUERY_ON_DEMAND &&\n process.env.GATSBY_QUERY_ON_DEMAND_LOADING_INDICATOR === `true`\n ) {\n emitter.emit(`onRouteUpdate`, { location, prevLocation })\n }\n }\n}\n\nconst navigate = (to, options = {}) => {\n // Support forward/backward navigation with numbers\n // navigate(-2) (jumps back 2 history steps)\n // navigate(2) (jumps forward 2 history steps)\n if (typeof to === `number`) {\n globalHistory.navigate(to)\n return\n }\n\n const { pathname, search, hash } = parsePath(to)\n const redirect = maybeGetBrowserRedirect(pathname)\n\n // If we're redirecting, just replace the passed in pathname\n // to the one we want to redirect to.\n if (redirect) {\n to = redirect.toPath + search + hash\n }\n\n // If we had a service worker update, no matter the path, reload window and\n // reset the pathname whitelist\n if (window.___swUpdated) {\n window.location = pathname + search + hash\n return\n }\n\n // Start a timer to wait for a second before transitioning and showing a\n // loader in case resources aren't around yet.\n const timeoutId = setTimeout(() => {\n emitter.emit(`onDelayedLoadPageResources`, { pathname })\n apiRunner(`onRouteUpdateDelayed`, {\n location: window.location,\n })\n }, 1000)\n\n loader.loadPage(pathname + search).then(pageResources => {\n // If no page resources, then refresh the page\n // Do this, rather than simply `window.location.reload()`, so that\n // pressing the back/forward buttons work - otherwise when pressing\n // back, the browser will just change the URL and expect JS to handle\n // the change, which won't always work since it might not be a Gatsby\n // page.\n if (!pageResources || pageResources.status === PageResourceStatus.Error) {\n window.history.replaceState({}, ``, location.href)\n window.location = pathname\n clearTimeout(timeoutId)\n return\n }\n\n // If the loaded page has a different compilation hash to the\n // window, then a rebuild has occurred on the server. Reload.\n if (process.env.NODE_ENV === `production` && pageResources) {\n if (\n pageResources.page.webpackCompilationHash !==\n window.___webpackCompilationHash\n ) {\n // Purge plugin-offline cache\n if (\n `serviceWorker` in navigator &&\n navigator.serviceWorker.controller !== null &&\n navigator.serviceWorker.controller.state === `activated`\n ) {\n navigator.serviceWorker.controller.postMessage({\n gatsbyApi: `clearPathResources`,\n })\n }\n\n window.location = pathname + search + hash\n }\n }\n reachNavigate(to, options)\n clearTimeout(timeoutId)\n })\n}\n\nfunction shouldUpdateScroll(prevRouterProps, { location }) {\n const { pathname, hash } = location\n const results = apiRunner(`shouldUpdateScroll`, {\n prevRouterProps,\n // `pathname` for backwards compatibility\n pathname,\n routerProps: { location },\n getSavedScrollPosition: args => [\n 0,\n // FIXME this is actually a big code smell, we should fix this\n // eslint-disable-next-line @babel/no-invalid-this\n this._stateStorage.read(args, args.key),\n ],\n })\n if (results.length > 0) {\n // Use the latest registered shouldUpdateScroll result, this allows users to override plugin's configuration\n // @see https://github.com/gatsbyjs/gatsby/issues/12038\n return results[results.length - 1]\n }\n\n if (prevRouterProps) {\n const {\n location: { pathname: oldPathname },\n } = prevRouterProps\n if (oldPathname === pathname) {\n // Scroll to element if it exists, if it doesn't, or no hash is provided,\n // scroll to top.\n return hash ? decodeURI(hash.slice(1)) : [0, 0]\n }\n }\n return true\n}\n\nfunction init() {\n // The \"scroll-behavior\" package expects the \"action\" to be on the location\n // object so let's copy it over.\n globalHistory.listen(args => {\n args.location.action = args.action\n })\n\n window.___push = to => navigate(to, { replace: false })\n window.___replace = to => navigate(to, { replace: true })\n window.___navigate = (to, options) => navigate(to, options)\n}\n\nclass RouteAnnouncer extends React.Component {\n constructor(props) {\n super(props)\n this.announcementRef = React.createRef()\n }\n\n componentDidUpdate(prevProps, nextProps) {\n requestAnimationFrame(() => {\n let pageName = `new page at ${this.props.location.pathname}`\n if (document.title) {\n pageName = document.title\n }\n const pageHeadings = document.querySelectorAll(`#gatsby-focus-wrapper h1`)\n if (pageHeadings && pageHeadings.length) {\n pageName = pageHeadings[0].textContent\n }\n const newAnnouncement = `Navigated to ${pageName}`\n if (this.announcementRef.current) {\n const oldAnnouncement = this.announcementRef.current.innerText\n if (oldAnnouncement !== newAnnouncement) {\n this.announcementRef.current.innerText = newAnnouncement\n }\n }\n })\n }\n\n render() {\n return \n }\n}\n\nconst compareLocationProps = (prevLocation, nextLocation) => {\n if (prevLocation.href !== nextLocation.href) {\n return true\n }\n\n if (prevLocation?.state?.key !== nextLocation?.state?.key) {\n return true\n }\n\n return false\n}\n\n// Fire on(Pre)RouteUpdate APIs\nclass RouteUpdates extends React.Component {\n constructor(props) {\n super(props)\n onPreRouteUpdate(props.location, null)\n }\n\n componentDidMount() {\n onRouteUpdate(this.props.location, null)\n }\n\n shouldComponentUpdate(nextProps) {\n if (compareLocationProps(this.props.location, nextProps.location)) {\n onPreRouteUpdate(nextProps.location, this.props.location)\n return true\n }\n return false\n }\n\n componentDidUpdate(prevProps) {\n if (compareLocationProps(prevProps.location, this.props.location)) {\n onRouteUpdate(this.props.location, prevProps.location)\n }\n }\n\n render() {\n return (\n \n {this.props.children}\n \n )\n }\n}\n\nRouteUpdates.propTypes = {\n location: PropTypes.object.isRequired,\n}\n\nexport { init, shouldUpdateScroll, RouteUpdates, maybeGetBrowserRedirect }\n","// Pulled from react-compat\n// https://github.com/developit/preact-compat/blob/7c5de00e7c85e2ffd011bf3af02899b63f699d3a/src/index.js#L349\nfunction shallowDiffers(a, b) {\n for (var i in a) {\n if (!(i in b)) return true;\n }for (var _i in b) {\n if (a[_i] !== b[_i]) return true;\n }return false;\n}\n\nexport default (function (instance, nextProps, nextState) {\n return shallowDiffers(instance.props, nextProps) || shallowDiffers(instance.state, nextState);\n});","import React from \"react\"\nimport loader, { PageResourceStatus } from \"./loader\"\nimport shallowCompare from \"shallow-compare\"\n\nclass EnsureResources extends React.Component {\n constructor(props) {\n super()\n const { location, pageResources } = props\n this.state = {\n location: { ...location },\n pageResources:\n pageResources ||\n loader.loadPageSync(location.pathname + location.search, {\n withErrorDetails: true,\n }),\n }\n }\n\n static getDerivedStateFromProps({ location }, prevState) {\n if (prevState.location.href !== location.href) {\n const pageResources = loader.loadPageSync(\n location.pathname + location.search,\n {\n withErrorDetails: true,\n }\n )\n\n return {\n pageResources,\n location: { ...location },\n }\n }\n\n return {\n location: { ...location },\n }\n }\n\n loadResources(rawPath) {\n loader.loadPage(rawPath).then(pageResources => {\n if (pageResources && pageResources.status !== PageResourceStatus.Error) {\n this.setState({\n location: { ...window.location },\n pageResources,\n })\n } else {\n window.history.replaceState({}, ``, location.href)\n window.location = rawPath\n }\n })\n }\n\n shouldComponentUpdate(nextProps, nextState) {\n // Always return false if we're missing resources.\n if (!nextState.pageResources) {\n this.loadResources(\n nextProps.location.pathname + nextProps.location.search\n )\n return false\n }\n\n if (\n process.env.BUILD_STAGE === `develop` &&\n nextState.pageResources.stale\n ) {\n this.loadResources(\n nextProps.location.pathname + nextProps.location.search\n )\n return false\n }\n\n // Check if the component or json have changed.\n if (this.state.pageResources !== nextState.pageResources) {\n return true\n }\n if (\n this.state.pageResources.component !== nextState.pageResources.component\n ) {\n return true\n }\n\n if (this.state.pageResources.json !== nextState.pageResources.json) {\n return true\n }\n // Check if location has changed on a page using internal routing\n // via matchPath configuration.\n if (\n this.state.location.key !== nextState.location.key &&\n nextState.pageResources.page &&\n (nextState.pageResources.page.matchPath ||\n nextState.pageResources.page.path)\n ) {\n return true\n }\n return shallowCompare(this, nextProps, nextState)\n }\n\n render() {\n if (\n process.env.NODE_ENV !== `production` &&\n (!this.state.pageResources ||\n this.state.pageResources.status === PageResourceStatus.Error)\n ) {\n const message = `EnsureResources was not able to find resources for path: \"${this.props.location.pathname}\"\nThis typically means that an issue occurred building components for that path.\nRun \\`gatsby clean\\` to remove any cached elements.`\n if (this.state.pageResources?.error) {\n console.error(message)\n throw this.state.pageResources.error\n }\n\n throw new Error(message)\n }\n\n return this.props.children(this.state)\n }\n}\n\nexport default EnsureResources\n","import { apiRunner, apiRunnerAsync } from \"./api-runner-browser\"\nimport React from \"react\"\nimport { Router, navigate, Location, BaseContext } from \"@gatsbyjs/reach-router\"\nimport { ScrollContext } from \"gatsby-react-router-scroll\"\nimport { StaticQueryContext } from \"./static-query\"\nimport {\n SlicesMapContext,\n SlicesContext,\n SlicesResultsContext,\n} from \"./slice/context\"\nimport {\n shouldUpdateScroll,\n init as navigationInit,\n RouteUpdates,\n} from \"./navigation\"\nimport emitter from \"./emitter\"\nimport PageRenderer from \"./page-renderer\"\nimport asyncRequires from \"$virtual/async-requires\"\nimport {\n setLoader,\n ProdLoader,\n publicLoader,\n PageResourceStatus,\n getStaticQueryResults,\n getSliceResults,\n} from \"./loader\"\nimport EnsureResources from \"./ensure-resources\"\nimport stripPrefix from \"./strip-prefix\"\n\n// Generated during bootstrap\nimport matchPaths from \"$virtual/match-paths.json\"\nimport { reactDOMUtils } from \"./react-dom-utils\"\n\nconst loader = new ProdLoader(asyncRequires, matchPaths, window.pageData)\nsetLoader(loader)\nloader.setApiRunner(apiRunner)\n\nconst { render, hydrate } = reactDOMUtils()\n\nwindow.asyncRequires = asyncRequires\nwindow.___emitter = emitter\nwindow.___loader = publicLoader\n\nnavigationInit()\n\nconst reloadStorageKey = `gatsby-reload-compilation-hash-match`\n\napiRunnerAsync(`onClientEntry`).then(() => {\n // Let plugins register a service worker. The plugin just needs\n // to return true.\n if (apiRunner(`registerServiceWorker`).filter(Boolean).length > 0) {\n require(`./register-service-worker`)\n }\n\n // In gatsby v2 if Router is used in page using matchPaths\n // paths need to contain full path.\n // For example:\n // - page have `/app/*` matchPath\n // - inside template user needs to use `/app/xyz` as path\n // Resetting `basepath`/`baseuri` keeps current behaviour\n // to not introduce breaking change.\n // Remove this in v3\n const RouteHandler = props => (\n \n \n {({ location }) => (\n \n {({ pageResources, location }) => {\n const staticQueryResults = getStaticQueryResults()\n const sliceResults = getSliceResults()\n\n return (\n \n \n \n \n \n {children}\n \n \n \n \n \n )\n }}\n \n )}\n \n )\n }\n }\n\n class LocationHandler extends React.Component {\n render() {\n return (\n \n {({ pageResources, location }) => (\n \n \n \n \n )}\n \n )\n }\n }\n\n const { pagePath, location: browserLoc } = window\n\n // Explicitly call navigate if the canonical path (window.pagePath)\n // is different to the browser path (window.location.pathname). SSR\n // page paths might include search params, while SSG and DSG won't.\n // If page path include search params we also compare query params.\n // But only if NONE of the following conditions hold:\n //\n // - The url matches a client side route (page.matchPath)\n // - it's a 404 page\n // - it's the offline plugin shell (/offline-plugin-app-shell-fallback/)\n if (\n pagePath &&\n __BASE_PATH__ + pagePath !==\n browserLoc.pathname + (pagePath.includes(`?`) ? browserLoc.search : ``) &&\n !(\n loader.findMatchPath(stripPrefix(browserLoc.pathname, __BASE_PATH__)) ||\n pagePath.match(/^\\/(404|500)(\\/?|.html)$/) ||\n pagePath.match(/^\\/offline-plugin-app-shell-fallback\\/?$/)\n )\n ) {\n navigate(\n __BASE_PATH__ +\n pagePath +\n (!pagePath.includes(`?`) ? browserLoc.search : ``) +\n browserLoc.hash,\n {\n replace: true,\n }\n )\n }\n\n // It's possible that sessionStorage can throw an exception if access is not granted, see https://github.com/gatsbyjs/gatsby/issues/34512\n const getSessionStorage = () => {\n try {\n return sessionStorage\n } catch {\n return null\n }\n }\n\n publicLoader.loadPage(browserLoc.pathname + browserLoc.search).then(page => {\n const sessionStorage = getSessionStorage()\n\n if (\n page?.page?.webpackCompilationHash &&\n page.page.webpackCompilationHash !== window.___webpackCompilationHash\n ) {\n // Purge plugin-offline cache\n if (\n `serviceWorker` in navigator &&\n navigator.serviceWorker.controller !== null &&\n navigator.serviceWorker.controller.state === `activated`\n ) {\n navigator.serviceWorker.controller.postMessage({\n gatsbyApi: `clearPathResources`,\n })\n }\n\n // We have not matching html + js (inlined `window.___webpackCompilationHash`)\n // with our data (coming from `app-data.json` file). This can cause issues such as\n // errors trying to load static queries (as list of static queries is inside `page-data`\n // which might not match to currently loaded `.js` scripts).\n // We are making attempt to reload if hashes don't match, but we also have to handle case\n // when reload doesn't fix it (possibly broken deploy) so we don't end up in infinite reload loop\n if (sessionStorage) {\n const isReloaded = sessionStorage.getItem(reloadStorageKey) === `1`\n\n if (!isReloaded) {\n sessionStorage.setItem(reloadStorageKey, `1`)\n window.location.reload(true)\n return\n }\n }\n }\n\n if (sessionStorage) {\n sessionStorage.removeItem(reloadStorageKey)\n }\n\n if (!page || page.status === PageResourceStatus.Error) {\n const message = `page resources for ${browserLoc.pathname} not found. Not rendering React`\n\n // if the chunk throws an error we want to capture the real error\n // This should help with https://github.com/gatsbyjs/gatsby/issues/19618\n if (page && page.error) {\n console.error(message)\n throw page.error\n }\n\n throw new Error(message)\n }\n\n const SiteRoot = apiRunner(\n `wrapRootElement`,\n { element: {SiteRoot} \n }\n\n const focusEl = document.getElementById(`gatsby-focus-wrapper`)\n\n // Client only pages have any empty body so we just do a normal\n // render to avoid React complaining about hydration mis-matches.\n let defaultRenderer = render\n if (focusEl && focusEl.children.length) {\n defaultRenderer = hydrate\n }\n\n const renderer = apiRunner(\n `replaceHydrateFunction`,\n undefined,\n defaultRenderer\n )[0]\n\n function runRender() {\n const rootElement =\n typeof window !== `undefined`\n ? document.getElementById(`___gatsby`)\n : null\n\n renderer(\n {finalData && render(finalData)}\n {!finalData && \n )\n}\n\nlet warnedAboutStaticQuery = false\n\n// TODO(v6): Remove completely\nconst StaticQuery = props => {\n const { data, query, render, children } = props\n\n if (process.env.NODE_ENV === `development` && !warnedAboutStaticQuery) {\n console.warn(\n `The \n {staticQueryData => (\n \n )\n}\n\nStaticQuery.propTypes = {\n data: PropTypes.object,\n query: PropTypes.string.isRequired,\n render: PropTypes.func,\n children: PropTypes.func,\n}\n\nconst useStaticQuery = query => {\n if (\n typeof React.useContext !== `function` &&\n process.env.NODE_ENV === `development`\n ) {\n // TODO(v5): Remove since we require React >= 18\n throw new Error(\n `You're likely using a version of React that doesn't support Hooks\\n` +\n `Please update React and ReactDOM to 16.8.0 or later to use the useStaticQuery hook.`\n )\n }\n\n const context = React.useContext(StaticQueryContext)\n\n // query is a stringified number like `3303882` when wrapped with graphql, If a user forgets\n // to wrap the query in a grqphql, then casting it to a Number results in `NaN` allowing us to\n // catch the misuse of the API and give proper direction\n if (isNaN(Number(query))) {\n throw new Error(`useStaticQuery was called with a string but expects to be called using \\`graphql\\`. Try this:\n\nimport { useStaticQuery, graphql } from 'gatsby';\n\nuseStaticQuery(graphql\\`${query}\\`);\n`)\n }\n\n if (context[query]?.data) {\n return context[query].data\n } else {\n throw new Error(\n `The result of this StaticQuery could not be fetched.\\n\\n` +\n `This is likely a bug in Gatsby and if refreshing the page does not fix it, ` +\n `please open an issue in https://github.com/gatsbyjs/gatsby/issues`\n )\n }\n}\n\nexport { StaticQuery, StaticQueryContext, useStaticQuery }\n","import React from \"react\"\n\n// Ensure serverContext is not created more than once as React will throw when creating it more than once\n// https://github.com/facebook/react/blob/dd2d6522754f52c70d02c51db25eb7cbd5d1c8eb/packages/react/src/ReactServerContext.js#L101\nconst createServerContext = (name, defaultValue = null) => {\n /* eslint-disable no-undef */\n if (!globalThis.__SERVER_CONTEXT) {\n globalThis.__SERVER_CONTEXT = {}\n }\n\n if (!globalThis.__SERVER_CONTEXT[name]) {\n globalThis.__SERVER_CONTEXT[name] = React.createServerContext(\n name,\n defaultValue\n )\n }\n\n return globalThis.__SERVER_CONTEXT[name]\n}\n\nfunction createServerOrClientContext(name, defaultValue) {\n if (React.createServerContext) {\n return createServerContext(name, defaultValue)\n }\n\n return React.createContext(defaultValue)\n}\n\nexport { createServerOrClientContext }\n","/**\n * Remove a prefix from a string. Return the input string if the given prefix\n * isn't found.\n */\n\nexport default function stripPrefix(str, prefix = ``) {\n if (!prefix) {\n return str\n }\n\n if (str === prefix) {\n return `/`\n }\n\n if (str.startsWith(`${prefix}/`)) {\n return str.slice(prefix.length)\n }\n\n return str\n}\n","module.exports = {\r\n // ######################\r\n // Required Section Start\r\n // ######################\r\n\r\n // Main page title\r\n title: \"LellowMellow Tech Blog\",\r\n\r\n // Main page description (callout)\r\n description:\r\n \"안녕하세요, Web Front-end 개발자 지망생 이동령(LellowMellow) 입니다. 해당 블로그는 Front-end 와 관련해 학습한 결과와 경험들을 모아놓은 공간입니다.\",\r\n\r\n // Meta tage description\r\n metaDescription: \"Festina lente, Make haste slowly\",\r\n\r\n // Blog name\r\n blogName: \"LellowMellow.dev\",\r\n\r\n // Post author name\r\n author: \"LellowMellow\",\r\n\r\n // Blog site url\r\n siteUrl: \"https://lellowmellow.github.io\",\r\n\r\n // Icons\r\n // Enter the desired Icon name in the field below the link.\r\n // Example: main: \"TbAlien\"\r\n // https://react-icons.github.io/react-icons/icons/tb/\r\n // main: Main page icon\r\n // profile: Navigation bar author icon\r\n mainIcon: \"TbTopologyStarRing3\",\r\n\r\n // ######################\r\n // Required Section End\r\n // ######################\r\n\r\n // ######################\r\n // Optional Section Start\r\n // ######################\r\n\r\n // Navigation bar bio links\r\n // Do not remove keys, only modify the links.\r\n // Use an empty string if a link is not available.\r\n links: {\r\n github: \"https://github.com/LellowMellow\",\r\n linkedin: \"\",\r\n youtube: \"\",\r\n x: \"\",\r\n threads: \"\",\r\n instagram: \"https://www.instagram.com/lell0w_mell0w/\",\r\n gmail: \"mailto:dr11291129@gmail.com\",\r\n },\r\n\r\n // Navigation bar additional bio links\r\n // Feel free to add new keys if necessary.\r\n // If not using a key, leave it as an empty object.\r\n // Example: { icon: \"TbBrandTiktok\", title: \"Tiktok\", url: \"https://www.tiktok.com/\" }\r\n additionalLinks: [],\r\n\r\n // ######################\r\n // Optional Section End\r\n // ######################\r\n}\r\n","var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\n return cooked;\n};\nimport { css, createGlobalStyle } from 'styled-components';\n// prettier-ignore\nexport var reset = css(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n/* http://meyerweb.com/eric/tools/css/reset/\\n v5.0.1 | 20191019\\n License: none (public domain)\\n*/\\n\\nhtml, body, div, span, applet, object, iframe,\\nh1, h2, h3, h4, h5, h6, p, blockquote, pre,\\na, abbr, acronym, address, big, cite, code,\\ndel, dfn, em, img, ins, kbd, q, s, samp,\\nsmall, strike, strong, sub, sup, tt, var,\\nb, u, i, center,\\ndl, dt, dd, menu, ol, ul, li,\\nfieldset, form, label, legend,\\ntable, caption, tbody, tfoot, thead, tr, th, td,\\narticle, aside, canvas, details, embed,\\nfigure, figcaption, footer, header, hgroup,\\nmain, menu, nav, output, ruby, section, summary,\\ntime, mark, audio, video {\\n margin: 0;\\n padding: 0;\\n border: 0;\\n font-size: 100%;\\n font: inherit;\\n vertical-align: baseline;\\n}\\n/* HTML5 display-role reset for older browsers */\\narticle, aside, details, figcaption, figure,\\nfooter, header, hgroup, main, menu, nav, section {\\n display: block;\\n}\\n/* HTML5 hidden-attribute fix for newer browsers */\\n*[hidden] {\\n display: none;\\n}\\nbody {\\n line-height: 1;\\n}\\nmenu, ol, ul {\\n list-style: none;\\n}\\nblockquote, q {\\n quotes: none;\\n}\\nblockquote:before, blockquote:after,\\nq:before, q:after {\\n content: '';\\n content: none;\\n}\\ntable {\\n border-collapse: collapse;\\n border-spacing: 0;\\n}\\n\"], [\"\\n/* http://meyerweb.com/eric/tools/css/reset/\\n v5.0.1 | 20191019\\n License: none (public domain)\\n*/\\n\\nhtml, body, div, span, applet, object, iframe,\\nh1, h2, h3, h4, h5, h6, p, blockquote, pre,\\na, abbr, acronym, address, big, cite, code,\\ndel, dfn, em, img, ins, kbd, q, s, samp,\\nsmall, strike, strong, sub, sup, tt, var,\\nb, u, i, center,\\ndl, dt, dd, menu, ol, ul, li,\\nfieldset, form, label, legend,\\ntable, caption, tbody, tfoot, thead, tr, th, td,\\narticle, aside, canvas, details, embed,\\nfigure, figcaption, footer, header, hgroup,\\nmain, menu, nav, output, ruby, section, summary,\\ntime, mark, audio, video {\\n margin: 0;\\n padding: 0;\\n border: 0;\\n font-size: 100%;\\n font: inherit;\\n vertical-align: baseline;\\n}\\n/* HTML5 display-role reset for older browsers */\\narticle, aside, details, figcaption, figure,\\nfooter, header, hgroup, main, menu, nav, section {\\n display: block;\\n}\\n/* HTML5 hidden-attribute fix for newer browsers */\\n*[hidden] {\\n display: none;\\n}\\nbody {\\n line-height: 1;\\n}\\nmenu, ol, ul {\\n list-style: none;\\n}\\nblockquote, q {\\n quotes: none;\\n}\\nblockquote:before, blockquote:after,\\nq:before, q:after {\\n content: '';\\n content: none;\\n}\\ntable {\\n border-collapse: collapse;\\n border-spacing: 0;\\n}\\n\"])));\nexport var Reset = createGlobalStyle(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\", \"\"], [\"\", \"\"])), reset);\nexport default reset;\nvar templateObject_1, templateObject_2;\n","import { createGlobalStyle } from \"styled-components\"\r\nimport reset from \"styled-reset\"\r\nimport \"./font.css\"\r\n\r\nconst GlobalStyles = createGlobalStyle`\r\n ${reset}\r\n \r\n * {\r\n box-sizing: border-box;\r\n text-decoration: none;\r\n -webkit-text-size-adjust: 100%;\r\n -webkit-tap-highlight-color: transparent;\r\n\r\n ::selection {\r\n background: #2383e247;\r\n }\r\n\r\n scrollbar-color: ${props => props.theme.scrollBarColor};\r\n ::-webkit-scrollbar {\r\n background: transparent;\r\n width: 12px;\r\n height: 12px;\r\n }\r\n ::-webkit-scrollbar-button {\r\n display: none;\r\n }\r\n ::-webkit-scrollbar-thumb {\r\n background: ${props => props.theme.scrollBarThumb};\r\n cursor: pointer;\r\n }\r\n transition: background-color 0.2s ease;\r\n }\r\n\r\n html {\r\n overscroll-behavior: none;\r\n background-color: ${props => props.theme.background};\r\n }\r\n \r\n body {\r\n font-family: 'Pretendard Variable', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';\r\n background-color: ${props => props.theme.background};\r\n }\r\n\r\n button {\r\n border: none;\r\n background: none;\r\n box-sizing: border-box;\r\n cursor: pointer;\r\n -webkit-appearance: none;\r\n -moz-appearance: none;\r\n appearance: none;\r\n }\r\n\r\n input {\r\n border: none;\r\n background: transparent;\r\n &:focus {\r\n outline: none;\r\n }\r\n &::placeholder {\r\n color: ${props => props.theme.placeholderColor};\r\n opacity: 1;\r\n }\r\n &::-webkit-input-placeholder {\r\n color: ${props => props.theme.placeholderColor};\r\n }\r\n &:-moz-placeholder {\r\n color: ${props => props.theme.placeholderColor};\r\n opacity: 1;\r\n }\r\n &::-moz-placeholder {\r\n color: ${props => props.theme.placeholderColor};\r\n opacity: 1;\r\n }\r\n &:-ms-input-placeholder {\r\n color: ${props => props.theme.placeholderColor};\r\n }\r\n }\r\n`\r\n\r\nexport default GlobalStyles\r\n","import styled from \"styled-components\"\r\n\r\nexport const Dimmer = styled.div`\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100vw;\r\n height: 100dvh;\r\n z-index: 200;\r\n overflow: hidden;\r\n -webkit-backdrop-filter: blur(10px);\r\n backdrop-filter: blur(10px);\r\n`\r\n","// src/components/Nav.jsx\r\nimport React, { useContext } from \"react\"\r\nimport styled from \"styled-components\"\r\nimport Icon from \"../../Icon\"\r\nimport { mainIcon, blogName } from \"../../../../blog-config.js\"\r\nimport { MobileContext } from \"../../../contexts/MobileContext/index.jsx\"\r\nimport { NavContext } from \"../../../contexts/NavContext/index.jsx\"\r\n\r\nconst HeaderWrapper = styled.div`\r\n height: 2rem;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n margin: 0.375rem;\r\n border-radius: 0.375rem;\r\n`\r\n\r\nconst BlogTitle = styled.div`\r\n flex: 1 1 auto;\r\n padding: 0.25rem 0.5rem;\r\n display: flex;\r\n align-items: center;\r\n gap: 0.5rem;\r\n font-size: 0.875rem;\r\n font-weight: 500;\r\n color: ${props => props.theme.text};\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n`\r\n\r\nconst IconWrapper = styled.div`\r\n color: ${props => props.theme.icon};\r\n margin-top: 0.0625rem;\r\n position: relative;\r\n`\r\n\r\nconst RedDot = styled.div`\r\n width: 0.375rem;\r\n height: 0.375rem;\r\n border-radius: 50%;\r\n top: -0.0625rem;\r\n right: -0.0625rem;\r\n position: absolute;\r\n background: ${props => props.theme.red};\r\n`\r\n\r\nconst HeaderButton = styled.button`\r\n width: 1.75rem;\r\n height: 1.75rem;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: 0.25rem;\r\n padding: 0;\r\n margin-right: 0.125rem;\r\n flex: 0 0 auto;\r\n color: ${props => props.theme.icon};\r\n &:hover {\r\n background: ${props => props.theme.navButtonHover};\r\n }\r\n &:active {\r\n background: ${props => props.theme.buttonActive};\r\n }\r\n & > .closeButton {\r\n opacity: 0;\r\n color: ${props => props.theme.weekIcon};\r\n transition: opacity 200ms ease;\r\n &:hover {\r\n color: ${props => props.theme.icon};\r\n }\r\n }\r\n transition: 20ms ease-in 0s;\r\n`\r\n\r\nconst NavHeader = () => {\r\n const { isMobile } = useContext(MobileContext)\r\n const { isNavFixed, setIsNavFixed } = useContext(NavContext)\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n {blogName}\r\n \r\n {isNavFixed && !isMobile && (\r\n setIsNavFixed(false)} aria-label=\"close\">\r\n \r\n )}\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default NavHeader\r\n","// src/components/Nav.jsx\r\nimport React, { useContext } from \"react\"\r\nimport styled from \"styled-components\"\r\nimport Icon from \"../../Icon\"\r\nimport { ThemeContext } from \"../../../contexts/ThemeContext\"\r\nimport { links, additionalLinks } from \"../../../../blog-config\"\r\n\r\nconst ICON_LIST = {\r\n github: \"TbBrandGithub\",\r\n linkedin: \"TbBrandLinkedin\",\r\n youtube: \"TbBrandYoutube\",\r\n x: \"TbBrandX\",\r\n threads: \"TbBrandThreads\",\r\n instagram: \"TbBrandInstagram\",\r\n gmail: \"TbBrandGmail\",\r\n}\r\nObject.freeze(ICON_LIST)\r\n\r\nconst NavButtonWrapper = styled.div`\r\n display: flex;\r\n flex-direction: column;\r\n flex: 0 0 auto;\r\n gap: 0.0625rem;\r\n padding: 0 0.5rem 0.5rem 0.5rem;\r\n overflow: hidden;\r\n`\r\n\r\nconst NavButton = styled.button`\r\n height: 1.875rem;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n gap: 0.5rem;\r\n padding: 0.25rem 0.5rem;\r\n border-radius: 0.375rem;\r\n overflow: hidden;\r\n & > svg {\r\n flex: 0 0 auto;\r\n color: ${props => props.theme.weekIcon};\r\n }\r\n & > span {\r\n color: ${props => props.theme.navButtonText};\r\n font-weight: 500;\r\n font-size: 0.875rem;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n }\r\n &:hover {\r\n background: ${props => props.theme.navButtonHover};\r\n }\r\n &:active {\r\n background: ${props => props.theme.buttonActive};\r\n }\r\n transition: 20ms ease-in 0s;\r\n`\r\n\r\nconst NavLinks = ({ $setSearchModalActive, customNavigate }) => {\r\n const { ThemeMode, toggleTheme } = useContext(ThemeContext)\r\n\r\n return (\r\n \r\n $setSearchModalActive(true)}>\r\n \r\n toggleTheme()}>\r\n \r\n customNavigate(\"/\")}>\r\n \r\n customNavigate(\"/series/\")}>\r\n \r\n\r\n {Object.keys(links).map(key => {\r\n if (links[key] !== \"\") {\r\n return (\r\n window.open(links[key])} key={key}>\r\n \r\n )\r\n } else return \"\"\r\n })}\r\n\r\n {additionalLinks.map(({ icon, title, url }) => (\r\n window.open(url)} key={title}>\r\n \r\n ))}\r\n \r\n )\r\n}\r\n\r\nexport default NavLinks\r\n","// src/components/Nav.jsx\r\nimport React, { useRef, useEffect } from \"react\"\r\nimport styled from \"styled-components\"\r\nimport Icon from \"../../Icon\"\r\n\r\nconst Divider = styled.div`\r\n width: 100%;\r\n height: 0.125rem;\r\n margin-top: -0.125rem;\r\n &.scrolled {\r\n box-shadow: ${props => props.theme.navTagDivider};\r\n }\r\n transition: box-shadow 300ms;\r\n`\r\n\r\nconst TagWrapper = styled.div`\r\n width: 100%;\r\n flex: 1 1 auto;\r\n padding: 0.375rem 0.5rem 1.25rem 0.5rem;\r\n overflow: hidden auto;\r\n overscroll-behavior: contain;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: baseline;\r\n gap: 0.0625rem;\r\n`\r\n\r\nconst TagTitle = styled.div`\r\n flex: 0 0 auto;\r\n padding: 0 0.5rem;\r\n height: 1.875rem;\r\n display: flex;\r\n align-items: center;\r\n font-weight: 500;\r\n font-size: 0.75rem;\r\n color: ${props => props.theme.weekIcon};\r\n`\r\n\r\nconst TagButton = styled.button`\r\n flex: 0 0 auto;\r\n position: relative;\r\n height: 1.875rem;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n gap: 0.5rem;\r\n padding: 0.25rem 0.5rem;\r\n border-radius: 0.375rem;\r\n overflow: hidden;\r\n & > span {\r\n color: ${props => props.theme.navButtonText};\r\n font-weight: 500;\r\n font-size: 0.875rem;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n }\r\n & > .tagIcon {\r\n opacity: 1;\r\n flex: 0 0 auto;\r\n color: ${props => props.theme.navTagIcon};\r\n transition: opacity 200ms ease;\r\n }\r\n & > .arrowIcon {\r\n opacity: 0;\r\n flex: 0 0 auto;\r\n color: ${props => props.theme.navTagIcon};\r\n transition: opacity 200ms ease;\r\n position: absolute;\r\n left: 0.625rem;\r\n }\r\n &:hover {\r\n background: ${props => props.theme.navButtonHover};\r\n & > .tagIcon {\r\n opacity: 0;\r\n }\r\n & > .arrowIcon {\r\n opacity: 1;\r\n }\r\n }\r\n &:active {\r\n background: ${props => props.theme.buttonActive};\r\n }\r\n transition: background 20ms ease-in 0s;\r\n`\r\n\r\nconst NavTags = ({ tags, customNavigate }) => {\r\n const navRef = useRef(null)\r\n const dividerRef = useRef(null)\r\n\r\n useEffect(() => {\r\n const currentNav = navRef.current\r\n const currentDivider = dividerRef.current\r\n\r\n const handleScroll = () => {\r\n if (currentNav && currentNav.scrollTop > 0) {\r\n if (currentDivider) currentDivider.classList.add(\"scrolled\")\r\n } else if (currentDivider) {\r\n currentDivider.classList.remove(\"scrolled\")\r\n }\r\n }\r\n currentNav.addEventListener(\"scroll\", handleScroll)\r\n return () => {\r\n currentNav.removeEventListener(\"scroll\", handleScroll)\r\n }\r\n }, [])\r\n\r\n return (\r\n <>\r\n \r\n Tags \r\n {tags?.map(tag => (\r\n customNavigate(`/tags/${tag.replace(/\\s+/g, \"-\")}/`)}\r\n >\r\n \r\n \r\n )\r\n}\r\n\r\nexport default NavTags\r\n","import React, { useState } from \"react\"\r\nimport styled from \"styled-components\"\r\nimport Icon from \"../../Icon\"\r\n\r\nconst Dimmer = styled.div`\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100vw;\r\n height: 100dvh;\r\n z-index: 400;\r\n overflow: hidden;\r\n background: rgba(15, 15, 15, 0.8);\r\n`\r\n\r\nconst DialogWrapper = styled.div`\r\n position: fixed;\r\n top: 5.5rem;\r\n left: 50%;\r\n display: flex;\r\n flex-direction: column;\r\n transform: translate(-50%, 0);\r\n background: ${props => props.theme.searchBackground};\r\n border-radius: 0.75rem;\r\n overflow: hidden;\r\n min-height: max(50vh, 0px);\r\n max-height: max(50vh, 0px);\r\n width: 100%;\r\n max-width: 755px;\r\n z-index: 500;\r\n user-select: none;\r\n -webkit-user-select: none;\r\n`\r\n\r\nconst SearchBarWrapper = styled.div`\r\n display: flex;\r\n align-items: center;\r\n padding: 0 1rem 0 1rem;\r\n width: 100%;\r\n background: transparent;\r\n height: 3rem;\r\n box-shadow: ${props => props.theme.searchDivider};\r\n color: ${props => props.theme.searchIcon};\r\n & > * {\r\n flex: 0 0 auto;\r\n }\r\n`\r\n\r\nconst EraseButton = styled.button`\r\n color: ${props => props.theme.searchIcon};\r\n padding: 0;\r\n margin: 0 0.25rem;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: 50%;\r\n &:hover {\r\n background: ${props => props.theme.searchIconHover};\r\n }\r\n`\r\n\r\nconst SearchInput = styled.input`\r\n width: 100%;\r\n flex: 1 1 auto;\r\n margin-left: 0.5rem;\r\n font-size: 1.125rem;\r\n color: ${props => props.theme.text};\r\n`\r\n\r\nconst CloseButton = styled.button`\r\n width: 1.5rem;\r\n height: 1.5rem;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: 0.25rem;\r\n padding: 0.25rem;\r\n margin-left: 0.25rem;\r\n color: ${props => props.theme.searchIcon};\r\n &:hover {\r\n background: ${props => props.theme.buttonHover};\r\n }\r\n &:active {\r\n background: ${props => props.theme.buttonActive};\r\n }\r\n transition: 20ms ease-in 0s;\r\n`\r\n\r\nconst NoResult = styled.div`\r\n flex: 1 1 auto;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: center;\r\n font-size: 0.875rem;\r\n line-height: 1.5;\r\n text-align: center;\r\n span:nth-child(1) {\r\n font-weight: 500;\r\n color: ${props => props.theme.weekText};\r\n }\r\n span:nth-child(2) {\r\n color: ${props => props.theme.searchText};\r\n }\r\n button {\r\n line-height: 1.5;\r\n font-size: 0.875rem;\r\n color: ${props => props.theme.blue};\r\n }\r\n`\r\n\r\nconst SearchDialog = ({ $setSearchModalActive }) => {\r\n const [inputText, setInputText] = useState(\"\")\r\n\r\n const handleChange = e => {\r\n setInputText(e.target.value)\r\n }\r\n\r\n const handleErase = () => {\r\n setInputText(\"\")\r\n }\r\n\r\n return (\r\n <>\r\n $setSearchModalActive(false)} />\r\n \r\n \r\n \r\n \r\n $setSearchModalActive(false)}>\r\n \r\n \r\n\r\n \r\n No Results\r\n There are no pages related to the keyword you entered.\r\n \r\n \r\n \r\n \r\n )\r\n}\r\nexport default SearchDialog\r\n","import React, { useContext, useState } from \"react\"\r\nimport styled from \"styled-components\"\r\nimport { graphql, navigate, useStaticQuery } from \"gatsby\"\r\nimport { Dimmer } from \"../Dimmer\"\r\nimport NavHeader from \"./NavHeader\"\r\nimport NavLinks from \"./NavLinks\"\r\nimport NavTags from \"./NavTags\"\r\nimport SearchDialog from \"./SearchDialog\"\r\nimport { MobileContext } from \"../../contexts/MobileContext\"\r\nimport { NavContext } from \"../../contexts/NavContext\"\r\n\r\nconst Navigation = styled.nav`\r\n position: ${props => (props.$isMobile ? \"fixed\" : \"static\")};\r\n width: 15.5rem;\r\n height: ${props => (props.$isFixed || props.$isMobile ? \"100dvh\" : \"auto\")};\r\n max-height: ${props =>\r\n !props.$isFixed && !props.$isMobile ? \"calc(100dvh - 7.375rem)\" : \"none\"};\r\n background-color: ${props =>\r\n props.$isFixed && !props.$isMobile\r\n ? \"transparent\"\r\n : props.theme.navBackground};\r\n display: flex;\r\n flex-direction: column;\r\n flex: 0 0 auto;\r\n box-shadow: ${props =>\r\n props.$isFixed || props.$isMobile\r\n ? props.theme.navFixedBoxShadow\r\n : props.theme.navBoxShadow};\r\n border-radius: ${props =>\r\n props.$isFixed || props.$isMobile ? \"none\" : \"0 0.5rem 0.5rem 0\"};\r\n visibility: ${props =>\r\n props.$isVisible || props.$isFixed ? \"visible\" : \"hidden\"};\r\n transform: ${props =>\r\n props.$isFixed\r\n ? \"none\"\r\n : props.$isVisible\r\n ? `translateX(0rem) ${\r\n props.$isMobile ? \"translateY(0)\" : \"translateY(3.6875rem)\"\r\n }`\r\n : `translateX(-14.25rem) ${\r\n props.$isMobile ? \"translateY(0)\" : \"translateY(3.6875rem)\"\r\n }`};\r\n opacity: ${props => (props.$isVisible || props.$isFixed ? 1 : 0)};\r\n transition: transform 200ms ease, opacity 200ms ease, visibility 200ms ease,\r\n width 200ms ease, height 200ms ease;\r\n z-index: 300;\r\n user-select: none;\r\n -webkit-user-select: none;\r\n\r\n &:hover {\r\n .closeButton {\r\n opacity: 1;\r\n }\r\n }\r\n`\r\n\r\nconst NavBar = () => {\r\n const { isMobile } = useContext(MobileContext)\r\n const { isNavFixed, isNavVisible, setIsNavFixed } = useContext(NavContext)\r\n const [searchModalActive, setSearchModalActive] = useState(false)\r\n\r\n const customNavigate = to => {\r\n if (isMobile) setIsNavFixed(false)\r\n navigate(to)\r\n }\r\n\r\n const data = useStaticQuery(graphql`\r\n query {\r\n allMarkdownRemark {\r\n group(field: frontmatter___tags) {\r\n fieldValue\r\n totalCount\r\n }\r\n }\r\n }\r\n `)\r\n\r\n const tags = data.allMarkdownRemark.group.map(tag => tag.fieldValue)\r\n\r\n return (\r\n <>\r\n {searchModalActive && (\r\n setIsNavFixed(false)} />\r\n )}\r\n \r\n \r\n {children}\r\n \r\n )\r\n}\r\n\r\nexport { ToastProvider, ToastContext }\r\n","import React from \"react\"\r\nimport { MobileProvider } from \"./MobileContext\"\r\nimport { ThemeProvider } from \"./ThemeContext\"\r\nimport { NavProvider } from \"./NavContext\"\r\nimport { ToastProvider } from \"./ToastContext\"\r\nconst ContextProvider = ({ children }) => {\r\n return (\r\n \r\n \r\n \r\n {children} \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ContextProvider\r\n","import React, { useContext } from \"react\"\r\nimport styled from \"styled-components\"\r\nimport Icon from \"../../Icon\"\r\nimport { navigate } from \"gatsby\"\r\nimport { mainIcon, blogName } from \"../../../../blog-config.js\"\r\nimport { NavContext } from \"../../../contexts/NavContext\"\r\nimport { ToastContext } from \"../../../contexts/ToastContext/index.jsx\"\r\n\r\nconst HeaderWrapper = styled.header`\r\n display: flex;\r\n flex-direction: row;\r\n justify-content: space-between;\r\n align-items: center;\r\n max-width: 100vw;\r\n background: ${props => props.theme.background};\r\n padding: 0rem 0.75rem;\r\n height: 2.75rem;\r\n z-index: 100;\r\n user-select: none;\r\n -webkit-user-select: none;\r\n`\r\n\r\nconst MenuButtonWrapper = styled.div`\r\n width: 2.75rem;\r\n height: 2.75rem;\r\n padding: 0.625rem;\r\n margin-left: -0.75rem;\r\n flex: 0 0 auto;\r\n`\r\n\r\nconst MenuButton = styled.button`\r\n border-radius: 0.25rem;\r\n width: 100%;\r\n height: 100%;\r\n padding: 0.125rem;\r\n color: ${props => props.theme.icon};\r\n &:hover {\r\n background: ${props => props.theme.buttonHover};\r\n }\r\n &:active {\r\n background: ${props => props.theme.buttonActive};\r\n }\r\n position: relative;\r\n transition: 20ms ease-in 0s;\r\n`\r\n\r\nconst MenuIcon = styled(Icon)`\r\n position: absolute;\r\n top: 0.0625rem;\r\n left: 0.0625rem;\r\n opacity: ${props => (props.$isVisible ? 1 : 0)};\r\n transition: opacity 200ms ease;\r\n`\r\n\r\nconst MainTitleButton = styled.button`\r\n padding: 0 0.375rem;\r\n height: 1.5rem;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n border-radius: 0.25rem;\r\n line-height: 1.2;\r\n font-size: 0.875rem;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n gap: 0.375rem;\r\n color: ${props => props.theme.icon};\r\n span {\r\n padding-top: 0.125rem;\r\n color: ${props => props.theme.text};\r\n }\r\n &:hover {\r\n background: ${props => props.theme.buttonHover};\r\n }\r\n &:active {\r\n background: ${props => props.theme.buttonActive};\r\n }\r\n transition: 20ms ease-in 0s;\r\n`\r\n\r\nconst MiddleContainer = styled.div`\r\n flex: 1 1 auto;\r\n`\r\n\r\nconst ShareButton = styled.button`\r\n flex: 0 0 auto;\r\n border-radius: 0.25rem;\r\n padding: 0 0.5rem;\r\n height: 1.75rem;\r\n color: ${props => props.theme.text};\r\n font-size: 0.875rem;\r\n font-weight: 400;\r\n line-height: 1.2;\r\n &:hover {\r\n background: ${props => props.theme.buttonHover};\r\n }\r\n &:active {\r\n background: ${props => props.theme.buttonActive};\r\n }\r\n transition: 20ms ease-in 0s;\r\n`\r\n\r\nconst Header = () => {\r\n const { isNavVisible, isNavFixed, setIsNavFixed } = useContext(NavContext)\r\n const { addToast } = useContext(ToastContext)\r\n\r\n const handleShareButtonClicked = () => {\r\n navigator.clipboard\r\n .writeText(window.location.href)\r\n .then(() => addToast(\"Copy link complete\"))\r\n .catch(err => alert(\"COPY FAILED \", err))\r\n }\r\n\r\n return (\r\n \r\n {!isNavFixed && (\r\n \r\n setIsNavFixed(true)}>\r\n \r\n \r\n )}\r\n navigate(\"/\")}>\r\n \r\n handleShareButtonClicked()}>\r\n Share\r\n \r\n \r\n )\r\n}\r\n\r\nexport default Header\r\n","import React, { useEffect, useRef } from \"react\"\r\nimport styled from \"styled-components\"\r\nimport { useLocation } from \"@reach/router\"\r\n\r\nconst MainContainer = styled.main`\r\n width: 100%;\r\n flex-grow: 0;\r\n flex-shrink: 1;\r\n display: flex;\r\n flex-direction: column;\r\n background: ${props => props.theme.background};\r\n z-index: 1;\r\n height: calc(100dvh - 2.75rem);\r\n max-height: 100%;\r\n overflow: hidden auto;\r\n overscroll-behavior: contain;\r\n`\r\n\r\nconst ScrollWrapper = styled.div`\r\n position: static !important;\r\n width: 100%;\r\n max-width: 47.25rem;\r\n margin: auto;\r\n margin-top: 0;\r\n padding: 0 1.5rem;\r\n padding-bottom: 30vh;\r\n`\r\n\r\nconst Body = ({ children }) => {\r\n const scrollRef = useRef(null)\r\n const location = useLocation()\r\n\r\n useEffect(() => {\r\n if (scrollRef.current) {\r\n scrollRef.current.scrollTop = 0\r\n }\r\n }, [location.pathname])\r\n\r\n return (\r\n \r\n {children} \r\n \r\n )\r\n}\r\n\r\nexport default Body\r\n","import React, { useContext } from \"react\"\r\nimport Header from \"./Header\"\r\nimport Body from \"./Body\"\r\nimport styled from \"styled-components\"\r\nimport { MobileContext } from \"../../contexts/MobileContext\"\r\nimport { NavContext } from \"../../contexts/NavContext\"\r\n\r\nconst ContentContainer = styled.div`\r\n position: relative;\r\n display: flex;\r\n flex-direction: column;\r\n width: 100%;\r\n height: 100dvh;\r\n overflow: hidden;\r\n margin-left: ${props =>\r\n props.$isNavFixed || props.$isMobile ? \"0\" : \"-15.5rem\"};\r\n transition: margin-left 200ms ease, width 200ms ease;\r\n`\r\n\r\nconst Main = ({ children }) => {\r\n const { isMobile } = useContext(MobileContext)\r\n const { isNavFixed } = useContext(NavContext)\r\n\r\n return (\r\n \r\n \r\n )\r\n}\r\n\r\nexport default Main\r\n","import React, { useContext } from \"react\"\r\nimport styled, { keyframes } from \"styled-components\"\r\nimport { ToastContext } from \"../../contexts/ToastContext\"\r\n\r\nconst fadeInUp = keyframes`\r\n from {\r\n opacity: 0;\r\n transform: translateX(-50%) translateY(3rem);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateX(-50%) translateY(0);\r\n }\r\n`\r\n\r\nconst fadeOut = keyframes`\r\n from {\r\n opacity: 1;\r\n }\r\n to {\r\n opacity: 0;\r\n }\r\n`\r\n\r\nconst ToastWrapper = styled.div`\r\n position: fixed;\r\n bottom: 1.5rem;\r\n line-height: 1.5;\r\n left: 50%;\r\n font-size: 0.875rem;\r\n transform: translateX(-50%);\r\n background-color: ${props => props.theme.toastBackground};\r\n color: ${props => props.theme.toastText};\r\n padding: 0.75rem 1rem;\r\n border-radius: 0.5rem;\r\n z-index: 1000;\r\n box-shadow: ${props => props.theme.tocBarShadow};\r\n animation: ${fadeInUp} 0.27s ease, ${fadeOut} 0.27s ease 4s forwards;\r\n user-select: none;\r\n`\r\n\r\nconst ToastContainer = () => {\r\n const { toast } = useContext(ToastContext)\r\n\r\n return (\r\n <>{toast && {toast.message} }\r\n )\r\n}\r\n\r\nexport default ToastContainer\r\n","import React from \"react\"\r\nimport styled from \"styled-components\"\r\nimport GlobalStyles from \"../GlobalStyles\"\r\nimport NavBar from \"../NavBar\"\r\nimport ContextProvider from \"../../contexts\"\r\nimport Main from \"../Main\"\r\nimport ToastContainer from \"../ToastContainer\"\r\n\r\nconst LayoutWrapper = styled.div`\r\n width: 100vw;\r\n height: 100dvh;\r\n display: flex;\r\n flex-direction: row;\r\n overflow: hidden;\r\n overscroll-behavior: none;\r\n transition: margin-left 200ms ease, width 200ms ease;\r\n background: ${props => props.theme.layoutBackground};\r\n overflow: hidden;\r\n`\r\n\r\nconst Layout = ({ children }) => {\r\n return (\r\n \r\n \r\n {children} \r\n \r\n \r\n )\r\n}\r\n\r\nexport default Layout\r\n","import React from \"react\"\r\nimport Layout from \"./src/components/Layout\"\r\n\r\n// Pass all props (hence the ...props) to the layout component so it has access to things like pageContext or location\r\nconst wrapPageElement = ({ element, props }) => (\r\n {element} \r\n)\r\n\r\nexport default wrapPageElement\r\n","import CustomLayout from \"./wrapPageElement\"\r\nrequire(\"katex/dist/katex.min.css\")\r\n\r\nexport const wrapPageElement = CustomLayout\r\n","export const onRouteUpdate = ({\n location\n}, pluginOptions = {\n stripQueryString: false\n}) => {\n const domElem = document.querySelector(`link[rel='canonical']`);\n const existingValue = domElem.getAttribute(`href`);\n const baseProtocol = domElem.getAttribute(`data-baseProtocol`);\n const baseHost = domElem.getAttribute(`data-baseHost`);\n if (existingValue && baseProtocol && baseHost) {\n let value = `${baseProtocol}//${baseHost}${location.pathname}`;\n const {\n stripQueryString\n } = pluginOptions;\n if (!stripQueryString) {\n value += location.search;\n }\n value += location.hash;\n domElem.setAttribute(`href`, `${value}`);\n }\n};","import escapeStringRegexp from \"escape-string-regexp\";\nimport { withPrefix } from \"gatsby\";\nexport const userIsForcingNavigation = event => event.button !== 0 || event.altKey || event.ctrlKey || event.metaKey || event.shiftKey;\n\n// IE does not include leading slash in anchor.pathname\nexport const slashedPathname = pathname => pathname[0] === `/` ? pathname : `/${pathname}`;\nexport const navigationWasHandledElsewhere = event => event.defaultPrevented;\nexport const findClosestAnchor = node => {\n for (; node.parentNode; node = node.parentNode) {\n if (node.nodeName.toLowerCase() === `a`) {\n return node;\n }\n }\n return null;\n};\nexport const anchorsTargetIsEquivalentToSelf = anchor => /* If target attribute is not present it's treated as _self */\nanchor.hasAttribute(`target`) === false ||\n/**\n * The browser defaults to _self, but, not all browsers set\n * a.target to the string value `_self` by default\n */\n\n/**\n * Assumption: some browsers use null/undefined for default\n * attribute values\n */\nanchor.target == null ||\n/**\n * Some browsers use the empty string to mean _self, check\n * for actual `_self`\n */\n[`_self`, ``].includes(anchor.target) ||\n/**\n * As per https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-target\n */\nanchor.target === `_parent` && (!anchor.ownerDocument.defaultView.parent ||\n// Assumption: This can be falsey\nanchor.ownerDocument.defaultView.parent === anchor.ownerDocument.defaultView) || anchor.target === `_top` && (!anchor.ownerDocument.defaultView.top ||\n// Assumption: This can be falsey\nanchor.ownerDocument.defaultView.top === anchor.ownerDocument.defaultView);\nexport const authorIsForcingNavigation = anchor =>\n/**\n * HTML5 attribute that informs the browser to handle the\n * href as a downloadable file; let the browser handle it\n */\nanchor.hasAttribute(`download`) === true ||\n/**\n * Let the browser handle anything that doesn't look like a\n * target=\"_self\" anchor\n */\nanchorsTargetIsEquivalentToSelf(anchor) === false;\n\n// https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy\nexport const urlsAreOnSameOrigin = (origin, destination) => origin.protocol === destination.protocol && /* a.host includes both hostname and port in the expected format host:port */\norigin.host === destination.host;\nexport const pathIsNotHandledByApp = (destination, pathStartRegEx) => {\n const pathFileExtensionRegEx = /^.*\\.((?!htm)[a-z0-9]{1,5})$/i;\n return (\n /**\n * For when pathPrefix is used in an app and there happens to be a link\n * pointing to the same domain but outside of the app's pathPrefix. For\n * example, a Gatsby app lives at https://example.com/myapp/, with the\n * pathPrefix set to `/myapp`. When adding an absolute link to the same\n * domain but outside of the /myapp path, for example, `` the plugin won't catch it and\n * will navigate to an external link instead of doing a pushState resulting\n * in `https://example.com/myapp/https://example.com/not-my-app`\n */\n pathStartRegEx.test(slashedPathname(destination.pathname)) === false ||\n /**\n * Don't catch links pointed at what look like file extensions (other than\n * .htm/html extensions).\n */\n destination.pathname.search(pathFileExtensionRegEx) !== -1\n );\n};\nexport const hashShouldBeFollowed = (origin, destination) => destination.hash !== `` && (\n/**\n * Dynamically created anchor links (href=\"#my-anchor\") do not always\n * have pathname on IE\n */\ndestination.pathname === `` || /* Don't catch links pointed to the same page but with a hash. */\ndestination.pathname === origin.pathname);\nexport const routeThroughBrowserOrApp = (hrefHandler, pluginOptions) => event => {\n if (window.___failedResources) return true;\n if (userIsForcingNavigation(event)) return true;\n if (navigationWasHandledElsewhere(event)) return true;\n const clickedAnchor = findClosestAnchor(event.target);\n if (clickedAnchor == null) return true;\n if (authorIsForcingNavigation(clickedAnchor)) return true;\n\n // IE clears the host value if the anchor href changed after creation, e.g.\n // in React. Creating a new anchor element to ensure host value is present\n const destination = document.createElement(`a`);\n\n // https://html.spec.whatwg.org/multipage/links.html#concept-hyperlink-url-set\n // If clickedAnchor has no href attribute like `example`, the href getter returns empty string.\n if (clickedAnchor.href !== ``) {\n destination.href = clickedAnchor.href;\n }\n if (`SVGAnimatedString` in window && clickedAnchor.href instanceof SVGAnimatedString) {\n destination.href = clickedAnchor.href.animVal;\n }\n\n // In IE, the default port is included in the anchor host but excluded from\n // the location host. This affects the ability to directly compare\n // location host to anchor host. For example: http://example.com would\n // have a location.host of 'example.com' and an destination.host of\n // 'example.com:80' Creating anchor from the location.href to normalize the\n // host value.\n const origin = document.createElement(`a`);\n origin.href = window.location.href;\n if (urlsAreOnSameOrigin(origin, destination) === false) return true;\n\n // Regex to test pathname against pathPrefix\n const pathStartRegEx = new RegExp(`^${escapeStringRegexp(withPrefix(`/`))}`);\n if (pathIsNotHandledByApp(destination, pathStartRegEx)) return true;\n if (hashShouldBeFollowed(origin, destination)) return true;\n if (pluginOptions.excludePattern) {\n const excludeRegex = new RegExp(pluginOptions.excludePattern);\n if (excludeRegex.test(destination.pathname)) {\n return true;\n }\n }\n event.preventDefault();\n\n // See issue #8907: destination.pathname already includes pathPrefix added\n // by gatsby-transformer-remark but gatsby-link.navigate needs href without\n const destinationPathname = slashedPathname(destination.pathname).replace(pathStartRegEx, `/`);\n hrefHandler(`${destinationPathname}${destination.search}${destination.hash}`);\n return false;\n};\nexport default function (root, pluginOptions, cb) {\n const clickHandler = routeThroughBrowserOrApp(cb, pluginOptions);\n root.addEventListener(`click`, clickHandler);\n return () => root.removeEventListener(`click`, clickHandler);\n}","import { navigate } from \"gatsby\";\nimport catchLinks from \"./catch-links\";\nexport const onClientEntry = (_, pluginOptions = {}) => {\n catchLinks(window, pluginOptions, href => {\n navigate(href);\n });\n};","'use strict';\n\nvar matchOperatorsRe = /[|\\\\{}()[\\]^$+*?.]/g;\n\nmodule.exports = function (str) {\n\tif (typeof str !== 'string') {\n\t\tthrow new TypeError('Expected a string');\n\t}\n\n\treturn str.replace(matchOperatorsRe, '\\\\$&');\n};\n","\"use strict\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nvar _react = _interopRequireDefault(require(\"react\"));\nvar _styledComponents = require(\"styled-components\");\n// eslint-disable-next-line react/prop-types,react/display-name\nexports.wrapRootElement = function (_ref, pluginOptions) {\n var element = _ref.element;\n return /*#__PURE__*/_react.default.createElement(_styledComponents.StyleSheetManager, {\n disableVendorPrefixes: (pluginOptions === null || pluginOptions === void 0 ? void 0 : pluginOptions.disableVendorPrefixes) === true\n }, element);\n};","\"use strict\";\n\nvar offsetY = 0;\nvar getTargetOffset = function getTargetOffset(hash) {\n var id = window.decodeURI(hash.replace(\"#\", \"\"));\n if (id !== \"\") {\n var element = document.getElementById(id);\n if (element) {\n var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;\n var clientTop = document.documentElement.clientTop || document.body.clientTop || 0;\n var computedStyles = window.getComputedStyle(element);\n var scrollMarginTop = computedStyles.getPropertyValue(\"scroll-margin-top\") || computedStyles.getPropertyValue(\"scroll-snap-margin-top\") || \"0px\";\n return element.getBoundingClientRect().top + scrollTop - parseInt(scrollMarginTop, 10) - clientTop - offsetY;\n }\n }\n return null;\n};\nexports.onInitialClientRender = function (_, pluginOptions) {\n if (pluginOptions.offsetY) {\n offsetY = pluginOptions.offsetY;\n }\n requestAnimationFrame(function () {\n var offset = getTargetOffset(window.location.hash);\n if (offset !== null) {\n window.scrollTo(0, offset);\n }\n });\n};\nexports.shouldUpdateScroll = function (_ref) {\n var location = _ref.routerProps.location;\n var offset = getTargetOffset(location.hash);\n return offset !== null ? [0, offset] : true;\n};","\"use strict\";\n\nexports.DEFAULT_OPTIONS = {\n maxWidth: 650,\n wrapperStyle: \"\",\n backgroundColor: \"white\",\n linkImagesToOriginal: true,\n showCaptions: false,\n markdownCaptions: false,\n withWebp: false,\n withAvif: false,\n tracedSVG: false,\n loading: \"lazy\",\n disableBgImageOnAlpha: false,\n disableBgImage: false\n};\nexports.EMPTY_ALT = \"GATSBY_EMPTY_ALT\";\nexports.imageClass = \"gatsby-resp-image-image\";\nexports.imageWrapperClass = \"gatsby-resp-image-wrapper\";\nexports.imageBackgroundClass = \"gatsby-resp-image-background-image\";","\"use strict\";\n\nvar _require = require(\"./constants\"),\n DEFAULT_OPTIONS = _require.DEFAULT_OPTIONS,\n imageClass = _require.imageClass,\n imageBackgroundClass = _require.imageBackgroundClass,\n imageWrapperClass = _require.imageWrapperClass;\nexports.onRouteUpdate = function (apiCallbackContext, pluginOptions) {\n var options = Object.assign({}, DEFAULT_OPTIONS, pluginOptions);\n var imageWrappers = document.querySelectorAll(\".\" + imageWrapperClass);\n\n // https://css-tricks.com/snippets/javascript/loop-queryselectorall-matches/\n // for cross-browser looping through NodeList without polyfills\n var _loop = function _loop() {\n var imageWrapper = imageWrappers[i];\n var backgroundElement = imageWrapper.querySelector(\".\" + imageBackgroundClass);\n var imageElement = imageWrapper.querySelector(\".\" + imageClass);\n var onImageComplete = function onImageComplete() {\n backgroundElement.style.opacity = 0;\n imageElement.style.opacity = 1;\n imageElement.removeEventListener(\"load\", onImageComplete);\n imageElement.removeEventListener(\"error\", onImageComplete);\n };\n imageElement.addEventListener(\"load\", onImageComplete);\n imageElement.addEventListener(\"error\", onImageComplete);\n if (imageElement.complete) {\n onImageComplete();\n }\n };\n for (var i = 0; i < imageWrappers.length; i++) {\n _loop();\n }\n};","\"use strict\";\n\nexports.DEFAULT_OPTIONS = {\n maxWidth: 650,\n wrapperStyle: \"\",\n backgroundColor: \"white\",\n linkImagesToOriginal: true,\n showCaptions: false,\n markdownCaptions: false,\n withWebp: false,\n withAvif: false,\n tracedSVG: false,\n loading: \"lazy\",\n decoding: \"async\",\n disableBgImageOnAlpha: false,\n disableBgImage: false\n};\nexports.EMPTY_ALT = \"GATSBY_EMPTY_ALT\";\nexports.imageClass = \"gatsby-resp-image-image\";\nexports.imageWrapperClass = \"gatsby-resp-image-wrapper\";\nexports.imageBackgroundClass = \"gatsby-resp-image-background-image\";","\"use strict\";\n\nvar _require = require(\"./constants\"),\n DEFAULT_OPTIONS = _require.DEFAULT_OPTIONS,\n imageClass = _require.imageClass,\n imageBackgroundClass = _require.imageBackgroundClass,\n imageWrapperClass = _require.imageWrapperClass;\nexports.onRouteUpdate = function (apiCallbackContext, pluginOptions) {\n var options = Object.assign({}, DEFAULT_OPTIONS, pluginOptions);\n var imageWrappers = document.querySelectorAll(\".\" + imageWrapperClass);\n\n // https://css-tricks.com/snippets/javascript/loop-queryselectorall-matches/\n // for cross-browser looping through NodeList without polyfills\n var _loop = function _loop() {\n var imageWrapper = imageWrappers[i];\n var backgroundElement = imageWrapper.querySelector(\".\" + imageBackgroundClass);\n var imageElement = imageWrapper.querySelector(\".\" + imageClass);\n var onImageLoad = function onImageLoad() {\n backgroundElement.style.transition = \"opacity 0.5s 0.5s\";\n imageElement.style.transition = \"opacity 0.5s\";\n onImageComplete();\n };\n var onImageComplete = function onImageComplete() {\n backgroundElement.style.opacity = 0;\n imageElement.style.opacity = 1;\n imageElement.style.color = \"inherit\";\n imageElement.style.boxShadow = \"inset 0px 0px 0px 400px \" + options.backgroundColor;\n imageElement.removeEventListener(\"load\", onImageLoad);\n imageElement.removeEventListener(\"error\", onImageComplete);\n };\n imageElement.style.opacity = 0;\n imageElement.addEventListener(\"load\", onImageLoad);\n imageElement.addEventListener(\"error\", onImageComplete);\n if (imageElement.complete) {\n onImageComplete();\n }\n };\n for (var i = 0; i < imageWrappers.length; i++) {\n _loop();\n }\n};","import React from \"react\"\r\nimport * as Icons from \"react-icons/tb\"\r\n\r\nconst Icon = ({ iconName, width, height, ...props }) => {\r\n const Icon = Icons[iconName] || Icons[\"TbFileText\"]\r\n\r\n return \r\n {children}\r\n \r\n )\r\n}\r\n\r\nexport { MobileProvider, MobileContext }\r\n","import React, { createContext, useState, useEffect, useContext } from \"react\"\r\nimport { MobileContext } from \"../MobileContext\"\r\n\r\nexport const NavContext = createContext()\r\n\r\nexport const NavProvider = ({ children }) => {\r\n const { isMobile } = useContext(MobileContext)\r\n const [isNavVisible, setIsNavVisible] = useState(false)\r\n const [isNavFixed, setIsNavFixed] = useState(null)\r\n\r\n useEffect(() => {\r\n if (typeof window !== \"undefined\" && !isMobile) {\r\n const LocalIsNavFixed = window.localStorage.getItem(\"isNavFixed\")\r\n if (LocalIsNavFixed !== null) {\r\n setIsNavFixed(JSON.parse(LocalIsNavFixed))\r\n }\r\n }\r\n }, [isMobile])\r\n\r\n useEffect(() => {\r\n if (typeof window !== \"undefined\" && !isMobile && isNavFixed !== null) {\r\n window.localStorage.setItem(\"isNavFixed\", isNavFixed)\r\n }\r\n }, [isNavFixed, isMobile])\r\n\r\n useEffect(() => {\r\n if (isMobile !== null && !isMobile && typeof window !== \"undefined\") {\r\n const handleMouseMove = event => {\r\n const threshold =\r\n isNavVisible || isNavFixed\r\n ? 248\r\n : Math.max(window.innerWidth * 0.03, 24)\r\n if (event.clientX < threshold) {\r\n setIsNavVisible(true)\r\n } else {\r\n setIsNavVisible(false)\r\n }\r\n }\r\n\r\n window.addEventListener(\"mousemove\", handleMouseMove)\r\n return () => {\r\n window.removeEventListener(\"mousemove\", handleMouseMove)\r\n }\r\n }\r\n }, [isNavVisible, isNavFixed, isMobile])\r\n\r\n return (\r\n \r\n {children}\r\n \r\n )\r\n}\r\n","// themes.js\r\n\r\nexport const lightTheme = {\r\n background: \"rgb(256, 256, 256)\",\r\n layoutBackground: \"rgb(247, 247, 245)\",\r\n tag: \"rgb(227, 226, 224)\",\r\n red: \"rgb(235, 87, 87)\",\r\n blue: \"rgb(35, 131, 226)\",\r\n placeholderColor: \"rgb(179, 179, 176)\",\r\n divider: \"0.0625rem solid #37352f17\",\r\n dimmer: \"rgba(15, 15, 15, 0.6)\",\r\n\r\n // card\r\n cardBackground: \"rgb(256, 256, 256)\",\r\n cardHover: \"rgba(55, 53, 47, 0.04)\",\r\n cardActive: \"rgba(55, 53, 47, 0.04)\",\r\n cardShadow:\r\n \"rgba(15,15,15,0.1) 0 0 0 0.0625rem, rgba(15,15,15,0.1) 0 0.125rem 0.25rem\",\r\n\r\n // icon\r\n weekIcon: \"rgb(145, 145, 142)\",\r\n icon: \"#55534e\",\r\n\r\n // text\r\n weekText: \"rgba(55, 53, 47, 0.65)\",\r\n text: \"rgb(55, 53, 47)\",\r\n\r\n // button\r\n buttonHover: \"rgba(55, 53, 47, 0.06)\",\r\n buttonActive: \"rgba(55, 53, 47, 0.16)\",\r\n\r\n // tab\r\n tabBar: \"rgb(233, 233, 231) 0 -0.0625rem 0 inset\",\r\n tabBarSelected: \"0.125rem solid rgb(55, 53, 47)\",\r\n\r\n // callout\r\n calloutBorder: \"0.0625rem solid rgba(55, 53, 47, 0.16)\",\r\n\r\n // navigation\r\n navBackground: \"rgb(256, 256, 256)\",\r\n navButtonText: \"rgb(95, 94, 91)\",\r\n navButtonHover: \"rgba(0, 0, 0, 0.03)\",\r\n navTagIcon: \"rgb(168, 167, 163)\",\r\n navTagDivider: \"rgba(55, 53, 47, 0.09) 0 0.0625rem 0\",\r\n navBoxShadow:\r\n \"rgba(0, 0, 0, 0.024) -0.0625rem 0rem 0rem 0rem inset, rgba(15, 15, 15, 0.05) 0 0 0 0.0625rem, rgba(15, 15, 15, 0.1) 0 0.188rem 0.375rem, rgba(15, 15, 15, 0.2) 0 0.375rem 1.5rem\",\r\n navFixedBoxShadow: \"rgba(0, 0, 0, 0.024) -0.0625rem 0rem 0rem 0rem inset\",\r\n\r\n // scrollBar\r\n scrollBarColor: \"#D3D1C8 rgba(0, 0, 0, 0)\",\r\n scrollBarThumb: \"#D3D1C8\",\r\n\r\n // searchDialog\r\n searchBackground: \"rgb(255, 255, 255)\",\r\n searchIcon: \"rgb(172, 171, 169)\",\r\n searchIconHover: \"rgba(55, 53, 47, 0.06)\",\r\n searchDivider: \"rgba(55, 53, 47, 0.09) 0 0.0625rem 0\",\r\n searchText: \"rgba(55, 53, 47, 0.5)\",\r\n\r\n // toc\r\n tocLinkText: \"rgb(120, 119, 116)\",\r\n tocLinkBottom:\r\n \"linear-gradient(to right, rgba(55, 53, 47, 0.16) 0%, rgba(55, 53, 47, 0.16) 100%)\",\r\n\r\n // toc bar\r\n tocBarShadow:\r\n \"rgba(15, 15, 15, 0.04) 0 0 0 0.0625rem, rgba(15, 15, 15, 0.03) 0 0.188rem 0.375rem, rgba(15, 15, 15, 0.06) 0 0.563rem 1.5rem\",\r\n tocBarBorder: \"0.0625rem solid rgba(55, 53, 47, 0.06)\",\r\n tocTextWeek: \"rgb(120, 119, 116)\",\r\n tocMinBarBackground: \"rgb(227, 226, 224)\",\r\n tocMinShadow: \"none\",\r\n\r\n // markdown\r\n mdAnchorBorder: \"0.05rem solid rgba(55, 53, 47, 0.4)\",\r\n mdInlineCodeBackground: \"rgba(135, 131, 120, 0.15)\",\r\n mdHrBorder: \"0.0625rem solid rgba(55, 53, 47, 0.16)\",\r\n mdCheckboxTextline: \"rgba(55, 53, 47, 0.25)\",\r\n mdTableBorder: \"rgb(233, 233, 231)\",\r\n mdTableThBackground: \"rgb(247, 246, 243)\",\r\n\r\n // toast\r\n toastBackground: \"rgb(15, 15, 15)\",\r\n toastText: \"rgb(255, 255, 255)\",\r\n}\r\n\r\nexport const darkTheme = {\r\n background: \"rgb(25, 25, 25)\",\r\n layoutBackground: \"rgb(32, 32, 32)\",\r\n tag: \"rgb(90, 90, 90)\",\r\n red: \"rgb(235, 87, 87)\",\r\n blue: \"rgb(35, 131, 226)\",\r\n placeholderColor: \"rgb(100, 100, 100)\",\r\n divider: \"0.0625rem solid hsla(0,0%, 100%, 0.094)\",\r\n dimmer: \"rgba(15, 15, 15, 0.8)\",\r\n\r\n // card\r\n cardBackground: \"rgba(255, 255, 255, 0.055)\",\r\n cardHover: \"rgb(47, 47, 47)\",\r\n cardActive: \"rgb(37, 37, 37)\",\r\n cardShadow:\r\n \"rgba(15, 15, 15, 0.1) 0 0 0 0.0625rem, rgba(15, 15, 15, 0.1) 0 0.125rem 0.25rem\",\r\n\r\n // icon\r\n weekIcon: \"rgb(155, 155, 155)\",\r\n icon: \"rgb(211, 211, 211)\",\r\n\r\n // text\r\n weekText: \"rgba(255, 255, 255, 0.443)\",\r\n text: \"rgb(212, 212, 212)\",\r\n\r\n // button\r\n buttonHover: \"rgba(255, 255, 255, 0.055)\",\r\n buttonActive: \"rgba(255, 255, 255, 0.03)\",\r\n\r\n // tab\r\n tabBar: \"rgb(47, 47, 47) 0 -0.0625rem 0 inset\",\r\n tabBarSelected: \"0.125rem solid rgba(255, 255, 255, 0.81)\",\r\n\r\n // callout\r\n calloutBorder: \"0.0625rem solid rgba(255, 255, 255, 0.13)\",\r\n\r\n // navigation\r\n navBackground: \"rgb(37, 37, 37)\",\r\n navButtonText: \"rgb(155, 155, 155)\",\r\n navButtonHover: \"rgba(255, 255, 255, 0.055)\",\r\n navTagIcon: \"rgb(112, 112, 112)\",\r\n navTagDivider: \"rgba(255, 255, 255, 0.094) 0 0.0625rem 0\",\r\n navBoxShadow:\r\n \"rgba(255, 255, 255, 0.05) -0.0625rem 0rem 0rem 0rem inset, rgba(15, 15, 15, 0.1) 0 0 0 0.0625rem, rgba(15, 15, 15, 0.2) 0 0.188rem 0.375rem, rgba(15, 15, 15, 0.4) 0 0.375rem 1.5rem\",\r\n navFixedBoxShadow:\r\n \"rgba(255, 255, 255, 0.05) -0.0625rem 0rem 0rem 0rem inset\",\r\n\r\n // scrollBar\r\n scrollBarColor: \"rgba(255, 255, 255, 0.2) rgba(0, 0, 0, 0)\",\r\n scrollBarThumb: \"rgba(255, 255, 255, 0.2)\",\r\n\r\n // searchDialog\r\n searchBackground: \"rgb(32, 32, 32)\",\r\n searchIcon: \"rgba(255, 255, 255, 0.282)\",\r\n searchIconHover: \"rgba(255, 255, 255, 0.055)\",\r\n searchDivider: \"rgba(255, 255, 255, 0.094) 0 0.0625rem 0\",\r\n searchText: \"rgba(255, 255, 255, 0.282)\",\r\n\r\n // toc\r\n tocLinkText: \"rgb(155, 155, 155)\",\r\n tocLinkBottom:\r\n \"linear-gradient(to right, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.13) 100%)\",\r\n\r\n // toc bar\r\n tocBarShadow:\r\n \"rgba(15, 15, 15, 0.05) 0 0 0 0.0625rem, rgba(15, 15, 15, 0.1) 0 0.188rem 0.375rem, rgba(15, 15, 15, 0.2) 0 0.563rem 1.5rem\",\r\n tocBarBorder: \"0.0625rem solid rgba(255, 255, 255, 0.055)\",\r\n tocTextWeek: \"rgb(127, 127, 127)\",\r\n tocMinBarBackground: \"rgb(90, 90, 90)\",\r\n tocMinShadow: \"rgb(211, 211, 211) 0rem 0rem 0.188rem\",\r\n\r\n // markdown\r\n mdAnchorBorder: \"0.05rem solid rgba(255, 255, 255, 0.283)\",\r\n mdInlineCodeBackground: \"rgba(135, 131, 120, 0.15)\",\r\n mdHrBorder: \"0.0625rem solid rgba(255, 255, 255, 0.13)\",\r\n mdCheckboxTextline: \"rgb(127, 127, 127)\",\r\n mdTableBorder: \"rgb(47, 47, 47)\",\r\n mdTableThBackground: \"rgba(255, 255, 255, 0.03)\",\r\n\r\n // toast\r\n toastBackground: \"rgb(47, 47, 47)\",\r\n toastText: \"rgb(255, 255, 255)\",\r\n}\r\n","import { lightTheme, darkTheme } from \"../../themes/colors\"\r\nimport React, { createContext, useState, useEffect } from \"react\"\r\nimport { ThemeProvider as StyledProvider } from \"styled-components\"\r\n\r\nconst ThemeContext = createContext({})\r\n\r\nconst ThemeProvider = ({ children }) => {\r\n const [ThemeMode, setThemeMode] = useState(\"light\")\r\n\r\n useEffect(() => {\r\n const LocalTheme = window.localStorage.getItem(\"theme\") || \"light\"\r\n setThemeMode(LocalTheme)\r\n }, [])\r\n\r\n const themeObject = ThemeMode === \"light\" ? lightTheme : darkTheme\r\n\r\n const toggleTheme = () => {\r\n let toggleMode = ThemeMode === \"light\" ? \"dark\" : \"light\"\r\n setThemeMode(toggleMode)\r\n window.localStorage.setItem(\"theme\", toggleMode)\r\n }\r\n\r\n return (\r\n \r\n {children} \r\n \r\n )\r\n}\r\n\r\nexport { ThemeProvider, ThemeContext }\r\n","/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n'use strict';\n\n/**\n * Use invariant() to assert state which your program assumes to be true.\n *\n * Provide sprintf-style format (only %s is supported) and arguments\n * to provide information about what broke and what you were\n * expecting.\n *\n * The invariant message will be stripped in production, but the invariant\n * will remain to ensure logic does not differ in production.\n */\n\nvar invariant = function(condition, format, a, b, c, d, e, f) {\n if (process.env.NODE_ENV !== 'production') {\n if (format === undefined) {\n throw new Error('invariant requires an error message argument');\n }\n }\n\n if (!condition) {\n var error;\n if (format === undefined) {\n error = new Error(\n 'Minified exception occurred; use the non-minified dev environment ' +\n 'for the full error message and additional helpful warnings.'\n );\n } else {\n var args = [a, b, c, d, e, f];\n var argIndex = 0;\n error = new Error(\n format.replace(/%s/g, function() { return args[argIndex++]; })\n );\n error.name = 'Invariant Violation';\n }\n\n error.framesToPop = 1; // we don't care about invariant's own frame\n throw error;\n }\n};\n\nmodule.exports = invariant;\n","/**\n * @license React\n * react-server-dom-webpack.production.min.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n'use strict';var k=require(\"react\"),l={stream:!0},n=new Map,p=Symbol.for(\"react.element\"),q=Symbol.for(\"react.lazy\"),r=Symbol.for(\"react.default_value\"),t=k.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ContextRegistry;function u(a){t[a]||(t[a]=k.createServerContext(a,r));return t[a]}function v(a,b,c){this._status=a;this._value=b;this._response=c}v.prototype.then=function(a){0===this._status?(null===this._value&&(this._value=[]),this._value.push(a)):a()};\nfunction w(a){switch(a._status){case 3:return a._value;case 1:var b=JSON.parse(a._value,a._response._fromJSON);a._status=3;return a._value=b;case 2:b=a._value;for(var c=b.chunks,d=0;d= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n}\n\nexport function __param(paramIndex, decorator) {\n return function (target, key) { decorator(target, key, paramIndex); }\n}\n\nexport function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {\n function accept(f) { if (f !== void 0 && typeof f !== \"function\") throw new TypeError(\"Function expected\"); return f; }\n var kind = contextIn.kind, key = kind === \"getter\" ? \"get\" : kind === \"setter\" ? \"set\" : \"value\";\n var target = !descriptorIn && ctor ? contextIn[\"static\"] ? ctor : ctor.prototype : null;\n var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});\n var _, done = false;\n for (var i = decorators.length - 1; i >= 0; i--) {\n var context = {};\n for (var p in contextIn) context[p] = p === \"access\" ? {} : contextIn[p];\n for (var p in contextIn.access) context.access[p] = contextIn.access[p];\n context.addInitializer = function (f) { if (done) throw new TypeError(\"Cannot add initializers after decoration has completed\"); extraInitializers.push(accept(f || null)); };\n var result = (0, decorators[i])(kind === \"accessor\" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);\n if (kind === \"accessor\") {\n if (result === void 0) continue;\n if (result === null || typeof result !== \"object\") throw new TypeError(\"Object expected\");\n if (_ = accept(result.get)) descriptor.get = _;\n if (_ = accept(result.set)) descriptor.set = _;\n if (_ = accept(result.init)) initializers.unshift(_);\n }\n else if (_ = accept(result)) {\n if (kind === \"field\") initializers.unshift(_);\n else descriptor[key] = _;\n }\n }\n if (target) Object.defineProperty(target, contextIn.name, descriptor);\n done = true;\n};\n\nexport function __runInitializers(thisArg, initializers, value) {\n var useValue = arguments.length > 2;\n for (var i = 0; i < initializers.length; i++) {\n value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);\n }\n return useValue ? value : void 0;\n};\n\nexport function __propKey(x) {\n return typeof x === \"symbol\" ? x : \"\".concat(x);\n};\n\nexport function __setFunctionName(f, name, prefix) {\n if (typeof name === \"symbol\") name = name.description ? \"[\".concat(name.description, \"]\") : \"\";\n return Object.defineProperty(f, \"name\", { configurable: true, value: prefix ? \"\".concat(prefix, \" \", name) : name });\n};\n\nexport function __metadata(metadataKey, metadataValue) {\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\n}\n\nexport function __awaiter(thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n}\n\nexport function __generator(thisArg, body) {\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\n function verb(n) { return function (v) { return step([n, v]); }; }\n function step(op) {\n if (f) throw new TypeError(\"Generator is already executing.\");\n while (g && (g = 0, op[0] && (_ = 0)), _) try {\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\n if (y = 0, t) op = [op[0] & 2, t.value];\n switch (op[0]) {\n case 0: case 1: t = op; break;\n case 4: _.label++; return { value: op[1], done: false };\n case 5: _.label++; y = op[1]; op = [0]; continue;\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\n default:\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\n if (t[2]) _.ops.pop();\n _.trys.pop(); continue;\n }\n op = body.call(thisArg, _);\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\n }\n}\n\nexport var __createBinding = Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n});\n\nexport function __exportStar(m, o) {\n for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);\n}\n\nexport function __values(o) {\n var s = typeof Symbol === \"function\" && Symbol.iterator, m = s && o[s], i = 0;\n if (m) return m.call(o);\n if (o && typeof o.length === \"number\") return {\n next: function () {\n if (o && i >= o.length) o = void 0;\n return { value: o && o[i++], done: !o };\n }\n };\n throw new TypeError(s ? \"Object is not iterable.\" : \"Symbol.iterator is not defined.\");\n}\n\nexport function __read(o, n) {\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\n if (!m) return o;\n var i = m.call(o), r, ar = [], e;\n try {\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\n }\n catch (error) { e = { error: error }; }\n finally {\n try {\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\n }\n finally { if (e) throw e.error; }\n }\n return ar;\n}\n\n/** @deprecated */\nexport function __spread() {\n for (var ar = [], i = 0; i < arguments.length; i++)\n ar = ar.concat(__read(arguments[i]));\n return ar;\n}\n\n/** @deprecated */\nexport function __spreadArrays() {\n for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;\n for (var r = Array(s), k = 0, i = 0; i < il; i++)\n for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)\n r[k] = a[j];\n return r;\n}\n\nexport function __spreadArray(to, from, pack) {\n if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\n if (ar || !(i in from)) {\n if (!ar) ar = Array.prototype.slice.call(from, 0, i);\n ar[i] = from[i];\n }\n }\n return to.concat(ar || Array.prototype.slice.call(from));\n}\n\nexport function __await(v) {\n return this instanceof __await ? (this.v = v, this) : new __await(v);\n}\n\nexport function __asyncGenerator(thisArg, _arguments, generator) {\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\n function fulfill(value) { resume(\"next\", value); }\n function reject(value) { resume(\"throw\", value); }\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\n}\n\nexport function __asyncDelegator(o) {\n var i, p;\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; }\n}\n\nexport function __asyncValues(o) {\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\n var m = o[Symbol.asyncIterator], i;\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\n}\n\nexport function __makeTemplateObject(cooked, raw) {\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\n return cooked;\n};\n\nvar __setModuleDefault = Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n};\n\nexport function __importStar(mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n}\n\nexport function __importDefault(mod) {\n return (mod && mod.__esModule) ? mod : { default: mod };\n}\n\nexport function __classPrivateFieldGet(receiver, state, kind, f) {\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a getter\");\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot read private member from an object whose class did not declare it\");\n return kind === \"m\" ? f : kind === \"a\" ? f.call(receiver) : f ? f.value : state.get(receiver);\n}\n\nexport function __classPrivateFieldSet(receiver, state, value, kind, f) {\n if (kind === \"m\") throw new TypeError(\"Private method is not writable\");\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a setter\");\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot write private member to an object whose class did not declare it\");\n return (kind === \"a\" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;\n}\n\nexport function __classPrivateFieldIn(state, receiver) {\n if (receiver === null || (typeof receiver !== \"object\" && typeof receiver !== \"function\")) throw new TypeError(\"Cannot use 'in' operator on non-object\");\n return typeof state === \"function\" ? receiver === state : state.has(receiver);\n}\n\nexport function __addDisposableResource(env, value, async) {\n if (value !== null && value !== void 0) {\n if (typeof value !== \"object\" && typeof value !== \"function\") throw new TypeError(\"Object expected.\");\n var dispose;\n if (async) {\n if (!Symbol.asyncDispose) throw new TypeError(\"Symbol.asyncDispose is not defined.\");\n dispose = value[Symbol.asyncDispose];\n }\n if (dispose === void 0) {\n if (!Symbol.dispose) throw new TypeError(\"Symbol.dispose is not defined.\");\n dispose = value[Symbol.dispose];\n }\n if (typeof dispose !== \"function\") throw new TypeError(\"Object not disposable.\");\n env.stack.push({ value: value, dispose: dispose, async: async });\n }\n else if (async) {\n env.stack.push({ async: true });\n }\n return value;\n}\n\nvar _SuppressedError = typeof SuppressedError === \"function\" ? SuppressedError : function (error, suppressed, message) {\n var e = new Error(message);\n return e.name = \"SuppressedError\", e.error = error, e.suppressed = suppressed, e;\n};\n\nexport function __disposeResources(env) {\n function fail(e) {\n env.error = env.hasError ? new _SuppressedError(e, env.error, \"An error was suppressed during disposal.\") : e;\n env.hasError = true;\n }\n function next() {\n while (env.stack.length) {\n var rec = env.stack.pop();\n try {\n var result = rec.dispose && rec.dispose.call(rec.value);\n if (rec.async) return Promise.resolve(result).then(next, function(e) { fail(e); return next(); });\n }\n catch (e) {\n fail(e);\n }\n }\n if (env.hasError) throw env.error;\n }\n return next();\n}\n\nexport default {\n __extends,\n __assign,\n __rest,\n __decorate,\n __param,\n __metadata,\n __awaiter,\n __generator,\n __createBinding,\n __exportStar,\n __values,\n __read,\n __spread,\n __spreadArrays,\n __spreadArray,\n __await,\n __asyncGenerator,\n __asyncDelegator,\n __asyncValues,\n __makeTemplateObject,\n __importStar,\n __importDefault,\n __classPrivateFieldGet,\n __classPrivateFieldSet,\n __classPrivateFieldIn,\n __addDisposableResource,\n __disposeResources,\n};\n","export var MS = '-ms-'\nexport var MOZ = '-moz-'\nexport var WEBKIT = '-webkit-'\n\nexport var COMMENT = 'comm'\nexport var RULESET = 'rule'\nexport var DECLARATION = 'decl'\n\nexport var PAGE = '@page'\nexport var MEDIA = '@media'\nexport var IMPORT = '@import'\nexport var CHARSET = '@charset'\nexport var VIEWPORT = '@viewport'\nexport var SUPPORTS = '@supports'\nexport var DOCUMENT = '@document'\nexport var NAMESPACE = '@namespace'\nexport var KEYFRAMES = '@keyframes'\nexport var FONT_FACE = '@font-face'\nexport var COUNTER_STYLE = '@counter-style'\nexport var FONT_FEATURE_VALUES = '@font-feature-values'\nexport var LAYER = '@layer'\nexport var SCOPE = '@scope'\n","/**\n * @param {number}\n * @return {number}\n */\nexport var abs = Math.abs\n\n/**\n * @param {number}\n * @return {string}\n */\nexport var from = String.fromCharCode\n\n/**\n * @param {object}\n * @return {object}\n */\nexport var assign = Object.assign\n\n/**\n * @param {string} value\n * @param {number} length\n * @return {number}\n */\nexport function hash (value, length) {\n\treturn charat(value, 0) ^ 45 ? (((((((length << 2) ^ charat(value, 0)) << 2) ^ charat(value, 1)) << 2) ^ charat(value, 2)) << 2) ^ charat(value, 3) : 0\n}\n\n/**\n * @param {string} value\n * @return {string}\n */\nexport function trim (value) {\n\treturn value.trim()\n}\n\n/**\n * @param {string} value\n * @param {RegExp} pattern\n * @return {string?}\n */\nexport function match (value, pattern) {\n\treturn (value = pattern.exec(value)) ? value[0] : value\n}\n\n/**\n * @param {string} value\n * @param {(string|RegExp)} pattern\n * @param {string} replacement\n * @return {string}\n */\nexport function replace (value, pattern, replacement) {\n\treturn value.replace(pattern, replacement)\n}\n\n/**\n * @param {string} value\n * @param {string} search\n * @param {number} position\n * @return {number}\n */\nexport function indexof (value, search, position) {\n\treturn value.indexOf(search, position)\n}\n\n/**\n * @param {string} value\n * @param {number} index\n * @return {number}\n */\nexport function charat (value, index) {\n\treturn value.charCodeAt(index) | 0\n}\n\n/**\n * @param {string} value\n * @param {number} begin\n * @param {number} end\n * @return {string}\n */\nexport function substr (value, begin, end) {\n\treturn value.slice(begin, end)\n}\n\n/**\n * @param {string} value\n * @return {number}\n */\nexport function strlen (value) {\n\treturn value.length\n}\n\n/**\n * @param {any[]} value\n * @return {number}\n */\nexport function sizeof (value) {\n\treturn value.length\n}\n\n/**\n * @param {any} value\n * @param {any[]} array\n * @return {any}\n */\nexport function append (value, array) {\n\treturn array.push(value), value\n}\n\n/**\n * @param {string[]} array\n * @param {function} callback\n * @return {string}\n */\nexport function combine (array, callback) {\n\treturn array.map(callback).join('')\n}\n\n/**\n * @param {string[]} array\n * @param {RegExp} pattern\n * @return {string[]}\n */\nexport function filter (array, pattern) {\n\treturn array.filter(function (value) { return !match(value, pattern) })\n}\n","import {from, trim, charat, strlen, substr, append, assign} from './Utility.js'\n\nexport var line = 1\nexport var column = 1\nexport var length = 0\nexport var position = 0\nexport var character = 0\nexport var characters = ''\n\n/**\n * @param {string} value\n * @param {object | null} root\n * @param {object | null} parent\n * @param {string} type\n * @param {string[] | string} props\n * @param {object[] | string} children\n * @param {object[]} siblings\n * @param {number} length\n */\nexport function node (value, root, parent, type, props, children, length, siblings) {\n\treturn {value: value, root: root, parent: parent, type: type, props: props, children: children, line: line, column: column, length: length, return: '', siblings: siblings}\n}\n\n/**\n * @param {object} root\n * @param {object} props\n * @return {object}\n */\nexport function copy (root, props) {\n\treturn assign(node('', null, null, '', null, null, 0, root.siblings), root, {length: -root.length}, props)\n}\n\n/**\n * @param {object} root\n */\nexport function lift (root) {\n\twhile (root.root)\n\t\troot = copy(root.root, {children: [root]})\n\n\tappend(root, root.siblings)\n}\n\n/**\n * @return {number}\n */\nexport function char () {\n\treturn character\n}\n\n/**\n * @return {number}\n */\nexport function prev () {\n\tcharacter = position > 0 ? charat(characters, --position) : 0\n\n\tif (column--, character === 10)\n\t\tcolumn = 1, line--\n\n\treturn character\n}\n\n/**\n * @return {number}\n */\nexport function next () {\n\tcharacter = position < length ? charat(characters, position++) : 0\n\n\tif (column++, character === 10)\n\t\tcolumn = 1, line++\n\n\treturn character\n}\n\n/**\n * @return {number}\n */\nexport function peek () {\n\treturn charat(characters, position)\n}\n\n/**\n * @return {number}\n */\nexport function caret () {\n\treturn position\n}\n\n/**\n * @param {number} begin\n * @param {number} end\n * @return {string}\n */\nexport function slice (begin, end) {\n\treturn substr(characters, begin, end)\n}\n\n/**\n * @param {number} type\n * @return {number}\n */\nexport function token (type) {\n\tswitch (type) {\n\t\t// \\0 \\t \\n \\r \\s whitespace token\n\t\tcase 0: case 9: case 10: case 13: case 32:\n\t\t\treturn 5\n\t\t// ! + , / > @ ~ isolate token\n\t\tcase 33: case 43: case 44: case 47: case 62: case 64: case 126:\n\t\t// ; { } breakpoint token\n\t\tcase 59: case 123: case 125:\n\t\t\treturn 4\n\t\t// : accompanied token\n\t\tcase 58:\n\t\t\treturn 3\n\t\t// \" ' ( [ opening delimit token\n\t\tcase 34: case 39: case 40: case 91:\n\t\t\treturn 2\n\t\t// ) ] closing delimit token\n\t\tcase 41: case 93:\n\t\t\treturn 1\n\t}\n\n\treturn 0\n}\n\n/**\n * @param {string} value\n * @return {any[]}\n */\nexport function alloc (value) {\n\treturn line = column = 1, length = strlen(characters = value), position = 0, []\n}\n\n/**\n * @param {any} value\n * @return {any}\n */\nexport function dealloc (value) {\n\treturn characters = '', value\n}\n\n/**\n * @param {number} type\n * @return {string}\n */\nexport function delimit (type) {\n\treturn trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)))\n}\n\n/**\n * @param {string} value\n * @return {string[]}\n */\nexport function tokenize (value) {\n\treturn dealloc(tokenizer(alloc(value)))\n}\n\n/**\n * @param {number} type\n * @return {string}\n */\nexport function whitespace (type) {\n\twhile (character = peek())\n\t\tif (character < 33)\n\t\t\tnext()\n\t\telse\n\t\t\tbreak\n\n\treturn token(type) > 2 || token(character) > 3 ? '' : ' '\n}\n\n/**\n * @param {string[]} children\n * @return {string[]}\n */\nexport function tokenizer (children) {\n\twhile (next())\n\t\tswitch (token(character)) {\n\t\t\tcase 0: append(identifier(position - 1), children)\n\t\t\t\tbreak\n\t\t\tcase 2: append(delimit(character), children)\n\t\t\t\tbreak\n\t\t\tdefault: append(from(character), children)\n\t\t}\n\n\treturn children\n}\n\n/**\n * @param {number} index\n * @param {number} count\n * @return {string}\n */\nexport function escaping (index, count) {\n\twhile (--count && next())\n\t\t// not 0-9 A-F a-f\n\t\tif (character < 48 || character > 102 || (character > 57 && character < 65) || (character > 70 && character < 97))\n\t\t\tbreak\n\n\treturn slice(index, caret() + (count < 6 && peek() == 32 && next() == 32))\n}\n\n/**\n * @param {number} type\n * @return {number}\n */\nexport function delimiter (type) {\n\twhile (next())\n\t\tswitch (character) {\n\t\t\t// ] ) \" '\n\t\t\tcase type:\n\t\t\t\treturn position\n\t\t\t// \" '\n\t\t\tcase 34: case 39:\n\t\t\t\tif (type !== 34 && type !== 39)\n\t\t\t\t\tdelimiter(character)\n\t\t\t\tbreak\n\t\t\t// (\n\t\t\tcase 40:\n\t\t\t\tif (type === 41)\n\t\t\t\t\tdelimiter(type)\n\t\t\t\tbreak\n\t\t\t// \\\n\t\t\tcase 92:\n\t\t\t\tnext()\n\t\t\t\tbreak\n\t\t}\n\n\treturn position\n}\n\n/**\n * @param {number} type\n * @param {number} index\n * @return {number}\n */\nexport function commenter (type, index) {\n\twhile (next())\n\t\t// //\n\t\tif (type + character === 47 + 10)\n\t\t\tbreak\n\t\t// /*\n\t\telse if (type + character === 42 + 42 && peek() === 47)\n\t\t\tbreak\n\n\treturn '/*' + slice(index, position - 1) + '*' + from(type === 47 ? type : next())\n}\n\n/**\n * @param {number} index\n * @return {string}\n */\nexport function identifier (index) {\n\twhile (!token(peek()))\n\t\tnext()\n\n\treturn slice(index, position)\n}\n","import {IMPORT, LAYER, COMMENT, RULESET, DECLARATION, KEYFRAMES} from './Enum.js'\nimport {strlen} from './Utility.js'\n\n/**\n * @param {object[]} children\n * @param {function} callback\n * @return {string}\n */\nexport function serialize (children, callback) {\n\tvar output = ''\n\n\tfor (var i = 0; i < children.length; i++)\n\t\toutput += callback(children[i], i, children, callback) || ''\n\n\treturn output\n}\n\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n * @param {function} callback\n * @return {string}\n */\nexport function stringify (element, index, children, callback) {\n\tswitch (element.type) {\n\t\tcase LAYER: if (element.children.length) break\n\t\tcase IMPORT: case DECLARATION: return element.return = element.return || element.value\n\t\tcase COMMENT: return ''\n\t\tcase KEYFRAMES: return element.return = element.value + '{' + serialize(element.children, callback) + '}'\n\t\tcase RULESET: if (!strlen(element.value = element.props.join(','))) return ''\n\t}\n\n\treturn strlen(children = serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : ''\n}\n","import {MS, MOZ, WEBKIT} from './Enum.js'\nimport {hash, charat, strlen, indexof, replace, substr, match} from './Utility.js'\n\n/**\n * @param {string} value\n * @param {number} length\n * @param {object[]} children\n * @return {string}\n */\nexport function prefix (value, length, children) {\n\tswitch (hash(value, length)) {\n\t\t// color-adjust\n\t\tcase 5103:\n\t\t\treturn WEBKIT + 'print-' + value + value\n\t\t// animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)\n\t\tcase 5737: case 4201: case 3177: case 3433: case 1641: case 4457: case 2921:\n\t\t// text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break\n\t\tcase 5572: case 6356: case 5844: case 3191: case 6645: case 3005:\n\t\t// mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,\n\t\tcase 6391: case 5879: case 5623: case 6135: case 4599: case 4855:\n\t\t// background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)\n\t\tcase 4215: case 6389: case 5109: case 5365: case 5621: case 3829:\n\t\t\treturn WEBKIT + value + value\n\t\t// tab-size\n\t\tcase 4789:\n\t\t\treturn MOZ + value + value\n\t\t// appearance, user-select, transform, hyphens, text-size-adjust\n\t\tcase 5349: case 4246: case 4810: case 6968: case 2756:\n\t\t\treturn WEBKIT + value + MOZ + value + MS + value + value\n\t\t// writing-mode\n\t\tcase 5936:\n\t\t\tswitch (charat(value, length + 11)) {\n\t\t\t\t// vertical-l(r)\n\t\t\t\tcase 114:\n\t\t\t\t\treturn WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'tb') + value\n\t\t\t\t// vertical-r(l)\n\t\t\t\tcase 108:\n\t\t\t\t\treturn WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'tb-rl') + value\n\t\t\t\t// horizontal(-)tb\n\t\t\t\tcase 45:\n\t\t\t\t\treturn WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'lr') + value\n\t\t\t\t// default: fallthrough to below\n\t\t\t}\n\t\t// flex, flex-direction, scroll-snap-type, writing-mode\n\t\tcase 6828: case 4268: case 2903:\n\t\t\treturn WEBKIT + value + MS + value + value\n\t\t// order\n\t\tcase 6165:\n\t\t\treturn WEBKIT + value + MS + 'flex-' + value + value\n\t\t// align-items\n\t\tcase 5187:\n\t\t\treturn WEBKIT + value + replace(value, /(\\w+).+(:[^]+)/, WEBKIT + 'box-$1$2' + MS + 'flex-$1$2') + value\n\t\t// align-self\n\t\tcase 5443:\n\t\t\treturn WEBKIT + value + MS + 'flex-item-' + replace(value, /flex-|-self/g, '') + (!match(value, /flex-|baseline/) ? MS + 'grid-row-' + replace(value, /flex-|-self/g, '') : '') + value\n\t\t// align-content\n\t\tcase 4675:\n\t\t\treturn WEBKIT + value + MS + 'flex-line-pack' + replace(value, /align-content|flex-|-self/g, '') + value\n\t\t// flex-shrink\n\t\tcase 5548:\n\t\t\treturn WEBKIT + value + MS + replace(value, 'shrink', 'negative') + value\n\t\t// flex-basis\n\t\tcase 5292:\n\t\t\treturn WEBKIT + value + MS + replace(value, 'basis', 'preferred-size') + value\n\t\t// flex-grow\n\t\tcase 6060:\n\t\t\treturn WEBKIT + 'box-' + replace(value, '-grow', '') + WEBKIT + value + MS + replace(value, 'grow', 'positive') + value\n\t\t// transition\n\t\tcase 4554:\n\t\t\treturn WEBKIT + replace(value, /([^-])(transform)/g, '$1' + WEBKIT + '$2') + value\n\t\t// cursor\n\t\tcase 6187:\n\t\t\treturn replace(replace(replace(value, /(zoom-|grab)/, WEBKIT + '$1'), /(image-set)/, WEBKIT + '$1'), value, '') + value\n\t\t// background, background-image\n\t\tcase 5495: case 3959:\n\t\t\treturn replace(value, /(image-set\\([^]*)/, WEBKIT + '$1' + '$`$1')\n\t\t// justify-content\n\t\tcase 4968:\n\t\t\treturn replace(replace(value, /(.+:)(flex-)?(.*)/, WEBKIT + 'box-pack:$3' + MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + WEBKIT + value + value\n\t\t// justify-self\n\t\tcase 4200:\n\t\t\tif (!match(value, /flex-|baseline/)) return MS + 'grid-column-align' + substr(value, length) + value\n\t\t\tbreak\n\t\t// grid-template-(columns|rows)\n\t\tcase 2592: case 3360:\n\t\t\treturn MS + replace(value, 'template-', '') + value\n\t\t// grid-(row|column)-start\n\t\tcase 4384: case 3616:\n\t\t\tif (children && children.some(function (element, index) { return length = index, match(element.props, /grid-\\w+-end/) })) {\n\t\t\t\treturn ~indexof(value + (children = children[length].value), 'span', 0) ? value : (MS + replace(value, '-start', '') + value + MS + 'grid-row-span:' + (~indexof(children, 'span', 0) ? match(children, /\\d+/) : +match(children, /\\d+/) - +match(value, /\\d+/)) + ';')\n\t\t\t}\n\t\t\treturn MS + replace(value, '-start', '') + value\n\t\t// grid-(row|column)-end\n\t\tcase 4896: case 4128:\n\t\t\treturn (children && children.some(function (element) { return match(element.props, /grid-\\w+-start/) })) ? value : MS + replace(replace(value, '-end', '-span'), 'span ', '') + value\n\t\t// (margin|padding)-inline-(start|end)\n\t\tcase 4095: case 3583: case 4068: case 2532:\n\t\t\treturn replace(value, /(.+)-inline(.+)/, WEBKIT + '$1$2') + value\n\t\t// (min|max)?(width|height|inline-size|block-size)\n\t\tcase 8116: case 7059: case 5753: case 5535:\n\t\tcase 5445: case 5701: case 4933: case 4677:\n\t\tcase 5533: case 5789: case 5021: case 4765:\n\t\t\t// stretch, max-content, min-content, fill-available\n\t\t\tif (strlen(value) - 1 - length > 6)\n\t\t\t\tswitch (charat(value, length + 1)) {\n\t\t\t\t\t// (m)ax-content, (m)in-content\n\t\t\t\t\tcase 109:\n\t\t\t\t\t\t// -\n\t\t\t\t\t\tif (charat(value, length + 4) !== 45)\n\t\t\t\t\t\t\tbreak\n\t\t\t\t\t// (f)ill-available, (f)it-content\n\t\t\t\t\tcase 102:\n\t\t\t\t\t\treturn replace(value, /(.+:)(.+)-([^]+)/, '$1' + WEBKIT + '$2-$3' + '$1' + MOZ + (charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value\n\t\t\t\t\t// (s)tretch\n\t\t\t\t\tcase 115:\n\t\t\t\t\t\treturn ~indexof(value, 'stretch', 0) ? prefix(replace(value, 'stretch', 'fill-available'), length, children) + value : value\n\t\t\t\t}\n\t\t\tbreak\n\t\t// grid-(column|row)\n\t\tcase 5152: case 5920:\n\t\t\treturn replace(value, /(.+?):(\\d+)(\\s*\\/\\s*(span)?\\s*(\\d+))?(.*)/, function (_, a, b, c, d, e, f) { return (MS + a + ':' + b + f) + (c ? (MS + a + '-span:' + (d ? e : +e - +b)) + f : '') + value })\n\t\t// position: sticky\n\t\tcase 4949:\n\t\t\t// stick(y)?\n\t\t\tif (charat(value, length + 6) === 121)\n\t\t\t\treturn replace(value, ':', ':' + WEBKIT) + value\n\t\t\tbreak\n\t\t// display: (flex|inline-flex|grid|inline-grid)\n\t\tcase 6444:\n\t\t\tswitch (charat(value, charat(value, 14) === 45 ? 18 : 11)) {\n\t\t\t\t// (inline-)?fle(x)\n\t\t\t\tcase 120:\n\t\t\t\t\treturn replace(value, /(.+:)([^;\\s!]+)(;|(\\s+)?!.+)?/, '$1' + WEBKIT + (charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + WEBKIT + '$2$3' + '$1' + MS + '$2box$3') + value\n\t\t\t\t// (inline-)?gri(d)\n\t\t\t\tcase 100:\n\t\t\t\t\treturn replace(value, ':', ':' + MS) + value\n\t\t\t}\n\t\t\tbreak\n\t\t// scroll-margin, scroll-margin-(top|right|bottom|left)\n\t\tcase 5719: case 2647: case 2135: case 3927: case 2391:\n\t\t\treturn replace(value, 'scroll-', 'scroll-snap-') + value\n\t}\n\n\treturn value\n}\n","import {MS, MOZ, WEBKIT, RULESET, KEYFRAMES, DECLARATION} from './Enum.js'\nimport {match, charat, substr, strlen, sizeof, replace, combine, filter, assign} from './Utility.js'\nimport {copy, lift, tokenize} from './Tokenizer.js'\nimport {serialize} from './Serializer.js'\nimport {prefix} from './Prefixer.js'\n\n/**\n * @param {function[]} collection\n * @return {function}\n */\nexport function middleware (collection) {\n\tvar length = sizeof(collection)\n\n\treturn function (element, index, children, callback) {\n\t\tvar output = ''\n\n\t\tfor (var i = 0; i < length; i++)\n\t\t\toutput += collection[i](element, index, children, callback) || ''\n\n\t\treturn output\n\t}\n}\n\n/**\n * @param {function} callback\n * @return {function}\n */\nexport function rulesheet (callback) {\n\treturn function (element) {\n\t\tif (!element.root)\n\t\t\tif (element = element.return)\n\t\t\t\tcallback(element)\n\t}\n}\n\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n * @param {function} callback\n */\nexport function prefixer (element, index, children, callback) {\n\tif (element.length > -1)\n\t\tif (!element.return)\n\t\t\tswitch (element.type) {\n\t\t\t\tcase DECLARATION: element.return = prefix(element.value, element.length, children)\n\t\t\t\t\treturn\n\t\t\t\tcase KEYFRAMES:\n\t\t\t\t\treturn serialize([copy(element, {value: replace(element.value, '@', '@' + WEBKIT)})], callback)\n\t\t\t\tcase RULESET:\n\t\t\t\t\tif (element.length)\n\t\t\t\t\t\treturn combine(children = element.props, function (value) {\n\t\t\t\t\t\t\tswitch (match(value, callback = /(::plac\\w+|:read-\\w+)/)) {\n\t\t\t\t\t\t\t\t// :read-(only|write)\n\t\t\t\t\t\t\t\tcase ':read-only': case ':read-write':\n\t\t\t\t\t\t\t\t\tlift(copy(element, {props: [replace(value, /:(read-\\w+)/, ':' + MOZ + '$1')]}))\n\t\t\t\t\t\t\t\t\tlift(copy(element, {props: [value]}))\n\t\t\t\t\t\t\t\t\tassign(element, {props: filter(children, callback)})\n\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t// :placeholder\n\t\t\t\t\t\t\t\tcase '::placeholder':\n\t\t\t\t\t\t\t\t\tlift(copy(element, {props: [replace(value, /:(plac\\w+)/, ':' + WEBKIT + 'input-$1')]}))\n\t\t\t\t\t\t\t\t\tlift(copy(element, {props: [replace(value, /:(plac\\w+)/, ':' + MOZ + '$1')]}))\n\t\t\t\t\t\t\t\t\tlift(copy(element, {props: [replace(value, /:(plac\\w+)/, MS + 'input-$1')]}))\n\t\t\t\t\t\t\t\t\tlift(copy(element, {props: [value]}))\n\t\t\t\t\t\t\t\t\tassign(element, {props: filter(children, callback)})\n\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn ''\n\t\t\t\t\t\t})\n\t\t\t}\n}\n\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n */\nexport function namespace (element) {\n\tswitch (element.type) {\n\t\tcase RULESET:\n\t\t\telement.props = element.props.map(function (value) {\n\t\t\t\treturn combine(tokenize(value), function (value, index, children) {\n\t\t\t\t\tswitch (charat(value, 0)) {\n\t\t\t\t\t\t// \\f\n\t\t\t\t\t\tcase 12:\n\t\t\t\t\t\t\treturn substr(value, 1, strlen(value))\n\t\t\t\t\t\t// \\0 ( + > ~\n\t\t\t\t\t\tcase 0: case 40: case 43: case 62: case 126:\n\t\t\t\t\t\t\treturn value\n\t\t\t\t\t\t// :\n\t\t\t\t\t\tcase 58:\n\t\t\t\t\t\t\tif (children[++index] === 'global')\n\t\t\t\t\t\t\t\tchildren[index] = '', children[++index] = '\\f' + substr(children[index], index = 1, -1)\n\t\t\t\t\t\t// \\s\n\t\t\t\t\t\tcase 32:\n\t\t\t\t\t\t\treturn index === 1 ? '' : value\n\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\tswitch (index) {\n\t\t\t\t\t\t\t\tcase 0: element = value\n\t\t\t\t\t\t\t\t\treturn sizeof(children) > 1 ? '' : value\n\t\t\t\t\t\t\t\tcase index = sizeof(children) - 1: case 2:\n\t\t\t\t\t\t\t\t\treturn index === 2 ? value + element + element : value + element\n\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\treturn value\n\t\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t})\n\t}\n}\n","import {COMMENT, RULESET, DECLARATION} from './Enum.js'\nimport {abs, charat, trim, from, sizeof, strlen, substr, append, replace, indexof} from './Utility.js'\nimport {node, char, prev, next, peek, caret, alloc, dealloc, delimit, whitespace, escaping, identifier, commenter} from './Tokenizer.js'\n\n/**\n * @param {string} value\n * @return {object[]}\n */\nexport function compile (value) {\n\treturn dealloc(parse('', null, null, null, [''], value = alloc(value), 0, [0], value))\n}\n\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {string[]} rule\n * @param {string[]} rules\n * @param {string[]} rulesets\n * @param {number[]} pseudo\n * @param {number[]} points\n * @param {string[]} declarations\n * @return {object}\n */\nexport function parse (value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {\n\tvar index = 0\n\tvar offset = 0\n\tvar length = pseudo\n\tvar atrule = 0\n\tvar property = 0\n\tvar previous = 0\n\tvar variable = 1\n\tvar scanning = 1\n\tvar ampersand = 1\n\tvar character = 0\n\tvar type = ''\n\tvar props = rules\n\tvar children = rulesets\n\tvar reference = rule\n\tvar characters = type\n\n\twhile (scanning)\n\t\tswitch (previous = character, character = next()) {\n\t\t\t// (\n\t\t\tcase 40:\n\t\t\t\tif (previous != 108 && charat(characters, length - 1) == 58) {\n\t\t\t\t\tif (indexof(characters += replace(delimit(character), '&', '&\\f'), '&\\f', abs(index ? points[index - 1] : 0)) != -1)\n\t\t\t\t\t\tampersand = -1\n\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t// \" ' [\n\t\t\tcase 34: case 39: case 91:\n\t\t\t\tcharacters += delimit(character)\n\t\t\t\tbreak\n\t\t\t// \\t \\n \\r \\s\n\t\t\tcase 9: case 10: case 13: case 32:\n\t\t\t\tcharacters += whitespace(previous)\n\t\t\t\tbreak\n\t\t\t// \\\n\t\t\tcase 92:\n\t\t\t\tcharacters += escaping(caret() - 1, 7)\n\t\t\t\tcontinue\n\t\t\t// /\n\t\t\tcase 47:\n\t\t\t\tswitch (peek()) {\n\t\t\t\t\tcase 42: case 47:\n\t\t\t\t\t\tappend(comment(commenter(next(), caret()), root, parent, declarations), declarations)\n\t\t\t\t\t\tbreak\n\t\t\t\t\tdefault:\n\t\t\t\t\t\tcharacters += '/'\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t// {\n\t\t\tcase 123 * variable:\n\t\t\t\tpoints[index++] = strlen(characters) * ampersand\n\t\t\t// } ; \\0\n\t\t\tcase 125 * variable: case 59: case 0:\n\t\t\t\tswitch (character) {\n\t\t\t\t\t// \\0 }\n\t\t\t\t\tcase 0: case 125: scanning = 0\n\t\t\t\t\t// ;\n\t\t\t\t\tcase 59 + offset: if (ampersand == -1) characters = replace(characters, /\\f/g, '')\n\t\t\t\t\t\tif (property > 0 && (strlen(characters) - length))\n\t\t\t\t\t\t\tappend(property > 32 ? declaration(characters + ';', rule, parent, length - 1, declarations) : declaration(replace(characters, ' ', '') + ';', rule, parent, length - 2, declarations), declarations)\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// @ ;\n\t\t\t\t\tcase 59: characters += ';'\n\t\t\t\t\t// { rule/at-rule\n\t\t\t\t\tdefault:\n\t\t\t\t\t\tappend(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length, rulesets), rulesets)\n\n\t\t\t\t\t\tif (character === 123)\n\t\t\t\t\t\t\tif (offset === 0)\n\t\t\t\t\t\t\t\tparse(characters, root, reference, reference, props, rulesets, length, points, children)\n\t\t\t\t\t\t\telse\n\t\t\t\t\t\t\t\tswitch (atrule === 99 && charat(characters, 3) === 110 ? 100 : atrule) {\n\t\t\t\t\t\t\t\t\t// d l m s\n\t\t\t\t\t\t\t\t\tcase 100: case 108: case 109: case 115:\n\t\t\t\t\t\t\t\t\t\tparse(value, reference, reference, rule && append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length, children), children), rules, children, length, points, rule ? props : children)\n\t\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\t\tparse(characters, reference, reference, reference, [''], children, 0, points, children)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tindex = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo\n\t\t\t\tbreak\n\t\t\t// :\n\t\t\tcase 58:\n\t\t\t\tlength = 1 + strlen(characters), property = previous\n\t\t\tdefault:\n\t\t\t\tif (variable < 1)\n\t\t\t\t\tif (character == 123)\n\t\t\t\t\t\t--variable\n\t\t\t\t\telse if (character == 125 && variable++ == 0 && prev() == 125)\n\t\t\t\t\t\tcontinue\n\n\t\t\t\tswitch (characters += from(character), character * variable) {\n\t\t\t\t\t// &\n\t\t\t\t\tcase 38:\n\t\t\t\t\t\tampersand = offset > 0 ? 1 : (characters += '\\f', -1)\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// ,\n\t\t\t\t\tcase 44:\n\t\t\t\t\t\tpoints[index++] = (strlen(characters) - 1) * ampersand, ampersand = 1\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// @\n\t\t\t\t\tcase 64:\n\t\t\t\t\t\t// -\n\t\t\t\t\t\tif (peek() === 45)\n\t\t\t\t\t\t\tcharacters += delimit(next())\n\n\t\t\t\t\t\tatrule = peek(), offset = length = strlen(type = characters += identifier(caret())), character++\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// -\n\t\t\t\t\tcase 45:\n\t\t\t\t\t\tif (previous === 45 && strlen(characters) == 2)\n\t\t\t\t\t\t\tvariable = 0\n\t\t\t\t}\n\t\t}\n\n\treturn rulesets\n}\n\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {number} index\n * @param {number} offset\n * @param {string[]} rules\n * @param {number[]} points\n * @param {string} type\n * @param {string[]} props\n * @param {string[]} children\n * @param {number} length\n * @param {object[]} siblings\n * @return {object}\n */\nexport function ruleset (value, root, parent, index, offset, rules, points, type, props, children, length, siblings) {\n\tvar post = offset - 1\n\tvar rule = offset === 0 ? rules : ['']\n\tvar size = sizeof(rule)\n\n\tfor (var i = 0, j = 0, k = 0; i < index; ++i)\n\t\tfor (var x = 0, y = substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x)\n\t\t\tif (z = trim(j > 0 ? rule[x] + ' ' + y : replace(y, /&\\f/g, rule[x])))\n\t\t\t\tprops[k++] = z\n\n\treturn node(value, root, parent, offset === 0 ? RULESET : type, props, children, length, siblings)\n}\n\n/**\n * @param {number} value\n * @param {object} root\n * @param {object?} parent\n * @param {object[]} siblings\n * @return {object}\n */\nexport function comment (value, root, parent, siblings) {\n\treturn node(value, root, parent, COMMENT, from(char()), substr(value, 2, -2), 0, siblings)\n}\n\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {number} length\n * @param {object[]} siblings\n * @return {object}\n */\nexport function declaration (value, root, parent, length, siblings) {\n\treturn node(value, root, parent, DECLARATION, substr(value, 0, length), substr(value, length + 1, -1), length, siblings)\n}\n","var unitlessKeys = {\n animationIterationCount: 1,\n aspectRatio: 1,\n borderImageOutset: 1,\n borderImageSlice: 1,\n borderImageWidth: 1,\n boxFlex: 1,\n boxFlexGroup: 1,\n boxOrdinalGroup: 1,\n columnCount: 1,\n columns: 1,\n flex: 1,\n flexGrow: 1,\n flexPositive: 1,\n flexShrink: 1,\n flexNegative: 1,\n flexOrder: 1,\n gridRow: 1,\n gridRowEnd: 1,\n gridRowSpan: 1,\n gridRowStart: 1,\n gridColumn: 1,\n gridColumnEnd: 1,\n gridColumnSpan: 1,\n gridColumnStart: 1,\n msGridRow: 1,\n msGridRowSpan: 1,\n msGridColumn: 1,\n msGridColumnSpan: 1,\n fontWeight: 1,\n lineHeight: 1,\n opacity: 1,\n order: 1,\n orphans: 1,\n tabSize: 1,\n widows: 1,\n zIndex: 1,\n zoom: 1,\n WebkitLineClamp: 1,\n // SVG-related properties\n fillOpacity: 1,\n floodOpacity: 1,\n stopOpacity: 1,\n strokeDasharray: 1,\n strokeDashoffset: 1,\n strokeMiterlimit: 1,\n strokeOpacity: 1,\n strokeWidth: 1\n};\n\nexport { unitlessKeys as default };\n","import{__spreadArray as e,__assign as t}from\"tslib\";import n from\"@emotion/is-prop-valid\";import o,{useRef as r,useState as s,useMemo as i,useEffect as a,useContext as c,useDebugValue as l,createElement as u}from\"react\";import p from\"shallowequal\";import*as d from\"stylis\";import h from\"@emotion/unitless\";var f=\"undefined\"!=typeof process&&void 0!==process.env&&(process.env.REACT_APP_SC_ATTR||process.env.SC_ATTR)||\"data-styled\",m=\"active\",y=\"data-styled-version\",v=\"6.1.12\",g=\"/*!sc*/\\n\",S=\"undefined\"!=typeof window&&\"HTMLElement\"in window,w=Boolean(\"boolean\"==typeof SC_DISABLE_SPEEDY?SC_DISABLE_SPEEDY:\"undefined\"!=typeof process&&void 0!==process.env&&void 0!==process.env.REACT_APP_SC_DISABLE_SPEEDY&&\"\"!==process.env.REACT_APP_SC_DISABLE_SPEEDY?\"false\"!==process.env.REACT_APP_SC_DISABLE_SPEEDY&&process.env.REACT_APP_SC_DISABLE_SPEEDY:\"undefined\"!=typeof process&&void 0!==process.env&&void 0!==process.env.SC_DISABLE_SPEEDY&&\"\"!==process.env.SC_DISABLE_SPEEDY?\"false\"!==process.env.SC_DISABLE_SPEEDY&&process.env.SC_DISABLE_SPEEDY:\"production\"!==process.env.NODE_ENV),b={},E=/invalid hook call/i,N=new Set,P=function(t,n){if(\"production\"!==process.env.NODE_ENV){var o=n?' with the id of \"'.concat(n,'\"'):\"\",s=\"The component \".concat(t).concat(o,\" has been created dynamically.\\n\")+\"You may see this warning because you've called styled inside another component.\\nTo resolve this only create new StyledComponents outside of any render method and function component.\",i=console.error;try{var a=!0;console.error=function(t){for(var n=[],o=1;o?@[\\\\\\]^`{|}~-]+/g,D=/(^-|-$)/g;function R(e){return e.replace(O,\"-\").replace(D,\"\")}var T=/(a)(d)/gi,k=52,j=function(e){return String.fromCharCode(e+(e>25?39:97))};function x(e){var t,n=\"\";for(t=Math.abs(e);t>k;t=t/k|0)n=j(t%k)+n;return(j(t%k)+n).replace(T,\"$1-$2\")}var V,F=5381,M=function(e,t){for(var n=t.length;n;)e=33*e^t.charCodeAt(--n);return e},z=function(e){return M(F,e)};function $(e){return x(z(e)>>>0)}function B(e){return\"production\"!==process.env.NODE_ENV&&\"string\"==typeof e&&e||e.displayName||e.name||\"Component\"}function L(e){return\"string\"==typeof e&&(\"production\"===process.env.NODE_ENV||e.charAt(0)===e.charAt(0).toLowerCase())}var G=\"function\"==typeof Symbol&&Symbol.for,Y=G?Symbol.for(\"react.memo\"):60115,W=G?Symbol.for(\"react.forward_ref\"):60112,q={childContextTypes:!0,contextType:!0,contextTypes:!0,defaultProps:!0,displayName:!0,getDefaultProps:!0,getDerivedStateFromError:!0,getDerivedStateFromProps:!0,mixins:!0,propTypes:!0,type:!0},H={name:!0,length:!0,prototype:!0,caller:!0,callee:!0,arguments:!0,arity:!0},U={$$typeof:!0,compare:!0,defaultProps:!0,displayName:!0,propTypes:!0,type:!0},J=((V={})[W]={$$typeof:!0,render:!0,defaultProps:!0,displayName:!0,propTypes:!0},V[Y]=U,V);function X(e){return(\"type\"in(t=e)&&t.type.$$typeof)===Y?U:\"$$typeof\"in e?J[e.$$typeof]:q;var t}var Z=Object.defineProperty,K=Object.getOwnPropertyNames,Q=Object.getOwnPropertySymbols,ee=Object.getOwnPropertyDescriptor,te=Object.getPrototypeOf,ne=Object.prototype;function oe(e,t,n){if(\"string\"!=typeof t){if(ne){var o=te(t);o&&o!==ne&&oe(e,o,n)}var r=K(t);Q&&(r=r.concat(Q(t)));for(var s=X(e),i=X(t),a=0;a ({})}\\n```\\n\\n',8:'ThemeProvider: Please make your \"theme\" prop an object.\\n\\n',9:\"Missing document ``\\n\\n\",10:\"Cannot find a StyleSheet instance. Usually this happens if there are multiple copies of styled-components loaded at once. Check out this issue for how to troubleshoot and fix the common cases where this situation can happen: https://github.com/styled-components/styled-components/issues/1941#issuecomment-417862021\\n\\n\",11:\"_This error was replaced with a dev-time warning, it will be deleted for v4 final._ [createGlobalStyle] received children which will not be rendered. Please use the component without passing children elements.\\n\\n\",12:\"It seems you are interpolating a keyframe declaration (%s) into an untagged string. This was supported in styled-components v3, but is not longer supported in v4 as keyframes are now injected on-demand. Please wrap your string in the css\\\\`\\\\` helper which ensures the styles are injected correctly. See https://www.styled-components.com/docs/api#css\\n\\n\",13:\"%s is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details.\\n\\n\",14:'ThemeProvider: \"theme\" prop is required.\\n\\n',15:\"A stylis plugin has been supplied that is not named. We need a name for each plugin to be able to prevent styling collisions between different stylis configurations within the same app. Before you pass your plugin to ``, please make sure each plugin is uniquely-named, e.g.\\n\\n```js\\nObject.defineProperty(importedPlugin, 'name', { value: 'some-unique-name' });\\n```\\n\\n\",16:\"Reached the limit of how many styled components may be created at group %s.\\nYou may only create up to 1,073,741,824 components. If you're creating components dynamically,\\nas for instance in your render method then you may be running into this limitation.\\n\\n\",17:\"CSSStyleSheet could not be found on HTMLStyleElement.\\nHas styled-components' style tag been unmounted or altered by another script?\\n\",18:\"ThemeProvider: Please make sure your useTheme hook is within a ``\"}:{};function de(){for(var e=[],t=0;t0?\" Args: \".concat(n.join(\", \")):\"\")):new Error(de.apply(void 0,e([pe[t]],n,!1)).trim())}var fe=function(){function e(e){this.groupSizes=new Uint32Array(512),this.length=512,this.tag=e}return e.prototype.indexOfGroup=function(e){for(var t=0,n=0;n=this.groupSizes.length){for(var n=this.groupSizes,o=n.length,r=o;e>=r;)if((r<<=1)<0)throw he(16,\"\".concat(e));this.groupSizes=new Uint32Array(r),this.groupSizes.set(n),this.length=r;for(var s=o;s=this.length||0===this.groupSizes[e])return t;for(var n=this.groupSizes[e],o=this.indexOfGroup(e),r=o+n,s=o;sme))throw he(16,\"\".concat(t));return ye.set(e,t),ve.set(t,e),t},we=function(e,t){ge=t+1,ye.set(e,t),ve.set(t,e)},be=\"style[\".concat(f,\"][\").concat(y,'=\"').concat(v,'\"]'),Ee=new RegExp(\"^\".concat(f,'\\\\.g(\\\\d+)\\\\[id=\"([\\\\w\\\\d-]+)\"\\\\].*?\"([^\"]*)')),Ne=function(e,t,n){for(var o,r=n.split(\",\"),s=0,i=r.length;s=0){var n=document.createTextNode(t);return this.element.insertBefore(n,this.nodes[e]||null),this.length++,!0}return!1},e.prototype.deleteRule=function(e){this.element.removeChild(this.nodes[e]),this.length--},e.prototype.getRule=function(e){return e0&&(c+=\"\".concat(e,\",\"))}),o+=\"\".concat(i).concat(a,'{content:\"').concat(c,'\"}').concat(g)},s=0;s0?\".\".concat(t):e},u=c.slice();u.push(function(e){e.type===d.RULESET&&e.value.includes(\"&\")&&(e.props[0]=e.props[0].replace(je,n).replace(o,l))}),i.prefix&&u.push(d.prefixer),u.push(d.stringify);var p=function(e,r,s,a){void 0===r&&(r=\"\"),void 0===s&&(s=\"\"),void 0===a&&(a=\"&\"),t=a,n=r,o=new RegExp(\"\\\\\".concat(n,\"\\\\b\"),\"g\");var c=e.replace(xe,\"\"),l=d.compile(s||r?\"\".concat(s,\" \").concat(r,\" { \").concat(c,\" }\"):c);i.namespace&&(l=Ve(l,i.namespace));var p=[];return d.serialize(l,d.middleware(u.concat(d.rulesheet(function(e){return p.push(e)})))),p};return p.hash=c.length?c.reduce(function(e,t){return t.name||he(15),M(e,t.name)},F).toString():\"\",p}var Me=new ke,ze=Fe(),$e=o.createContext({shouldForwardProp:void 0,styleSheet:Me,stylis:ze}),Be=$e.Consumer,Le=o.createContext(void 0);function Ge(){return c($e)}function Ye(e){var t=s(e.stylisPlugins),n=t[0],r=t[1],c=Ge().styleSheet,l=i(function(){var t=c;return e.sheet?t=e.sheet:e.target&&(t=t.reconstructWithOptions({target:e.target},!1)),e.disableCSSOMInjection&&(t=t.reconstructWithOptions({useCSSOMInjection:!1})),t},[e.disableCSSOMInjection,e.sheet,e.target,c]),u=i(function(){return Fe({options:{namespace:e.namespace,prefix:e.enableVendorPrefixes},plugins:n})},[e.enableVendorPrefixes,e.namespace,n]);a(function(){p(n,e.stylisPlugins)||r(e.stylisPlugins)},[e.stylisPlugins]);var d=i(function(){return{shouldForwardProp:e.shouldForwardProp,styleSheet:l,stylis:u}},[e.shouldForwardProp,l,u]);return o.createElement($e.Provider,{value:d},o.createElement(Le.Provider,{value:u},e.children))}var We=function(){function e(e,t){var n=this;this.inject=function(e,t){void 0===t&&(t=ze);var o=n.name+t.hash;e.hasNameForId(n.id,o)||e.insertRules(n.id,o,t(n.rules,o,\"@keyframes\"))},this.name=e,this.id=\"sc-keyframes-\".concat(e),this.rules=t,ue(this,function(){throw he(12,String(n.name))})}return e.prototype.getName=function(e){return void 0===e&&(e=ze),this.name+e.hash},e}(),qe=function(e){return e>=\"A\"&&e<=\"Z\"};function He(e){for(var t=\"\",n=0;n>>0);if(!t.hasNameForId(this.componentId,s)){var i=n(r,\".\".concat(s),void 0,this.componentId);t.insertRules(this.componentId,s,i)}o=ie(o,s),this.staticRulesId=s}else{for(var a=M(this.baseHash,n.hash),c=\"\",l=0;l>>0);t.hasNameForId(this.componentId,d)||t.insertRules(this.componentId,d,n(c,\".\".concat(d),void 0,this.componentId)),o=ie(o,d)}}return o},e}(),et=o.createContext(void 0),tt=et.Consumer;function nt(){var e=c(et);if(!e)throw he(18);return e}function ot(e){var n=o.useContext(et),r=i(function(){return function(e,n){if(!e)throw he(14);if(re(e)){var o=e(n);if(\"production\"!==process.env.NODE_ENV&&(null===o||Array.isArray(o)||\"object\"!=typeof o))throw he(7);return o}if(Array.isArray(e)||\"object\"!=typeof e)throw he(8);return n?t(t({},n),e):e}(e.theme,n)},[e.theme,n]);return e.children?o.createElement(et.Provider,{value:r},e.children):null}var rt={},st=new Set;function it(e,r,s){var i=se(e),a=e,c=!L(e),p=r.attrs,d=void 0===p?_:p,h=r.componentId,f=void 0===h?function(e,t){var n=\"string\"!=typeof e?\"sc\":R(e);rt[n]=(rt[n]||0)+1;var o=\"\".concat(n,\"-\").concat($(v+n+rt[n]));return t?\"\".concat(t,\"-\").concat(o):o}(r.displayName,r.parentComponentId):h,m=r.displayName,y=void 0===m?function(e){return L(e)?\"styled.\".concat(e):\"Styled(\".concat(B(e),\")\")}(e):m,g=r.displayName&&r.componentId?\"\".concat(R(r.displayName),\"-\").concat(r.componentId):r.componentId||f,S=i&&a.attrs?a.attrs.concat(d).filter(Boolean):d,w=r.shouldForwardProp;if(i&&a.shouldForwardProp){var b=a.shouldForwardProp;if(r.shouldForwardProp){var E=r.shouldForwardProp;w=function(e,t){return b(e,t)&&E(e,t)}}else w=b}var N=new Qe(s,g,i?a.componentStyle:void 0);function O(e,r){return function(e,r,s){var i=e.attrs,a=e.componentStyle,c=e.defaultProps,p=e.foldedComponentIds,d=e.styledComponentId,h=e.target,f=o.useContext(et),m=Ge(),y=e.shouldForwardProp||m.shouldForwardProp;\"production\"!==process.env.NODE_ENV&&l(d);var v=I(r,f,c)||C,g=function(e,n,o){for(var r,s=t(t({},n),{className:void 0,theme:o}),i=0;i` (connect an API like `@emotion/is-prop-valid`) or consider using transient props (`$` prefix for automatic filtering.)')))));var E=function(e,t){var n=Ge(),o=e.generateAndInjectStyles(t,n.styleSheet,n.stylis);return\"production\"!==process.env.NODE_ENV&&l(o),o}(a,g);\"production\"!==process.env.NODE_ENV&&e.warnTooManyClasses&&e.warnTooManyClasses(E);var N=ie(p,d);return E&&(N+=\" \"+E),g.className&&(N+=\" \"+g.className),w[L(S)&&!A.has(S)?\"class\":\"className\"]=N,w.ref=s,u(S,w)}(D,e,r)}O.displayName=y;var D=o.forwardRef(O);return D.attrs=S,D.componentStyle=N,D.displayName=y,D.shouldForwardProp=w,D.foldedComponentIds=i?ie(a.foldedComponentIds,a.styledComponentId):\"\",D.styledComponentId=g,D.target=i?a.target:e,Object.defineProperty(D,\"defaultProps\",{get:function(){return this._foldedDefaultProps},set:function(e){this._foldedDefaultProps=i?function(e){for(var t=[],n=1;n=200)){var s=t?' with the id of \"'.concat(t,'\"'):\"\";console.warn(\"Over \".concat(200,\" classes were generated for component \").concat(e).concat(s,\".\\n\")+\"Consider using the attrs method, together with a style object for frequently changed styles.\\nExample:\\n const Component = styled.div.attrs(props => ({\\n style: {\\n background: props.background,\\n },\\n }))`width: 100%;`\\n\\n 2&&ke.registerId(this.componentId+e),this.removeStyles(e,n),this.createStyles(e,t,n,o)},e}();function ft(n){for(var r=[],s=1;s meta tag to the stylesheet, or simply embedding it manually in your index.html section for a simpler app.\"),t.styleSheet.server&&u(r,e,t.styleSheet,n,t.stylis),o.useLayoutEffect(function(){if(!t.styleSheet.server)return u(r,e,t.styleSheet,n,t.stylis),function(){return c.removeStyles(r,t.styleSheet)}},[r,e,t.styleSheet,n,t.stylis]),null};function u(e,n,o,r,s){if(c.isStatic)c.renderStyles(e,b,o,s);else{var i=t(t({},n),{theme:I(n,r,l.defaultProps)});c.renderStyles(e,i,o,s)}}return o.memo(l)}function mt(t){for(var n=[],o=1;o\").concat(t,\"\")},this.getStyleTags=function(){if(e.sealed)throw he(2);return e._emitSheetCSS()},this.getStyleElement=function(){var n;if(e.sealed)throw he(2);var r=e.instance.toString();if(!r)return[];var s=((n={})[f]=\"\",n[y]=v,n.dangerouslySetInnerHTML={__html:r},n),i=Ce();return i&&(s.nonce=i),[o.createElement(\"style\",t({},s,{key:\"sc-0-0\"}))]},this.seal=function(){e.sealed=!0},this.instance=new ke({isServer:!0}),this.sealed=!1}return e.prototype.collectStyles=function(e){if(this.sealed)throw he(2);return o.createElement(Ye,{sheet:this.instance},e)},e.prototype.interleaveWithNodeStream=function(e){throw he(3)},e}(),gt={StyleSheet:ke,mainSheet:Me};\"production\"!==process.env.NODE_ENV&&\"undefined\"!=typeof navigator&&\"ReactNative\"===navigator.product&&console.warn(\"It looks like you've imported 'styled-components' on React Native.\\nPerhaps you're looking to import 'styled-components/native'?\\nRead more about this at https://www.styled-components.com/docs/basics#react-native\");var St=\"__sc-\".concat(f,\"__\");\"production\"!==process.env.NODE_ENV&&\"test\"!==process.env.NODE_ENV&&\"undefined\"!=typeof window&&(window[St]||(window[St]=0),1===window[St]&&console.warn(\"It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles to not render properly, errors during the rehydration process, a missing theme prop, and makes your application bigger without good reason.\\n\\nSee https://s-c.sh/2BAXzed for more info.\"),window[St]+=1);export{vt as ServerStyleSheet,Be as StyleSheetConsumer,$e as StyleSheetContext,Ye as StyleSheetManager,tt as ThemeConsumer,et as ThemeContext,ot as ThemeProvider,gt as __PRIVATE__,ft as createGlobalStyle,lt as css,dt as default,se as isStyledComponent,mt as keyframes,dt as styled,nt as useTheme,v as version,yt as withTheme};\n//# sourceMappingURL=styled-components.browser.esm.js.map\n","function _assertThisInitialized(self) {\n if (self === void 0) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n return self;\n}\nmodule.exports = _assertThisInitialized, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;","var setPrototypeOf = require(\"./setPrototypeOf.js\");\nfunction _inheritsLoose(subClass, superClass) {\n subClass.prototype = Object.create(superClass.prototype);\n subClass.prototype.constructor = subClass;\n setPrototypeOf(subClass, superClass);\n}\nmodule.exports = _inheritsLoose, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;","function _interopRequireDefault(obj) {\n return obj && obj.__esModule ? obj : {\n \"default\": obj\n };\n}\nmodule.exports = _interopRequireDefault, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;","function _setPrototypeOf(o, p) {\n module.exports = _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {\n o.__proto__ = p;\n return o;\n }, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;\n return _setPrototypeOf(o, p);\n}\nmodule.exports = _setPrototypeOf, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;","'use strict';\n\nObject.defineProperty(exports, '__esModule', { value: true });\n\nconst PartytownSnippet = \"/* Partytown 0.7.5 - MIT builder.io */\\n!function(t,e,n,i,r,o,a,d,s,c,p,l){function u(){l||(l=1,\\\"/\\\"==(a=(o.lib||\\\"/~partytown/\\\")+(o.debug?\\\"debug/\\\":\\\"\\\"))[0]&&(s=e.querySelectorAll('script[type=\\\"text/partytown\\\"]'),i!=t?i.dispatchEvent(new CustomEvent(\\\"pt1\\\",{detail:t})):(d=setTimeout(f,1e4),e.addEventListener(\\\"pt0\\\",w),r?h(1):n.serviceWorker?n.serviceWorker.register(a+(o.swPath||\\\"partytown-sw.js\\\"),{scope:a}).then((function(t){t.active?h():t.installing&&t.installing.addEventListener(\\\"statechange\\\",(function(t){\\\"activated\\\"==t.target.state&&h()}))}),console.error):f())))}function h(t){c=e.createElement(t?\\\"script\\\":\\\"iframe\\\"),t||(c.setAttribute(\\\"style\\\",\\\"display:block;width:0;height:0;border:0;visibility:hidden\\\"),c.setAttribute(\\\"aria-hidden\\\",!0)),c.src=a+\\\"partytown-\\\"+(t?\\\"atomics.js?v=0.7.5\\\":\\\"sandbox-sw.html?\\\"+Date.now()),e.body.appendChild(c)}function f(n,r){for(w(),i==t&&(o.forward||[]).map((function(e){delete t[e.split(\\\".\\\")[0]]})),n=0;n {\n const { forward = [], ...filteredConfig } = config || {};\n const configStr = JSON.stringify(filteredConfig, (k, v) => {\n if (typeof v === 'function') {\n v = String(v);\n if (v.startsWith(k + '(')) {\n v = 'function ' + v;\n }\n }\n return v;\n });\n return [\n `!(function(w,p,f,c){`,\n Object.keys(filteredConfig).length > 0\n ? `c=w[p]=Object.assign(w[p]||{},${configStr});`\n : `c=w[p]=w[p]||{};`,\n `c[f]=(c[f]||[])`,\n forward.length > 0 ? `.concat(${JSON.stringify(forward)})` : ``,\n `})(window,'partytown','forward');`,\n snippetCode,\n ].join('');\n};\n\n/**\n * The `type` attribute for Partytown scripts, which does two things:\n *\n * 1. Prevents the `=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n},W=function(e){return!1===(!(arguments.length>1&&void 0!==arguments[1])||arguments[1])?String(e):String(e).replace(/&/g,"&").replace(//g,">").replace(/"/g,""").replace(/'/g,"'")},Z=function(e){var t=J(e,S.TITLE),n=J(e,B);if(n&&t)return n.replace(/%s/g,(function(){return Array.isArray(t)?t.join(""):t}));var r=J(e,M);return t||r||void 0},Y=function(e){return J(e,L)||function(){}},X=function(e,t){return t.filter((function(t){return void 0!==t[e]})).map((function(t){return t[e]})).reduce((function(e,t){return H({},e,t)}),{})},G=function(e,t){return t.filter((function(e){return void 0!==e[S.BASE]})).map((function(e){return e[S.BASE]})).reverse().reduce((function(t,n){if(!t.length)for(var r=Object.keys(n),o=0;o=0;n--){var r=e[n];if(r.hasOwnProperty(t))return r[t]}return null},Q=(r=Date.now(),function(e){var t=Date.now();t-r>16?(r=t,e(t)):setTimeout((function(){Q(e)}),0)}),ee=function(e){return clearTimeout(e)},te="undefined"!=typeof window?window.requestAnimationFrame&&window.requestAnimationFrame.bind(window)||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||Q:n.g.requestAnimationFrame||Q,ne="undefined"!=typeof window?window.cancelAnimationFrame||window.webkitCancelAnimationFrame||window.mozCancelAnimationFrame||ee:n.g.cancelAnimationFrame||ee,re=function(e){return console&&"function"==typeof console.warn&&console.warn(e)},oe=null,ae=function(e,t){var n=e.baseTag,r=e.bodyAttributes,o=e.htmlAttributes,a=e.linkTags,i=e.metaTags,l=e.noscriptTags,u=e.onChangeClientState,s=e.scriptTags,c=e.styleTags,d=e.title,f=e.titleAttributes;ue(S.BODY,r),ue(S.HTML,o),le(d,f);var p={baseTag:se(S.BASE,n),linkTags:se(S.LINK,a),metaTags:se(S.META,i),noscriptTags:se(S.NOSCRIPT,l),scriptTags:se(S.SCRIPT,s),styleTags:se(S.STYLE,c)},h={},m={};Object.keys(p).forEach((function(e){var t=p[e],n=t.newTags,r=t.oldTags;n.length&&(h[e]=n),r.length&&(m[e]=p[e].oldTags)})),t&&t(),u(e,h,m)},ie=function(e){return Array.isArray(e)?e.join(""):e},le=function(e,t){void 0!==e&&document.title!==e&&(document.title=ie(e)),ue(S.TITLE,t)},ue=function(e,t){var n=document.getElementsByTagName(e)[0];if(n){for(var r=n.getAttribute(V),o=r?r.split(","):[],a=[].concat(o),i=Object.keys(t),l=0;l=0;d--)n.removeAttribute(a[d]);o.length===a.length?n.removeAttribute(V):n.getAttribute(V)!==i.join(",")&&n.setAttribute(V,i.join(","))}},se=function(e,t){var n=document.head||document.querySelector(S.HEAD),r=n.querySelectorAll(e+"["+V+"]"),o=Array.prototype.slice.call(r),a=[],i=void 0;return t&&t.length&&t.forEach((function(t){var n=document.createElement(e);for(var r in t)if(t.hasOwnProperty(r))if(r===T)n.innerHTML=t.innerHTML;else if(r===k)n.styleSheet?n.styleSheet.cssText=t.cssText:n.appendChild(document.createTextNode(t.cssText));else{var l=void 0===t[r]?"":t[r];n.setAttribute(r,l)}n.setAttribute(V,"true"),o.some((function(e,t){return i=t,n.isEqualNode(e)}))?o.splice(i,1):a.push(n)})),o.forEach((function(e){return e.parentNode.removeChild(e)})),a.forEach((function(e){return n.appendChild(e)})),{oldTags:o,newTags:a}},ce=function(e){return Object.keys(e).reduce((function(t,n){var r=void 0!==e[n]?n+'="'+e[n]+'"':""+n;return t?t+" "+r:r}),"")},de=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return Object.keys(e).reduce((function(t,n){return t[O[n]||n]=e[n],t}),t)},fe=function(e,t,n){switch(e){case S.TITLE:return{toComponent:function(){return e=t.title,n=t.titleAttributes,(r={key:e})[V]=!0,o=de(n,r),[l.createElement(S.TITLE,o,e)];var e,n,r,o},toString:function(){return function(e,t,n,r){var o=ce(n),a=ie(t);return o?"<"+e+" "+V+'="true" '+o+">"+W(a,r)+"":"<"+e+" "+V+'="true">'+W(a,r)+""}(e,t.title,t.titleAttributes,n)}};case b:case v:return{toComponent:function(){return de(t)},toString:function(){return ce(t)}};default:return{toComponent:function(){return function(e,t){return t.map((function(t,n){var r,o=((r={key:n})[V]=!0,r);return Object.keys(t).forEach((function(e){var n=O[e]||e;if(n===T||n===k){var r=t.innerHTML||t.cssText;o.dangerouslySetInnerHTML={__html:r}}else o[n]=t[e]})),l.createElement(e,o)}))}(e,t)},toString:function(){return function(e,t,n){return t.reduce((function(t,r){var o=Object.keys(r).filter((function(e){return!(e===T||e===k)})).reduce((function(e,t){var o=void 0===r[t]?t:t+'="'+W(r[t],n)+'"';return e?e+" "+o:o}),""),a=r.innerHTML||r.cssText||"",i=-1===z.indexOf(e);return t+"<"+e+" "+V+'="true" '+o+(i?"/>":">"+a+"")}),"")}(e,t,n)}}}},pe=function(e){var t=e.baseTag,n=e.bodyAttributes,r=e.encode,o=e.htmlAttributes,a=e.linkTags,i=e.metaTags,l=e.noscriptTags,u=e.scriptTags,s=e.styleTags,c=e.title,d=void 0===c?"":c,f=e.titleAttributes;return{base:fe(S.BASE,t,r),bodyAttributes:fe(b,n,r),htmlAttributes:fe(v,o,r),link:fe(S.LINK,a,r),meta:fe(S.META,i,r),noscript:fe(S.NOSCRIPT,l,r),script:fe(S.SCRIPT,u,r),style:fe(S.STYLE,s,r),title:fe(S.TITLE,{title:d,titleAttributes:f},r)}},he=p()((function(e){return{baseTag:G([E,A],e),bodyAttributes:X(b,e),defer:J(e,N),encode:J(e,j),htmlAttributes:X(v,e),linkTags:K(S.LINK,[_,E],e),metaTags:K(S.META,[R,x,C,P,F],e),noscriptTags:K(S.NOSCRIPT,[T],e),onChangeClientState:Y(e),scriptTags:K(S.SCRIPT,[I,T],e),styleTags:K(S.STYLE,[k],e),title:Z(e),titleAttributes:X(w,e)}}),(function(e){oe&&ne(oe),e.defer?oe=te((function(){ae(e,(function(){oe=null}))})):(ae(e),oe=null)}),pe)((function(){return null})),me=(o=he,i=a=function(e){function t(){return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,e.apply(this,arguments))}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,e),t.prototype.shouldComponentUpdate=function(e){return!m()(this.props,e)},t.prototype.mapNestedChildrenToProps=function(e,t){if(!t)return null;switch(e.type){case S.SCRIPT:case S.NOSCRIPT:return{innerHTML:t};case S.STYLE:return{cssText:t}}throw new Error("<"+e.type+" /> elements are self-closing and can not contain children. Refer to our API for more information.")},t.prototype.flattenArrayTypeChildren=function(e){var t,n=e.child,r=e.arrayTypeChildren,o=e.newChildProps,a=e.nestedChildren;return H({},r,((t={})[n.type]=[].concat(r[n.type]||[],[H({},o,this.mapNestedChildrenToProps(n,a))]),t))},t.prototype.mapObjectTypeChildren=function(e){var t,n,r=e.child,o=e.newProps,a=e.newChildProps,i=e.nestedChildren;switch(r.type){case S.TITLE:return H({},o,((t={})[r.type]=i,t.titleAttributes=H({},a),t));case S.BODY:return H({},o,{bodyAttributes:H({},a)});case S.HTML:return H({},o,{htmlAttributes:H({},a)})}return H({},o,((n={})[r.type]=H({},a),n))},t.prototype.mapArrayTypeChildrenToProps=function(e,t){var n=H({},t);return Object.keys(e).forEach((function(t){var r;n=H({},n,((r={})[t]=e[t],r))})),n},t.prototype.warnOnInvalidChildren=function(e,t){return!0},t.prototype.mapChildrenToProps=function(e,t){var n=this,r={};return l.Children.forEach(e,(function(e){if(e&&e.props){var o=e.props,a=o.children,i=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return Object.keys(e).reduce((function(t,n){return t[D[n]||n]=e[n],t}),t)}(U(o,["children"]));switch(n.warnOnInvalidChildren(e,a),e.type){case S.LINK:case S.META:case S.NOSCRIPT:case S.SCRIPT:case S.STYLE:r=n.flattenArrayTypeChildren({child:e,arrayTypeChildren:r,newChildProps:i,nestedChildren:a});break;default:t=n.mapObjectTypeChildren({child:e,newProps:t,newChildProps:i,nestedChildren:a})}}})),t=this.mapArrayTypeChildrenToProps(r,t)},t.prototype.render=function(){var e=this.props,t=e.children,n=U(e,["children"]),r=H({},n);return t&&(r=this.mapChildrenToProps(t,r)),l.createElement(o,r)},q(t,null,[{key:"canUseDOM",set:function(e){o.canUseDOM=e}}]),t}(l.Component),a.propTypes={base:d().object,bodyAttributes:d().object,children:d().oneOfType([d().arrayOf(d().node),d().node]),defaultTitle:d().string,defer:d().bool,encodeSpecialCharacters:d().bool,htmlAttributes:d().object,link:d().arrayOf(d().object),meta:d().arrayOf(d().object),noscript:d().arrayOf(d().object),onChangeClientState:d().func,script:d().arrayOf(d().object),style:d().arrayOf(d().object),title:d().string,titleAttributes:d().object,titleTemplate:d().string},a.defaultProps={defer:!0,encodeSpecialCharacters:!0},a.peek=o.peek,a.rewind=function(){var e=o.rewind();return e||(e=pe({baseTag:[],bodyAttributes:{},encodeSpecialCharacters:!0,htmlAttributes:{},linkTags:[],metaTags:[],noscriptTags:[],scriptTags:[],styleTags:[],title:"",titleAttributes:{}})),e},i);me.renderStatic=me.rewind;var ge=n(9349),ye=n.p+"static/ogimage-7f1a9de5fbc2f01c5683eaa17c5dc524.png";var be=e=>{let{title:t,description:n,url:r,icon:o}=e;const{0:a,1:i}=(0,l.useState)("light");(0,l.useEffect)((()=>{const e=localStorage.getItem("theme");e&&i(e)}),[]);const c="dark"===a?"rgb(211, 211, 211)":"#55534e",d=s.renderToStaticMarkup(l.createElement(u.Z,{iconName:o,style:{color:c}})),f="data:image/svg+xml,"+encodeURIComponent(d);return l.createElement(me,null,l.createElement("meta",{charset:"UTF-8"}),l.createElement("title",null,t),l.createElement("meta",{name:"description",content:n}),l.createElement("meta",{name:"author",content:ge.author}),l.createElement("meta",{property:"og:title",content:t}),l.createElement("meta",{property:"og:description",content:n}),l.createElement("meta",{property:"og:type",content:"website"}),l.createElement("meta",{property:"og:url",content:r}),l.createElement("meta",{property:"og:image",content:ye}),l.createElement("meta",{name:"twitter:card",content:"summary_large_image"}),l.createElement("meta",{name:"twitter:creator",content:ge.author}),l.createElement("meta",{name:"twitter:title",content:t}),l.createElement("meta",{name:"twitter:description",content:n}),l.createElement("meta",{name:"twitter:image",content:ye}),l.createElement("meta",{name:"theme-color",content:"currentColor"}),l.createElement("meta",{name:"apple-mobile-web-app-status-bar-style",content:"transparent"}),l.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1, viewport-fit=cover"}),l.createElement("meta",{name:"mobile-web-app-capable",content:"yes"}),l.createElement("link",{rel:"icon",href:f}))}},7774:function(e,t,n){"use strict";var r=n(7294);function o(e){for(var t="https://reactjs.org/docs/error-decoder.html?invariant="+e,n=1;n]/;function y(e){if("boolean"==typeof e||"number"==typeof e)return""+e;e=""+e;var t=g.exec(e);if(t){var n,r="",o=0;for(n=t.index;n"),C(e,i,n),"string"==typeof n?(e.push(y(n)),null):n}var F=/^[a-zA-Z][a-zA-Z:_\.\-\d]*$/,R=new Map;function P(e){var t=R.get(e);if(void 0===t){if(!F.test(e))throw Error(o(65,e));t="<"+e,R.set(e,t)}return t}function _(e,t,n,i,l){switch(t){case"select":e.push(P("select"));var u=null,c=null;for(h in n)if(a.call(n,h)){var d=n[h];if(null!=d)switch(h){case"children":u=d;break;case"dangerouslySetInnerHTML":c=d;break;case"defaultValue":case"value":break;default:E(e,i,h,d)}}return e.push(">"),C(e,c,u),u;case"option":c=l.selectedValue,e.push(P("option"));var f=d=null,p=null,h=null;for(u in n)if(a.call(n,u)){var m=n[u];if(null!=m)switch(u){case"children":d=m;break;case"selected":p=m;break;case"dangerouslySetInnerHTML":h=m;break;case"value":f=m;default:E(e,i,u,m)}}if(null!=c)if(n=null!==f?""+f:function(e){var t="";return r.Children.forEach(e,(function(e){null!=e&&(t+=e)})),t}(d),w(c)){for(i=0;i"),C(e,h,d),d;case"textarea":for(d in e.push(P("textarea")),h=c=u=null,n)if(a.call(n,d)&&null!=(f=n[d]))switch(d){case"children":h=f;break;case"value":u=f;break;case"defaultValue":c=f;break;case"dangerouslySetInnerHTML":throw Error(o(91));default:E(e,i,d,f)}if(null===u&&null!==c&&(u=c),e.push(">"),null!=h){if(null!=u)throw Error(o(92));if(w(h)&&1"),null;case"menuitem":for(var g in e.push(P("menuitem")),n)if(a.call(n,g)&&null!=(u=n[g]))switch(g){case"children":case"dangerouslySetInnerHTML":throw Error(o(400));default:E(e,i,g,u)}return e.push(">"),null;case"title":for(m in e.push(P("title")),u=null,n)if(a.call(n,m)&&null!=(c=n[m]))switch(m){case"children":u=c;break;case"dangerouslySetInnerHTML":throw Error(o(434));default:E(e,i,m,c)}return e.push(">"),u;case"listing":case"pre":for(f in e.push(P(t)),c=u=null,n)if(a.call(n,f)&&null!=(d=n[f]))switch(f){case"children":u=d;break;case"dangerouslySetInnerHTML":c=d;break;default:E(e,i,f,d)}if(e.push(">"),null!=c){if(null!=u)throw Error(o(60));if("object"!=typeof c||!("__html"in c))throw Error(o(61));null!=(n=c.__html)&&("string"==typeof n&&0>=i,o-=i,{id:1<<32-pe(t)+o|n<>>=0)?32:31-(he(e)/me|0)|0},he=Math.log,me=Math.LN2;var ge="function"==typeof Object.is?Object.is:function(e,t){return e===t&&(0!==e||1/e==1/t)||e!=e&&t!=t},ye=null,be=null,ve=null,we=null,Se=!1,xe=!1,ke=0,Ee=null,Ce=0;function Te(){if(null===ye)throw Error(o(321));return ye}function Fe(){if(0")}a.lastPushedText=!1}}function Xe(e,t,n){if(t.node=n,"object"==typeof n&&null!==n){switch(n.$$typeof){case j:return void Ye(e,t,n.type,n.props,n.ref);case L:throw Error(o(257));case Z:var r=n._init;return void Xe(e,t,n=r(n._payload))}if(w(n))return void Ge(e,t,n);if(null===n||"object"!=typeof n?r=null:r="function"==typeof(r=J&&n[J]||n["@@iterator"])?r:null,r&&(r=r.call(n))){if(!(n=r.next()).done){var a=[];do{a.push(n.value),n=r.next()}while(!n.done);Ge(e,t,a)}return}throw e=Object.prototype.toString.call(n),Error(o(31,"[object Object]"===e?"object with keys {"+Object.keys(n).join(", ")+"}":e))}"string"==typeof n?(r=t.blockedSegment).lastPushedText=M(t.blockedSegment.chunks,n,e.responseState,r.lastPushedText):"number"==typeof n&&((r=t.blockedSegment).lastPushedText=M(t.blockedSegment.chunks,""+n,e.responseState,r.lastPushedText))}function Ge(e,t,n){for(var r=n.length,o=0;o');case 1:n.status=2;var a=!0;r=n.chunks;var i=0;n=n.children;for(var l=0;l")),rt(e,t,n),e=!!e.responseState.generateStaticMarkup||t.push("\x3c!--/$--\x3e");if(0e.progressiveChunkSize)return r.rootSegmentID=e.nextSegmentId++,e.completedBoundaries.push(r),I(t,e.responseState,r.id),rt(e,t,n),t.push("\x3c!--/$--\x3e");if(e.responseState.generateStaticMarkup||t.push("\x3c!--$--\x3e"),1!==(n=r.completedSegments).length)throw Error(o(391));return ot(e,t,n[0]),e=!!e.responseState.generateStaticMarkup||t.push("\x3c!--/$--\x3e")}function at(e,t,n){return function(e,t,n,r){switch(n.insertionMode){case 0:case 1:return e.push('
Loading (StaticQuery)
}\n 2023 부스트캠프 Web-Mobile 8기 지원 후기
Table of Contents
작년 하반기에 진행되었던 우테코 프리코스를 끝까지 완주하지 못했다는 아쉬움과 더불어 아직 많이 부족하다고 생각되는 개발 능력과 CS 지식 향상을 위해 올해 네이버 부스트캠프 8기에 지원하게 되었습니다.
+주변에서 SAFFY, 우테코, 소마 와 같이 정말 많이 들어왔던 코딩 캠프이기도 하고, 새로운 도전을 해보고자 지원을 결심하였습니다. 이번 글은 지원 과정에서 7기 지원 후기를 보며 많은 도움을 받았기에 동일한 목적으로 기록을 남기고자 하는 것이 목적입니다. 혹여나 글 내용이 문제가 있는 경우, 수정 혹은 삭제를 진행할 예정입니다.
부스트캠프 8기 모집 안내
+모집 안내
+-
+
-
+
인원 : 약 300명 내외
+
+ -
+
분야 : 웹 풀스택(JavaScript), 모바일 iOS(Swift), 모바일 Android(Kotlin)
+
+
지원 자격
+-
+
-
+
2023년 하반기에 풀타임(월 - 금, 10:00 - 19:00)으로 참여하실 수 있는 분
+
+ -
+
분야에 관계없이 개발 경력 2년 미만인 분
+
+ -
+
만 19세 이상 성인
+
+
모집 일정
+++자세한 내용은 네이버 부스트캠프 공식 네이버 블로그를 확인해보세요.
+
-
+
-
+
서류 접수 : 2023년 5월 2일 ~ 2023년 6월 12일 오전 11시
+
+ -
+
서류 전형 결과 안내 : 2023년 6월 14일(수) 오후 12시 30분 경
+
+ -
+
1차 코딩 테스트 응시료 납부 마감일 : 2023년 6월 15일(목) 자정
+
+ -
+
1차 코딩 테스트 안내 : 2023년 6월 16일(금) 오후 5시 경
+
+ -
+
1차 코딩 테스트 진행 : 2023년 6월 19일(월) 오후 7시 ~ 9시
+
+ -
+
1차 코딩 테스트 결과 : 2023년 6월 21일(수) 오후 5시 경
+
+ -
+
2차 코딩 테스트 진행 : 2023년 6월 24일(토) 오후 2시 ~ 4시 30분
+
+ -
+
챌린지 합격자 발표 : 2023년 7월 5일 예정 > 7월 4일 오후 8시 경에 발표
+
+
지원 과정
+멋쟁이사자처럼 10기 동아리 활동을 부원으로 참여하고, 현재 인하대학교 멋쟁이사자처럼 11기 대표를 담당하고 있지만, 개발자가 되기 위해 필요한 CS 지식과 더불어 기초가 부족하다고 생각하고 있었습니다. 간단하고 토이 프로젝트 수준인 개인 프로젝트도 진행하였지만, 새로운 라이브러리나 프레임워크를 사용하여 개발하여 새로운 지식을 습득하는 과정이 아닌, 기존에 학습했던 내용을 활용하는 수준이기도 했습니다.
+따라서 좀 더 새로운 도전을 하고자 네이버 부스트캠프에 지원하게 되었습니다. 무엇보다 부스트캠프는 지속 가능한 개발자가 되기 위한 출발점 능력과 잠재력을 쌓아가는 곳이라는 점이 매력적으로 다가왔습니다. 1회성으로 끝나는 활동이 아닌, 해당 활동을 바탕으로 5년, 10년 후에도 꾸준히 성장중인 개발자, 혼자 성장하는 것이 아닌 같이 성장하는 개발자를 목표로 함께 노력하고 싶어 지원하였습니다.
+서류 지원
+총 4개의 질문으로 이루어진 서류를 작성하였습니다.
+각 문항은 400자 내외로 정해져있으며, 질문들은 주로 얼마나 자기주도적으로 노력했는가가 주된 내용입니다. 저는 멋쟁이사자처럼 10기 동아리 활동 과정에서의 경험과 더불어 진행했던 프로젝트에 대한 경험을 녹여 작성하였습니다. 나름의 팁이라면 네이버 부스트캠프에서의 인재상을 참고하여 작성하는 것입니다.
+이와 관련해서는 꼭 온라인 설명회와 수료생 MEET UP에 참여하는 것을 추천드립니다. 네이버 부스트캠프를 경험한 캠퍼 선배님들의 조언과 더불어 네이버 부스트캠프와 관련된 보다 다양한 경험들을 들을 수 있었습니다.
+
+
+
+
링크와 파일을 제출할 수 있었는데, 이제까지 진행하고 참여했던 프로젝트와 활동과 관련된 링크와 내용들을 정리한 notion 링크를 첨부하였습니다.
+
+
+
+
이번에는 서류 지원 단계에서도 심사가 있었습니다. 다행히 합격하여 1차 코딩테스트를 준비하였습니다.
+1차 코딩 테스트
+1차 코딩 테스트는 CS 문제와 코딩 테스트 2가지로 이루어져 있습니다. 문제 비중은 아래와 같습니다. CS 문제가 총 10문제, 코딩 테스트가 2문제로 총 12문제로 이루어져 있습니다.
+CS 문제는 생각보다 까다롭다고 느껴졌습니다. 모르는 개념도 있었고, 검색을 해도 쉽게 답을 알아낼 수 없던 문제들도 있었습니다. 시험 종료 버튼을 누르는 그 순간까지도 고민을 하게 만들었던...
+코딩 테스트 문제는 난이도가 어렵기보다는 얼마나 주어진 조건에 맞추어 구현을 잘 하는가를 판단하기 위한 문제라고 느껴졌습니다. 두 문제 전부 테스트 케이스는 통과했으나, 모든 조건을 만족했는지는 의심이 되는 상태로 시간이 부족해 제출하게 되었습니다.
+모든 경우를 확인해보지 못해 확실한 2솔이라 할 수 없는 상황이기도 하고, CS 문제들도 고민만 하다 제출했던 느낌이 강해 2차 코딩 테스트를 볼 수 있을까 생각도 들었지만 감사하게도 1차 코딩 테스트 합격 메일을 받았습니다.
+
+
+
+
++이번 8기 지원 과정에서는 코딩 테스트 유형 예시를 공개하였습니다.
++
+- 코딩 테스트 유형 예시를 참고하시어 미리 코딩 테스트 유형을 확인해보시는 것도 많은 도움이 되리라 생각합니다.
+- 또한 CS 문제 대비를 위해 부스트코스 CS50 강의를 수강하였습니다. 부족한 CS 지식을 보충할 수 있는 강의라고 생각합니다.
+
2차 코딩 테스트
+1차 코딩 테스트와 비슷한 방식으로 2차 코딩 테스트가 진행되었습니다. 2차 코딩 테스트는 총 6문제로 이루어져 있으며, 그 중에 코딩 테스트 문제는 3문제로 이루어져 있습니다.
+수료생 MEET UP 행사에서도 상대적으로 2차 코딩 테스트의 구현 난이도와 조건이 더 복잡하고 어렵다는 이야기에 걱정이 많았습니다. 대부분 프로그래머스 lv 2 정도의 난이도로 느껴지는 문제들이지만, 역시 시간이 오래 걸리는 문제였습니다.
+이전보다 주어진 조건도 많았고, 예외 처리와 관련된 조건도 많았습니다. 1번 문제에서 최대한 코드와 주석을 깔끔하게 작성하고 틀리지 않도록 확인하기 위해 시간을 많이 사용했고, 2번 문제에서 대부분의 시간을 사용해서 3번은 문제도 읽지 못하고 테스트를 종료하였습니다.
+조금이라도 점수를 받을 수 있지 않을까 하는 마음에 3번 문제에서는 하나의 조건이라도 만족할 수 있도록 급하게 코드를 작성하였습니다. 1번과 2번의 테스트 케이스는 통과하였지만.. 특히나 2번은 코드를 작성하고 살펴보면서 틀린 부분을 정말 많이 수정했기 때문에, 완벽한 답안이라고 할 수 없었습니다.
+결국 애매한 1.5솔의 느낌으로 테스트를 종료하였습니다.
+++나름의 팁이라면 꼼꼼하게 문제를 읽고 조건을 잘 정리하시는 것을 추천드립니다. 조건과 예외 처리가 많았기 때문에 이를 잘 정리하여 이해하고 코드로 작성하는 것이 중요할 것이라 생각합니다.
+
대망의 결과...
+
+
+
+
붙었으면 좋겠다.... 근데 떨어지면 어쩔 수 없지... 라고 생각하며 탈락하면 할 일들을 생각하고 있던 중에 감사하게도 합격 메일을 받아볼 수 있었습니다.
+앞으로 4주간의 챌린지 기간을 통해 많은 성장을 이루어낼 수 있었으면 좋겠습니다.
+그리고 받은 온보딩 키트
+
+
+
+
이전 기수에게는 과자 타워를, 7기에서는 슬리퍼를 온보딩 키트로 받았다는 후기들을 살펴보고 이번 온보딩 키트에는 어떤 굿즈들이 들어있을까 기대가 많았습니다. 이번에는 정말 실용적인 굿즈들로 가득한 온보딩 키트가 배송되었습니다.
+무엇보다 최근 우산이 망가져서 2단 우산을 대충 들고다니던 참인데... 정말 필요한 3단 우산... 정말 만족스러운 온보딩 키트였습니다.
');case 2:return e.push('