"use client"; // Handle theme const theme = getCookie("pinecone_theme_mode"); if (theme === "system") { window.matchMedia("(prefers-color-scheme: dark)").matches ? document.documentElement.classList.add("dark") : document.documentElement.classList.remove("dark"); } else if (theme === "dark") { setTimeout(() => { document.documentElement.classList.add("dark"); }, 0); } else { document.documentElement.classList.remove("dark"); } let currentTheme = theme; console.log("Initial theme:", currentTheme); // Add visibility change listener to detect theme changes when tab becomes active document.addEventListener("visibilitychange", () => { // Only check when tab becomes visible again if (document.visibilityState === "visible") { console.log("Tab became visible, checking theme"); const newTheme = getCookie("pinecone_theme_mode"); console.log("Current theme:", currentTheme, "New theme:", newTheme); // Only update if the theme actually changed if (newTheme !== currentTheme) { currentTheme = newTheme; // First remove dark class regardless of the new theme document.documentElement.classList.remove("dark"); if (newTheme === "dark") { document.documentElement.classList.add("dark"); } else if (newTheme === "system") { // Apply system preference const systemPreference = window.matchMedia( "(prefers-color-scheme: dark)" ).matches; if (systemPreference) { document.documentElement.classList.add("dark"); } } // If theme is light, we already removed the dark class above } // No theme change detected, no action needed } }); // Find mintlify dark mode button and replace with our own handler const darkModeButton = document.querySelector( 'button[aria-label="Toggle dark mode"]' ); if (darkModeButton) { const newButton = darkModeButton.cloneNode(true); newButton.addEventListener("click", function (event) { toggleTheme(); }); darkModeButton.parentNode.replaceChild(newButton, darkModeButton); } function toggleTheme() { const theme = getCookie("pinecone_theme_mode"); if (theme === "system") { window.matchMedia("(prefers-color-scheme: dark)").matches ? document.documentElement.classList.add("dark") : document.documentElement.classList.remove("dark"); document.cookie = "pinecone_theme_mode=dark; path=/; max-age=31536000; SameSite=lax; domain=.pinecone.io;"; } else if (theme === "dark") { document.documentElement.classList.remove("dark"); document.cookie = "pinecone_theme_mode=light; path=/; max-age=31536000; SameSite=lax; domain=.pinecone.io;"; } else { document.documentElement.classList.add("dark"); document.cookie = "pinecone_theme_mode=dark; path=/; max-age=31536000; SameSite=lax; domain=.pinecone.io;"; } // Reload iframe after theme change const currentPath = window.location.pathname; if (currentPath.includes("/models/")) { const iframe = document.querySelector("#model-search-iframe"); if (iframe) { iframe.src = iframe.src; } } if (currentPath.includes("/quickstart") || currentPath.includes("/reference/api/authentication")) { const iframe = document.querySelector("#pinecone-connect-widget iframe"); if (iframe) { iframe.src = iframe.src; } } if (currentPath.includes("/sample-apps")) { const iframes = document.querySelectorAll("#sample-app-iframe, #pinecone-connect-widget iframe"); if (iframes.length > 0) { iframes.forEach((iframe) => { iframe.src = iframe.src; }); } } } function getCookie(name) { const cookieName = name + "="; const cookies = document.cookie.split(";"); for (let i = 0; i < cookies.length; i++) { let cookie = cookies[i].trim(); if (cookie.indexOf(cookieName) === 0) { return cookie.substring(cookieName.length, cookie.length); } } return null; } // Handle anchor links after dynamic content loads const anchorObserver = new MutationObserver((mutations) => { if (window.location.hash) { const target = document.querySelector(window.location.hash); if (target) { // Disconnect observer once we find our target anchorObserver.disconnect(); // Small delay to ensure final layout is settled setTimeout(() => { target.scrollIntoView(); window.scrollBy(0, -120); // Adjust for fixed header }, 100); } } }); // Start observing document for content changes anchorObserver.observe(document.body, { childList: true, subtree: true, }); // Insert skeleton loader immediately const pineconeConnectWidget = document.getElementById( "pinecone-connect-widget" ); if (pineconeConnectWidget) { pineconeConnectWidget.innerHTML = ` `; } window.onload = function () { }; // Get the Mintlify search containers, going to reuse them as the triggers for Inkeep const searchButtonContainerIds = [ "search-bar-entry", "search-bar-entry-mobile", ]; // Clone and replace, needed to remove existing event listeners const clonedSearchButtonContainers = searchButtonContainerIds.map((id) => { const originalElement = document.getElementById(id); const clonedElement = originalElement.cloneNode(true); originalElement.parentNode.replaceChild(clonedElement, originalElement); return clonedElement; }); const pineconeConnectWidgetScript = document.createElement("script"); document.body.appendChild(pineconeConnectWidgetScript); function debounce(func, delay) { let timerId; return function (...args) { clearTimeout(timerId); timerId = setTimeout(() => { func.apply(this, args); }, delay); }; } // Find instances of {{YOUR_API_KEY}} in code blocks and replace them with a span const prepareApiKeys = () => { const codeElements = document.querySelectorAll( "code:not(.inline-flex.gap-2.items-center)" ); codeElements.forEach((el) => { el.innerHTML = el.innerHTML.replace( /{{YOUR_API_KEY}}/g, `YOUR_API_KEY` ); // Handle cases where the curly braces are in a different span const tokens = el.querySelectorAll("span span"); const apiKeyTokens = Array.from(tokens).filter((token) => token.innerHTML.includes("YOUR_API_KEY") ); apiKeyTokens.forEach((token) => { if ( token.previousElementSibling && token.previousElementSibling.textContent === "{{" && token.nextElementSibling && token.nextElementSibling.textContent === "}}" ) { token.previousElementSibling.remove(); token.nextElementSibling.remove(); token.innerHTML = `YOUR_API_KEY`; } }); }); }; // Set api keys inside codeblocks const setApiKeys = () => { prepareApiKeys(); const apiKey = sessionStorage.getItem("apiKey"); const codeBlocks = document.querySelectorAll("div.mt-5.mb-8.not-prose"); // Replace the copy function in each code block so that it works with the added API keys codeBlocks.forEach((codeBlock) => { const copyButton = codeBlock.querySelector( 'button[data-testid="copy-code-button"]' ); const clonedElement = copyButton.cloneNode(true); copyButton.parentNode.replaceChild(clonedElement, copyButton); clonedElement.addEventListener("click", () => { const codeElement = codeBlock.querySelector("code"); navigator.clipboard.writeText(codeElement.textContent); const statusElement = clonedElement.nextElementSibling; statusElement.textContent = "Copied!"; clonedElement.innerHTML = ``; setTimeout(() => { statusElement.textContent = "Copy"; clonedElement.innerHTML = ``; }, 2000); }); }); if (apiKey) { const apiKeys = document.querySelectorAll(".api-key"); apiKeys.forEach((el) => { el.innerHTML = apiKey; el.classList.add("set"); }); // Add remove api key button // Remove previous button to prevent duplicates const removeButton = document.querySelector(".remove-api-key"); if (removeButton) { removeButton.remove(); } const widgetContainer = document.getElementById("pinecone-connect-widget"); const div = document.createElement("div"); div.classList.add("remove-api-key"); const button = document.createElement("button"); button.textContent = "Remove API Key from guide"; button.addEventListener("click", () => { sessionStorage.removeItem("apiKey"); widgetContainer.innerHTML = ""; div.remove(); loadConnectWidget(); const setApiKeyElements = document.querySelectorAll(".api-key.set"); setApiKeyElements.forEach((el) => { el.innerHTML = "YOUR_API_KEY"; el.classList.remove("set"); }); }); div.appendChild(button); widgetContainer.insertAdjacentElement("afterend", div); } }; const debouncedSetApiKeys = debounce(() => { setApiKeys(); }, 1000); // Function to re-set the API keys after codeblock language changes const refreshApiKeys = () => { try { prepareApiKeys(); const apiKey = sessionStorage.getItem("apiKey"); if (!apiKey) return; const apiKeys = document.querySelectorAll(".api-key:not(.set)"); if (apiKeys.length > 0) { apiKeys.forEach((el) => { el.innerHTML = apiKey; el.classList.add("set"); }); } } catch (error) { console.error("Error refreshing API keys:", error); } }; const debouncedRefreshApiKeys = debounce(() => { refreshApiKeys(); }, 1000); const loadConnectWidget = () => { const apiKey = sessionStorage.getItem("apiKey"); const widgetContainer = document.getElementById("pinecone-connect-widget"); if (!apiKey) { import("https://connect.pinecone.io/embed.js") .then(() => { try { console.log("Trying to initialize connectToPinecone"); // Clear the skeleton loader before initializing the widget widgetContainer.innerHTML = ""; let integrationId = "docs"; // default const currentPath = window.location.pathname; if (currentPath === "/guides/get-started/quickstart") { integrationId = "db-quickstart"; } else if (currentPath === "/guides/assistant/quickstart") { integrationId = "assistant-quickstart"; } window.connectToPinecone( (apiKey) => { console.log(apiKey); sessionStorage.setItem("apiKey", apiKey); setApiKeys(); }, { integrationId, container: widgetContainer, } ); } catch (error) { console.error("Error initializing Pinecone widget:", error); } }) .catch((error) => { console.error("Error importing embed.js:", error); }); } else { widgetContainer.innerHTML = `

