{"version":3,"sources":["webpack://ezlunch/./src/components/ScaleToWindowWidth.tsx","webpack://ezlunch/./src/util/size.ts","webpack://ezlunch/./src/components/SpeechBubble.tsx","webpack://ezlunch/./src/components/SpeechBubble.module.scss","webpack://ezlunch/./src/pages/404.tsx","webpack://ezlunch/./src/pages/404.module.scss","webpack://ezlunch/./src/images/speech_bubble.svg"],"names":["ScaleToWindowWidth","props","dummyRef","useRef","serverSideRenderable","children","ScaleToWindowWidthImpl","useState","scale","lastUpdate","consecutiveUpdateCount","state","setState","ref","useLayoutEffect","el","current","doScale","unscaledWidth","getBoundingClientRect","width","newScale","window","innerWidth","timeSinceLastUpdate","Date","getTime","Infinity","localStorage","getItem","console","log","addEventListener","removeEventListener","scaleSize","baseSize","targetSize","largestScaleFactor","Math","max","height","BASE_BUBBLE_SIZE","SpeechBubble","ClientOnlyRenderable","className","style","size","SpeechBubbleContent","listenForUpdates","undefined","contentWidth","contentHeight","contentRef","updateBoundingRect","rect","scrollHeight","scrollWidth","actualSize","sizes","length","Error","areas","map","bestIndexSoFar","bestAreaSoFar","i","maxSize","mergeClassNames","PAGE_NOT_FOUND_METADATA","metaTitle","metaDescription","shareImage","context","currentLocale","currentSlug","pageSeo","styles","transform","transformOrigin","S","src","alt","quality","Section404","content","bubbleContent","highlight","body","image","React","createElement","defaultProps","module","exports","default"],"mappings":"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","file":"component---src-pages-404-tsx-324a46508d813abf767a.js","sourcesContent":["import React, { MutableRefObject, useLayoutEffect, useRef, useState } from \"react\"\r\nimport { ClientOnlyRenderable } from \"./ClientOnlyRenderable\"\r\n\r\ninterface ScaleToWindowWidthProps {\r\n  children: (\r\n    ref: MutableRefObject<HTMLDivElement | null>,\r\n    scaleX: number\r\n  ) => React.ReactNode\r\n}\r\nexport const ScaleToWindowWidth: React.FC<ScaleToWindowWidthProps> = (props) => {\r\n  const dummyRef = useRef<HTMLDivElement | null>(null)\r\n\r\n  return (\r\n    <ClientOnlyRenderable serverSideRenderable={props.children(dummyRef, 1)}>\r\n      <ScaleToWindowWidthImpl {...props}/>\r\n    </ClientOnlyRenderable>\r\n  )\r\n}\r\n\r\ninterface ScaleToWindowWidthImplState {\r\n  scale: number\r\n  lastUpdate: Date | null,\r\n  consecutiveUpdateCount: number\r\n}\r\nconst ScaleToWindowWidthImpl: React.FC<ScaleToWindowWidthProps> = ({children}) => {\r\n  const [state, setState] = useState<ScaleToWindowWidthImplState>({\r\n    scale: 1,\r\n    lastUpdate: null,\r\n    consecutiveUpdateCount: 0\r\n  })\r\n\r\n  const ref = useRef<HTMLDivElement | null>(null)\r\n\r\n  useLayoutEffect(() => {\r\n    const el = ref.current\r\n    if (el !== null) {\r\n      const doScale = () => {\r\n        const scale = state.scale\r\n\r\n        const bounds = el.getBoundingClientRect()\r\n        const unscaledWidth = bounds.width / scale\r\n\r\n        const newScale = (unscaledWidth >= window.innerWidth) ? window.innerWidth / unscaledWidth : 1\r\n\r\n        const timeSinceLastUpdate = (state.lastUpdate !== null) ? new Date().getTime() - state.lastUpdate!.getTime() : Infinity\r\n        if (newScale !== scale && (state.consecutiveUpdateCount < 20 || timeSinceLastUpdate > 1200)) {\r\n          setState({\r\n            scale: newScale,\r\n            lastUpdate: new Date(),\r\n            consecutiveUpdateCount: (timeSinceLastUpdate > 1200) ? 1 : state.consecutiveUpdateCount + 1\r\n          })\r\n\r\n          if (localStorage.getItem(\"__kindo_flag_log_ScaleToWindowWidth_updates\") === \"true\") {\r\n            console.log(`Scale: ${scale}. New Scale: ${newScale}`)\r\n          }\r\n        } else {\r\n          if (localStorage.getItem(\"__kindo_flag_log_ScaleToWindowWidth_updates\") === \"true\") {\r\n            console.log(`Filtered potentially unbounded resizing loop. TimeSinceLastUpdate: ${timeSinceLastUpdate}. ConsecutiveUpdateCount: ${state.consecutiveUpdateCount}.`)\r\n          }\r\n        }\r\n      }\r\n\r\n      el.addEventListener('resize', doScale)\r\n      window.addEventListener(\"resize\", doScale)\r\n      doScale()\r\n\r\n      return () => {\r\n        el.removeEventListener(\"resize\", doScale)\r\n        window.removeEventListener(\"resize\", doScale)\r\n      }\r\n    }\r\n  }, [ref.current, state])\r\n\r\n  return (\r\n    <>\r\n      {children(ref, state.scale)}\r\n    </>\r\n  )\r\n}","export interface Size {\r\n  width: number,\r\n  height: number\r\n}\r\n\r\nexport const scaleSize = (baseSize: Size, targetSize: Size): Size => {\r\n  const largestScaleFactor = Math.max(\r\n    targetSize.width / baseSize.width,\r\n    targetSize.height / baseSize.height\r\n  )\r\n\r\n  return {\r\n    width: largestScaleFactor * baseSize.width,\r\n    height: largestScaleFactor * baseSize.height\r\n  }\r\n}\r\n\r\nexport const maxSize = (...sizes: Size[]): Size => {\r\n  if (sizes.length === 0) {\r\n    throw new Error(\"At least one size must be provided.\")\r\n  }\r\n\r\n  const areas = sizes.map((size) => size.width * size.height)\r\n  let bestIndexSoFar = 0\r\n  let bestAreaSoFar: number = areas[0]\r\n\r\n  for (let i=1; i< areas.length; i++) {\r\n    if (areas[i] > bestAreaSoFar) {\r\n      bestAreaSoFar = areas[i]\r\n      bestIndexSoFar = i\r\n    }\r\n  }\r\n\r\n  return sizes[bestIndexSoFar]\r\n}","import React, { useLayoutEffect, useRef, useState } from \"react\"\r\nimport SpeechBubbleIcon from \"../images/speech_bubble.svg\"\r\nimport { ClientOnlyRenderable } from \"./ClientOnlyRenderable\"\r\nimport * as styles from \"./SpeechBubble.module.scss\"\r\nimport { maxSize, scaleSize, Size } from \"../util/size\"\r\nimport { mergeClassNames } from \"../util/util\"\r\n\r\nconst BASE_BUBBLE_SIZE: Size = {\r\n  width: 571,\r\n  height: 396\r\n}\r\n\r\ninterface SpeechBubbleProps {\r\n  className?: string,\r\n  style?: React.CSSProperties,\r\n  size?: Size,\r\n  listenForUpdates?: boolean\r\n}\r\ninterface SpeechBubbleState {\r\n  contentWidth: number,\r\n  contentHeight: number\r\n}\r\nexport const SpeechBubble: React.FC<SpeechBubbleProps> = (props) => {\r\n  return (\r\n    <ClientOnlyRenderable serverSideRenderable={(\r\n      <div className={props.className} style={{\r\n        ...(props.size ?? {}),\r\n        ...props.style\r\n      }}>\r\n        {props.children}\r\n      </div>\r\n    )}>\r\n      <SpeechBubbleContent {...props}/>\r\n    </ClientOnlyRenderable>\r\n  )\r\n}\r\n\r\nconst SpeechBubbleContent: React.FC<SpeechBubbleProps> = ({children, className, style, size, listenForUpdates = true}) => {\r\n  const [state, setState] = useState<SpeechBubbleState | null>((size !== undefined) ? {\r\n    contentWidth: scaleSize(BASE_BUBBLE_SIZE, size).width,\r\n    contentHeight: scaleSize(BASE_BUBBLE_SIZE, size).height\r\n  } : null)\r\n\r\n  const contentRef = useRef<HTMLDivElement | null>(null)\r\n\r\n  useLayoutEffect(() => {\r\n    if (size !== undefined) {\r\n      return\r\n    }\r\n\r\n    const el = contentRef.current\r\n    if (el !== null) {\r\n      const updateBoundingRect = () => {\r\n        const rect = el.getBoundingClientRect()\r\n        let width = rect.width\r\n        let height = rect.height\r\n\r\n        if (el.scrollHeight > height ) {\r\n          height = el.scrollHeight\r\n        }\r\n        if (el.scrollWidth > width) {\r\n          width = el.scrollWidth\r\n        }\r\n\r\n        setState({\r\n          ...state,\r\n          contentWidth: width,\r\n          contentHeight: height\r\n        })\r\n      }\r\n\r\n\r\n      if (listenForUpdates) {\r\n        el.addEventListener('resize', () => {\r\n          updateBoundingRect()\r\n        })\r\n      }\r\n      updateBoundingRect()\r\n    }\r\n  }, [contentRef.current, size, listenForUpdates])\r\n\r\n  const actualSize: Size | undefined = (state !== null) ? maxSize(\r\n    scaleSize(\r\n      BASE_BUBBLE_SIZE,\r\n      {\r\n        width: state.contentWidth,\r\n        height: state.contentHeight\r\n      }\r\n    ),\r\n    {\r\n      width: 100,\r\n      height: 72\r\n    }\r\n  ) : undefined\r\n\r\n  return (\r\n    <div className={mergeClassNames(styles.SpeechBubble, className)} style={{\r\n      ...actualSize,\r\n      ...(style ?? {})\r\n    }}>\r\n      <span ref={contentRef} className={styles.content}>{children}</span>\r\n      <SpeechBubbleIcon\r\n        className={styles.bubble}\r\n        style={{\r\n          width: (actualSize?.width ?? 0) + 40,\r\n          height: (actualSize?.height ?? 0) + 20\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n","// extracted by mini-css-extract-plugin\nexport var SpeechBubble = \"SpeechBubble-module--SpeechBubble--2vUML\";\nexport var content = \"SpeechBubble-module--content--37Bdd\";\nexport var bubble = \"SpeechBubble-module--bubble--H9vvF\";","import React from \"react\"\r\nimport Layout from \"../components/layout/Layout\"\r\nimport { IMetadata } from \"../model/IMetadata\"\r\nimport Section from \"../components/section/Section\"\r\nimport * as styles from \"./404.module.scss\"\r\nimport { StaticImage } from \"gatsby-plugin-image\"\r\nimport { SpeechBubble } from \"../components/SpeechBubble\"\r\nimport { AppContextProvider } from \"../components/AppContext\"\r\nimport { ScaleToWindowWidth } from \"../components/ScaleToWindowWidth\"\r\n\r\nconst PAGE_NOT_FOUND_METADATA: IMetadata = {\r\n  metaTitle: 'Page Not Found',\r\n  metaDescription: `Oops! Sorry, we really can't find that page.`,\r\n  shareImage: null\r\n}\r\n\r\nconst PageNotFoundPage: React.FC = () => {\r\n  return (\r\n    <AppContextProvider context={{\r\n      currentLocale: \"en\",\r\n      currentSlug: \"404\"\r\n    }}>\r\n      <Layout pageSeo={PAGE_NOT_FOUND_METADATA}>\r\n        <Section className={styles.Section404}>\r\n          <ScaleToWindowWidth>\r\n            {(ref, scale) => (\r\n              <div ref={ref} className={styles.content}\r\n                 style={{\r\n                   transform: `scale(${scale}, ${scale})`,\r\n                   transformOrigin: 'top'\r\n                 }}\r\n              >\r\n                <div>\r\n                  <SpeechBubble\r\n                    size={{\r\n                      width: 430,\r\n                      height: 180\r\n                    }}\r\n                    listenForUpdates={false}\r\n                  >\r\n                    <span className={styles.bubbleContent}>\r\n                      <span className={styles.highlight}>oops!</span><br/>\r\n                      <span className={styles.body}>\r\n                        {\"Sorry, we really\"}<br/>{\"can't find that page\"}\r\n                      </span>\r\n                    </span>\r\n                  </SpeechBubble>\r\n                </div>\r\n                <StaticImage\r\n                  className={styles.image}\r\n                  src='../images/404_image.png'\r\n                  alt=''\r\n                  width={465}\r\n                  quality={100}\r\n                />\r\n              </div>\r\n            )}\r\n          </ScaleToWindowWidth>\r\n        </Section>\r\n      </Layout>\r\n    </AppContextProvider>\r\n  )\r\n}\r\n\r\nexport default PageNotFoundPage","// extracted by mini-css-extract-plugin\nexport var Section404 = \"_404-module--Section404--1_m1G\";\nexport var content = \"_404-module--content--1SFxU\";\nexport var bubbleContent = \"_404-module--bubbleContent--3MzPQ\";\nexport var highlight = \"_404-module--highlight--2EPvi\";\nexport var body = \"_404-module--body--1X7Ng\";\nexport var image = \"_404-module--image--2rtQQ\";","var React = require('react');\n\nfunction SpeechBubble (props) {\n    return React.createElement(\"svg\",props,React.createElement(\"g\",null,[React.createElement(\"path\",{\"style\":{\"fill\":\"#D5DC74\"},\"d\":\"M404.1,428c0,0-23.6-58.3-136.5-49.2c-225.4,18-294.2-89.6-257-213.3C54.9,18.1,357.8-36.8,522.3,73.3\\r\\n\\t\\tc87.6,58.6,100,183.9,27.3,257.9c-23.5,23.9-55.2,41.5-74.2,53.6C451.2,400.3,404.1,428,404.1,428z\",\"key\":0}),React.createElement(\"path\",{\"style\":{\"fill\":\"#FFFFFF\"},\"d\":\"M404.1,413.8c0,0-23.6-58.3-136.5-49.2C42.1,382.7-26.7,275,10.6,151.3C54.9,4,357.8-51,522.3,59.2\\r\\n\\t\\tc87.6,58.6,100,183.9,27.3,257.9c-23.5,23.9-55.2,41.5-74.2,53.6C451.2,386.1,404.1,413.8,404.1,413.8z\",\"key\":1})]));\n}\n\nSpeechBubble.defaultProps = {\"version\":\"1.1\",\"x\":\"0px\",\"y\":\"0px\",\"viewBox\":\"0 0 598 429\",\"style\":{\"enableBackground\":\"new 0 0 598 429\"},\"xmlSpace\":\"preserve\"};\n\nmodule.exports = SpeechBubble;\n\nSpeechBubble.default = SpeechBubble;\n"],"sourceRoot":""}