UNPKG

react-amiga-guru-meditation

Version:

A React Error Boundary styled like the Amiga Guru Meditation

62 lines (58 loc) 46.8 kB
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="ie=edge"/><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/><style data-href="/react-amiga-guru-meditation/styles.2543ff947a193d7f33b1.css" id="gatsby-global-css">@import url(https://fonts.googleapis.com/css?family=Inconsolata&display=swap);@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro&display=swap);</style><meta name="generator" content="Gatsby 2.32.11"/><title data-rh="true">AmigaErrorBoundary | Amiga Guru Meditation</title><meta data-rh="true" name="description" content="React Amiga Guru Meditation"/><meta data-rh="true" property="og:title" content="AmigaErrorBoundary"/><meta data-rh="true" property="og:description" content="React Amiga Guru Meditation"/><meta data-rh="true" property="og:type" content="website"/><meta data-rh="true" name="twitter:card" content="summary"/><meta data-rh="true" name="twitter:title" content="AmigaErrorBoundary"/><meta data-rh="true" name="twitter:description" content="React Amiga Guru Meditation"/><link as="script" rel="preload" href="/react-amiga-guru-meditation/webpack-runtime-712514915ee32a0833a2.js"/><link as="script" rel="preload" href="/react-amiga-guru-meditation/framework-476be28629a883754470.js"/><link as="script" rel="preload" href="/react-amiga-guru-meditation/styles-bc72ca78f9bad9fb1f45.js"/><link as="script" rel="preload" href="/react-amiga-guru-meditation/app-6064ad2fe2b9b6d1fe89.js"/><link as="script" rel="preload" href="/react-amiga-guru-meditation/bac1b955-b711947e81fae9e9bc2c.js"/><link as="script" rel="preload" href="/react-amiga-guru-meditation/27dde964ec0edb61db759c8d54994a27d8d3b5a9-33fdebf56eb824084dd6.js"/><link as="script" rel="preload" href="/react-amiga-guru-meditation/component---srcdocs-components-amiga-error-baundary-amigaerrorboundary-mdx-1f318243d41b75b18411.js"/><link as="fetch" rel="preload" href="/react-amiga-guru-meditation/page-data/components/amigaerrorboundary/page-data.json" crossorigin="anonymous"/><link as="fetch" rel="preload" href="/react-amiga-guru-meditation/page-data/sq/d/1635659820.json" crossorigin="anonymous"/><link as="fetch" rel="preload" href="/react-amiga-guru-meditation/page-data/app-data.json" crossorigin="anonymous"/></head><body><div id="___gatsby"><div style="outline:none" tabindex="-1" id="gatsby-focus-wrapper"><style data-emotion-css="1ouyflx">.css-1ouyflx{font-family:'Source Sans Pro',sans-serif;font-size:20px;font-weight:400;line-height:1.5;color:var(--theme-ui-colors-text,#2D3747);background-color:var(--theme-ui-colors-background,#FFFFFF);}</style><div class="css-1ouyflx"><style data-emotion-css="jrjj6h">.css-jrjj6h > div{-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;}</style><style data-emotion-css="1ubpee3">.css-1ubpee3{min-height:100vh;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}.css-1ubpee3 > div{-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;}</style><style data-emotion-css="hbri28">.css-hbri28{box-sizing:border-box;min-width:0;min-height:100vh;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}.css-hbri28 > div{-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;}</style><div data-testid="layout" class="css-hbri28"><style data-emotion-css="1xva7m0">body{margin:0;padding:0;}.icon-link{display:none;}.with-overlay{overflow:hidden;}</style><style data-emotion-css="zf0iqh">.css-zf0iqh{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-height:100vh;}</style><style data-emotion-css="1tjxv7i">.css-1tjxv7i{-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-height:100vh;}</style><style data-emotion-css="238csb">.css-238csb{box-sizing:border-box;min-width:0;-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-height:100vh;}</style><main class="css-238csb"><style data-emotion-css="18wmtq">.css-18wmtq{background-color:var(--theme-ui-colors-header-bg,#F5F6F7);position:relative;z-index:1;border-bottom:1px solid var(--theme-ui-colors-border,#CED4DE);}</style><div data-testid="header" class="css-18wmtq"><style data-emotion-css="zankq9">.css-zankq9{display:none;position:absolute;top:calc(100% + 15px);left:30px;}@media screen and (max-width:57.5em){.css-zankq9{display:block;}}</style><style data-emotion-css="1s0wdqz">.css-1s0wdqz{box-sizing:border-box;min-width:0;display:none;position:absolute;top:calc(100% + 15px);left:30px;}@media screen and (max-width:57.5em){.css-1s0wdqz{display:block;}}</style><div class="css-1s0wdqz"><style data-emotion-css="4019lz">.css-4019lz{padding:0;outline:none;background:transparent;border:none;color:var(--theme-ui-colors-header-text,#2D3747);opacity:0.5;cursor:pointer;}.css-4019lz:hover{cursor:pointer;}</style><button class="css-4019lz"><svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="3" y1="12" x2="21" y2="12"></line><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="18" x2="21" y2="18"></line></svg></button></div><style data-emotion-css="z6jak6">.css-z6jak6{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;padding-left:32px;padding-right:32px;position:relative;height:80px;}</style><div class="css-z6jak6"><style data-emotion-css="xenp3v">.css-xenp3v{-webkit-letter-spacing:-0.02em;-moz-letter-spacing:-0.02em;-ms-letter-spacing:-0.02em;letter-spacing:-0.02em;font-weight:600;font-size:24px;}</style><style data-emotion-css="1abzlu">.css-1abzlu{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-letter-spacing:-0.02em;-moz-letter-spacing:-0.02em;-ms-letter-spacing:-0.02em;letter-spacing:-0.02em;font-weight:600;font-size:24px;}</style><style data-emotion-css="ug0363">.css-ug0363{box-sizing:border-box;min-width:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-letter-spacing:-0.02em;-moz-letter-spacing:-0.02em;-ms-letter-spacing:-0.02em;letter-spacing:-0.02em;font-weight:600;font-size:24px;}</style><div data-testid="logo" class="css-ug0363"><style data-emotion-css="gyijir">.css-gyijir{font-weight:600;color:var(--theme-ui-colors-header-text,#2D3747);-webkit-text-decoration:none;text-decoration:none;}.css-gyijir:hover{color:var(--theme-ui-colors-primary,#0B5FFF);}</style><a class="css-gyijir" href="/react-amiga-guru-meditation/">Amiga Guru Meditation</a></div><style data-emotion-css="k008qs">.css-k008qs{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}</style><style data-emotion-css="80zs6q">.css-80zs6q{box-sizing:border-box;min-width:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}</style><div class="css-80zs6q"><style data-emotion-css="12z0wuy">.css-12z0wuy{margin-right:8px;}</style><style data-emotion-css="q6cf68">.css-q6cf68{box-sizing:border-box;min-width:0;margin-right:8px;}</style><div class="css-q6cf68"><style data-emotion-css="1is33jg">.css-1is33jg{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;outline:none;padding:12px;border:none;border-radius:9999px;background-color:var(--theme-ui-colors-header-button-bg,#0B5FFF);color:var(--theme-ui-colors-header-button-color,#FFFFFF);font-size:12px;font-weight:600;cursor:pointer;}</style><a href="https://github.com/gfazioli/react-amiga-guru-meditation" target="_blank" rel="noopener noreferrer" class="css-1is33jg"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path></svg></a></div><button aria-label="Switch to light mode" class="css-1is33jg"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg></button></div><style data-emotion-css="1gncnz1">.css-1gncnz1{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;position:absolute;bottom:-40px;right:30px;background-color:transparent;color:var(--theme-ui-colors-muted,#67788a);font-size:14px;-webkit-text-decoration:none;text-decoration:none;border-radius:4px;}</style><a href="https://github.com/gfazioli/react-amiga-guru-meditation/edit/master/srcdocs/components/AmigaErrorBaundary/amigaerrorboundary.mdx" target="_blank" rel="noopener noreferrer" class="css-1gncnz1"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z"></path></svg><style data-emotion-css="1iuj5ih">.css-1iuj5ih{padding-left:8px;}</style><style data-emotion-css="1x2jprh">.css-1x2jprh{box-sizing:border-box;min-width:0;padding-left:8px;}</style><div class="css-1x2jprh">Edit page</div></a></div></div><style data-emotion-css="1nfi0ai">.css-1nfi0ai{padding-top:0;padding-bottom:0;-webkit-flex:1;-ms-flex:1;flex:1;display:grid;grid-template-columns:250px minmax(0,1fr);min-height:100vh;}@media screen and (max-width:57.5em){.css-1nfi0ai{display:block;}}</style><div class="css-1nfi0ai"><style data-emotion-css="1tn7q1x">.css-1tn7q1x{z-index:999;position:fixed;top:81px;right:0;bottom:0;left:0;background:rgba(0,0,0,0.6);-webkit-transition:all .2s ease-out;transition:all .2s ease-out;visibility:hidden;opacity:0;}</style><style data-emotion-css="h4snl3">.css-h4snl3{box-sizing:border-box;min-width:0;z-index:999;position:fixed;top:81px;right:0;bottom:0;left:0;background:rgba(0,0,0,0.6);-webkit-transition:all .2s ease-out;transition:all .2s ease-out;visibility:hidden;opacity:0;}</style><div class="css-h4snl3"></div><style data-emotion-css="1ethd5x">.css-1ethd5x{padding-top:32px;padding-bottom:32px;padding-left:32px;padding-right:32px;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;position:-webkit-sticky;position:sticky;top:0;z-index:1;min-width:0;max-height:100vh;border-right:1px solid var(--theme-ui-colors-border,#CED4DE);overflow:auto;-webkit-overflow-scrolling:touch;background-color:var(--theme-ui-colors-sidebar-bg,#FFFFFF);}@media screen and (max-width:57.5em){.css-1ethd5x{z-index:9999;display:block;position:fixed;top:81px;left:0;bottom:0;width:256px;padding-left:32px;padding-right:32px;background-color:var(--theme-ui-colors-background,#FFFFFF);-webkit-transition:-webkit-transform .2s ease-out;-webkit-transition:transform .2s ease-out;transition:transform .2s ease-out;-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);}}</style><style data-emotion-css="1li9yso">.css-1li9yso{box-sizing:border-box;min-width:0;padding-top:32px;padding-bottom:32px;padding-left:32px;padding-right:32px;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;position:-webkit-sticky;position:sticky;top:0;z-index:1;min-width:0;max-height:100vh;border-right:1px solid var(--theme-ui-colors-border,#CED4DE);overflow:auto;-webkit-overflow-scrolling:touch;background-color:var(--theme-ui-colors-sidebar-bg,#FFFFFF);}@media screen and (max-width:57.5em){.css-1li9yso{z-index:9999;display:block;position:fixed;top:81px;left:0;bottom:0;width:256px;padding-left:32px;padding-right:32px;background-color:var(--theme-ui-colors-background,#FFFFFF);-webkit-transition:-webkit-transform .2s ease-out;-webkit-transition:transform .2s ease-out;transition:transform .2s ease-out;-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);}}</style><div data-testid="sidebar" class="css-1li9yso"><style data-emotion-css="lcm9hh">.css-lcm9hh{margin-bottom:16px;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}</style><div data-testid="nav-search" class="css-lcm9hh"><style data-emotion-css="1mo6uhh">.css-1mo6uhh{color:var(--theme-ui-colors-border,#CED4DE);margin-right:8px;}</style><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="css-1mo6uhh"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg><style data-emotion-css="1bbueiu">.css-1bbueiu{outline:none;background:none;border:none;color:var(--theme-ui-colors-text,#2D3747);font-size:14px;}</style><input placeholder="Type to search..." value="" class="css-1bbueiu"/></div><style data-emotion-css="1ebprri">.css-1ebprri{margin-top:16px;margin-bottom:16px;}</style><div data-testid="nav-group" class="css-1ebprri"><style data-emotion-css="1c8kbwa">.css-1c8kbwa{margin-bottom:4px;font-size:16px;font-weight:500;color:var(--theme-ui-colors-sidebar-navGroup,#2D3747);cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}</style><div class="css-1c8kbwa">Components<style data-emotion-css="1scp5x8">.css-1scp5x8{margin-left:4px;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-align-self:baseline;-ms-flex-item-align:baseline;align-self:baseline;-webkit-transform:rotateX(180deg);-ms-transform:rotateX(180deg);transform:rotateX(180deg);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transition:-webkit-transform .3s ease-in-out;-webkit-transition:transform .3s ease-in-out;transition:transform .3s ease-in-out;}</style><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="css-1scp5x8"><polyline points="6 9 12 15 18 9"></polyline></svg></div><style data-emotion-css="1isemmb">.css-1isemmb{margin-left:8px;}</style><div data-testid="nav-group-links" class="css-1isemmb"><style data-emotion-css="1rqvyud">.css-1rqvyud{margin-top:8px;margin-bottom:8px;display:block;color:var(--theme-ui-colors-sidebar-navGroup,#2D3747);-webkit-text-decoration:none;text-decoration:none;font-size:16px;}.css-1rqvyud.active{color:var(--theme-ui-colors-sidebar-navLinkActive,#0B5FFF);}</style><a aria-current="page" class="css-1rqvyud active" href="/react-amiga-guru-meditation/components/amigaerrorboundary">AmigaErrorBoundary</a><style data-emotion-css="1ooej63">.css-1ooej63{margin-top:8px;margin-bottom:8px;display:block;color:var(--theme-ui-colors-sidebar-tocLink,#67788a);-webkit-text-decoration:none;text-decoration:none;font-size:14px;margin-left:16px;position:relative;}.css-1ooej63.active{color:var(--theme-ui-colors-sidebar-tocLinkActive,#1D2330);}.css-1ooej63.active::before{content:"";position:absolute;display:block;top:2px;left:-8px;height:1rem;background-color:var(--theme-ui-colors-primary,#0B5FFF);-webkit-transition:width 200ms ease 0s;transition:width 200ms ease 0s;width:2px;border-radius:1px;}</style><a class=" css-1ooej63" href="/react-amiga-guru-meditation/components/amigaerrorboundary#basic-usage">Basic usage</a><a class=" css-1ooej63" href="/react-amiga-guru-meditation/components/amigaerrorboundary#example">Example</a><a class=" css-1ooej63" href="/react-amiga-guru-meditation/components/amigaerrorboundary#props">Props</a></div></div><a class="css-1rqvyud" href="/react-amiga-guru-meditation/">Get Started</a></div><style data-emotion-css="1w3d2mg">.css-1w3d2mg{background-color:var(--theme-ui-colors-background,#FFFFFF);position:relative;max-width:1280px;padding-top:48px;padding-bottom:48px;padding-left:32px;padding-right:32px;padding:32px;}@media screen and (max-width:57.5em){.css-1w3d2mg{padding-top:48px;padding-bottom:32px;padding-left:32px;padding-right:32px;}}</style><style data-emotion-css="kjtkh5">.css-kjtkh5{width:100%;min-width:0;max-width:1280px;margin-left:auto;margin-right:auto;padding:32px;background-color:var(--theme-ui-colors-background,#FFFFFF);position:relative;max-width:1280px;padding-top:48px;padding-bottom:48px;padding-left:32px;padding-right:32px;padding:32px;}@media screen and (max-width:57.5em){.css-kjtkh5{padding-top:48px;padding-bottom:32px;padding-left:32px;padding-right:32px;}}</style><style data-emotion-css="1307vk3">.css-1307vk3{box-sizing:border-box;min-width:0;width:100%;min-width:0;max-width:1280px;margin-left:auto;margin-right:auto;padding:32px;background-color:var(--theme-ui-colors-background,#FFFFFF);position:relative;max-width:1280px;padding-top:48px;padding-bottom:48px;padding-left:32px;padding-right:32px;padding:32px;}@media screen and (max-width:57.5em){.css-1307vk3{padding-top:48px;padding-bottom:32px;padding-left:32px;padding-right:32px;}}</style><div data-testid="main-container" class="css-1307vk3"><style data-emotion-css="1vci3bl">.css-1vci3bl{padding:0;margin:0;margin-bottom:16px;font-size:48px;font-family:'Source Sans Pro',sans-serif;line-height:1.125;font-weight:700;}</style><h1 id="amigaerrorboundary" class="css-1vci3bl">AmigaErrorBoundary</h1><style data-emotion-css="1ftn47p">.css-1ftn47p{padding:0;margin:0;margin-bottom:16px;}</style><p class="css-1ftn47p">You may use the <style data-emotion-css="ueqitl">.css-ueqitl{font-family:Inconsolata;}</style><code class="css-ueqitl">AmigaErrorBoundary</code> as a ErrorBoundary</p><h2 id="basic-usage"><style data-emotion-css="1r0pe6c">.css-1r0pe6c{color:inherit;-webkit-text-decoration:none;text-decoration:none;}.css-1r0pe6c:hover{-webkit-text-decoration:underline;text-decoration:underline;}</style><a href="#basic-usage" class="css-1r0pe6c">Basic usage</a></h2><div><style data-emotion-css="1h0sj8d">.css-1h0sj8d{padding:16px;margin:0;margin-bottom:32px;font-size:85%;margin-top:32px;text-align:left;font-family:Inconsolata;border-radius:4px;}.css-1h0sj8d dark{[object Object];}.css-1h0sj8d light{[object Object];}</style><pre class="language-jsx prism-code language-jsx css-1h0sj8d" style="font-family:Inconsolata;color:#393A34;background-color:#f6f8fa;overflow-x:auto" data-testid="code"><div class="token-line" style="font-family:Inconsolata;color:#393A34"><style data-emotion-css="1baulvz">.css-1baulvz{display:inline-block;}</style><span class="token tag punctuation css-1baulvz" style="color:#393A34">&lt;</span><span class="token tag class-name css-1baulvz" style="color:#00009f">AmigaErrorBoundary</span><span class="token tag punctuation css-1baulvz" style="color:#393A34">&gt;</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token operator css-1baulvz" style="color:#393A34">...</span><span class="token plain css-1baulvz"> your components</span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"></span><span class="token tag punctuation css-1baulvz" style="color:#393A34">&lt;/</span><span class="token tag class-name css-1baulvz" style="color:#00009f">AmigaErrorBoundary</span><span class="token tag punctuation css-1baulvz" style="color:#393A34">&gt;</span></div></pre></div><div style="position:relative;user-select:auto;margin:0;margin-right:auto;width:100%;height:auto;max-width:100%;min-width:260px;box-sizing:border-box;flex-shrink:0" data-testid="playground"><style data-emotion-css="79elbk">.css-79elbk{position:relative;}</style><div class="css-79elbk"><style data-emotion-css="nxr1xe">.css-nxr1xe{height:auto;display:block;min-height:100%;width:calc(100% - 2px);background-color:var(--theme-ui-colors-playground-bg,#FFFFFF);border:1px solid var(--theme-ui-colors-playground-border,#CED4DE);border-radius:4px 4px 0 0;}</style><div class="css-nxr1xe"><style data-emotion-css="mxobd5">.css-mxobd5{margin:0;padding:20px;}</style><div data-testid="live-preview" class="css-mxobd5"><p>Set true the show prop</p></div></div><style data-emotion-css="4qwwu">.css-4qwwu{z-index:9;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:absolute;bottom:-20px;right:32px;}</style><div class="css-4qwwu"><style data-emotion-css="1ounbqd">.css-1ounbqd{padding:8px;outline:none;background:transparent;border:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-top:4px;padding-bottom:4px;background-color:var(--theme-ui-colors-border,#CED4DE);color:var(--theme-ui-colors-muted,#67788a);border-radius:0 0 3px 3px;}.css-1ounbqd:hover{cursor:pointer;}.css-1ounbqd ~ .css-1ounbqd{margin-left:4px;}</style><button class="css-1ounbqd"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"></path><rect x="8" y="2" width="8" height="4" rx="1" ry="1"></rect></svg></button><button class="css-1ounbqd"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg></button></div></div><style data-emotion-css="ycvwe1">.css-ycvwe1{height:auto;display:block;min-height:100%;width:calc(100% - 2px);background-color:var(--theme-ui-colors-playground-bg,#FFFFFF);border:1px solid var(--theme-ui-colors-playground-border,#CED4DE);border-top:0;border-radius:0 0 4px 4px;}</style><div class="css-ycvwe1"><style data-emotion-css="d45ar4">.css-d45ar4{padding:8px;background:#f6f8fa;border-top:0;font-family:Inconsolata;font-size:18px;}.css-d45ar4 * > textarea:focus{outline:none;}</style><div class="css-d45ar4"><div data-testid="live-editor" style="position:relative;text-align:left;box-sizing:border-box;padding:0;overflow:hidden;white-space:pre;font-family:Inconsolata;color:#393A34;background-color:#f6f8fa"><textarea style="margin:0;border:0;background:none;box-sizing:inherit;display:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-variant-ligatures:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;tab-size:inherit;text-indent:inherit;text-rendering:inherit;text-transform:inherit;white-space:pre-wrap;word-break:keep-all;overflow-wrap:break-word;position:absolute;top:0;left:0;height:100%;width:100%;resize:none;color:inherit;overflow:hidden;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-text-fill-color:transparent;padding-top:10px;padding-right:10px;padding-bottom:10px;padding-left:10px" class="npm__react-simple-code-editor__textarea" autoCapitalize="off" autoComplete="off" autoCorrect="off" spellcheck="false" data-gramm="false">&lt;AmigaErrorBoundary show={false} error={&quot;Hello, I&#x27;m error&quot;}&gt; &lt;p&gt;Set true the show prop&lt;/p&gt; &lt;/AmigaErrorBoundary&gt;</textarea><pre aria-hidden="true" style="margin:0;border:0;background:none;box-sizing:inherit;display:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-variant-ligatures:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;tab-size:inherit;text-indent:inherit;text-rendering:inherit;text-transform:inherit;white-space:pre-wrap;word-break:keep-all;overflow-wrap:break-word;position:relative;pointer-events:none;padding-top:10px;padding-right:10px;padding-bottom:10px;padding-left:10px"><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">AmigaErrorBoundary</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">show</span><span class="token tag script language-javascript script-punctuation punctuation" style="color:#393A34">=</span><span class="token tag script language-javascript punctuation" style="color:#393A34">{</span><span class="token tag script language-javascript boolean" style="color:#36acaa">false</span><span class="token tag script language-javascript punctuation" style="color:#393A34">}</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">error</span><span class="token tag script language-javascript script-punctuation punctuation" style="color:#393A34">=</span><span class="token tag script language-javascript punctuation" style="color:#393A34">{</span><span class="token tag script language-javascript string" style="color:#e3116c">&quot;Hello, I&#x27;m error&quot;</span><span class="token tag script language-javascript punctuation" style="color:#393A34">}</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">p</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain">Set </span><span class="token boolean" style="color:#36acaa">true</span><span class="token plain"> the show prop</span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">p</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain"></span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag class-name" style="color:#00009f">AmigaErrorBoundary</span><span class="token tag punctuation" style="color:#393A34">&gt;</span></div></pre><style type="text/css"> /** * Reset the text fill color so that placeholder is visible */ .npm__react-simple-code-editor__textarea:empty { -webkit-text-fill-color: inherit !important; } /** * Hack to apply on some CSS on IE10 and IE11 */ @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /** * IE doesn't support '-webkit-text-fill-color' * So we use 'color: transparent' to make the text transparent on IE * Unlike other browsers, it doesn't affect caret color in IE */ .npm__react-simple-code-editor__textarea { color: transparent !important; } .npm__react-simple-code-editor__textarea::selection { background-color: #accef7 !important; color: transparent !important; } } </style></div></div></div><style data-emotion-css="hkbkh9">.css-hkbkh9{margin:0;padding-top:8px;padding-bottom:8px;padding-left:16px;padding-right:16px;background-color:#FF4757;font-size:14px;color:var(--theme-ui-colors-white,#FFFFFF);white-space:pre-wrap;}</style><div><div class="" style="position:absolute;user-select:none;width:10px;height:100%;top:0px;right:-5px;cursor:col-resize"></div></div></div><p class="css-1ftn47p">Of course, you may use it to display any catchable error in your children components</p><div><pre class="language-jsx prism-code language-jsx css-1h0sj8d" style="font-family:Inconsolata;color:#393A34;background-color:#f6f8fa;overflow-x:auto" data-testid="code"><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token tag punctuation css-1baulvz" style="color:#393A34">&lt;</span><span class="token tag class-name css-1baulvz" style="color:#00009f">AmigaErrorBoundary</span><span class="token tag css-1baulvz" style="color:#00009f"> </span><span class="token tag attr-name css-1baulvz" style="color:#00a4db">show</span><span class="token tag script language-javascript script-punctuation punctuation css-1baulvz" style="color:#393A34">=</span><span class="token tag script language-javascript punctuation css-1baulvz" style="color:#393A34">{</span><span class="token tag script language-javascript boolean css-1baulvz" style="color:#36acaa">true</span><span class="token tag script language-javascript punctuation css-1baulvz" style="color:#393A34">}</span><span class="token tag css-1baulvz" style="color:#00009f"> </span><span class="token tag attr-name css-1baulvz" style="color:#00a4db">error</span><span class="token tag script language-javascript script-punctuation punctuation css-1baulvz" style="color:#393A34">=</span><span class="token tag script language-javascript punctuation css-1baulvz" style="color:#393A34">{</span><span class="token tag script language-javascript string css-1baulvz" style="color:#e3116c">&quot;Hello, I&#x27;m error&quot;</span><span class="token tag script language-javascript punctuation css-1baulvz" style="color:#393A34">}</span><span class="token tag punctuation css-1baulvz" style="color:#393A34">&gt;</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token operator css-1baulvz" style="color:#393A34">...</span><span class="token plain css-1baulvz"> your components</span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"></span><span class="token tag punctuation css-1baulvz" style="color:#393A34">&lt;/</span><span class="token tag class-name css-1baulvz" style="color:#00009f">AmigaErrorBoundary</span><span class="token tag punctuation css-1baulvz" style="color:#393A34">&gt;</span></div></pre></div><p class="css-1ftn47p">You may also change the appearance</p><div style="position:relative;user-select:auto;margin:0;margin-right:auto;width:100%;height:auto;max-width:100%;min-width:260px;box-sizing:border-box;flex-shrink:0" data-testid="playground"><div class="css-79elbk"><div class="css-nxr1xe"><div data-testid="live-preview" class="css-mxobd5"><p>Set true the show prop and change the color</p></div></div><div class="css-4qwwu"><button class="css-1ounbqd"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"></path><rect x="8" y="2" width="8" height="4" rx="1" ry="1"></rect></svg></button><button class="css-1ounbqd"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg></button></div></div><div class="css-ycvwe1"><div class="css-d45ar4"><div data-testid="live-editor" style="position:relative;text-align:left;box-sizing:border-box;padding:0;overflow:hidden;white-space:pre;font-family:Inconsolata;color:#393A34;background-color:#f6f8fa"><textarea style="margin:0;border:0;background:none;box-sizing:inherit;display:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-variant-ligatures:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;tab-size:inherit;text-indent:inherit;text-rendering:inherit;text-transform:inherit;white-space:pre-wrap;word-break:keep-all;overflow-wrap:break-word;position:absolute;top:0;left:0;height:100%;width:100%;resize:none;color:inherit;overflow:hidden;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-text-fill-color:transparent;padding-top:10px;padding-right:10px;padding-bottom:10px;padding-left:10px" class="npm__react-simple-code-editor__textarea" autoCapitalize="off" autoComplete="off" autoCorrect="off" spellcheck="false" data-gramm="false">&lt;AmigaErrorBoundary show={false} error={&quot;Hello, I&#x27;m error&quot;} color=&quot;#f90&quot; backgroundColor=&quot;#a00&quot; &gt; &lt;p&gt;Set true the show prop and change the color&lt;/p&gt; &lt;/AmigaErrorBoundary&gt;</textarea><pre aria-hidden="true" style="margin:0;border:0;background:none;box-sizing:inherit;display:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-variant-ligatures:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;tab-size:inherit;text-indent:inherit;text-rendering:inherit;text-transform:inherit;white-space:pre-wrap;word-break:keep-all;overflow-wrap:break-word;position:relative;pointer-events:none;padding-top:10px;padding-right:10px;padding-bottom:10px;padding-left:10px"><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">AmigaErrorBoundary</span><span class="token tag" style="color:#00009f"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">show</span><span class="token tag script language-javascript script-punctuation punctuation" style="color:#393A34">=</span><span class="token tag script language-javascript punctuation" style="color:#393A34">{</span><span class="token tag script language-javascript boolean" style="color:#36acaa">false</span><span class="token tag script language-javascript punctuation" style="color:#393A34">}</span><span class="token tag" style="color:#00009f"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">error</span><span class="token tag script language-javascript script-punctuation punctuation" style="color:#393A34">=</span><span class="token tag script language-javascript punctuation" style="color:#393A34">{</span><span class="token tag script language-javascript string" style="color:#e3116c">&quot;Hello, I&#x27;m error&quot;</span><span class="token tag script language-javascript punctuation" style="color:#393A34">}</span><span class="token tag" style="color:#00009f"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">color</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">#f90</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag" style="color:#00009f"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">backgroundColor</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">#a00</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag" style="color:#00009f"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token tag" style="color:#00009f"></span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">p</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain">Set </span><span class="token boolean" style="color:#36acaa">true</span><span class="token plain"> the show prop and change the color</span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">p</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain"></span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag class-name" style="color:#00009f">AmigaErrorBoundary</span><span class="token tag punctuation" style="color:#393A34">&gt;</span></div></pre><style type="text/css"> /** * Reset the text fill color so that placeholder is visible */ .npm__react-simple-code-editor__textarea:empty { -webkit-text-fill-color: inherit !important; } /** * Hack to apply on some CSS on IE10 and IE11 */ @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /** * IE doesn't support '-webkit-text-fill-color' * So we use 'color: transparent' to make the text transparent on IE * Unlike other browsers, it doesn't affect caret color in IE */ .npm__react-simple-code-editor__textarea { color: transparent !important; } .npm__react-simple-code-editor__textarea::selection { background-color: #accef7 !important; color: transparent !important; } } </style></div></div></div><div><div class="" style="position:absolute;user-select:none;width:10px;height:100%;top:0px;right:-5px;cursor:col-resize"></div></div></div><h2 id="example"><a href="#example" class="css-1r0pe6c">Example</a></h2><div class="sc-gsTCUz bhdLno"><h1>AmigaErrorBoundary Example</h1><button>Show</button></div><h2 id="props"><a href="#props" class="css-1r0pe6c">Props</a></h2><style data-emotion-css="1sgzo20">.css-1sgzo20{margin-top:16px;margin-bottom:32px;border:1px solid var(--theme-ui-colors-border,#CED4DE);border-radius:4px;overflow:hidden;background-color:var(--theme-ui-colors-props-bg,#FCFBFA);color:var(--theme-ui-colors-props-text,#2D3747);font-size:20px;}</style><div data-testid="props" class="css-1sgzo20"><style data-emotion-css="1r75nr">.css-1r75nr{padding-top:8px;}.css-1r75nr + .css-1r75nr{border-top:1px solid var(--theme-ui-colors-border,#CED4DE);}</style><div data-testid="prop" class="css-1r75nr"><style data-emotion-css="4fkzcu">.css-4fkzcu{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}@media (min-width:920px){.css-4fkzcu{-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}}</style><div class="css-4fkzcu"><style data-emotion-css="1ftd3os">.css-1ftd3os{min-width:0;padding-bottom:8px;padding-left:16px;padding-right:16px;color:var(--theme-ui-colors-props-highlight,#0B5FFF);}.css-1ftd3os ~ .css-1ftd3os{background-color:red;}</style><div data-testid="prop-name" class="css-1ftd3os">error</div><style data-emotion-css="yo2zo6">.css-yo2zo6{min-width:0;padding-bottom:8px;padding-left:16px;padding-right:16px;color:var(--theme-ui-colors-props-text,#2D3747);}.css-yo2zo6 ~ .css-yo2zo6{background-color:red;}</style><div data-testid="prop-type" class="css-yo2zo6">any</div><style data-emotion-css="1774bts">.css-1774bts{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;padding-left:16px;padding-right:16px;-webkit-flex:1;-ms-flex:1;flex:1;}@media (max-width:920px){.css-1774bts{position:absolute;top:0;right:0;}}</style><div class="css-1774bts"><style data-emotion-css="fd04g0">.css-fd04g0{padding:0;outline:none;background:transparent;border:none;margin-top:0;margin-left:16px;color:var(--theme-ui-colors-props-defaultValue,#67788a);}.css-fd04g0:hover{cursor:pointer;}</style><button data-testid="prop-toggle-description" class="css-fd04g0"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg></button></div></div></div><div data-testid="prop" class="css-1r75nr"><div class="css-4fkzcu"><div data-testid="prop-name" class="css-1ftd3os">errorInfo</div><div data-testid="prop-type" class="css-yo2zo6">any</div><div class="css-1774bts"><button data-testid="prop-toggle-description" class="css-fd04g0"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg></button></div></div></div><div data-testid="prop" class="css-1r75nr"><div class="css-4fkzcu"><div data-testid="prop-name" class="css-1ftd3os">backgroundColor</div><div data-testid="prop-type" class="css-yo2zo6">string | undefined</div><style data-emotion-css="lwh5ha">.css-lwh5ha{min-width:0;padding-bottom:8px;padding-left:16px;padding-right:16px;color:var(--theme-ui-colors-props-defaultValue,#67788a);}.css-lwh5ha ~ .css-lwh5ha{background-color:red;}</style><div data-testid="prop-default-value" class="css-lwh5ha"><em>#111</em></div><div class="css-1774bts"><button data-testid="prop-toggle-description" class="css-fd04g0"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg></button></div></div></div><div data-testid="prop" class="css-1r75nr"><div class="css-4fkzcu"><div data-testid="prop-name" class="css-1ftd3os">color</div><div data-testid="prop-type" class="css-yo2zo6">string | undefined</div><div data-testid="prop-default-value" class="css-lwh5ha"><em>#b00</em></div><div class="css-1774bts"><button data-testid="prop-toggle-description" class="css-fd04g0"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg></button></div></div></div><div data-testid="prop" class="css-1r75nr"><div class="css-4fkzcu"><div data-testid="prop-name" class="css-1ftd3os">show</div><div data-testid="prop-type" class="css-yo2zo6">boolean | undefined</div><div data-testid="prop-default-value" class="css-lwh5ha"><em>false</em></div><div class="css-1774bts"><button data-testid="prop-toggle-description" class="css-fd04g0"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg></button></div></div></div></div></div></div></main></div></div></div><div id="gatsby-announcer" style="position:absolute;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0" aria-live="assertive" aria-atomic="true"></div></div><script src="https://cdn.polyfill.io/v3/polyfill.min.js?features=smoothscroll"></script><script id="gatsby-script-loader">/*<![CDATA[*/window.pagePath="/components/amigaerrorboundary";/*]]>*/</script><script id="gatsby-chunk-mapping">/*<![CDATA[*/window.___chunkMapping={"polyfill":["/polyfill-142efea6586fb717d347.js"],"app":["/app-6064ad2fe2b9b6d1fe89.js"],"component---src-pages-404-js":["/component---src-pages-404-js-ffa868c2f1266c51d289.js"],"component---srcdocs-components-amiga-error-baundary-amigaerrorboundary-mdx":["/component---srcdocs-components-amiga-error-baundary-amigaerrorboundary-mdx-1f318243d41b75b18411.js"],"component---srcdocs-getstarted-mdx":["/component---srcdocs-getstarted-mdx-9fc7c6473e75e9912a47.js"]};/*]]>*/</script><script src="/react-amiga-guru-meditation/polyfill-142efea6586fb717d347.js" nomodule=""></script><script src="/react-amiga-guru-meditation/component---srcdocs-components-amiga-error-baundary-amigaerrorboundary-mdx-1f318243d41b75b18411.js" async=""></script><script src="/react-amiga-guru-meditation/27dde964ec0edb61db759c8d54994a27d8d3b5a9-33fdebf56eb824084dd6.js" async=""></script><script src="/react-amiga-guru-meditation/bac1b955-b711947e81fae9e9bc2c.js" async=""></script><script src="/react-amiga-guru-meditation/app-6064ad2fe2b9b6d1fe89.js" async=""></script><script src="/react-amiga-guru-meditation/styles-bc72ca78f9bad9fb1f45.js" async=""></script><script src="/react-amiga-guru-meditation/framework-476be28629a883754470.js" async=""></script><script src="/react-amiga-guru-meditation/webpack-runtime-712514915ee32a0833a2.js" async=""></script></body></html>