"use strict"; const {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0]; const {useMDXComponents: _provideComponents} = arguments[0]; const headings = [{ "data": { "id": "introduktion", "hProperties": { "id": "introduktion" } }, "depth": 2, "value": "Introduktion" }, { "data": { "id": "skapa-en-logto-applikation", "hProperties": { "id": "skapa-en-logto-applikation" } }, "depth": 2, "value": "Skapa en Logto-applikation" }, { "data": { "id": "konfigurera-ditt-chrome-tillägg", "hProperties": { "id": "konfigurera-ditt-chrome-tillägg" } }, "depth": 2, "value": "Konfigurera ditt Chrome-tillägg" }, { "data": { "id": "installera-logto-sdk", "hProperties": { "id": "installera-logto-sdk" } }, "depth": 3, "value": "Installera Logto SDK" }, { "data": { "id": "uppdatera-manifestjson", "hProperties": { "id": "uppdatera-manifestjson" } }, "depth": 3, "value": "Uppdatera manifest.json" }, { "data": { "id": "konfigurera-ett-bakgrundsskript-service-worker", "hProperties": { "id": "konfigurera-ett-bakgrundsskript-service-worker" } }, "depth": 3, "value": "Konfigurera ett bakgrundsskript (service worker)" }, { "data": { "id": "uppdatera-logto-applikationsinställningar", "hProperties": { "id": "uppdatera-logto-applikationsinställningar" } }, "depth": 2, "value": "Uppdatera Logto-applikationsinställningar" }, { "data": { "id": "lägg-till-inloggnings--och-utloggningsknappar-till-popup-fönstret", "hProperties": { "id": "lägg-till-inloggnings--och-utloggningsknappar-till-popup-fönstret" } }, "depth": 2, "value": "Lägg till inloggnings- och utloggningsknappar till popup-fönstret" }, { "data": { "id": "kontrollpunkt-testa-autentiseringsflödet", "hProperties": { "id": "kontrollpunkt-testa-autentiseringsflödet" } }, "depth": 2, "value": "Kontrollpunkt: Testa autentiseringsflödet" }, { "data": { "id": "kontrollera-autentiseringstillstånd", "hProperties": { "id": "kontrollera-autentiseringstillstånd" } }, "depth": 2, "value": "Kontrollera autentiseringstillstånd" }, { "data": { "id": "andra-överväganden", "hProperties": { "id": "andra-överväganden" } }, "depth": 2, "value": "Andra överväganden" }, { "data": { "id": "slutsats", "hProperties": { "id": "slutsats" } }, "depth": 2, "value": "Slutsats" }]; const readingTime = { "minutes": 4, "words": 1241, "text": "4 min read" }; const frontmatter = undefined; function _createMdxContent(props) { const _components = { a: "a", code: "code", h2: "h2", h3: "h3", img: "img", li: "li", ol: "ol", p: "p", pre: "pre", span: "span", strong: "strong", ul: "ul", ..._provideComponents(), ...props.components }, {Info, LogtoCloudButton, Note} = _components; if (!Info) _missingMdxReference("Info", true); if (!LogtoCloudButton) _missingMdxReference("LogtoCloudButton", true); if (!Note) _missingMdxReference("Note", true); return _jsxs(_Fragment, { children: [_jsx(_components.p, { children: "Chrome-tillägg är ett fantastiskt sätt att utöka funktionaliteten i Chrome-webbläsaren. När du har ett populärt tillägg kanske du vill tjäna pengar på det genom att erbjuda professionella funktioner till användare som betalar för dem. Användarautentisering är ett måste för detta ändamål:" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Användaridentifiering" }), ": Du behöver veta vem användaren är för att erbjuda personliga funktioner."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Åtkomstkontroll" }), ": Du behöver kontrollera vem som kan få åtkomst till de betalda funktionerna."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Prenumerationshantering" }), ": Du behöver erbjuda ett sätt för användare att prenumerera och hantera sina prenumerationer."] }), "\n"] }), "\n", _jsx(_components.p, { children: "Å andra sidan vill vi inte vara bundna till Google-kontosystemet, eftersom dina användare kanske föredrar att använda andra konton, eller, du kan ha flera tjänster som du vill integrera med samma identitetssystem." }), "\n", _jsx(_components.p, { children: "En snabb sammanfattning av fördelarna med att använda OpenID Connect (OIDC) för autentisering:" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Ingen leverantörsinlåsning" }), ": Dina användare kan använda olika metoder för att logga in, istället för att tvingas till Google."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Enkel inloggning (SSO)" }), ": Användare kan logga in en gång och få tillgång till flera tjänster eller applikationer."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Standardiserat" }), ": OIDC är en öppen standard som är allmänt antagen och stöds, dessutom är det säkert."] }), "\n"] }), "\n", _jsxs(_components.p, { children: ["I denna handledning kommer vi att använda ", _jsx(_components.a, { href: "https://logto.io/", children: "Logto" }), " som OIDC-leverantör, vilket är ett alternativ till Auth0 för att bygga identitetsinfrastrukturer."] }), "\n", _jsx(_components.p, { children: "Låt oss börja!" }), "\n", _jsx(Note, { children: _jsxs(_components.p, { children: ["Du kan hitta ett exempel projekt för denna handledning på ", _jsx(_components.a, { href: "https://github.com/logto-io/js/tree/HEAD/packages/chrome-extension-sample", children: "vår GitHub\nrepository" }), "."] }) }), "\n", _jsxs(_components.h2, { id: "introduktion", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#introduktion", children: _jsx(_components.span, { children: "#" }) }), "Introduktion"] }), "\n", _jsx(_components.p, { children: "Om du antar att du sätter en \"Logga in\"-knapp i din Chrome-extensions popup, kommer autentiseringsflödet att se ut så här:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n participant A as Extension popup\n participant B as Extension service worker\n participant C as Logto logga-in upplevelse\n\n A->>B: Initierar inloggning\n B->>C: Omadresserar till Logto\n C->>C: Användaren loggar in\n C->>B: Omadresserar tillbaka till tillägget\n B->>A: Informerar popup-fönstret\n" }) }), "\n", _jsxs(_components.p, { children: ["För andra interaktiva sidor i ditt tillägg behöver du bara ersätta ", _jsx(_components.code, { children: "Extension popup" }), "-deltagaren med sidans namn. I denna handledning kommer vi att fokusera på popupsidan."] }), "\n", _jsxs(_components.h2, { id: "skapa-en-logto-applikation", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#skapa-en-logto-applikation", children: _jsx(_components.span, { children: "#" }) }), "Skapa en Logto-applikation"] }), "\n", _jsx(_components.p, { children: "För att komma igång, skapa en Logto-applikation med typen \"Single page app\". Följ dessa steg för att skapa en Logto-applikation:" }), "\n", _jsxs(_components.ol, { children: ["\n", _jsxs(_components.li, { children: ["Logga in på ", _jsx(_components.a, { href: "https://cloud.logto.io/", children: "Logto Console" }), "."] }), "\n", _jsxs(_components.li, { children: ["Klicka på ", _jsx(_components.strong, { children: "Skapa applikation" }), "."] }), "\n", _jsx(_components.li, { children: "På den öppnade sidan, hitta \"Skapa app utan ramverk\"-knappen längst ned och klicka på den." }), "\n", _jsx(_components.li, { children: "Välj typen \"Single page app\" och ange ditt applikationsnamn." }), "\n", _jsxs(_components.li, { children: ["Klicka på ", _jsx(_components.strong, { children: "Skapa" }), "."] }), "\n"] }), "\n", _jsxs(_components.h2, { id: "konfigurera-ditt-chrome-tillägg", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#konfigurera-ditt-chrome-tillägg", children: _jsx(_components.span, { children: "#" }) }), "Konfigurera ditt Chrome-tillägg"] }), "\n", _jsxs(_components.h3, { id: "installera-logto-sdk", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#installera-logto-sdk", children: _jsx(_components.span, { children: "#" }) }), "Installera Logto SDK"] }), "\n", _jsx(_components.p, { children: "Installera Logto SDK i ditt Chrome-tilläggs projekt:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-bash", children: "# eller pnpm, yarn, etc.\nnpm i @logto/chrome-extension\n" }) }), "\n", _jsxs(_components.h3, { id: "uppdatera-manifestjson", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#uppdatera-manifestjson", children: _jsx(_components.span, { children: "#" }) }), "Uppdatera ", _jsx(_components.code, { children: "manifest.json" })] }), "\n", _jsxs(_components.p, { children: ["Logto SDK kräver följande behörigheter i ", _jsx(_components.code, { children: "manifest.json" }), ":"] }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-json", children: "{\n \"permissions\": [\"identity\", \"storage\"],\n \"host_permissions\": [\"https://*.logto.app/*\"]\n}\n" }) }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.code, { children: "permissions.identity" }), ": Krävs för Chrome Identity API, som används för att logga in och ut."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.code, { children: "permissions.storage" }), ": Krävs för att spara användarens session."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.code, { children: "host_permissions" }), ": Krävs för att Logto SDK ska kunna kommunicera med Logto API:er."] }), "\n"] }), "\n", _jsx(Note, { children: _jsxs(_components.p, { children: ["Om du använder en anpassad domän på Logto Cloud måste du uppdatera ", _jsx(_components.code, { children: "host_permissions" }), " för att matcha din domän."] }) }), "\n", _jsxs(_components.h3, { id: "konfigurera-ett-bakgrundsskript-service-worker", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#konfigurera-ett-bakgrundsskript-service-worker", children: _jsx(_components.span, { children: "#" }) }), "Konfigurera ett bakgrundsskript (service worker)"] }), "\n", _jsx(_components.p, { children: "I ditt Chrome-tilläggs bakgrundsscript, initialisera Logto SDK:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-js", children: "// service-worker.js\nimport LogtoClient from '@logto/chrome-extension';\n\nexport const client = new LogtoClient({\n endpoint: ''\n appId: '',\n});\n" }) }), "\n", _jsxs(_components.p, { children: ["Ersätt ", _jsx(_components.code, { children: "" }), " och ", _jsx(_components.code, { children: "" }), " med de verkliga värdena. Du kan hitta dessa värden på applikationssidan du just skapade i Logto Console."] }), "\n", _jsxs(_components.p, { children: ["Om du inte har ett bakgrundsskript kan du följa den ", _jsx(_components.a, { href: "https://developer.chrome.com/docs/extensions/develop/concepts/service-workers/basics", children: "officiella guiden" }), " för att skapa ett."] }), "\n", _jsxs(Info, { children: [_jsx(_components.p, { children: _jsx(_components.strong, { children: "Varför behöver vi ett bakgrundsskript?" }) }), _jsx(_components.p, { children: "Normala extensionssidor som popup eller alternativsidan kan inte köras i bakgrunden, och det finns möjlighet att de stängs under autentiseringsprocessen. Ett bakgrundsskript säkerställer att autentiseringsprocessen kan hanteras korrekt." })] }), "\n", _jsx(_components.p, { children: "Sedan behöver vi lyssna på meddelanden från andra extensionssidor och hantera autentiseringsprocessen:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-js", children: "// service-worker.js\nchrome.runtime.onMessage.addListener((message, sender, sendResponse) => {\n // I koden nedan, eftersom vi returnerar `true` för varje åtgärd, måste vi anropa `sendResponse`\n // för att informera avsändaren. Du kan också hantera fel här eller använda andra sätt för att informera avsändaren.\n\n if (message.action === 'signIn') {\n const redirectUri = chrome.identity.getRedirectURL('/callback');\n client.signIn(redirectUri).finally(sendResponse);\n return true;\n }\n\n if (message.action === 'signOut') {\n const redirectUri = chrome.identity.getRedirectURL();\n client.signOut(redirectUri).finally(sendResponse);\n return true;\n }\n\n return false;\n});\n" }) }), "\n", _jsxs(_components.p, { children: ["Du kanske märker att det finns två omdirigerings-URI:er som används i koden ovan. De skapas båda med ", _jsx(_components.code, { children: "chrome.identity.getRedirectURL" }), ", som är ett ", _jsx(_components.a, { href: "https://developer.chrome.com/docs/extensions/reference/api/identity#method-getRedirectURL", children: "inbyggt Chrome API" }), " för att generera en omdirigerings-URL för autentiseringsflöden. De två URI:erna kommer att vara:"] }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.code, { children: "https://.chromiumapp.org/callback" }), " för inloggning."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.code, { children: "https://.chromiumapp.org/" }), " för utloggning."] }), "\n"] }), "\n", _jsx(_components.p, { children: "Observera att dessa URI:er inte är åtkomliga och de används endast för att Chrome ska kunna utlösa specifika åtgärder för autentiseringsprocessen." }), "\n", _jsxs(_components.h2, { id: "uppdatera-logto-applikationsinställningar", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#uppdatera-logto-applikationsinställningar", children: _jsx(_components.span, { children: "#" }) }), "Uppdatera Logto-applikationsinställningar"] }), "\n", _jsx(_components.p, { children: "Nu behöver vi uppdatera Logto-applikationsinställningarna för att tillåta de omdirigerings-URI:er vi just skapade." }), "\n", _jsxs(_components.ol, { children: ["\n", _jsx(_components.li, { children: "Gå till applikationssidan i Logto Console." }), "\n", _jsxs(_components.li, { children: ["I avsnittet \"Omdirigerings-URI:er\", lägg till URI:n: ", _jsx(_components.code, { children: "https://.chromiumapp.org/callback" }), "."] }), "\n", _jsxs(_components.li, { children: ["I avsnittet \"Omdirigerings-URI:er efter utloggning\", lägg till URI:n: ", _jsx(_components.code, { children: "https://.chromiumapp.org/" }), "."] }), "\n", _jsxs(_components.li, { children: ["I avsnittet \"CORS tillåtna ursprung\", lägg till URI:n: ", _jsx(_components.code, { children: "chrome-extension://" }), ". SDK:t i Chrome-tillägget kommer att använda detta ursprung för att kommunicera med Logto API:er."] }), "\n", _jsxs(_components.li, { children: ["Klicka på ", _jsx(_components.strong, { children: "Spara ändringar" }), "."] }), "\n"] }), "\n", _jsxs(_components.p, { children: ["Kom ihåg att ersätta ", _jsx(_components.code, { children: "" }), " med ditt faktiska tilläggs-ID. Du kan hitta tilläggs-ID:t på ", _jsx(_components.code, { children: "chrome://extensions" }), " sidan."] }), "\n", _jsx(_components.p, { children: "Efter att ha uppdaterat inställningarna, borde dina Logto-applikationsinställningar se ut så här:" }), "\n", _jsx(_components.p, { children: _jsx(_components.img, { src: "https://uploads.strapi.logto.io/1/app_settings_f30c24be38.webp", alt: "Applikationsinställningar" }) }), "\n", _jsxs(_components.h2, { id: "lägg-till-inloggnings--och-utloggningsknappar-till-popup-fönstret", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#lägg-till-inloggnings--och-utloggningsknappar-till-popup-fönstret", children: _jsx(_components.span, { children: "#" }) }), "Lägg till inloggnings- och utloggningsknappar till popup-fönstret"] }), "\n", _jsx(_components.p, { children: "Vi är nästan där! Låt oss lägga till inloggnings- och utloggningsknappar och annan nödvändig logik till popup-sidan." }), "\n", _jsxs(_components.p, { children: ["I ", _jsx(_components.code, { children: "popup.html" }), " filen:"] }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-html", children: "\n\n\n" }) }), "\n", _jsxs(_components.p, { children: ["I ", _jsx(_components.code, { children: "popup.js" }), " filen (förutsatt att ", _jsx(_components.code, { children: "popup.js" }), " ingår i ", _jsx(_components.code, { children: "popup.html" }), "):"] }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-js", children: "// popup.js\ndocument.getElementById('sign-in').addEventListener('click', async () => {\n await chrome.runtime.sendMessage({ action: 'signIn' });\n // Inloggning klar (eller misslyckad), du kan uppdatera UI här.\n});\n\ndocument.getElementById('sign-out').addEventListener('click', async () => {\n await chrome.runtime.sendMessage({ action: 'signOut' });\n // Utloggning klar (eller misslyckad), du kan uppdatera UI här.\n});\n" }) }), "\n", _jsxs(_components.h2, { id: "kontrollpunkt-testa-autentiseringsflödet", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#kontrollpunkt-testa-autentiseringsflödet", children: _jsx(_components.span, { children: "#" }) }), "Kontrollpunkt: Testa autentiseringsflödet"] }), "\n", _jsx(_components.p, { children: "Nu kan du testa autentiseringsflödet i ditt Chrome-tillägg:" }), "\n", _jsxs(_components.ol, { children: ["\n", _jsx(_components.li, { children: "Öppna tilläggspopupen." }), "\n", _jsx(_components.li, { children: "Klicka på \"Logga in\"-knappen." }), "\n", _jsx(_components.li, { children: "Du kommer att omdirigeras till Logto inloggningssida." }), "\n", _jsx(_components.li, { children: "Logga in med ditt Logto-konto." }), "\n", _jsx(_components.li, { children: "Du kommer att omdirigeras tillbaka till Chrome." }), "\n"] }), "\n", _jsxs(_components.h2, { id: "kontrollera-autentiseringstillstånd", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#kontrollera-autentiseringstillstånd", children: _jsx(_components.span, { children: "#" }) }), "Kontrollera autentiseringstillstånd"] }), "\n", _jsx(_components.p, { children: "Eftersom Chrome tillhandahåller enhetliga lagrings-API:er, förutom inloggnings- och utloggningsflödet, kan alla andra Logto SDK-metoder användas direkt på popupsidan." }), "\n", _jsxs(_components.p, { children: ["I din ", _jsx(_components.code, { children: "popup.js" }), ", kan du återanvända ", _jsx(_components.code, { children: "LogtoClient" }), "-instansen som skapades i bakgrundsskriptet, eller skapa en ny med samma konfiguration:"] }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-js", children: "// popup.js\nimport LogtoClient from '@logto/chrome-extension';\n\nconst client = new LogtoClient({\n endpoint: ''\n appId: '',\n});\n\n// Eller återanvänd klientinstansen som skapades i bakgrundsskriptet\nimport { client } from './service-worker.js';\n" }) }), "\n", _jsx(_components.p, { children: "Sedan kan du skapa en funktion för att ladda autentiseringstillståndet och användarens profil:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-js", children: "// popup.js\nconst loadAuthenticationState = async () => {\n const isAuthenticated = await client.isAuthenticated();\n // Uppdatera UI baserat på autentiseringstillstånd\n\n if (isAuthenticated) {\n const user = await client.getIdTokenClaims(); // { sub: '...', email: '...', ... }\n // Uppdatera UI med användarens profil\n }\n};\n" }) }), "\n", _jsxs(_components.p, { children: ["Du kan också kombinera ", _jsx(_components.code, { children: "loadAuthenticationState" }), "-funktionen med logiken för inloggning och utloggning:"] }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-js", children: "// popup.js\ndocument.getElementById('sign-in').addEventListener('click', async () => {\n await chrome.runtime.sendMessage({ action: 'signIn' });\n await loadAuthenticationState();\n});\n\ndocument.getElementById('sign-out').addEventListener('click', async () => {\n await chrome.runtime.sendMessage({ action: 'signOut' });\n await loadAuthenticationState();\n});\n" }) }), "\n", _jsx(_components.p, { children: "Här är ett exempel på popupsidan med autentiseringstillståndet:" }), "\n", _jsx(_components.p, { children: _jsx(_components.img, { src: "https://uploads.strapi.logto.io/1/extension_popup_03b2ad10b2.webp", alt: "Popup-sida" }) }), "\n", _jsxs(_components.p, { children: ["För mer information om SDK, kan du hänvisa till den ", _jsx(_components.a, { href: "https://docs.logto.io/sdk/vanilla-js/", children: "officiella dokumentationen för webbläsar-SDK" }), ". Webbläsar-SDK delar samma API:er med Chrome-tilläggets SDK."] }), "\n", _jsxs(_components.h2, { id: "andra-överväganden", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#andra-överväganden", children: _jsx(_components.span, { children: "#" }) }), "Andra överväganden"] }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Sammanställning av service worker" }), ": Om du använder en bundlare som Webpack eller Rollup behöver du explicit sätta målet till ", _jsx(_components.code, { children: "browser" }), " eller liknande för att undvika onödig sammanställning av Node.js-moduler."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Modulupplösning" }), ": Logto Chrome-extension SDK är enbart en ESM-modul."] }), "\n"] }), "\n", _jsxs(_components.p, { children: ["Se vårt ", _jsx(_components.a, { href: "https://github.com/logto-io/js/tree/HEAD/packages/chrome-extension-sample", children: "exempelprojekt" }), " för ett komplett exempel med TypeScript, Rollup och andra konfigurationer."] }), "\n", _jsxs(_components.h2, { id: "slutsats", children: [_jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#slutsats", children: _jsx(_components.span, { children: "#" }) }), "Slutsats"] }), "\n", _jsx(_components.p, { children: "Med användare autentiserade kan du nu säkert erbjuda betalda funktioner i ditt Chrome-tillägg. Till exempel kan du lagra användarens prenumerationsstatus i användarprofilen och kontrollera det när användaren öppnar tillägget." }), "\n", _jsx(_components.p, { children: "Genom att kombinera kraften i Chrome-tillägg och Logto kan du bygga ett mer flexibelt och anpassningsbart tillägg som både du och dina användare kommer att älska." }), "\n", _jsx(LogtoCloudButton, {})] }); } function MDXContent(props = {}) { const {wrapper: MDXLayout} = { ..._provideComponents(), ...props.components }; return MDXLayout ? _jsx(MDXLayout, { ...props, children: _jsx(_createMdxContent, { ...props }) }) : _createMdxContent(props); } return { headings, readingTime, frontmatter, default: MDXContent }; function _missingMdxReference(id, component) { throw new Error("Expected " + (component ? "component" : "object") + " `" + id + "` to be defined: you likely forgot to import, pass, or provide it."); }