@tanstack/solid-router/dist/cjs/CatchBoundary.cjs.map

Modern and scalable routing for Solid applications

{"version":3,"file":"CatchBoundary.cjs","names":["Solid","Dynamic","ErrorRouteComponent","CatchBoundary","props","getResetKey","children","JSX","Element","errorComponent","onCatch","error","Error","ParentProps","_$createComponent","ErrorBoundary","fallback","reset","createEffect","on","defer","component","ErrorComponent","show","setShow","createSignal","process","env","NODE_ENV","_el$","_tmpl$","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$5","$$click","d","_$insert","_c$","_$memo","_el$6","_tmpl$2","_el$7","_c$2","message","_el$8","_tmpl$3","_$delegateEvents"],"sources":["../../src/CatchBoundary.tsx"],"sourcesContent":["import * as Solid from 'solid-js'\nimport { Dynamic } from 'solid-js/web'\nimport type { ErrorRouteComponent } from './route'\n\nexport function CatchBoundary(\n  props: {\n    getResetKey: () => number | string\n    children: Solid.JSX.Element\n    errorComponent?: ErrorRouteComponent\n    onCatch?: (error: Error) => void\n  } & Solid.ParentProps,\n) {\n  return (\n    <Solid.ErrorBoundary\n      fallback={(error, reset) => {\n        props.onCatch?.(error)\n\n        Solid.createEffect(\n          Solid.on([props.getResetKey], () => reset(), { defer: true }),\n        )\n\n        return (\n          <Dynamic\n            component={props.errorComponent ?? ErrorComponent}\n            error={error}\n            reset={reset}\n          />\n        )\n      }}\n    >\n      {props.children}\n    </Solid.ErrorBoundary>\n  )\n}\n\nexport function ErrorComponent({ error }: { error: any }) {\n  const [show, setShow] = Solid.createSignal(\n    process.env.NODE_ENV !== 'production',\n  )\n\n  return (\n    <div style={{ padding: '.5rem', 'max-width': '100%' }}>\n      <div style={{ display: 'flex', 'align-items': 'center', gap: '.5rem' }}>\n        <strong style={{ 'font-size': '1rem' }}>Something went wrong!</strong>\n        <button\n          style={{\n            appearance: 'none',\n            'font-size': '.6em',\n            border: '1px solid currentColor',\n            padding: '.1rem .2rem',\n            'font-weight': 'bold',\n            'border-radius': '.25rem',\n          }}\n          onClick={() => setShow((d) => !d)}\n        >\n          {show() ? 'Hide Error' : 'Show Error'}\n        </button>\n      </div>\n      <div style={{ height: '.25rem' }} />\n      {show() ? (\n        <div>\n          <pre\n            style={{\n              'font-size': '.7em',\n              border: '1px solid red',\n              'border-radius': '.25rem',\n              padding: '.3rem',\n              color: 'red',\n              overflow: 'auto',\n            }}\n          >\n            {error.message ? <code>{error.message}</code> : null}\n          </pre>\n        </div>\n      ) : null}\n    </div>\n  )\n}\n"],"mappings":";;;;;;AAIA,SAAgBG,cACdC,OAMA;CACA,QAAA,GAAA,aAAA,iBACGJ,SAAMe,eAAa;EAClBC,WAAWL,OAAOM,UAAU;GAC1Bb,MAAMM,UAAUC,KAAK;GAErBX,SAAMkB,aACJlB,SAAMmB,GAAG,CAACf,MAAMC,WAAW,SAASY,MAAM,GAAG,EAAEG,OAAO,KAAK,CAAC,CAC9D;GAEA,QAAA,GAAA,aAAA,iBACGnB,aAAAA,SAAO;IAAA,IACNoB,YAAS;KAAA,OAAEjB,MAAMK,kBAAkBa;IAAc;IAC1CX;IACAM;GAAK,CAAA;EAGlB;EAAC,IAAAX,WAAA;GAAA,OAEAF,MAAME;EAAQ;CAAA,CAAA;AAGrB;AAEA,SAAgBgB,eAAe,EAAEX,SAAyB;CACxD,MAAM,CAACY,MAAMC,WAAWxB,SAAMyB,aAAAA,QAAAA,IAAAA,aACH,YAC3B;CAEA,cAAA;EAAA,IAAAI,OAAAC,OAAA,GAAAC,QAAAF,KAAAG,YAAAE,QAAAH,MAAAC,WAAAG;EAAAJ,MAAAI;EAAAD,MAAAG,gBAauBb,SAASc,MAAM,CAACA,CAAC;EAACC,CAAAA,GAAAA,aAAAA,QAAAL,aAEhCX,KAAK,IAAI,eAAe,YAAY;EAAAgB,CAAAA,GAAAA,aAAAA,QAAAV,aAAA;GAAA,IAAAW,OAAAA,GAAAA,aAAAA,YAAA,CAAA,CAIxCjB,KAAK,CAAC;GAAA,aAANiB,IAAA,WAAA;IAAA,IAAAE,QAAAC,QAAA,GAAAC,QAAAF,MAAAV;IAAAO,CAAAA,GAAAA,aAAAA,QAAAK,cAAA;KAAA,IAAAC,QAAAA,GAAAA,aAAAA,YAAA,CAAA,CAYMlC,MAAMmC,OAAO;KAAA,aAAbD,KAAA,WAAA;MAAA,IAAAE,QAAAC,QAAA;MAAAT,CAAAA,GAAAA,aAAAA,QAAAQ,aAAuBpC,MAAMmC,OAAO;MAAA,OAAAC;KAAA,GAAA,IAAW;IAAI,GAAA,CAAA;IAAA,OAAAL;GAAA,GAAA,IAGtD;EAAI,GAAA,GAAA,IAAA;EAAA,OAAAb;CAAA,GAAA;AAGd;iCAAC,CAAA,OAAA,CAAA"}