You're all set! An API key has been generated and provided to Pinecone Docs.

You can manage your API keys in the Pinecone console.

`; } }; const debouncedLoadConnectWidget = debounce(() => { try { loadConnectWidget(); } catch (error) { console.error("Error loading connect widget:", error); } }, 1000); // Global keyboard event listener for cmd+k / ctrl+k document.addEventListener("keydown", function (event) { if ((event.metaKey || event.ctrlKey) && event.key === "k") { event.preventDefault(); event.stopPropagation(); setTimeout(() => { if (window.inkeepSearchModal) { window.inkeepSearchModal.render({ isOpen: true, }); } }, 0); } }); // Load the Inkeep script const inkeepScript = document.createElement("script"); inkeepScript.type = "module"; inkeepScript.src = "https://unpkg.com/@inkeep/widgets-embed@0.2.271/dist/embed.js"; document.body.appendChild(inkeepScript); const DATA_INKEEP_LISTENER_ATTACHED = "data-inkeep-listener-attached"; // Once the Inkeep script has loaded, load the Inkeep chat components inkeepScript.addEventListener("load", function () { function convertFilesToBase64(files) { const filesArray = Array.from(files); return Promise.all( filesArray.map((file) => { return new Promise((resolve, reject) => { const reader = new FileReader(); reader.onload = (event) => { const result = event.target.result; const base64Data = result ?.toString() .replace(/^data:.+;base64,/, ""); resolve({ data: base64Data, fileName: file.name, mimeType: file.type, }); }; reader.onerror = (error) => reject(error); reader.readAsDataURL(file); }); }) ); } const supportFormConfig = { heading: "Contact support", successConfirmationPage: { heading: "Submission successful", message: "To view your open tickets, go to the Support page on the Pinecone console.", }, fields: [ { type: "STANDARD_FIELD", label: "Email (associated with Pinecone account)", name: "email", inputType: "EMAIL", required: true, }, { type: "STANDARD_FIELD", label: "Subject", name: "subject", inputType: "TEXT", required: true, }, { type: "INCLUDE_CHAT_SESSION", defaultValue: true, }, { type: "STANDARD_FIELD", label: "Additional details", name: "additional_details", inputType: "TEXTAREA", }, ], submitCallback: async (values) => { const { formDetails, chatSession } = values; const formData = new FormData(); formData.append("subject", formDetails.subject); formData.append("email", formDetails.email); formData.append("additional_details", formDetails.additional_details); formData.append("chatbot_source", "docs"); if (chatSession) { formData.append("chatSession", JSON.stringify(chatSession)); } console.log("TEST LOG", formDetails); try { try { const response = await fetch( "https://www.pinecone.io/api/submitTicket", { method: "POST", body: formData, mode: "no-cors", } ); // const result = await response.json(); // console.log("RESULT", result); return { success: true }; // We assume success if we get here due to cors issues } catch (error) { console.error("Error submitting form 1:", error); return { success: false }; } } catch (error) { console.error("Error submitting form 2:", error); return { success: false }; } }, }; // Customization settings const sharedConfig = { stylesheetUrls: [ "https://www.pinecone.io/customerStylesheets/pinecone.css", ], baseSettings: { apiKey: "ac936dc250fee335d56e8e7f01c93f6352fa88a69331053c", integrationId: "clu1mcp8l0008nc70ugr3yft8", organizationId: "org_2w8WbI2ZUZ7xN2wp", primaryBrandColor: "#1c17ff", theme: { primaryColors: { textColorOnPrimary: "white", }, colors: { gray: { "gray.50": "242 243 251", "gray.100": "236 237 246", "gray.200": "223 225 236", "gray.300": "203 207 220", "gray.400": "152 159 177", "gray.500": "105 111 132", "gray.600": "74 83 104", "gray.700": "54 64 86", "gray.800": "31 40 61", "gray.900": "17 24 46", }, }, components: { SearchBarTrigger: { defaultProps: { variant: "subtle", }, }, }, }, customIcons: { search: { builtIn: "IoSearch" }, }, breadcrumbRules: { urlToBreadcrumbMapper: [ { matchingRule: { ruleType: "PartialUrl", partialUrl: "pinecone.io", }, replaceLeading: true, breadcrumbName: "Home", }, { matchingRule: { ruleType: "PartialUrl", partialUrl: "docs.pinecone.io", }, replaceLeading: true, breadcrumbName: "Docs", }, { matchingRule: { ruleType: "PartialUrl", partialUrl: "www.pinecone.io/learn", }, replaceLeading: true, breadcrumbName: "Learn", }, { matchingRule: { ruleType: "PartialUrl", partialUrl: "www.pinecone.io/blog", }, replaceLeading: true, breadcrumbName: "Blog", }, { matchingRule: { ruleType: "PartialUrl", partialUrl: "pinecone.io/community", }, replaceLeading: true, breadcrumbName: "Community", }, ], }, customCardSettings: [ { filters: { RootBreadcrumb: "Community", }, searchTabLabel: "Community", icon: { builtIn: "IoPeopleOutline" }, }, { filters: { RootBreadcrumb: "Blog", }, searchTabLabel: "Blog", icon: { builtIn: "IoPencilOutline" }, }, { filters: { RootBreadcrumb: "Learn", }, searchTabLabel: "Learn", icon: { builtIn: "IoBookOutline" }, }, { filters: { RootBreadcrumb: "Home", }, searchTabLabel: "Home", icon: { builtIn: "IoHomeOutline" }, }, { filters: { RootBreadcrumb: "Support", }, searchTabLabel: "Support", icon: { builtIn: "IoHelpBuoyOutline" }, }, ], }, aiChatSettings: { chatSubjectName: "Pinecone", botAvatarSrcUrl: "https://storage.googleapis.com/organization-image-assets/pinecone-botAvatarSrcUrl-1707422859519.svg", botAvatarDarkSrcUrl: "https://storage.googleapis.com/organization-image-assets/pinecone-botAvatarDarkSrcUrl-1707422858768.svg", getHelpCallToActions: [ { name: "Community", url: "https://community.pinecone.io/", icon: { builtIn: "IoPeopleOutline", }, }, { name: "Support Center", url: "https://app.pinecone.io/organizations/-/settings/support", icon: { builtIn: "IoHelpBuoyOutline", }, }, { name: "Create Support Ticket", type: "OPEN_FORM", formConfig: supportFormConfig, icon: { builtIn: "info", }, }, ], quickQuestions: [ "What are the benefits of serverless?", "How do I do a dense and sparse search?", "What are the primary ways to minimize latency?", ], includeAIAnnotations: { shouldEscalateToSupport: true, }, aiAnnotationPolicies: { shouldEscalateToSupport: [ { threshold: "STANDARD", action: { type: "SHOW_SUPPORT_BUTTON", label: "Contact Support", icon: { builtIn: "LuUsers" }, action: { type: "OPEN_FORM", formConfig: supportFormConfig, }, }, }, ], }, }, searchSettings: { // If the docs are embedded, open links in a new tab shouldOpenLinksInNewTab: window.self !== window.top, tabSettings: { isAllTabEnabled: false, rootBreadcrumbsToUseAsTabs: [ "Docs", "Learn", "Forums", "Community", "Support", "Blog", "Home", ], }, }, }; // for syncing with dark mode const colorModeSettings = { observedElement: document.documentElement, isDarkModeCallback: (el) => { return el.classList.contains("dark"); }, colorModeAttribute: "class", }; // instantiate Inkeep "custom trigger" component const inkeepSearchModal = Inkeep({ ...sharedConfig.baseSettings, }).embed({ componentType: "CustomTrigger", colorModeSync: colorModeSettings, properties: { ...sharedConfig, isOpen: false, onClose: () => { inkeepSearchModal.render({ isOpen: false, }); }, }, }); // Store the modal globally so it can be accessed by the mutation observer window.inkeepSearchModal = inkeepSearchModal; // Initial attachment of event listeners clonedSearchButtonContainers.forEach((trigger) => { trigger.addEventListener("click", function () { inkeepSearchModal.render({ isOpen: true, }); }); trigger.setAttribute(DATA_INKEEP_LISTENER_ATTACHED, "true"); }); // Add event listener for the 'keydown' event on the document object for cmd + k // document.addEventListener("keydown", function (event) { // if (event.metaKey && event.key === "k") { // event.preventDefault(); // Prevent the default behavior of the keyboard shortcut // inkeepSearchModal.render({ // isOpen: true, // }); // } // }); }); function addRelatedArticles(titles, links) { const existing = document.querySelector("#related-articles"); if (existing) return; const sidebar = document.querySelector("#table-of-contents"); const relatedArticles = document.createElement("div"); relatedArticles.id = "related-articles"; const title = document.createElement("h2"); title.textContent = "Related Articles"; relatedArticles.appendChild(title); titles.forEach((title, index) => { const relatedArticle = document.createElement("a"); relatedArticle.href = links[index]; relatedArticle.textContent = title; relatedArticle.insertAdjacentHTML( "beforeend", '' ); relatedArticles.appendChild(relatedArticle); }); sidebar.appendChild(relatedArticles); } const relatedArticles = { airbyte: { titles: [ "Data Sync and Search: Pinecone and Airbyte", "Introduction to Airbyte and the Pinecone connector", "Postgres to Pinecone Syncing", ], links: [ "https://www.pinecone.io/learn/series/airbyte/", "https://www.pinecone.io/learn/series/airbyte/airbyte-and-pinecone-intro/", "https://www.pinecone.io/learn/series/airbyte/airbyte-postgres-to-pinecone/", ], }, bedrock: { titles: ["Pinecone as a Knowledge Base for Amazon Bedrock"], links: ["https://www.pinecone.io/blog/amazon-bedrock-integration/"], }, sagemaker: { titles: [ "Mitigate hallucinations through Retrieval Augmented Generation using Pinecone vector database & Llama-2 from Amazon SageMaker JumpStart", ], links: [ "https://aws.amazon.com/blogs/machine-learning/mitigate-hallucinations-through-retrieval-augmented-generation-using-pinecone-vector-database-llama-2-from-amazon-sagemaker-jumpstart/", ], }, langchain: { titles: ["LangChain AI Handbook"], links: ["https://www.pinecone.io/learn/series/langchain/"], }, openai: { titles: [ "Generative Question-Answering with Long-Term Memory", "OpenAI's Text Embeddings v3", ], links: [ "https://www.pinecone.io/learn/openai-gen-qa/", "https://www.pinecone.io/learn/openai-embeddings-v3/", ], }, snowflake: { titles: [ "Snowpark Container Services: Securely Deploy and run Sophisticated Generative AI and full-stack apps in Snowflake", ], links: [ "https://www.snowflake.com/blog/snowpark-container-services-deploy-genai-full-stack-apps/", ], }, }; let isScrollListenerAdded = false; let scrollListener = null; // Mutation observer to handle page changes const observer = new MutationObserver(function (mutations) { mutations.forEach(function (mutation) { if (mutation.type === "childList") { try { searchButtonContainerIds.forEach((id) => { const element = document.getElementById(id); if (element && !element.hasAttribute(DATA_INKEEP_LISTENER_ATTACHED)) { const clonedElement = element.cloneNode(true); element.parentNode.replaceChild(clonedElement, element); clonedElement.addEventListener("click", function () { if (window.inkeepSearchModal) { window.inkeepSearchModal.render({ isOpen: true, }); } }); clonedElement.setAttribute(DATA_INKEEP_LISTENER_ATTACHED, 'true'); } }); // Pinecone connect widget const pineconeConnectWidget = document.querySelector( "#pinecone-connect-widget" ); if ( pineconeConnectWidget && !pineconeConnectWidget.classList.contains("loaded") ) { debouncedLoadConnectWidget(); pineconeConnectWidget.classList.add("loaded"); } // console.log("mutation") if ( pineconeConnectWidget && !pineconeConnectWidget.classList.contains("apiKeysSet") ) { debouncedSetApiKeys(); pineconeConnectWidget.classList.add("apiKeysSet"); } const [path, page, page2] = window.location.pathname .split("/") .slice(1); var contentContainer = document.querySelector("#content-container"); var contentArea = document.querySelector("#content-area"); //** Model Gallery **/ if (path !== "models") { const sidebar = document.querySelector("#sidebar"); if (sidebar) sidebar.style.display = ""; if (contentContainer) contentContainer.style.paddingLeft = ""; } else { const sidebar = document.querySelector("#sidebar"); if (sidebar) sidebar.style.display = "none"; const rightSidebar = document.querySelector("#content-side-layout"); if (rightSidebar) rightSidebar.style.display = "none"; if (contentContainer) contentContainer.style.paddingLeft = "0px"; if (contentArea) contentArea.style.paddingLeft = "0px"; if (contentArea) contentArea.style.marginLeft = "12px"; const header = document.querySelector("#header"); if (header) header.remove(); const tableOfContents = document.querySelector("#table-of-contents"); if (tableOfContents) tableOfContents.remove(); } //** References **/ // Hide toc items with class 'toc-item relevant' and data-depth="1" on /reference/api/database-limits page if ( path === "reference" && page === "api" && page2 === "database-limits" ) { document.querySelectorAll('li.toc-item[data-depth="1"]').forEach((li) => { li.style.display = "none"; }); } // Hide toc items with class 'toc-item relevant' and data-depth="2" on /guides/manage-cost/understanding-cost page if ( path === "guides" && page === "manage-cost" && page2 === "understanding-cost" ) { document.querySelectorAll('li.toc-item[data-depth="2"]').forEach((li) => { li.style.display = "none"; }); } //** Integrations **/ if (path === "integrations" && page === "overview") { const toc = document.querySelector("#table-of-contents"); if (toc) toc.style.display = "none"; const sidebar = document.querySelector("#content-side-layout"); if (sidebar) sidebar.style.display = "none"; } else { // Set sample apps side nav link to active for all sample apps if (page === "sample-apps") { const aElement = document.querySelector( 'a[href="/examples/sample-apps"]' ); if (aElement) { aElement.className = "group mt-2 lg:mt-0 flex items-center pr-3 py-1.5 rounded-lg focus:outline-primary dark:focus:outline-primary-light bg-primary/10 text-primary font-semibold dark:text-primary-light dark:bg-primary-light/10"; } } else if (page === "notebooks") { const aElement = document.querySelector( 'li > a[href="/examples/sample-apps"]' ); if (aElement) { aElement.className = "group mt-2 lg:mt-0 flex items-center pr-3 py-1.5 rounded-lg focus:outline-primary dark:focus:outline-primary-light hover:bg-gray-600/5 dark:hover:bg-gray-200/5 text-gray-700 hover:text-gray-900 dark:text-gray-400 dark:hover:text-gray-300"; } } if (path === "integrations" && page !== "overview") { // Insert back button const backButton = document.querySelector("#back-button"); if (!backButton) { const link = document.createElement("a"); link.id = "back-button"; link.href = "/integrations/overview"; link.textContent = "Back to Integrations"; link.insertAdjacentHTML( "afterbegin", '' ); const header = document.querySelector("#header"); header.insertAdjacentElement("afterbegin", link); } // Add related articles switch ( page /* Hide related articles for now case "airbyte": addRelatedArticles( relatedArticles.airbyte.titles, relatedArticles.airbyte.links ); break; airbyte; case "amazon-bedrock": addRelatedArticles( relatedArticles.bedrock.titles, relatedArticles.bedrock.links ); break; case "amazon-sagemaker": addRelatedArticles( relatedArticles.sagemaker.titles, relatedArticles.sagemaker.links ); break; case "langchain": addRelatedArticles( relatedArticles.langchain.titles, relatedArticles.langchain.links ); break; case "openai": addRelatedArticles( relatedArticles.openai.titles, relatedArticles.openai.links ); break; case "snowflake": addRelatedArticles(relatedArticles.snowflake.titles, relatedArticles.snowflake.links) break; */ ) { default: break; } } // Sample apps if (page === "sample-apps" && !!page2) { const header = document.querySelector("#header"); if (header) header.style.display = "none"; const toc = document.querySelector("#table-of-contents"); if (toc) toc.style.display = "none"; const contentArea = document.querySelector( "#content-area > div.mt-8" ); contentArea.style.marginTop = "0"; // Create toc document.querySelectorAll(".sample-app-split").forEach((div) => { const toc = div.querySelector(".toc"); const content = div.querySelector(".content"); const existing = div.querySelector(".toc-list"); if (toc && content && !existing) { const tocList = document.createElement("div"); tocList.className = "toc-list"; const headers = content.querySelectorAll( "h2, h3, .connect-with-pinecone" ); headers.forEach((header) => { // If connect btn, clone it and append if (header.classList.contains("connect-with-pinecone")) { const cloned = header.cloneNode(true); tocList.appendChild(cloned); return; } // Slugify heading text and create id const slugify = (text) => text .toLowerCase() .replace(/[^a-z0-9]+/g, "-") .replace(/^-|-$/g, ""); const id = slugify(header.textContent); header.id = id; // Set ID on the header using the slugified text // Create an anchor link and append it to the TOC const anchor = document.createElement("a"); anchor.href = `#${id}`; anchor.textContent = header.textContent; anchor.className = header.tagName === "H2" ? "bold" : ""; tocList.appendChild(anchor); }); toc.appendChild(tocList); const initialTopOffset = tocList.getBoundingClientRect().top + window.scrollY - 148; const stickySidebar = () => { if (window.innerWidth > 1280) { if (window.scrollY >= initialTopOffset) { tocList.style.position = "fixed"; tocList.style.top = "148px"; } else { tocList.style.position = "relative"; tocList.style.top = ""; } } else { tocList.style.position = "relative"; tocList.style.top = ""; } }; stickySidebar(); window.addEventListener("scroll", stickySidebar); window.addEventListener("resize", stickySidebar); } }); } // Notebooks if ( path === "examples" && (page === "notebooks" || page === "sample-apps" || page == "reference-architectures") ) { const toc = document.querySelector("#table-of-contents"); if (toc) toc.style.display = "none"; const sidebar = document.querySelector("#content-side-layout"); if (sidebar) sidebar.style.display = "none"; const heading = document.querySelector("#header h1"); if (heading) heading.style.fontSize = "1.5rem"; } } // Detect when codeblock languages change and rerun the function to replace API keys if (mutation.target.dataset.componentPart === "code-block-root") { debouncedRefreshApiKeys(); } } catch (error) { console.error("Error handling mutation:", error); } } }); }); observer.observe(document.body, { childList: true, subtree: true }); // Replace the header cta button since replacing the svg via css ::after is not working window.addEventListener("load", () => { const ctaButton = document.querySelector("#topbar-cta-button"); if (ctaButton) { ctaButton.innerHTML = ""; const a = document.createElement("a"); a.href = "https://app.pinecone.io/?sessionType=signup"; a.target = "_blank"; a.textContent = "Sign up free"; const svg = ''; a.insertAdjacentHTML("beforeend", svg); ctaButton.appendChild(a); } localStorage.setItem("isDarkMode", "false"); const [path, page, page2] = window.location.pathname.split("/").slice(1); if (path !== "reference") { // Remove version picker from home page on load const versionToggle = document.getElementById( "headlessui-menu-button-:r0:" ); if (versionToggle) { versionToggle.style.visibility = "hidden"; } } }); // Model Carousel document.addEventListener("DOMContentLoaded", () => { const carousel = document.getElementById("modelCarousel"); const prevButton = document.getElementById("prevButton"); const nextButton = document.getElementById("nextButton"); if (!carousel || !prevButton || !nextButton) return; const handleScroll = (direction) => { const cardWidth = carousel.offsetWidth / 3; carousel.scrollBy({ left: direction * cardWidth, behavior: "smooth", }); }; prevButton.addEventListener("click", (e) => { e.preventDefault(); handleScroll(-1); }); nextButton.addEventListener("click", (e) => { e.preventDefault(); handleScroll(1); }); }); // Fix for Radix popper content wrapper used in page context menu const fixRadixPoppers = () => { // Handle page context menu popper elements that appear in the DOM new MutationObserver((mutations) => { document .querySelectorAll("[data-radix-popper-content-wrapper]") .forEach((el) => { // Check if this is the page context menu by looking for specific identifiers const menuContent = el.querySelector("[data-radix-menu-content]"); // Only target the specific page context menu with the copy/markdown/ChatGPT/Claude options if ( menuContent && (menuContent.textContent.includes("Copy page") || menuContent.textContent.includes("View as Markdown") || menuContent.textContent.includes("Open in ChatGPT") || menuContent.textContent.includes("Open in Claude")) ) { // Unset the min-width style for the page context menu el.style.minWidth = ""; el.style.zIndex = "10"; } }); }).observe(document, { childList: true, subtree: true }); // Also check for existing page context menu elements document .querySelectorAll("[data-radix-popper-content-wrapper]") .forEach((el) => { const menuContent = el.querySelector("[data-radix-menu-content]"); // Only target the specific page context menu with the copy/markdown/ChatGPT/Claude options if ( menuContent && (menuContent.textContent.includes("Copy page") || menuContent.textContent.includes("View as Markdown") || menuContent.textContent.includes("Open in ChatGPT") || menuContent.textContent.includes("Open in Claude")) ) { el.style.minWidth = ""; el.style.zIndex = "10"; } }); }; // End of Selection

APIs

Database

Inference

Admin

SDKs

Tools