{"version":3,"file":"static/js/8721.acb46423.chunk.js","mappings":"6RAwEA,GAtEeA,E,SAAAA,IAAW,SAAAC,GAAK,cAAK,CACnCC,SAAU,CACTC,OAAQ,SACRC,SAAU,KACVC,QAASJ,EAAMK,QAAQ,GAAI,GAC3BC,MAAO,QAERC,SAAU,CACTC,MAAOR,EAAMS,QAAQC,UAAUC,KAC/BC,aAAcZ,EAAMK,QAAQ,GAC5BQ,SAAU,WACVC,cAAed,EAAMK,QAAQ,GAC7BU,UAAW,SACXC,OAAQ,EACR,UAAW,CACVC,WAAY,+BACZC,eAAgB,UAChBC,iBAAkB,YAClBC,OAAQ,EACRC,QAAS,KACTC,OAAQ,GACRC,KAAM,MACNV,SAAU,WACVW,UAAW,qBACXlB,MAAO,MAGTmB,SAAO,GACNC,WAAY,SACZC,QAAS,OACTC,QAAS,EACTC,oBAAqB,iBACrBC,iBAAkB,OAClBC,SAAU,WAAQ,SACjB/B,EAAMgC,YAAYC,GAAG,MAAQ,CAC7BJ,oBAAqB,oBACrB,SACA7B,EAAMgC,YAAYC,GAAG,MAAQ,CAC7BJ,oBAAqB,mBACrB,GAEFK,KAAM,CACLR,WAAY,SACZT,WAAY,UACZU,QAAS,OACTL,OAAQ,OACRa,eAAgB,SAChBJ,SAAU,SACVK,YAAa,QACbhC,QAASJ,EAAMK,QAAQ,KACvBC,MAAO,OACP,SAAO,GACNqB,QAAS,QACTL,OAAQ,OACRe,UAAW,IACXlC,SAAU,IACVmC,UAAW,UACXhC,MAAO,SAAM,SACZN,EAAMgC,YAAYC,GAAG,MAAQ,CAC7BI,UAAW,IACXlC,SAAU,OACV,SACAH,EAAMgC,YAAYC,GAAG,MAAQ,CAC7BI,UAAW,IACXlC,SAAU,MACV,IAGH,I,WCzDKoC,GAAWC,EAAAA,EAAAA,UAAS,kBAAM,+BAAoB,IAC9CC,GAAYD,EAAAA,EAAAA,UAAS,kBAAM,+BAA8C,IACzEE,GAAaF,EAAAA,EAAAA,UAAS,kBAAM,+BAAwD,IAmG1F,EAjGc,SAAH,GAAkB,IAAZG,EAAI,EAAJA,KAMRC,GAJSC,EAAAA,EAAAA,GAAS,GAAD,OADEC,GAET,kGACjB,IAEOF,MACFG,EAAMC,IACNC,GAAIC,EAAAA,EAAAA,SAAU,CACnBP,KAAMA,EACNQ,IAAK,CACJC,GAAIC,EACJC,GAAIC,KAGN,GAAsBC,EAAAA,EAAAA,IAAU,CAC/BC,MAAO,GACPC,aAAa,IACZ,eAHKC,EAAG,KAAEC,EAAM,KAcZC,EAAiB,CACtBC,QAAS,CACRC,QAAS,EACTC,GAAI,IAELC,QAAS,CACRF,QAAS,EACTG,WAAY,CACXC,UAAW,IACXC,KAAM,UAEPJ,EAAG,IAIL,OACC,iBAAKK,WAAWC,EAAAA,EAAAA,SAAKvB,EAAI9C,SAAU,0BAA2B0D,IAAKA,EAAI,WACtE,SAACjB,EAAU,CAAC2B,UAAWtB,EAAIxC,SAAUgE,SAAU,CAAEC,GAAI,kBAAmB,SACtEvB,EAAE,yBAEJ,SAACwB,EAAA,MAAU,CACVJ,UAAWtB,EAAItB,QACfwC,QAASL,GAAU,UACnBE,QAAS,UACTS,SAjCyB,CAC3BN,QAAS,CACRC,WAAY,CACXQ,cAAe,EACfC,gBAAiB,MA6Ba,SAExB,OAAL/B,QAAK,IAALA,OAAK,EAALA,EAAOgC,KAAI,SAAAC,GAAS,IAAD,EACXC,EAAgDD,EAAhDC,OAAQC,EAAwCF,EAAxCE,GAAG,EAAqCF,EAApCG,MAAK,aAAwB,CAAC,EAAC,EAAtBC,EAAQ,EAARA,SAAUC,EAAK,EAALA,MAEjCC,GACC,OAANL,QAAM,IAANA,GAME,QANI,EAANA,EAAQM,MAAK,SAAAC,GACZ,MAAa,OAAT1C,EACoB,kBAAhB0C,EAAMH,MAEU,mBAAhBG,EAAMH,KAEf,WAAE,WANI,EAAN,EAMII,QAAS,GAEd,OAAIH,GAEF,SAACV,EAAA,MAAU,CACVJ,WAAWC,EAAAA,EAAAA,SAAKvB,EAAIb,KAAM,gCAE1BqC,SAAUV,EAAe,UAEzB,SAACpB,EAAS,CAAC8C,GAAIJ,EAAiBK,OAAO,SAASC,IAAI,aAAY,UAC/D,gBAAKC,IA1Ec5C,GA0EQmC,EAAUU,IAAKT,EAAOU,QAAQ,YAJrDb,IAWP,SAACN,EAAA,MAAU,CACVJ,WAAWC,EAAAA,EAAAA,SAAKvB,EAAIb,KAAM,gCAE1BqC,SAAUV,EAAe,UAEzB,gBAAK6B,IAtFgB5C,GAsFMmC,EAAUU,IAAKT,EAAOU,QAAQ,UAHpDb,EAMR,OAED,SAACxC,EAAQ,CAACI,KAAMA,MAGnB,C,+UC9GA,IAAMkD,EAAc,IAAIC,IASlBC,EAA+C,IAAIC,QACrDC,EAAS,EAETC,OAAwCC,EA6BtC,SAAUC,EAAYC,GACnBC,OAAAA,OAAOC,KAAKF,GAChBG,OACAC,QAAQC,SAAAA,GAAD,YAA0BP,IAAjBE,EAAQK,EAFpB,IAGJ9B,KAAK8B,SAAAA,GACJ,MAAO,GAAP,OAAUA,EACR,YAAQ,SAARA,GAnBWC,EAmBgBN,EAAQM,OAjBrCZ,EAAQa,IAAID,KAChBV,GAAU,EACVF,EAAQc,IAAIF,EAAMV,EAAOa,aAFKf,EAAQgB,IAAIJ,IADxB,IAkB+BN,EAAQK,IAnB3D,IAAmBC,CAqBd,IACAG,UACJ,CA2De,SAAAE,EACdC,EACAC,GAEiC,IADjCb,EAAAA,UAAAA,OAAAA,QAAAA,IAAAA,UAAAA,GAAAA,UAAAA,GAAoC,CAAC,EACrCc,EAAiB,UAAH,6CAAGjB,EAGf,GAAuC,qBAAhCkB,OAAOC,2BACKlB,IAAnBgB,EACA,CACA,IAAMG,EAASL,EAAQM,wBAWvB,OAVAL,EAASC,EAAgB,CACvBK,eAAgBL,EAChB3B,OAAQyB,EACRQ,kBAC+B,kBAAtBpB,EAAQqB,UAAyBrB,EAAQqB,UAAY,EAC9DC,KAAM,EACNC,mBAAoBN,EACpBO,iBAAkBP,EAClBQ,WAAYR,IAEP,WAAK,CAGb,CAEK,MAnFR,SAAwBjB,GAEtB,IAAItB,EAAKqB,EAAYC,GACjB0B,EAAWlC,EAAYkB,IAAIhC,GAE3B,IAACgD,EAAU,CAEb,IACIC,EADEC,EAAW,IAAInC,IAGfoC,EAAW,IAAIb,sBAAsBc,SAAAA,GACzCA,EAAQC,SAASC,SAAAA,GAAS,MAGlBzE,EACJyE,EAAMb,gBACNQ,EAAWM,MAAMZ,SAAAA,GAAD,OAAeW,EAAMZ,mBAAqBC,CAA1D,IAGErB,EAAQkC,iBAA8C,qBAApBF,EAAMG,YAG1CH,EAAMG,UAAY5E,GAGQwE,OAA5BH,EAAAA,EAASlB,IAAIsB,EAAM7C,UAAS4C,EAAAA,SAASlB,SAAAA,GACnCA,EAAStD,EAAQyE,EAClB,GACF,GACF,GAAEhC,GAGH2B,EACEE,EAASF,aACRS,MAAMC,QAAQrC,EAAQqB,WACnBrB,EAAQqB,UACR,CAACrB,EAAQqB,WAAa,IAE5BK,EAAW,CACThD,GAAAA,EACAmD,SAAAA,EACAD,SAAAA,GAGFpC,EAAYgB,IAAI9B,EAAIgD,EACrB,CAED,OAAOA,CACR,CAmCoCY,CAAetC,GAA1CtB,EAAF,EAAEA,GAAImD,EAAN,EAAMA,SAAUD,EAAAA,EAAAA,SAGlBW,EAAYX,EAASlB,IAAIE,IAAY,GAQlC,OAPFgB,EAASrB,IAAIK,IAChBgB,EAASpB,IAAII,EAAS2B,GAGxBA,EAAUC,KAAK3B,GACfgB,EAASlB,QAAQC,GAEV,WAEL2B,EAAUE,OAAOF,EAAUG,QAAQ7B,GAAW,GAErB,IAArB0B,EAAUI,SAEZf,EAASgB,OAAOhC,GAChBiB,EAASgB,UAAUjC,IAGC,IAAlBgB,EAASkB,OAEXjB,EAASkB,aACTvD,EAAYoD,OAAOlE,GAEtB,CACF,C,mJC5JD,SAASsE,EACPC,GAEA,MAAiC,oBAAnBA,EAAMC,QACrB,CAmD2BC,EAAAA,UC7BtB,SAAUhG,IAWW,+DAAF,CAAC,EAVxBkE,EADwB,EACxBA,UACAjE,EAFwB,EAExBA,MACA8E,EAHwB,EAGxBA,gBACAkB,EAJwB,EAIxBA,WACA9C,EALwB,EAKxBA,KACAjD,EANwB,EAMxBA,YACAgG,EAPwB,EAOxBA,KACAC,EARwB,EAQxBA,cACAxC,EATwB,EASxBA,eACAyC,EAAAA,EAAAA,SAEM,EAAgBJ,EAAAA,SAA+B,MAArD,eAAO7F,EAAD,KAAMkG,EAAN,KACA3C,EAAWsC,EAAAA,SACX,EAAoBA,EAAAA,SAAsB,CAC9C5F,SAAU+F,EACVtB,WAAOlC,IAFT,eAAO2D,EAAD,KAAQC,EAAR,KAON7C,EAAS8C,QAAUJ,EAEnBJ,EAAAA,WACE,WAIE,IAAIN,EAFJ,IAAIQ,GAAS/F,EA8Bb,OA3BAuF,EAAYlC,EACVrD,GACA,SAACC,EAAQyE,GACP0B,EAAS,CACPnG,OAAAA,EACAyE,MAAAA,IAEEnB,EAAS8C,SAAS9C,EAAS8C,QAAQpG,EAAQyE,GAE3CA,EAAMb,gBAAkB9D,GAAewF,IAEzCA,IACAA,OAAY/C,EAEf,GACD,CACEQ,KAAAA,EACA8C,WAAAA,EACA/B,UAAAA,EAEAa,gBAAAA,EAEA9E,MAAAA,GAEF0D,GAGK,WACD+B,GACFA,GAEH,CACF,GAIC,CAEAT,MAAMC,QAAQhB,GAAaA,EAAUZ,WAAaY,EAClD/D,EACAgD,EACA8C,EACA/F,EACAgG,EACAnB,EACApB,EACA1D,IAIJ,IAAMwG,EAAW,OAAGH,EAAAA,EAAMzB,YAAT,EAAG6B,EAAa1E,OAC3B2E,EAAsBX,EAAAA,SAEzB7F,IACDsG,GACCvG,GACAgG,GACDS,EAAoBH,UAAYC,IAIhCE,EAAoBH,QAAUC,EAC9BF,EAAS,CACPnG,SAAU+F,EACVtB,WAAOlC,KAIX,IAAMiE,EAAS,CAACP,EAAQC,EAAMlG,OAAQkG,EAAMzB,OAO5C,OAJA+B,EAAOzG,IAAMyG,EAAO,GACpBA,EAAOxG,OAASwG,EAAO,GACvBA,EAAO/B,MAAQ+B,EAAO,GAEfA,CACR,C","sources":["components/Elements/Sponsors/Sponsors.styles.js","components/Elements/Sponsors/index.jsx","../node_modules/src/observe.ts","../node_modules/src/InView.tsx","../node_modules/src/useInView.tsx"],"sourcesContent":["import makeStyles from \"@material-ui/styles/makeStyles\";\r\n\r\nconst styles = makeStyles(theme => ({\r\n\tsponsors: {\r\n\t\tmargin: \"0 auto\",\r\n\t\tmaxWidth: 1056,\r\n\t\tpadding: theme.spacing(10, 3),\r\n\t\twidth: \"100%\"\r\n\t},\r\n\theadline: {\r\n\t\tcolor: theme.palette.secondary.dark,\r\n\t\tmarginBottom: theme.spacing(5),\r\n\t\tposition: \"relative\",\r\n\t\tpaddingBottom: theme.spacing(3),\r\n\t\ttextAlign: \"center\",\r\n\t\tzIndex: 1,\r\n\t\t\"&:after\": {\r\n\t\t\tbackground: \"url('/img/highlight-xl.svg')\",\r\n\t\t\tbackgroundSize: \"contain\",\r\n\t\t\tbackgroundRepeat: \"no-repeat\",\r\n\t\t\tbottom: 0,\r\n\t\t\tcontent: \"''\",\r\n\t\t\theight: 14,\r\n\t\t\tleft: \"50%\",\r\n\t\t\tposition: \"absolute\",\r\n\t\t\ttransform: \"translate(-50%, 0)\",\r\n\t\t\twidth: 221\r\n\t\t}\r\n\t},\r\n\twrapper: {\r\n\t\talignItems: \"center\",\r\n\t\tdisplay: \"grid\",\r\n\t\tgridGap: 2,\r\n\t\tgridTemplateColumns: \"repeat(2, 1fr)\",\r\n\t\tgridTemplateRows: \"auto\",\r\n\t\toverflow: \"hidden\",\r\n\t\t[theme.breakpoints.up(\"sm\")]: {\r\n\t\t\tgridTemplateColumns: \"repeat(3, 1fr)\"\r\n\t\t},\r\n\t\t[theme.breakpoints.up(\"md\")]: {\r\n\t\t\tgridTemplateColumns: \"repeat(5, 1fr)\"\r\n\t\t}\r\n\t},\r\n\tlogo: {\r\n\t\talignItems: \"center\",\r\n\t\tbackground: \"#FFFFFF\",\r\n\t\tdisplay: \"flex\",\r\n\t\theight: \"100%\",\r\n\t\tjustifyContent: \"center\",\r\n\t\toverflow: \"hidden\",\r\n\t\taspectRatio: \"1 / 1\",\r\n\t\tpadding: theme.spacing(1.5),\r\n\t\twidth: \"100%\",\r\n\t\t\"& img\": {\r\n\t\t\tdisplay: \"block\",\r\n\t\t\theight: \"100%\",\r\n\t\t\tmaxHeight: 120,\r\n\t\t\tmaxWidth: 120,\r\n\t\t\tobjectFit: \"contain\",\r\n\t\t\twidth: \"100%\",\r\n\t\t\t[theme.breakpoints.up(\"sm\")]: {\r\n\t\t\t\tmaxHeight: 140,\r\n\t\t\t\tmaxWidth: 140\r\n\t\t\t},\r\n\t\t\t[theme.breakpoints.up(\"lg\")]: {\r\n\t\t\t\tmaxHeight: 170,\r\n\t\t\t\tmaxWidth: 170\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n}));\r\n\r\nexport default styles;\r\n","/* eslint-disable react-hooks/exhaustive-deps */\r\nimport React from \"react\";\r\nimport loadable from \"@loadable/component\";\r\nimport clsx from \"clsx\";\r\nimport { motion } from \"framer-motion\";\r\nimport { useInView } from \"react-intersection-observer\";\r\nimport useFetch from \"@micado-digital/react-ui/hooks/useFetch\";\r\nimport useLocals from \"@micado-digital/react-ui/hooks/useLocals\";\r\nimport localDE from \"@localDE\";\r\nimport localEN from \"@localEN\";\r\n\r\nimport styles from \"./Sponsors.styles\";\r\n\r\nconst Partners = loadable(() => import(\"./Partners\"));\r\nconst ReactLink = loadable(() => import(\"@micado-digital/react-link/ReactLink\"));\r\nconst Typography = loadable(() => import(\"@micado-digital/react-ui/components/Typography\"));\r\n\r\nconst Logos = ({ lang }) => {\r\n\tconst { REACT_APP_PATH } = process.env;\r\n\tconst sponsors = useFetch(\r\n\t\t`${REACT_APP_PATH}/Micado.WebEngine/Micado.WebEngine.Plugin.Media/List.api?FolderNames=Sponsoren&Types=2&Sort=1}`,\r\n\t\t[]\r\n\t);\r\n\tconst { items } = sponsors;\r\n\tconst css = styles();\r\n\tconst l = useLocals({\r\n\t\tlang: lang,\r\n\t\tres: {\r\n\t\t\tde: localDE,\r\n\t\t\ten: localEN\r\n\t\t}\r\n\t});\r\n\tconst [ref, inView] = useInView({\r\n\t\tdelay: 0.5,\r\n\t\ttriggerOnce: true\r\n\t});\r\n\r\n\tconst animationContainer1 = {\r\n\t\tanimate: {\r\n\t\t\ttransition: {\r\n\t\t\t\tdelayChildren: 1,\r\n\t\t\t\tstaggerChildren: 0.1\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n\r\n\tconst animationItem1 = {\r\n\t\tinitial: {\r\n\t\t\topacity: 0,\r\n\t\t\ty: -20\r\n\t\t},\r\n\t\tanimate: {\r\n\t\t\topacity: 1,\r\n\t\t\ttransition: {\r\n\t\t\t\tstiffness: 100,\r\n\t\t\t\ttype: \"spring\"\r\n\t\t\t},\r\n\t\t\ty: 0\r\n\t\t}\r\n\t};\r\n\r\n\treturn (\r\n\t\t<div className={clsx(css.sponsors, \"mco-component-sponsors\")} ref={ref}>\r\n\t\t\t<Typography className={css.headline} variants={{ xs: \"headline-small\" }}>\r\n\t\t\t\t{l(\"headlines.sponsors\")}\r\n\t\t\t</Typography>\r\n\t\t\t<motion.div\r\n\t\t\t\tclassName={css.wrapper}\r\n\t\t\t\tanimate={inView && \"animate\"}\r\n\t\t\t\tinitial={\"initial\"}\r\n\t\t\t\tvariants={animationContainer1}\r\n\t\t\t>\r\n\t\t\t\t{items?.map(item => {\r\n\t\t\t\t\tconst { fields, id, media: { filename, title } = {} } = item;\r\n\r\n\t\t\t\t\tconst linkCurrentLang =\r\n\t\t\t\t\t\tfields?.find(field => {\r\n\t\t\t\t\t\t\tif (lang === \"de\") {\r\n\t\t\t\t\t\t\t\treturn field.title === \"URL (Deutsch)\";\r\n\t\t\t\t\t\t\t} else {\r\n\t\t\t\t\t\t\t\treturn field.title === \"URL (Englisch)\";\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t})?.value || \"\";\r\n\r\n\t\t\t\t\tif (linkCurrentLang) {\r\n\t\t\t\t\t\treturn (\r\n\t\t\t\t\t\t\t<motion.div\r\n\t\t\t\t\t\t\t\tclassName={clsx(css.logo, \"mco-component-sponsors__logo\")}\r\n\t\t\t\t\t\t\t\tkey={id}\r\n\t\t\t\t\t\t\t\tvariants={animationItem1}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t<ReactLink to={linkCurrentLang} target=\"_blank\" rel=\"noreferrer\">\r\n\t\t\t\t\t\t\t\t\t<img src={REACT_APP_PATH + filename} alt={title} loading=\"lazy\" />\r\n\t\t\t\t\t\t\t\t</ReactLink>\r\n\t\t\t\t\t\t\t</motion.div>\r\n\t\t\t\t\t\t);\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\treturn (\r\n\t\t\t\t\t\t<motion.div\r\n\t\t\t\t\t\t\tclassName={clsx(css.logo, \"mco-component-sponsors__logo\")}\r\n\t\t\t\t\t\t\tkey={id}\r\n\t\t\t\t\t\t\tvariants={animationItem1}\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t<img src={REACT_APP_PATH + filename} alt={title} loading=\"lazy\" />\r\n\t\t\t\t\t\t</motion.div>\r\n\t\t\t\t\t);\r\n\t\t\t\t})}\r\n\t\t\t</motion.div>\r\n\t\t\t<Partners lang={lang} />\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nexport default Logos;\r\n","import type { ObserverInstanceCallback } from './index';\n\nconst observerMap = new Map<\n  string,\n  {\n    id: string;\n    observer: IntersectionObserver;\n    elements: Map<Element, Array<ObserverInstanceCallback>>;\n  }\n>();\n\nconst RootIds: WeakMap<Element | Document, string> = new WeakMap();\nlet rootId = 0;\n\nlet unsupportedValue: boolean | undefined = undefined;\n\n/**\n * What should be the default behavior if the IntersectionObserver is unsupported?\n * Ideally the polyfill has been loaded, you can have the following happen:\n * - `undefined`: Throw an error\n * - `true` or `false`: Set the `inView` value to this regardless of intersection state\n * **/\nexport function defaultFallbackInView(inView: boolean | undefined) {\n  unsupportedValue = inView;\n}\n\n/**\n * Generate a unique ID for the root element\n * @param root\n */\nfunction getRootId(root: IntersectionObserverInit['root']) {\n  if (!root) return '0';\n  if (RootIds.has(root)) return RootIds.get(root);\n  rootId += 1;\n  RootIds.set(root, rootId.toString());\n  return RootIds.get(root);\n}\n\n/**\n * Convert the options to a string Id, based on the values.\n * Ensures we can reuse the same observer when observing elements with the same options.\n * @param options\n */\nexport function optionsToId(options: IntersectionObserverInit) {\n  return Object.keys(options)\n    .sort()\n    .filter((key) => options[key] !== undefined)\n    .map((key) => {\n      return `${key}_${\n        key === 'root' ? getRootId(options.root) : options[key]\n      }`;\n    })\n    .toString();\n}\n\nfunction createObserver(options: IntersectionObserverInit) {\n  // Create a unique ID for this observer instance, based on the root, root margin and threshold.\n  let id = optionsToId(options);\n  let instance = observerMap.get(id);\n\n  if (!instance) {\n    // Create a map of elements this observer is going to observe. Each element has a list of callbacks that should be triggered, once it comes into view.\n    const elements = new Map<Element, Array<ObserverInstanceCallback>>();\n    let thresholds: number[] | readonly number[];\n\n    const observer = new IntersectionObserver((entries) => {\n      entries.forEach((entry) => {\n        // While it would be nice if you could just look at isIntersecting to determine if the component is inside the viewport, browsers can't agree on how to use it.\n        // -Firefox ignores `threshold` when considering `isIntersecting`, so it will never be false again if `threshold` is > 0\n        const inView =\n          entry.isIntersecting &&\n          thresholds.some((threshold) => entry.intersectionRatio >= threshold);\n\n        // @ts-ignore support IntersectionObserver v2\n        if (options.trackVisibility && typeof entry.isVisible === 'undefined') {\n          // The browser doesn't support Intersection Observer v2, falling back to v1 behavior.\n          // @ts-ignore\n          entry.isVisible = inView;\n        }\n\n        elements.get(entry.target)?.forEach((callback) => {\n          callback(inView, entry);\n        });\n      });\n    }, options);\n\n    // Ensure we have a valid thresholds array. If not, use the threshold from the options\n    thresholds =\n      observer.thresholds ||\n      (Array.isArray(options.threshold)\n        ? options.threshold\n        : [options.threshold || 0]);\n\n    instance = {\n      id,\n      observer,\n      elements,\n    };\n\n    observerMap.set(id, instance);\n  }\n\n  return instance;\n}\n\n/**\n * @param element - DOM Element to observe\n * @param callback - Callback function to trigger when intersection status changes\n * @param options - Intersection Observer options\n * @param fallbackInView - Fallback inView value.\n * @return Function - Cleanup function that should be triggered to unregister the observer\n */\nexport function observe(\n  element: Element,\n  callback: ObserverInstanceCallback,\n  options: IntersectionObserverInit = {},\n  fallbackInView = unsupportedValue,\n) {\n  if (\n    typeof window.IntersectionObserver === 'undefined' &&\n    fallbackInView !== undefined\n  ) {\n    const bounds = element.getBoundingClientRect();\n    callback(fallbackInView, {\n      isIntersecting: fallbackInView,\n      target: element,\n      intersectionRatio:\n        typeof options.threshold === 'number' ? options.threshold : 0,\n      time: 0,\n      boundingClientRect: bounds,\n      intersectionRect: bounds,\n      rootBounds: bounds,\n    });\n    return () => {\n      // Nothing to cleanup\n    };\n  }\n  // An observer with the same options can be reused, so lets use this fact\n  const { id, observer, elements } = createObserver(options);\n\n  // Register the callback listener for this element\n  let callbacks = elements.get(element) || [];\n  if (!elements.has(element)) {\n    elements.set(element, callbacks);\n  }\n\n  callbacks.push(callback);\n  observer.observe(element);\n\n  return function unobserve() {\n    // Remove the callback from the callback list\n    callbacks.splice(callbacks.indexOf(callback), 1);\n\n    if (callbacks.length === 0) {\n      // No more callback exists for element, so destroy it\n      elements.delete(element);\n      observer.unobserve(element);\n    }\n\n    if (elements.size === 0) {\n      // No more elements are being observer by this instance, so destroy it\n      observer.disconnect();\n      observerMap.delete(id);\n    }\n  };\n}\n","import * as React from 'react';\nimport type { IntersectionObserverProps, PlainChildrenProps } from './index';\nimport { observe } from './observe';\n\ntype State = {\n  inView: boolean;\n  entry?: IntersectionObserverEntry;\n};\n\nfunction isPlainChildren(\n  props: IntersectionObserverProps | PlainChildrenProps,\n): props is PlainChildrenProps {\n  return typeof props.children !== 'function';\n}\n\n/**\n ## Render props\n\n To use the `<InView>` component, you pass it a function. It will be called\n whenever the state changes, with the new value of `inView`. In addition to the\n `inView` prop, children also receive a `ref` that should be set on the\n containing DOM element. This is the element that the IntersectionObserver will\n monitor.\n\n If you need it, you can also access the\n [`IntersectionObserverEntry`](https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserverEntry)\n on `entry`, giving you access to all the details about the current intersection\n state.\n\n ```jsx\n import { InView } from 'react-intersection-observer';\n\n const Component = () => (\n <InView>\n {({ inView, ref, entry }) => (\n      <div ref={ref}>\n        <h2>{`Header inside viewport ${inView}.`}</h2>\n      </div>\n    )}\n </InView>\n );\n\n export default Component;\n ```\n\n ## Plain children\n\n You can pass any element to the `<InView />`, and it will handle creating the\n wrapping DOM element. Add a handler to the `onChange` method, and control the\n state in your own component. Any extra props you add to `<InView>` will be\n passed to the HTML element, allowing you set the `className`, `style`, etc.\n\n ```jsx\n import { InView } from 'react-intersection-observer';\n\n const Component = () => (\n <InView as=\"div\" onChange={(inView, entry) => console.log('Inview:', inView)}>\n <h2>Plain children are always rendered. Use onChange to monitor state.</h2>\n </InView>\n );\n\n export default Component;\n ```\n */\nexport class InView extends React.Component<\n  IntersectionObserverProps | PlainChildrenProps,\n  State\n> {\n  constructor(props: IntersectionObserverProps | PlainChildrenProps) {\n    super(props);\n    this.state = {\n      inView: !!props.initialInView,\n      entry: undefined,\n    };\n  }\n\n  componentDidUpdate(prevProps: IntersectionObserverProps) {\n    // If a IntersectionObserver option changed, reinit the observer\n    if (\n      prevProps.rootMargin !== this.props.rootMargin ||\n      prevProps.root !== this.props.root ||\n      prevProps.threshold !== this.props.threshold ||\n      prevProps.skip !== this.props.skip ||\n      prevProps.trackVisibility !== this.props.trackVisibility ||\n      prevProps.delay !== this.props.delay\n    ) {\n      this.unobserve();\n      this.observeNode();\n    }\n  }\n\n  componentWillUnmount() {\n    this.unobserve();\n    this.node = null;\n  }\n\n  node: Element | null = null;\n  _unobserveCb: (() => void) | null = null;\n\n  observeNode() {\n    if (!this.node || this.props.skip) return;\n    const {\n      threshold,\n      root,\n      rootMargin,\n      trackVisibility,\n      delay,\n      fallbackInView,\n    } = this.props;\n\n    this._unobserveCb = observe(\n      this.node,\n      this.handleChange,\n      {\n        threshold,\n        root,\n        rootMargin,\n        // @ts-ignore\n        trackVisibility,\n        // @ts-ignore\n        delay,\n      },\n      fallbackInView,\n    );\n  }\n\n  unobserve() {\n    if (this._unobserveCb) {\n      this._unobserveCb();\n      this._unobserveCb = null;\n    }\n  }\n\n  handleNode = (node?: Element | null) => {\n    if (this.node) {\n      // Clear the old observer, before we start observing a new element\n      this.unobserve();\n\n      if (!node && !this.props.triggerOnce && !this.props.skip) {\n        // Reset the state if we get a new node, and we aren't ignoring updates\n        this.setState({ inView: !!this.props.initialInView, entry: undefined });\n      }\n    }\n\n    this.node = node ? node : null;\n    this.observeNode();\n  };\n\n  handleChange = (inView: boolean, entry: IntersectionObserverEntry) => {\n    if (inView && this.props.triggerOnce) {\n      // If `triggerOnce` is true, we should stop observing the element.\n      this.unobserve();\n    }\n    if (!isPlainChildren(this.props)) {\n      // Store the current State, so we can pass it to the children in the next render update\n      // There's no reason to update the state for plain children, since it's not used in the rendering.\n      this.setState({ inView, entry });\n    }\n    if (this.props.onChange) {\n      // If the user is actively listening for onChange, always trigger it\n      this.props.onChange(inView, entry);\n    }\n  };\n\n  render() {\n    if (!isPlainChildren(this.props)) {\n      const { inView, entry } = this.state;\n      return this.props.children({ inView, entry, ref: this.handleNode });\n    }\n\n    const {\n      children,\n      as,\n      triggerOnce,\n      threshold,\n      root,\n      rootMargin,\n      onChange,\n      skip,\n      trackVisibility,\n      delay,\n      initialInView,\n      fallbackInView,\n      ...props\n    } = this.props;\n\n    return React.createElement(\n      as || 'div',\n      { ref: this.handleNode, ...props },\n      children,\n    );\n  }\n}\n","import * as React from 'react';\nimport type { InViewHookResponse, IntersectionOptions } from './index';\nimport { observe } from './observe';\n\ntype State = {\n  inView: boolean;\n  entry?: IntersectionObserverEntry;\n};\n\n/**\n * React Hooks make it easy to monitor the `inView` state of your components. Call\n * the `useInView` hook with the (optional) [options](#options) you need. It will\n * return an array containing a `ref`, the `inView` status and the current\n * [`entry`](https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserverEntry).\n * Assign the `ref` to the DOM element you want to monitor, and the hook will\n * report the status.\n *\n * @example\n * ```jsx\n * import React from 'react';\n * import { useInView } from 'react-intersection-observer';\n *\n * const Component = () => {\n *   const { ref, inView, entry } = useInView({\n *       threshold: 0,\n *   });\n *\n *   return (\n *     <div ref={ref}>\n *       <h2>{`Header inside viewport ${inView}.`}</h2>\n *     </div>\n *   );\n * };\n * ```\n */\nexport function useInView({\n  threshold,\n  delay,\n  trackVisibility,\n  rootMargin,\n  root,\n  triggerOnce,\n  skip,\n  initialInView,\n  fallbackInView,\n  onChange,\n}: IntersectionOptions = {}): InViewHookResponse {\n  const [ref, setRef] = React.useState<Element | null>(null);\n  const callback = React.useRef<IntersectionOptions['onChange']>();\n  const [state, setState] = React.useState<State>({\n    inView: !!initialInView,\n    entry: undefined,\n  });\n\n  // Store the onChange callback in a `ref`, so we can access the latest instance\n  // inside the `useEffect`, but without triggering a rerender.\n  callback.current = onChange;\n\n  React.useEffect(\n    () => {\n      // Ensure we have node ref, and that we shouldn't skip observing\n      if (skip || !ref) return;\n\n      let unobserve: (() => void) | undefined;\n      unobserve = observe(\n        ref,\n        (inView, entry) => {\n          setState({\n            inView,\n            entry,\n          });\n          if (callback.current) callback.current(inView, entry);\n\n          if (entry.isIntersecting && triggerOnce && unobserve) {\n            // If it should only trigger once, unobserve the element after it's inView\n            unobserve();\n            unobserve = undefined;\n          }\n        },\n        {\n          root,\n          rootMargin,\n          threshold,\n          // @ts-ignore\n          trackVisibility,\n          // @ts-ignore\n          delay,\n        },\n        fallbackInView,\n      );\n\n      return () => {\n        if (unobserve) {\n          unobserve();\n        }\n      };\n    },\n    // We break the rule here, because we aren't including the actual `threshold` variable\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [\n      // If the threshold is an array, convert it to a string, so it won't change between renders.\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      Array.isArray(threshold) ? threshold.toString() : threshold,\n      ref,\n      root,\n      rootMargin,\n      triggerOnce,\n      skip,\n      trackVisibility,\n      fallbackInView,\n      delay,\n    ],\n  );\n\n  const entryTarget = state.entry?.target;\n  const previousEntryTarget = React.useRef<Element>();\n  if (\n    !ref &&\n    entryTarget &&\n    !triggerOnce &&\n    !skip &&\n    previousEntryTarget.current !== entryTarget\n  ) {\n    // If we don't have a node ref, then reset the state (unless the hook is set to only `triggerOnce` or `skip`)\n    // This ensures we correctly reflect the current state - If you aren't observing anything, then nothing is inView\n    previousEntryTarget.current = entryTarget;\n    setState({\n      inView: !!initialInView,\n      entry: undefined,\n    });\n  }\n\n  const result = [setRef, state.inView, state.entry] as InViewHookResponse;\n\n  // Support object destructuring, by adding the specific values.\n  result.ref = result[0];\n  result.inView = result[1];\n  result.entry = result[2];\n\n  return result;\n}\n"],"names":["makeStyles","theme","sponsors","margin","maxWidth","padding","spacing","width","headline","color","palette","secondary","dark","marginBottom","position","paddingBottom","textAlign","zIndex","background","backgroundSize","backgroundRepeat","bottom","content","height","left","transform","wrapper","alignItems","display","gridGap","gridTemplateColumns","gridTemplateRows","overflow","breakpoints","up","logo","justifyContent","aspectRatio","maxHeight","objectFit","Partners","loadable","ReactLink","Typography","lang","items","useFetch","process","css","styles","l","useLocals","res","de","localDE","en","localEN","useInView","delay","triggerOnce","ref","inView","animationItem1","initial","opacity","y","animate","transition","stiffness","type","className","clsx","variants","xs","motion","delayChildren","staggerChildren","map","item","fields","id","media","filename","title","linkCurrentLang","find","field","value","to","target","rel","src","alt","loading","observerMap","Map","RootIds","WeakMap","rootId","unsupportedValue","undefined","optionsToId","options","Object","keys","sort","filter","key","root","has","set","toString","get","observe","element","callback","fallbackInView","window","IntersectionObserver","bounds","getBoundingClientRect","isIntersecting","intersectionRatio","threshold","time","boundingClientRect","intersectionRect","rootBounds","instance","thresholds","elements","observer","entries","forEach","entry","some","trackVisibility","isVisible","Array","isArray","createObserver","callbacks","push","splice","indexOf","length","delete","unobserve","size","disconnect","isPlainChildren","props","children","React","rootMargin","skip","initialInView","onChange","setRef","state","setState","current","entryTarget","_state$entry","previousEntryTarget","result"],"sourceRoot":""}