import{_ as i,k as r,t as a}from"./index--mkBkEwj.js";function n(t){const e=Object.assign({p:"p",code:"code",h2:"h2",a:"a",div:"div",style:"style",script:"script",figure:"figure",figcaption:"figcaption",pre:"pre",span:"span",button:"button"},i(),t.components);return[r(e.p,{get children(){return["The ",r(e.code,{children:"App"}),` component is the isomorphic (shared on server and browser) entry point into your application.
This is where the code runs on both sides.
This is like the classic entry point where you can define your router, and other top level components.`]}}),`
`,r(e.h2,{id:"basic-example-with-routing",get children(){return r(e.a,{className:"heading",href:"#basic-example-with-routing",children:"Basic example (with routing)"})}}),`
`,r(e.p,{get children(){return["This is where routers setup navigation between the pages discovered by the ",r(e.a,{href:"/solid-start/reference/routing/file-routes",get children(){return r(e.code,{children:"FileRouter"})}}),"."]}}),`
`,r(e.div,{className:"expressive-code",get children(){return[r(e.style,{children:`.expressive-code{font-family:var(--ec-uiFontFml);font-size:var(--ec-uiFontSize);font-weight:var(--ec-uiFontWg);line-height:var(--ec-uiLineHt);text-size-adjust:none;-webkit-text-size-adjust:none}.expressive-code *:not(path){all:revert;box-sizing:border-box}.expressive-code pre{display:flex;margin:0;padding:0;border:var(--ec-brdWd) solid var(--ec-brdCol);border-radius:calc(var(--ec-brdRad) + var(--ec-brdWd));background:var(--ec-codeBg)}.expressive-code pre:focus-visible{outline:3px solid var(--ec-focusBrd);outline-offset:-3px}.expressive-code pre > code{all:unset;display:block;flex:1 0 100%;padding:var(--ec-codePadBlk) 0;color:var(--ec-codeFg);font-family:var(--ec-codeFontFml);font-size:var(--ec-codeFontSize);font-weight:var(--ec-codeFontWg);line-height:var(--ec-codeLineHt)}.expressive-code pre{overflow-x:auto}.expressive-code pre.wrap .ec-line .code{white-space:pre-wrap;overflow-wrap:break-word;min-width:min(20ch, var(--ecMaxLine, 20ch))}.expressive-code pre.wrap .ec-line .code span.indent{white-space:pre}.expressive-code pre::-webkit-scrollbar,.expressive-code pre::-webkit-scrollbar-track{background-color:inherit;border-radius:calc(var(--ec-brdRad) + var(--ec-brdWd));border-top-left-radius:0;border-top-right-radius:0}.expressive-code pre::-webkit-scrollbar-thumb{background-color:var(--ec-sbThumbCol);border:4px solid transparent;background-clip:content-box;border-radius:10px}.expressive-code pre::-webkit-scrollbar-thumb:hover{background-color:var(--ec-sbThumbHoverCol)}.expressive-code .ec-line{direction:ltr;unicode-bidi:isolate;display:grid;grid-template-areas:'gutter code';grid-template-columns:auto 1fr;position:relative}.expressive-code .ec-line .gutter{grid-area:gutter;color:var(--ec-gtrFg)}.expressive-code .ec-line .gutter > *{pointer-events:none;user-select:none;-webkit-user-select:none}.expressive-code .ec-line .gutter ~ .code{--ecLineBrdCol:var(--ec-gtrBrdCol)}.expressive-code .ec-line.highlight .gutter{color:var(--ec-gtrHlFg)}.expressive-code .ec-line .code{grid-area:code;position:relative;box-sizing:content-box;padding-inline-start:calc(var(--ecIndent, 0ch) + var(--ec-codePadInl) - var(--ecGtrBrdWd));padding-inline-end:var(--ec-codePadInl);text-indent:calc(var(--ecIndent, 0ch) * -1)}.expressive-code .ec-line .code::before,.expressive-code .ec-line .code::after,.expressive-code .ec-line .code :where(*){text-indent:0}.expressive-code .ec-line .code{--ecGtrBrdWd:var(--ec-gtrBrdWd);border-inline-start:var(--ecGtrBrdWd) solid var(--ecLineBrdCol, transparent)}.expressive-code :nth-child(1 of .ec-line) .code{padding-inline-end:calc(2rem + var(--ec-codePadInl))}.expressive-code .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}.expressive-code .ec-line.mark{--tmLineBgCol:var(--ec-tm-markBg)}.expressive-code .ec-line.mark .code{--ecLineBrdCol:var(--ec-tm-markBrdCol)}.expressive-code .ec-line.ins{--tmLineBgCol:var(--ec-tm-insBg);--tmLabel:var(--ec-tm-insDiffIndContent)}.expressive-code .ec-line.ins .code{--ecLineBrdCol:var(--ec-tm-insBrdCol)}.expressive-code .ec-line.ins .code::before{color:var(--ec-tm-insDiffIndCol)}.expressive-code .ec-line.del{--tmLineBgCol:var(--ec-tm-delBg);--tmLabel:var(--ec-tm-delDiffIndContent)}.expressive-code .ec-line.del .code{--ecLineBrdCol:var(--ec-tm-delBrdCol)}.expressive-code .ec-line.del .code::before{color:var(--ec-tm-delDiffIndCol)}.expressive-code .ec-line.mark,.expressive-code .ec-line.ins,.expressive-code .ec-line.del{background:var(--tmLineBgCol)}.expressive-code .ec-line.mark .code,.expressive-code .ec-line.ins .code,.expressive-code .ec-line.del .code{--ecGtrBrdWd:var(--ec-tm-lineMarkerAccentWd)}.expressive-code .ec-line.mark .code::before,.expressive-code .ec-line.ins .code::before,.expressive-code .ec-line.del .code::before{display:block;position:absolute;left:0;box-sizing:border-box;content:var(--tmLabel, ' ');padding-inline-start:var(--ec-tm-lineDiffIndMargLeft);text-align:center;white-space:pre}.expressive-code .ec-line.mark.tm-label .code::before,.expressive-code .ec-line.ins.tm-label .code::before,.expressive-code .ec-line.del.tm-label .code::before{background:var(--ecLineBrdCol);padding:0 calc(var(--ec-tm-lineMarkerLabelPadInl) + var(--ec-tm-lineMarkerAccentWd)) 0 var(--ec-tm-lineMarkerLabelPadInl);color:var(--ec-tm-lineMarkerLabelCol)}.expressive-code .ec-line mark{--tmInlineBgCol:var(--ec-tm-markBg);--tmInlineBrdCol:var(--ec-tm-markBrdCol)}.expressive-code .ec-line ins{--tmInlineBgCol:var(--ec-tm-insBg);--tmInlineBrdCol:var(--ec-tm-insBrdCol)}.expressive-code .ec-line del{--tmInlineBgCol:var(--ec-tm-delBg);--tmInlineBrdCol:var(--ec-tm-delBrdCol)}.expressive-code .ec-line mark,.expressive-code .ec-line ins,.expressive-code .ec-line del{all:unset;display:inline-block;position:relative;--tmBrdL:var(--ec-tm-inlMarkerBrdWd);--tmBrdR:var(--ec-tm-inlMarkerBrdWd);--tmRadL:var(--ec-tm-inlMarkerBrdRad);--tmRadR:var(--ec-tm-inlMarkerBrdRad);margin-inline:0.025rem;padding-inline:var(--ec-tm-inlMarkerPad);border-radius:var(--tmRadL) var(--tmRadR) var(--tmRadR) var(--tmRadL);background:var(--tmInlineBgCol);background-clip:padding-box}.expressive-code .ec-line mark.open-start,.expressive-code .ec-line ins.open-start,.expressive-code .ec-line del.open-start{margin-inline-start:0;padding-inline-start:0;--tmBrdL:0px;--tmRadL:0}.expressive-code .ec-line mark.open-end,.expressive-code .ec-line ins.open-end,.expressive-code .ec-line del.open-end{margin-inline-end:0;padding-inline-end:0;--tmBrdR:0px;--tmRadR:0}.expressive-code .ec-line mark::before,.expressive-code .ec-line ins::before,.expressive-code .ec-line del::before{content:'';position:absolute;pointer-events:none;display:inline-block;inset:0;border-radius:var(--tmRadL) var(--tmRadR) var(--tmRadR) var(--tmRadL);border:var(--ec-tm-inlMarkerBrdWd) solid var(--tmInlineBrdCol);border-inline-width:var(--tmBrdL) var(--tmBrdR)}.expressive-code .frame{all:unset;position:relative;display:block;--header-border-radius:calc(var(--ec-brdRad) + var(--ec-brdWd));--tab-border-radius:calc(var(--ec-frm-edTabBrdRad) + var(--ec-brdWd));--button-spacing:0.4rem;--code-background:var(--ec-frm-edBg);border-radius:var(--header-border-radius);box-shadow:var(--ec-frm-frameBoxShdCssVal)}.expressive-code .frame .header{display:none;z-index:1;position:relative;border-radius:var(--header-border-radius) var(--header-border-radius) 0 0}.expressive-code .frame.has-title pre,.expressive-code .frame.has-title code,.expressive-code .frame.is-terminal pre,.expressive-code .frame.is-terminal code{border-top:none;border-top-left-radius:0;border-top-right-radius:0}.expressive-code .frame .title:empty:before{content:'\\a0'}.expressive-code .frame.has-title:not(.is-terminal){--button-spacing:calc(1.9rem + 2 * (var(--ec-uiPadBlk) + var(--ec-frm-edActTabIndHt)))}.expressive-code .frame.has-title:not(.is-terminal) .title{position:relative;color:var(--ec-frm-edActTabFg);background:var(--ec-frm-edActTabBg);background-clip:padding-box;margin-block-start:var(--ec-frm-edTabsMargBlkStart);padding:calc(var(--ec-uiPadBlk) + var(--ec-frm-edActTabIndHt)) var(--ec-uiPadInl);border:var(--ec-brdWd) solid var(--ec-frm-edActTabBrdCol);border-radius:var(--tab-border-radius) var(--tab-border-radius) 0 0;border-bottom:none;overflow:hidden}.expressive-code .frame.has-title:not(.is-terminal) .title::after{content:'';position:absolute;pointer-events:none;inset:0;border-top:var(--ec-frm-edActTabIndHt) solid var(--ec-frm-edActTabIndTopCol);border-bottom:var(--ec-frm-edActTabIndHt) solid var(--ec-frm-edActTabIndBtmCol)}.expressive-code .frame.has-title:not(.is-terminal) .header{display:flex;background:linear-gradient(to top, var(--ec-frm-edTabBarBrdBtmCol) var(--ec-brdWd), transparent var(--ec-brdWd)),linear-gradient(var(--ec-frm-edTabBarBg), var(--ec-frm-edTabBarBg));background-repeat:no-repeat;padding-inline-start:var(--ec-frm-edTabsMargInlStart)}.expressive-code .frame.has-title:not(.is-terminal) .header::before{content:'';position:absolute;pointer-events:none;inset:0;border:var(--ec-brdWd) solid var(--ec-frm-edTabBarBrdCol);border-radius:inherit;border-bottom:none}.expressive-code .frame.is-terminal{--button-spacing:calc(1.9rem + var(--ec-brdWd) + 2 * var(--ec-uiPadBlk));--code-background:var(--ec-frm-trmBg)}.expressive-code .frame.is-terminal .header{display:flex;align-items:center;justify-content:center;padding-block:var(--ec-uiPadBlk);padding-block-end:calc(var(--ec-uiPadBlk) + var(--ec-brdWd));position:relative;font-weight:500;letter-spacing:0.025ch;color:var(--ec-frm-trmTtbFg);background:var(--ec-frm-trmTtbBg);border:var(--ec-brdWd) solid var(--ec-brdCol);border-bottom:none}.expressive-code .frame.is-terminal .header::before{content:'';position:absolute;pointer-events:none;left:var(--ec-uiPadInl);width:2.1rem;height:0.56rem;line-height:0;background-color:var(--ec-frm-trmTtbDotsFg);opacity:var(--ec-frm-trmTtbDotsOpa);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 16' preserveAspectRatio='xMidYMid meet'%3E%3Ccircle cx='8' cy='8' r='8'/%3E%3Ccircle cx='30' cy='8' r='8'/%3E%3Ccircle cx='52' cy='8' r='8'/%3E%3C/svg%3E");-webkit-mask-repeat:no-repeat;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 16' preserveAspectRatio='xMidYMid meet'%3E%3Ccircle cx='8' cy='8' r='8'/%3E%3Ccircle cx='30' cy='8' r='8'/%3E%3Ccircle cx='52' cy='8' r='8'/%3E%3C/svg%3E");mask-repeat:no-repeat}.expressive-code .frame.is-terminal .header::after{content:'';position:absolute;pointer-events:none;inset:0;border-bottom:var(--ec-brdWd) solid var(--ec-frm-trmTtbBrdBtmCol)}.expressive-code .frame pre{background:var(--code-background)}.expressive-code .copy{display:flex;gap:0.25rem;flex-direction:row;position:absolute;inset-block-start:calc(var(--ec-brdWd) + var(--button-spacing));inset-inline-end:calc(var(--ec-brdWd) + var(--ec-uiPadInl) / 2);direction:ltr;unicode-bidi:isolate}.expressive-code .copy button{position:relative;align-self:flex-end;margin:0;padding:0;border:none;border-radius:0.2rem;z-index:1;cursor:pointer;transition-property:opacity, background, border-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.25, 0.46, 0.45, 0.94);width:2.5rem;height:2.5rem;background:var(--code-background);opacity:0.75}.expressive-code .copy button div{position:absolute;inset:0;border-radius:inherit;background:var(--ec-frm-inlBtnBg);opacity:var(--ec-frm-inlBtnBgIdleOpa);transition-property:inherit;transition-duration:inherit;transition-timing-function:inherit}.expressive-code .copy button::before{content:'';position:absolute;pointer-events:none;inset:0;border-radius:inherit;border:var(--ec-brdWd) solid var(--ec-frm-inlBtnBrd);opacity:var(--ec-frm-inlBtnBrdOpa)}.expressive-code .copy button::after{content:'';position:absolute;pointer-events:none;inset:0;background-color:var(--ec-frm-inlBtnFg);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75'%3E%3Cpath d='M3 19a2 2 0 0 1-1-2V2a2 2 0 0 1 1-1h13a2 2 0 0 1 2 1'/%3E%3Crect x='6' y='5' width='16' height='18' rx='1.5' ry='1.5'/%3E%3C/svg%3E");-webkit-mask-repeat:no-repeat;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75'%3E%3Cpath d='M3 19a2 2 0 0 1-1-2V2a2 2 0 0 1 1-1h13a2 2 0 0 1 2 1'/%3E%3Crect x='6' y='5' width='16' height='18' rx='1.5' ry='1.5'/%3E%3C/svg%3E");mask-repeat:no-repeat;margin:0.475rem;line-height:0}.expressive-code .copy button:hover,.expressive-code .copy button:focus:focus-visible{opacity:1}.expressive-code .copy button:hover div,.expressive-code .copy button:focus:focus-visible div{opacity:var(--ec-frm-inlBtnBgHoverOrFocusOpa)}.expressive-code .copy button:active{opacity:1}.expressive-code .copy button:active div{opacity:var(--ec-frm-inlBtnBgActOpa)}.expressive-code .copy .feedback{--tooltip-arrow-size:0.35rem;--tooltip-bg:var(--ec-frm-tooltipSuccessBg);color:var(--ec-frm-tooltipSuccessFg);pointer-events:none;user-select:none;-webkit-user-select:none;position:relative;align-self:center;background-color:var(--tooltip-bg);z-index:99;padding:0.125rem 0.75rem;border-radius:0.2rem;margin-inline-end:var(--tooltip-arrow-size);opacity:0;transition-property:opacity, transform;transition-duration:0.2s;transition-timing-function:ease-in-out;transform:translate3d(0, 0.25rem, 0)}.expressive-code .copy .feedback::after{content:'';position:absolute;pointer-events:none;top:calc(50% - var(--tooltip-arrow-size));inset-inline-end:calc(-2 * (var(--tooltip-arrow-size) - 0.5px));border:var(--tooltip-arrow-size) solid transparent;border-inline-start-color:var(--tooltip-bg)}.expressive-code .copy .feedback.show{opacity:1;transform:translate3d(0, 0, 0)}@media (hover: hover){.expressive-code{}.expressive-code .copy button{opacity:0;width:2rem;height:2rem}.expressive-code .frame:hover .copy button:not(:hover),.expressive-code .frame:focus-within :focus-visible ~ .copy button:not(:hover),.expressive-code .frame .copy .feedback.show ~ button:not(:hover){opacity:0.75}}:root,:root:not([data-theme='min-light']) .expressive-code[data-theme='min-light']{--ec-brdRad:0.3rem;--ec-brdWd:1.5px;--ec-brdCol:#ffffff00;--ec-codeFontFml:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,'Liberation Mono','Courier New',monospace;--ec-codeFontSize:0.85rem;--ec-codeFontWg:400;--ec-codeLineHt:1.65;--ec-codePadBlk:1rem;--ec-codePadInl:1.35rem;--ec-codeBg:#ffffff;--ec-codeFg:#212121;--ec-codeSelBg:#add6ff;--ec-gtrFg:#8d8d8d;--ec-gtrBrdCol:#8d8d8d33;--ec-gtrBrdWd:1.5px;--ec-gtrHlFg:#757575;--ec-uiFontFml:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol','Noto Color Emoji';--ec-uiFontSize:0.9rem;--ec-uiFontWg:400;--ec-uiLineHt:1.65;--ec-uiPadBlk:0.25rem;--ec-uiPadInl:1rem;--ec-uiSelBg:#eee;--ec-uiSelFg:#212121;--ec-focusBrd:#d0d0d0;--ec-sbThumbCol:#64646466;--ec-sbThumbHoverCol:#646464b2;--ec-tm-lineMarkerAccentMarg:0rem;--ec-tm-lineMarkerAccentWd:0.15rem;--ec-tm-lineMarkerLabelPadInl:0.2rem;--ec-tm-lineMarkerLabelCol:white;--ec-tm-lineDiffIndMargLeft:0.3rem;--ec-tm-inlMarkerBrdWd:1.5px;--ec-tm-inlMarkerBrdRad:0.2rem;--ec-tm-inlMarkerPad:0.15rem;--ec-tm-insDiffIndContent:'+';--ec-tm-delDiffIndContent:'-';--ec-tm-markBg:#9fb6ff80;--ec-tm-markBrdCol:#5570b3d0;--ec-tm-insBg:#94c68480;--ec-tm-insBrdCol:#4e7e41d0;--ec-tm-insDiffIndCol:#3a692fd0;--ec-tm-delBg:#fea09280;--ec-tm-delBrdCol:#ae594fd0;--ec-tm-delDiffIndCol:#97453dd0;--ec-frm-shdCol:#00000028;--ec-frm-frameBoxShdCssVal:0.1rem 0.1rem 0.2rem #00000028;--ec-frm-edActTabBg:#ffffff;--ec-frm-edActTabFg:#424242;--ec-frm-edActTabBrdCol:transparent;--ec-frm-edActTabIndHt:1.5px;--ec-frm-edActTabIndTopCol:null;--ec-frm-edActTabIndBtmCol:#fff;--ec-frm-edTabsMargInlStart:0;--ec-frm-edTabsMargBlkStart:0;--ec-frm-edTabBrdRad:0.3rem;--ec-frm-edTabBarBg:#f6f6f6;--ec-frm-edTabBarBrdCol:#ffffff00;--ec-frm-edTabBarBrdBtmCol:#fff;--ec-frm-edBg:#ffffff;--ec-frm-trmTtbFg:#333333;--ec-frm-trmTtbDotsFg:#333333;--ec-frm-trmTtbDotsOpa:0.15;--ec-frm-trmTtbBg:#f6f6f6;--ec-frm-trmTtbBrdBtmCol:#ffffff00;--ec-frm-trmBg:#fff;--ec-frm-inlBtnFg:#212121;--ec-frm-inlBtnBg:#212121;--ec-frm-inlBtnBgIdleOpa:0;--ec-frm-inlBtnBgHoverOrFocusOpa:0.2;--ec-frm-inlBtnBgActOpa:0.3;--ec-frm-inlBtnBrd:#212121;--ec-frm-inlBtnBrdOpa:0.4;--ec-frm-tooltipSuccessBg:#4c8300;--ec-frm-tooltipSuccessFg:white}.expressive-code .ec-line :where(span[style^='--']:not([class])),:root:not([data-theme='min-light']) .expressive-code[data-theme='min-light'] .ec-line :where(span[style^='--']:not([class])){color:var(--0, inherit);font-style:var(--0fs, inherit);font-weight:var(--0fw, inherit);text-decoration:var(--0td, inherit)}@media (prefers-color-scheme: dark){:root:not([data-theme='min-light']){--ec-brdCol:#0f111a60;--ec-codeBg:#0f111a;--ec-codeFg:#babed8;--ec-codeSelBg:#717cb450;--ec-gtrFg:#636674fe;--ec-gtrBrdCol:#63667433;--ec-gtrHlFg:#767c92;--ec-uiSelBg:#00000050;--ec-uiSelFg:#80cbc4;--ec-focusBrd:#ffffff00;--ec-sbThumbCol:#8f93a220;--ec-sbThumbHoverCol:#8f93a284;--ec-tm-markBg:#264a8980;--ec-tm-insBg:#26561c80;--ec-tm-insDiffIndCol:#7eb070d0;--ec-tm-delBg:#81322b80;--ec-tm-delDiffIndCol:#e68a7ed0;--ec-frm-shdCol:#00000030;--ec-frm-frameBoxShdCssVal:0.1rem 0.1rem 0.2rem #00000030;--ec-frm-edActTabBg:#0f111a;--ec-frm-edActTabFg:#ffffff;--ec-frm-edActTabIndBtmCol:#80cbc4;--ec-frm-edTabBarBg:#0f111a;--ec-frm-edTabBarBrdCol:#0f111a60;--ec-frm-edTabBarBrdBtmCol:transparent;--ec-frm-edBg:#0f111a;--ec-frm-trmTtbFg:#babed8;--ec-frm-trmTtbDotsFg:#babed8;--ec-frm-trmTtbBg:#0f111a;--ec-frm-trmTtbBrdBtmCol:#0f111a60;--ec-frm-trmBg:#0f111a;--ec-frm-inlBtnFg:#babed8;--ec-frm-inlBtnBg:#babed8;--ec-frm-inlBtnBrd:#babed8;--ec-frm-tooltipSuccessBg:#687b4b}:root:not([data-theme='min-light']) .expressive-code .ec-line :where(span[style^='--']:not([class])){color:var(--1, inherit);font-style:var(--1fs, inherit);font-weight:var(--1fw, inherit);text-decoration:var(--1td, inherit)}}:root[data-theme='material-theme-ocean'] .expressive-code:not([data-theme='min-light']),.expressive-code[data-theme='material-theme-ocean']{--ec-brdCol:#0f111a60;--ec-codeBg:#0f111a;--ec-codeFg:#babed8;--ec-codeSelBg:#717cb450;--ec-gtrFg:#636674fe;--ec-gtrBrdCol:#63667433;--ec-gtrHlFg:#767c92;--ec-uiSelBg:#00000050;--ec-uiSelFg:#80cbc4;--ec-focusBrd:#ffffff00;--ec-sbThumbCol:#8f93a220;--ec-sbThumbHoverCol:#8f93a284;--ec-tm-markBg:#264a8980;--ec-tm-insBg:#26561c80;--ec-tm-insDiffIndCol:#7eb070d0;--ec-tm-delBg:#81322b80;--ec-tm-delDiffIndCol:#e68a7ed0;--ec-frm-shdCol:#00000030;--ec-frm-frameBoxShdCssVal:0.1rem 0.1rem 0.2rem #00000030;--ec-frm-edActTabBg:#0f111a;--ec-frm-edActTabFg:#ffffff;--ec-frm-edActTabIndBtmCol:#80cbc4;--ec-frm-edTabBarBg:#0f111a;--ec-frm-edTabBarBrdCol:#0f111a60;--ec-frm-edTabBarBrdBtmCol:transparent;--ec-frm-edBg:#0f111a;--ec-frm-trmTtbFg:#babed8;--ec-frm-trmTtbDotsFg:#babed8;--ec-frm-trmTtbBg:#0f111a;--ec-frm-trmTtbBrdBtmCol:#0f111a60;--ec-frm-trmBg:#0f111a;--ec-frm-inlBtnFg:#babed8;--ec-frm-inlBtnBg:#babed8;--ec-frm-inlBtnBrd:#babed8;--ec-frm-tooltipSuccessBg:#687b4b}:root[data-theme='material-theme-ocean'] .expressive-code:not([data-theme='min-light']) .ec-line :where(span[style^='--']:not([class])),.expressive-code[data-theme='material-theme-ocean'] .ec-line :where(span[style^='--']:not([class])){color:var(--1, inherit);font-style:var(--1fs, inherit);font-weight:var(--1fw, inherit);text-decoration:var(--1td, inherit)}`}),r(e.script,{type:"module",children:'(()=>{function i(n){let e=document.createElement("pre");Object.assign(e.style,{opacity:"0",pointerEvents:"none",position:"absolute",overflow:"hidden",left:"0",top:"0",width:"20px",height:"20px",webkitUserSelect:"auto",userSelect:"all"}),e.ariaHidden="true",e.textContent=n,document.body.appendChild(e);let r=document.createRange();r.selectNode(e);let o=getSelection();if(!o)return!1;o.removeAllRanges(),o.addRange(r);let a=!1;try{a=document.execCommand("copy")}finally{o.removeAllRanges(),document.body.removeChild(e)}return a}async function l(n){let e=n.currentTarget,r=e.dataset,o=!1,a=r.code.replace(/\\u007f/g,`\n`);try{await navigator.clipboard.writeText(a),o=!0}catch{o=i(a)}if(!o||e.parentNode?.querySelector(".feedback"))return;let t=document.createElement("div");t.classList.add("feedback"),t.append(r.copied),e.before(t),t.offsetWidth,requestAnimationFrame(()=>t?.classList.add("show"));let c=()=>!t||t.classList.remove("show"),d=()=>{!t||parseFloat(getComputedStyle(t).opacity)>0||(t.remove(),t=void 0)};setTimeout(c,1500),setTimeout(d,2500),e.addEventListener("blur",c),t.addEventListener("transitioncancel",d),t.addEventListener("transitionend",d)}var s=n=>{n.querySelectorAll&&n.querySelectorAll(".expressive-code .copy button").forEach(e=>e.addEventListener("click",l))};s(document);var u=new MutationObserver(n=>n.forEach(e=>e.addedNodes.forEach(r=>{s(r)})));u.observe(document.body,{childList:!0,subtree:!0});document.addEventListener("astro:page-load",()=>{s(document)});})();'}),r(e.figure,{className:"frame",get children(){return[r(e.figcaption,{className:"header"}),r(e.pre,{tabIndex:"0",get children(){return r(e.code,{get children(){return[r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"import"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"{"}),r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:"A"}),r(e.span,{style:{"--0":"#212121","--1":"#89DDFF"},children:","}),r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:"Router"}),r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"}"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"from"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#1E7734","--1":"#89DDFF"},children:'"'}),r(e.span,{style:{"--0":"#1E7734","--1":"#C3E88D"},children:"@solidjs/router"}),r(e.span,{style:{"--0":"#1E7734","--1":"#89DDFF"},children:'"'}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:";"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"import"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"{"}),r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:"FileRoutes"}),r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"}"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"from"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#1E7734","--1":"#89DDFF"},children:'"'}),r(e.span,{style:{"--0":"#1E7734","--1":"#C3E88D"},children:"@solidjs/start/router"}),r(e.span,{style:{"--0":"#1E7734","--1":"#89DDFF"},children:'"'}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:";"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"import"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"{"}),r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:"Suspense"}),r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"}"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"from"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#1E7734","--1":"#89DDFF"},children:'"'}),r(e.span,{style:{"--0":"#1E7734","--1":"#C3E88D"},children:"solid-js"}),r(e.span,{style:{"--0":"#1E7734","--1":"#89DDFF"},children:'"'}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:";"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",children:`
`})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"export"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"default"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#C62C2C","--1":"#C792EA"},children:"function"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#6F42C1","--1":"#82AAFF"},children:"App"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"()"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"{"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",children:"  "}),r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"return"}),r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:" ("})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E"},children:"    "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"<"}),r(e.span,{style:{"--0":"#1669BB","--1":"#FFCB6B"},children:"Router"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",children:"      "}),r(e.span,{style:{"--0":"#6F42C1","--1":"#C792EA"},children:"root"}),r(e.span,{style:{"--1":"#89DDFF"},get children(){return[r(e.span,{style:{"--0":"#C62C2C"},children:"="}),r(e.span,{style:{"--0":"#24292E"},children:"{("})]}}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8","--1fs":"italic"},children:"props"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:")"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#C62C2C","--1":"#C792EA"},children:"=>"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" ("})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E"},children:"          "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"<"}),r(e.span,{style:{"--0":"#1669BB","--1":"#FFCB6B"},children:"A"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:" "}),r(e.span,{style:{"--0":"#6F42C1","--1":"#C792EA"},children:"href"}),r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF"},children:"="}),r(e.span,{style:{"--0":"#1E7734","--1":"#89DDFF"},children:'"'}),r(e.span,{style:{"--0":"#1E7734","--1":"#C3E88D"},children:"/"}),r(e.span,{style:{"--0":"#1E7734","--1":"#89DDFF"},children:'"'}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:"Index"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"</"}),r(e.span,{style:{"--0":"#1669BB","--1":"#FFCB6B"},children:"A"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E"},children:"          "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"<"}),r(e.span,{style:{"--0":"#1669BB","--1":"#FFCB6B"},children:"A"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:" "}),r(e.span,{style:{"--0":"#6F42C1","--1":"#C792EA"},children:"href"}),r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF"},children:"="}),r(e.span,{style:{"--0":"#1E7734","--1":"#89DDFF"},children:'"'}),r(e.span,{style:{"--0":"#1E7734","--1":"#C3E88D"},children:"/about"}),r(e.span,{style:{"--0":"#1E7734","--1":"#89DDFF"},children:'"'}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:"About"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"</"}),r(e.span,{style:{"--0":"#1669BB","--1":"#FFCB6B"},children:"A"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E"},children:"          "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"<"}),r(e.span,{style:{"--0":"#1669BB","--1":"#FFCB6B"},children:"Suspense"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">{"}),r(e.span,{style:{"--0":"#1669BB","--1":"#BABED8"},children:"props"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"."}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:"children"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"}</"}),r(e.span,{style:{"--0":"#1669BB","--1":"#FFCB6B"},children:"Suspense"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:"      "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:")"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"}"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"    "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E"},children:"      "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"<"}),r(e.span,{style:{"--0":"#1669BB","--1":"#FFCB6B"},children:"FileRoutes"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:" />"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E"},children:"    "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"</"}),r(e.span,{style:{"--0":"#1669BB","--1":"#FFCB6B"},children:"Router"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:"  "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:")"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:";"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"}"})}})}})]}})}}),r(e.div,{className:"copy",get children(){return r(e.button,{title:"Copy to clipboard","data-copied":"Copied!","data-code":'import { A, Router } from "@solidjs/router";import { FileRoutes } from "@solidjs/start/router";import { Suspense } from "solid-js";export default function App() {  return (    <Router      root={(props) => (          <A href="/">Index</A>          <A href="/about">About</A>          <Suspense>{props.children}</Suspense>      )}    >      <FileRoutes />    </Router>  );}',get children(){return r(e.div,{})}})}})]}})]}}),`
`,r(e.p,{get children(){return["See a similar example in ",r(e.a,{href:"https://stackblitz.com/github/solidjs/solid-start/tree/main/examples/basic?file=src%2Fapp.tsx",children:"StackBlitz"})]}}),`
`,r(e.h2,{id:"bare-example-no-routing",get children(){return r(e.a,{className:"heading",href:"#bare-example-no-routing",children:"Bare example (no routing)"})}}),`
`,r(e.p,{children:"Since SolidStart does not come packaged with a router, you can simply return your template of choice:"}),`
`,r(e.div,{className:"expressive-code",get children(){return r(e.figure,{className:"frame",get children(){return[r(e.figcaption,{className:"header"}),r(e.pre,{tabIndex:"0",get children(){return r(e.code,{get children(){return[r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"export"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"default"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#C62C2C","--1":"#C792EA"},children:"function"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#6F42C1","--1":"#82AAFF"},children:"App"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"()"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:" "}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"{"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",children:"  "}),r(e.span,{style:{"--0":"#C62C2C","--1":"#89DDFF","--1fs":"italic"},children:"return"}),r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:" ("})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E"},children:"    "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"<"}),r(e.span,{style:{"--0":"#1E7734","--1":"#F07178"},children:"main"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E"},children:"      "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"<"}),r(e.span,{style:{"--0":"#1E7734","--1":"#F07178"},children:"h1"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">"}),r(e.span,{style:{"--0":"#24292E","--1":"#BABED8"},children:"Hello world!"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"</"}),r(e.span,{style:{"--0":"#1E7734","--1":"#F07178"},children:"h1"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E"},children:"    "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"</"}),r(e.span,{style:{"--0":"#1E7734","--1":"#F07178"},children:"main"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:">"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return[r(e.span,{className:"indent",get children(){return r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:"  "})}}),r(e.span,{style:{"--0":"#24292E","--1":"#F07178"},children:")"}),r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:";"})]}})}}),r(e.div,{className:"ec-line",get children(){return r(e.div,{className:"code",get children(){return r(e.span,{style:{"--0":"#24292E","--1":"#89DDFF"},children:"}"})}})}})]}})}}),r(e.div,{className:"copy",get children(){return r(e.button,{title:"Copy to clipboard","data-copied":"Copied!","data-code":"export default function App() {  return (    <main>      <h1>Hello world!</h1>    </main>  );}",get children(){return r(e.div,{})}})}})]}})}}),`
`,r(e.p,{get children(){return["See this example in ",r(e.a,{href:"https://stackblitz.com/github/solidjs/solid-start/tree/main/examples/bare?file=src%2Fapp.tsx",children:"StackBlitz"})]}})]}function s(t={}){const{wrapper:e}=Object.assign({},i(),t.components);return e?r(e,a(t,{get children(){return r(n,t)}})):n(t)}export{s as default};