1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[823],{5462:(e,n,s)=>{(window.__NEXT_P=window.__NEXT_P||[]).push(["/swiper-mcp",function(){return s(576)}])},576:(e,n,s)=>{"use strict";s.r(n),s.d(n,{default:()=>d,meta:()=>t});var r=s(4848),a=s(8453),i=s(1086),l=s(8877);let t={title:"Swiper MCP Server",description:"Model Context Protocol server for Swiper API documentation and demos"},c=function(e){let{children:n}=e,s={h1:i.A.h1,h2:i.A.h2,h3:i.A.h3,h4:i.A.h4};return(0,r.jsx)(a.x,{components:s,children:(0,r.jsx)(l.p,{meta:t,children:n})})};function o(e){let n={a:"a",blockquote:"blockquote",code:"code",h2:"h2",h3:"h3",li:"li",ol:"ol",p:"p",pre:"pre",span:"span",strong:"strong",ul:"ul",...(0,a.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(n.h2,{id:"overview",children:"Overview"}),"\n",(0,r.jsx)(n.p,{children:"The Swiper MCP (Model Context Protocol) Server provides programmatic access to Swiper's API documentation, demos, and code examples. It enables AI assistants and development tools to search, retrieve, and understand Swiper's API through a standardized JSON-RPC 2.0 interface."}),"\n",(0,r.jsx)(n.h3,{id:"features",children:"Features"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"API Documentation Search"}),": Search through Swiper options, methods, and events"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Detailed API Lookups"}),": Get comprehensive information about specific API items"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Module Documentation"}),": Retrieve all options, methods, and events for a specific module"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Demo Code Access"}),": Get complete demo code for any Swiper demo in your preferred framework"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Public Access"}),": No authentication required - free to use"]}),"\n"]}),"\n",(0,r.jsx)(n.h3,{id:"server-information",children:"Server Information"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Protocol"}),": MCP (Model Context Protocol) via JSON-RPC 2.0"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Transport"}),": HTTP POST requests"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Endpoint"}),": ",(0,r.jsx)(n.code,{children:"https://swiperjs.com/mcp"})]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Protocol Version"}),": 2024-11-05"]}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"available-tools",children:"Available Tools"}),"\n",(0,r.jsx)(n.p,{children:"The Swiper MCP server provides 8 tools for interacting with Swiper documentation:"}),"\n",(0,r.jsxs)(n.h3,{id:"1-search-api",children:["1. ",(0,r.jsx)(n.code,{children:"search-api"})]}),"\n",(0,r.jsx)(n.p,{children:"Search Swiper API documentation for options, methods, or events."}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Parameters:"})}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"query"})," (string, required): Search query string"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"type"})," (string, optional): Filter by type - ",(0,r.jsx)(n.code,{children:'"option"'}),", ",(0,r.jsx)(n.code,{children:'"method"'}),", ",(0,r.jsx)(n.code,{children:'"event"'}),", or ",(0,r.jsx)(n.code,{children:'"all"'})," (default)"]}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Example:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"name"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"search-api"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"arguments"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"query"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"navigation"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"type"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"option"'}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.strong,{children:"Returns:"})," Array of matching API items with descriptions, types, and categories."]}
1),"\n",(0,r.jsxs)(n.h3,{id:"2-get-option",children:["2. ",(0,r.jsx)(n.code,{children:"get-option"})]}),"\n",(0,r.jsx)(n.p,{children:"Get detailed information about a specific Swiper option by name."}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Parameters:"})}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"name"})," (string, required): The name of the option (e.g., ",(0,r.jsx)(n.code,{children:'"slidesPerView"'}),", ",(0,r.jsx)(n.code,{children:'"spaceBetween"'}),")"]}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Example:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"name"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"get-option"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"arguments"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"name"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"slidesPerView"'}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.strong,{children:"Returns:"})," Option details including type, default value, description, and full type information."]}),"\n",(0,r.jsxs)(n.h3,{id:"3-get-method",children:["3. ",(0,r.jsx)(n.code,{children:"get-method"})]}),"\n",(0,r.jsx)(n.p,{children:"Get detailed information about a specific Swiper method by name."}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Parameters:"})}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"name"})," (string, required): The name of the method (e.g., ",(0,r.jsx)(n.code,{children:'"slideNext"'}),", ",(0,r.jsx)(n.code,{children:'"update"'}),", ",(0,r.jsx)(n.code,{children:'"destroy"'}),")"]}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Example:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"name"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"get-method"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"arguments"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"name"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"slideNext"'}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.strong,{children:"Returns:"})," Method details including signature, parameters, return type, and description."]}),"\n",(0,r.jsxs)(n.h3,{id:"4-get-event",children:["4. ",(0,r.jsx)(n.code,{children:"get-event"})]}),"\n",(0,r.jsx)(n.p,{children:"Get detailed information about a specific Swiper event by name."}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Parameters:"})}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"name"})," (string, required): The name of the event (e.g., ",(0,r.jsx)(n.code,{children:'"slideChange"'}),", ",(0,r.jsx)(n.code,{children:'"init"'}),", ",(0,r.jsx)(n.code,{children:'"transitionStart"'}),")"]}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Example:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"name"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"get-event"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"arguments"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"name"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"slideChange"'}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.strong,{children:"Returns:"})," Event details including parameters, description, and usage information."]}),"\n",(0,r.jsxs)(n.h3,{id:"5-get-module-options",children:["5. ",(0,r.jsx)(n.code,{children:"get-module-options"})]}),"\n",(0,r.jsx)(n.p,{children:"Get all options, methods, and events for a specific Swiper module."}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Parameters:"})}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"module"})," (string, required): The module name (e.g., ",(0,r.jsx)(n.code,{children:'"navigation"'}),", ",(0,r.jsx)(n.code,{children:'"pagination"'}),", ",(0,r.jsx)(n.code,{children:'"autoplay"'}),"). Case-insensitive."]}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Example:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"name"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"get-module-options"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"arguments"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"module"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"navigation"'}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.strong,{children:"Returns:"})," Complete module documentation including:"]}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"options"}),": All configuration options for the module"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"methods"}),": All available methods for the module"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"events"}),": All events emitted by the module"]}),"\n"]}),"\n",(0,r.jsxs)(n.h3,{id:"6-list-demos",children:["6. ",(0,r.jsx)(n.code,{children:"list-demos"})]}),"\n",(0,r.jsx)(n.p,{children:"List all available Swiper demos with their metadata."}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.strong,{children:"Parameters:"})," None"]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Example:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"name"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"list-demos"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"arguments"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.strong,{children:"Returns:"})," Array of demo objects containing:"]}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"slug"}),": Demo identifier (e.g., ",(0,r.jsx)(n.code,{children:'"navigation"'}),", ",(0,r.jsx)(n.code,{children:'"pagination"'}),")"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"title"}),": Human-readable demo name"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"folder"}),": Demo folder name"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"frameworks"}),": Array of available framework variants (e.g., ",(0,r.jsx)(n.code,{children:'["core", "element", "react", "vue"]'}),")"]}),"\n"]}),"\n",(0,r.jsxs)(n.h3,{id:"7-get-demo",children:["7. ",(0,r.jsx)(n.code,{children:"get-demo"})]}),"\n",(0,r.jsx)(n.p,{children:"Get complete demo code for a specific Swiper demo in your preferred framework."}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Parameters:"})}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"slug"})," (string, required): The demo slug (e.g., ",(0,r.jsx)(n.code,{children:'"default"'}),", ",(0,r.jsx)(n.code,{children:'"navigation"'}),", ",(0,r.jsx)(n.code,{children:'"pagination"'}),")"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"framework"})," (string, required): The framework variant - ",(0,r.jsx)(n.code,{children:'"core"'}),", ",(0,r.jsx)(n.code,{children:'"element"'}),", ",(0,r.jsx)(n.code,{children:'"react"'}),", ",(0,r.jsx)(n.code,{children:'"vue"'}),", etc."]}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Example:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"name"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"get-demo"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"arguments"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"slug"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"navigation"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"framework"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"react"'}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.strong,{children:"Returns:"})," Object with file paths as keys and file content as values. For example:"]}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"src/App.jsx"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"content"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:"\"import React from 'react';\\n...\""}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"src/styles.css"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"content"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'".swiper { ... }"'}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsxs)(n.h3,{id:"8-get-premium-recommendations",children:["8. ",(0,r.jsx)(n.code,{children:"get-premium-recommendations"})]}),"\n",(0,r.jsx)(n.p,{children:"Get premium Swiper plugin recommendations based on effect, module, keywords, or use case."}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Parameters:"})}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"effect"})," (string, optional): Swiper effect name (e.g., ",(0,r.jsx)(n.code,{children:'"cards"'}),", ",(0,r.jsx)(n.code,{children:'"coverflow"'}),", ",(0,r.jsx)(n.code,{children:'"cube"'}),")"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"module"})," (string, optional): Swiper module name (e.g., ",(0,r.jsx)(n.code,{children:'"Parallax"'}),", ",(0,r.jsx)(n.code,{children:'"Autoplay"'}),")"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"keywords"})," (string, optional): Keywords to search for (e.g., ",(0,r.jsx)(n.code,{children:'"3d"'}),", ",(0,r.jsx)(n.code,{children:'"instagram"'}),", ",(0,r.jsx)(n.code,{children:'"tinder"'}),")"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"useCase"})," (string, optional): Use case description (e.g., ",(0,r.jsx)(n.code,{children:'"e-commerce"'}),", ",(0,r.jsx)(n.code,{children:'"dating app"'}),")"]}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Example:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"name"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"get-premium-recommendations"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"arguments"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"effect"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"cards"'}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.strong,{children:"Returns:"})," Array of premium product recommendations including:"]}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"title"}),": Product name"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"description"}),": Product description"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"url"}),": Link to the product page"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"preview"}),": Live preview URL"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"useCases"}),": Array of suggested use cases"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"features"}),": Key features of the product"]}),"\n",(0,r.jsx
1s)(n.li,{children:[(0,r.jsx)(n.code,{children:"timeSaved"}),": Estimated development time saved"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"availableInSwiperStudio"}),": Whether it's available in Swiper Studio"]}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"setup-instructions",children:"Setup Instructions"}),"\n",(0,r.jsx)(n.h3,{id:"cursor",children:"Cursor"}),"\n",(0,r.jsxs)("a",{className:"inline-block",href:"cursor://anysphere.cursor-deeplink/mcp/install?name=swiper&config=eyJ1cmwiOiJodHRwczovL3N3aXBlcmpzLmNvbS9tY3AifQ==",children:[(0,r.jsx)("img",{className:"dark:hidden !rounded-none",src:"https://cursor.com/deeplink/mcp-install-dark.svg",alt:"Install MCP Server"}),(0,r.jsx)("img",{className:"hidden dark:block !rounded-none",src:"https://cursor.com/deeplink/mcp-install-light.svg",alt:"Install MCP Server"})]}),"\n",(0,r.jsxs)(n.ol,{children:["\n",(0,r.jsx)(n.li,{children:"Open Cursor Settings"}),"\n",(0,r.jsxs)(n.li,{children:["Navigate to ",(0,r.jsx)(n.strong,{children:"Tools & MCP"})," â ",(0,r.jsx)(n.strong,{children:"Install MCP Server"})]}),"\n",(0,r.jsxs)(n.li,{children:["Click ",(0,r.jsx)(n.strong,{children:"New MCP Server"})," or edit your MCP configuration file (usually ",(0,r.jsx)(n.code,{children:".cursor/mcp.json"})," in your project or global Cursor config)"]}),"\n",(0,r.jsx)(n.li,{children:"Add the following configuration:"}),"\n"]}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"mcpServers"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"swiper"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"url"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"https://swiperjs.com/mcp"'}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsxs)(n.ol,{start:"5",children:["\n",(0,r.jsx)(n.li,{children:"The Swiper MCP server will now be available in your AI conversations"}),"\n"]}),"\n",(0,r.jsx)(n.h3,{id:"claude-code",children:"Claude Code"}),"\n",(0,r.jsx)(n.p,{children:"Claude Code uses the command-line interface to add MCP servers. HTTP transport is recommended for remote servers like Swiper."}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Add the Swiper MCP server:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-bash",children:(0,r.jsxs)(n.code,{className:"language-bash",children:["claude mcp ",(0,r.jsx)(n.span,{className:"token function",children:"add"})," --transport http swiper https://swiperjs.com/mcp\n"]})}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Verify the server was added:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-bash",children:(0,r.jsx)(n.code,{className:"language-bash",children:"claude mcp list\n"})}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Get server details:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-bash",children:(0,r.jsx)(n.code,{className:"language-bash",children:"claude mcp get swiper\n"})}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Check server status in Claude Code:"})}),"\n",(0,r.jsxs)(n.p,{children:["Within Claude Code, use the ",(0,r.jsx)(n.code,{children:"/mcp"})," command to see all connected MCP servers and their status."]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Scopes:"})}),"\n",(0,r.jsxs)(n.p,{children:["You can specify where the configuration is stored using the ",(0,r.jsx)(n.code,{children:"--scope"})," flag:"]}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"local"})," (default): Available only to you in the current project"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"project"}
1),": Shared with everyone via ",(0,r.jsx)(n.code,{children:".mcp.json"})," file in project root"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"user"}),": Available to you across all projects"]}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Example with project scope:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-bash",children:(0,r.jsxs)(n.code,{className:"language-bash",children:["claude mcp ",(0,r.jsx)(n.span,{className:"token function",children:"add"})," --transport http swiper --scope project https://swiperjs.com/mcp\n"]})}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Remove a server:"})}),"\n",(0,r.jsx)(n.pre,{className:"language-bash",children:(0,r.jsx)(n.code,{className:"language-bash",children:"claude mcp remove swiper\n"})}),"\n",(0,r.jsx)(n.p,{children:"You can now ask Claude Code about Swiper API documentation, and it will use the MCP tools automatically."}),"\n",(0,r.jsx)(n.h3,{id:"vs-code",children:"VS Code"}),"\n",(0,r.jsx)(n.p,{children:"VS Code has built-in support for MCP servers starting from version 1.102. You can add MCP servers to your workspace or user configuration."}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Add to Workspace (Recommended for team projects):"})}),"\n",(0,r.jsxs)(n.ol,{children:["\n",(0,r.jsxs)(n.li,{children:["Create a ",(0,r.jsx)(n.code,{children:".vscode/mcp.json"})," file in your workspace root"]}),"\n",(0,r.jsx)(n.li,{children:"Add the Swiper MCP server configuration:"}),"\n"]}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"servers"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"swiper"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"type"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"http"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"url"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"https://swiperjs.com/mcp"'}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Add to User Configuration (Available across all projects):"})}),"\n",(0,r.jsxs)(n.ol,{children:["\n",(0,r.jsxs)(n.li,{children:["Run the ",(0,r.jsx)(n.strong,{children:"MCP: Add Server"})," command from the Command Palette (â§âP / Ctrl+Shift+P)"]}),"\n",(0,r.jsxs)(n.li,{children:["Choose ",(0,r.jsx)(n.strong,{children:"HTTP"})," as the server type"]}),"\n",(0,r.jsxs)(n.li,{children:["Enter the server name: ",(0,r.jsx)(n.code,{children:"swiper"})]}),"\n",(0,r.jsxs)(n.li,{children:["Enter the URL: ",(0,r.jsx)(n.code,{children:"https://swiperjs.com/mcp"})]}),"\n",(0,r.jsxs)(n.li,{children:["Select ",(0,r.jsx)(n.strong,{children:"Global"})," to add it to your user configuration"]}),"\n"]}),"\n",(0,r.jsxs)(n.p,{children:["Alternatively, you can run ",(0,r.jsx)(n.strong,{children:"MCP: Open User Configuration"})," and manually add the configuration."]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Add from Extensions View:"})}),"\n",(0,r.jsxs)(n.ol,{children:["\n",(0,r.jsx)(n.li,{children:"Open the Extensions view (â§âX / Ctrl+Shift+X)"}),"\n",(0,r.jsxs)(n.li,{children:["Search for ",(0,r.jsx)(n.code,{children:"@mcp"})," or run the ",(0,r.jsx)(n.strong,{children:"MCP: Browse Servers"})," command"]}),"\n",(0,r.jsx)(n.li,{children:'Search for "swiper" and install it'}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Using the Tools:"})}),"\n",(0,r.jsx)(n.p,{children:"Once configured, you can use Swiper MCP tools in the Chat view:"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsx)(n.li,{children:"Open Chat (ââI / Ctrl+Alt+I)"}),"\n",(0,r.jsx)(n.li,{children:"Tools are automatically available when using agents"}),"\n",(0,r.jsxs)(n.li,{children:["You can explicitly reference tools by typing ",(0,r.jsx)(n.code,{children:"#"})," followed by the tool name"]}),"\n"]}),"\n",(0,r.jsxs)(n.p,{children:["For more information, see the ",(0,r.jsx)(n.a,{href:"https://code.visualstudio.com/docs/copilot/customization/mcp-servers",children:"VS Code MCP documentation"}),"."]}),"\n",(0,r.jsx)(n.h3,{id:"codex-openai",children:"Codex (OpenAI)"}),"\n",(0,r.jsx)(n.p,{children:"Codex supports MCP servers through both the Codex CLI and Codex IDE extension. Configuration is shared between both."}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Add using CLI (Recommended):"})}),"\n",(0,r.jsx)(n.pre,{className:"language-bash",children:(0,r.jsxs)(n.code,{className:"language-bash",children:["codex mcp ",(0,r.jsx)(n.span,{className:"token function",children:"add"})," swiper --url https://swiperjs.com/mcp\n"]})}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Add by editing config.toml:"})}),"\n",(0,r.jsxs)(n.ol,{children:["\n",(0,r.jsxs)(n.li,{children:["Open or create the Codex configuration file at ",(0,r.jsx)(n.code,{children:"~/.codex/config.toml"})]}),"\n",(0,r.jsxs)(n.li,{children:["If using the IDE extension, click the gear icon â ",(0,r.jsx)(n.code,{children:"MCP settings > Open config.toml"})]}),"\n",(0,r.jsx)(n.li,{children:"Add the Swiper MCP server configuration:"}),"\n"]}),"\n",(0,r.jsx)(n.pre,{className:"language-bash",children:(0,r.jsxs)(n.code,{className:"language-bash",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"["}),"mcp_servers.swiper",(0,r.jsx)(n.span,{className:"token punctuation",children:"]"}),"\nurl ",(0,r.jsx)(n.span,{className:"token operator",children:"="})," ",(0,r.jsx)(n.span,{className:"token string",children:'"https://swiperjs.com/mcp"'}),"\n"]})}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Verify the server:"})}),"\n",(0,r.jsxs)(n.p,{children:["In the Codex TUI (Terminal UI), use ",(0,r.jsx)(n.code,{children:"/mcp"})," to see your actively connected MCP servers."]}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Advanced Configuration:"})}),"\n",(0,r.jsx)(n.p,{children:"You can customize timeouts and other settings:"}),"\n",(0,r.jsx)(n.pre,{className:"language-bash",children:(0,r.jsxs)(n.code,{className:"language-bash",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"["}),"mcp_servers.swiper",(0,r.jsx)(n.span,{className:"token punctuation",children:"]"}),"\nurl ",(0,r.jsx)(n.span,{className:"token operator",children:"="})," ",(0,r.jsx)(n.span,{className:"token string",children:'"https://swiperjs.com/mcp"'}),"\nstartup_timeout_sec ",(0,r.jsx)(n.span,{className:"token operator",children:"="})," ",(0,r.jsx)(n.span,{className:"token number",children:"10"}),"\ntool_timeout_sec ",(0,r.jsx)(n.span,{className:"token operator",children:"="})," ",(0,r.jsx)(n.span,{className:"token number",children:"60"}),"\nenabled ",(0,r.jsx)(n.span,{className:"token operator",children:"="})," ",(0,r.jsx)(n.span,{className:"token boolean",children:"true"}),"\n"]})}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Disable/Enable:"})}),"\n",(0,r.jsx)(n.p,{children:"To temporarily disable a server without remov
1ing it:"}),"\n",(0,r.jsx)(n.pre,{className:"language-bash",children:(0,r.jsxs)(n.code,{className:"language-bash",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"["}),"mcp_servers.swiper",(0,r.jsx)(n.span,{className:"token punctuation",children:"]"}),"\nurl ",(0,r.jsx)(n.span,{className:"token operator",children:"="})," ",(0,r.jsx)(n.span,{className:"token string",children:'"https://swiperjs.com/mcp"'}),"\nenabled ",(0,r.jsx)(n.span,{className:"token operator",children:"="})," ",(0,r.jsx)(n.span,{className:"token boolean",children:"false"}),"\n"]})}),"\n",(0,r.jsxs)(n.p,{children:["For more information, see the ",(0,r.jsx)(n.a,{href:"https://developers.openai.com/codex/mcp/",children:"Codex MCP documentation"}),"."]}),"\n",(0,r.jsx)(n.h3,{id:"opencode",children:"OpenCode"}),"\n",(0,r.jsx)(n.p,{children:"OpenCode supports both local and remote MCP servers. The Swiper MCP server is a remote HTTP server."}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Add to your OpenCode configuration:"})}),"\n",(0,r.jsxs)(n.ol,{children:["\n",(0,r.jsxs)(n.li,{children:["Open or create your ",(0,r.jsx)(n.code,{children:"opencode.jsonc"})," or ",(0,r.jsx)(n.code,{children:"opencode.json"})," configuration file"]}),"\n",(0,r.jsxs)(n.li,{children:["Add the Swiper MCP server under the ",(0,r.jsx)(n.code,{children:"mcp"})," section:"]}),"\n"]}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"$schema"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"https://opencode.ai/config.json"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"mcp"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"swiper"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"type"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"remote"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"url"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"https://swiperjs.com/mcp"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"enabled"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token boolean",children:"true"}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Disable temporarily:"})}),"\n",(0,r.jsxs)(n.p,{children:["Set ",(0,r.jsx)(n.code,{children:"enabled"})," to ",(0,r.jsx)(n.code,{children:"false"})," to temporarily disable without removing the configuration:"]}),"\n",(0,r.jsx)(n.pre,{className:"language-json",children:(0,r.jsxs)(n.code,{className:"language-json",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"mcp"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"swiper"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"type"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"remote"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"url"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:'"https://swiperjs.com/mcp"'}),(0,r.jsx)(n.span,{className:"token punctuation",children:","}),"\n ",(0,r.jsx)(n.span,{className:"token property",children:'"enabled"'}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token boolean",children:"false"}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"Manage MCP servers:"})}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:["Disable globally in the ",(0,r.jsx)(n.code,{children:"tools"})," section: ",(0,r.jsx)(n.code,{children:'"swiper": false'})]}),"\n",(0,r.jsxs)(n.li,{children:["Enable per-agent by adding ",(0,r.jsx)(n.code,{children:'"swiper": true'})," in the agent's tools configuration"]}),"\n"]}),"\n",(0,r.jsxs)(n.p,{children:["For more information, see the ",(0,r.jsx)(n.a,{href:"https://opencode.ai/docs/mcp-servers/",children:"OpenCode MCP documentation"}),"."]}),"\n",(0,r.jsx)(n.h2,{id:"usage-examples",children:"Usage Examples"}),"\n",(0,r.jsx)(n.h3,{id:"example-1-finding-navigation-options",children:"Example 1: Finding Navigation Options"}),"\n",(0,r.jsx)(n.p,{children:"Ask your AI assistant:"}),"\n",(0,r.jsxs)(n.blockquote,{children:["\n",(0,r.jsx)(n.p,{children:'"What are the available options for Swiper navigation?"'}),"\n"]}),"\n",(0,r.jsxs)(n.p,{children:["The assistant will use the ",(0,r.jsx)(n.code,{children:"get-module-options"})," tool with ",(0,r.jsx)(n.code,{children:'module: "navigation"'})," and return all navigation-related options, methods, and events."]}),"\n",(0,r.jsx)(n.h3,{id:"example-2-getting-demo-code",children:"Example 2: Getting Demo Code"}),"\n",(0,r.jsx)(n.p,{children:"Ask your AI assistant:"}),"\n",(0,r.jsxs)(n.blockquote,{children:["\n",(0,r.jsx)(n.p,{children:'"Show me the React code for a Swiper navigation demo"'}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:"The assistant will:"}),"\n",(0,r.jsxs)(n.ol,{children:["\n",(0,r.jsxs)(n.li,{children:["Use ",(0,r.jsx)(n.code,{children:"list-demos"})," to find demos"]}),"\n",(0,r.jsxs)(n.li,{children:["Use ",(0,r.jsx)(n.code,{children:"get-demo"})," with ",(0,r.jsx)(n.code,{children:'slug: "navigation"'})," and ",(0,r.jsx)(n.code,{children:'framework: "react"'})]}),"\n",(0,r.jsx)(n.li,{children:"Return the complete React component code"}),"\n"]}),"\n",(0,r.jsx)(n.h3,{id:"example-3-searching-for-a-specific-option",children:"Example 3: Searching for a Specific Option"}),"\n",(0,r.jsx)(n.p,{children:"Ask your AI assistant:"}),"\n",(0,r.jsxs)(n.blockquote,{children:["\n",(0,r.jsx)(n.p,{children:'"What does the slidesPerView option do?"'}),"\n"]}),"\n",(0,r.jsxs)(n.p,{children:["The assistant will use ",(0,r.jsx)(n.code,{children:"get-option"})," with ",(0,r.jsx)(n.code,{children:'name: "slidesPerView"'})," and return detailed documentation including:"]}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsx)(n.li,{children:"Type information"}),"\n",(0,r.jsx)(n.li,{children:"Default value"}),"\n",(0,r.jsx)(n.li,{children:"Description"}),"\n",(0,r.jsx)(n.li,{children:"Usage examples"}),"\n"]}),"\n",(0,r.jsx)(n.h3,{id:"example-4-finding-methods",children:"Example 4: Finding Methods"}),"\n",(0,r.jsx)(n.p,{children:"Ask your AI assistant:"}),"\n",(0,r.jsxs)(n.blockquote,{children:["\n",(0,r.jsx)(n.p,{children:'"How do I programmatically go to the next slide?"'}),"\n"]}),"\n",(0,r.jsxs)(n.p,{children:["The assistant will use ",(0,r.jsx)(n.code,{children:"get-method"})," with ",(0,r.jsx)(n.code,{children:'name: "slideNext"'})," and return the method signature, parameters, and usage instructions."]}),"\n",(0,r.jsx)(n.h2,{id:"supported-modules",children:"Supported Modules"}),"\n",(0,r.jsx)(n.p,{children:"The following Swiper modules are fully documented and accessible via the MCP server:"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"A11y"})," - Accessibility features"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Autoplay"})," - Automatic slide transitions"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Controller"})," - Control multiple swipers"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"CoverflowEffect"})," - 3D coverflow effect"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"CubeEffect"})," - 3D cube effect"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"CreativeEffect"})," - Creative transition effects"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"CardsEffect"})," - Cards transition effect"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"FadeEffect"})," - Fade transition effect"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"FlipEffect"})," - Flip transition effect"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"FreeMode"})," - Free scroll mode"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Grid"})," - Multi-row grid layout"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"HashNavigation"})," - Hash-based navigation"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"History"})," - Browser history integration"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Keyboard"})," - Keyboard control"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Lazy"})," - Lazy loading"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Manipulation"})," - Slide manipulation methods"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Mousewheel"})," - Mousewheel control"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Navigation"})," - Navigation arrows"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Pagination"})," - Pagination bullets/dots"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Parallax"})," - Parallax effects"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Scrollbar"})," - Scrollbar navigation"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Thumbs"})," - Thumbnail gallery"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Virtual"})," - Virtual slides"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Zoom"})," - Image zoom"]}),"\n"]}),"\n",(0,r.jsxs)(n.p,{children:["Each module can be queried using the ",(0,r.jsx)(n.code,{children:"get-module-options"})," tool."]}),"\n",(0,r.jsx)(n.h2,{id:"api-response-format",children:"API Response Format"}),"\n",(0,r.jsx)(n.p,{children:"All tools return responses in the MCP Tool Call Result format:"}),"\n",(0,r.jsx)(n.pre,{className:"language-typescript",children:(0,r.jsxs)(n.code,{className:"language-typescript",children:[(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n content",(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token known-class-name class-name",children:"Array"}),(0,r.jsx)(n.span,{className:"token operator",children:"<"}),(0,r.jsx)(n.span,{className:"token punctuation",children:"{"}),"\n type",(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token string",children:"'text'"}),(0,r.jsx)(n.span,{className:"token punctuation",children:";"}),"\n text",(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token builtin",children:"string"}),(0,r.jsx)(n.span,{className:"token punctuation",children:";"})," ",(0,r.jsx)(n.span,{className:"token comment",children:"// JSON string containing the actual data"}),"\n ",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),(0,r.jsx)(n.span,{className:"token operator",children:">"}),(0,r.jsx)(n.span,{className:"token punctuation",children:";"}),"\n isError",(0,r.jsx)(n.span,{className:"token operator",children:"?"}),(0,r.jsx)(n.span,{className:"token operator",children:":"})," ",(0,r.jsx)(n.span,{className:"token builtin",children:"boolean"}),(0,r.jsx)(n.span,{className:"token punctuation",children:";"})," ",(0,r.jsx)(n.span,{className:"token comment",children:"// Present if an error occurred"}),"\n",(0,r.jsx)(n.span,{className:"token punctuation",children:"}"}),"\n"]})}),"\n",(0,r.jsxs)(n.p,{children:["The ",(0,r.jsx)(n.code,{children:"text"})," field contains a JSON string that, when parsed, contains the actual response data or error information."]}),"\n",(0,r.jsx)(n.h2,{id:"error-handling",children:"Error Handling"}),"\n",(0,r.jsx)(n.p,{children:"The MCP server uses standard JSON-RPC 2.0 error codes:"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"-32700"}),": Parse error - Invalid JSON"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"-32600"}
1),": Invalid Request - Request structure is invalid"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"-32601"}),": Method not found - Unknown method requested"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"-32602"}),": Invalid params - Parameters are missing or invalid"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.code,{children:"-32603"}),": Internal error - Server-side error occurred"]}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:"Error responses include helpful messages indicating what went wrong and, when applicable, suggestions for fixing the issue."}),"\n",(0,r.jsx)(n.h2,{id:"rate-limits",children:"Rate Limits"}),"\n",(0,r.jsx)(n.p,{children:"Currently, the Swiper MCP server is publicly accessible without authentication and has no rate limits. However, please use responsibly. If you need higher rate limits or have specific requirements, please contact the Swiper team."}),"\n",(0,r.jsx)(n.h2,{id:"contributing",children:"Contributing"}),"\n",(0,r.jsx)(n.p,{children:"The MCP server implementation is part of the Swiper website repository. To contribute improvements or report issues:"}),"\n",(0,r.jsxs)(n.ol,{children:["\n",(0,r.jsxs)(n.li,{children:["Visit the ",(0,r.jsx)(n.a,{href:"https://github.com/nolimits4web/swiper-website",children:"Swiper GitHub repository"})]}),"\n",(0,r.jsx)(n.li,{children:"Open an issue or submit a pull request"}),"\n",(0,r.jsx)(n.li,{children:"Include detailed information about your use case or the issue you encountered"}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"changelog",children:"Changelog"}),"\n",(0,r.jsx)(n.h3,{id:"version-110",children:"Version 1.1.0"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:["Added ",(0,r.jsx)(n.code,{children:"get-premium-recommendations"})," tool for premium plugin discovery"]}),"\n",(0,r.jsxs)(n.li,{children:["Premium alternatives now included in ",(0,r.jsx)(n.code,{children:"get-option"})," and ",(0,r.jsx)(n.code,{children:"get-demo"})," responses for relevant effects"]}),"\n"]}),"\n",(0,r.jsx)(n.h3,{id:"version-100",children:"Version 1.0.0"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsx)(n.li,{children:"Initial release"}),"\n",(0,r.jsx)(n.li,{children:"7 tools for API documentation and demo access"}),"\n",(0,r.jsx)(n.li,{children:"Support for all Swiper modules"}),"\n",(0,r.jsx)(n.li,{children:"Public access without authentication"}),"\n"]})]})}function d(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return(0,r.jsx)(c,{...e,children:(0,r.jsx)(o,{...e})})}},8453:(e,n,s)=>{"use strict";s.d(n,{R:()=>l,x:()=>t});var r=s(6540);let a={},i=r.createContext(a);function l(e){let n=r.useContext(i);return r.useMemo(function(){return"function"==typeof e?e(n):{...n,...e}},[n,e])}function t(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(a):e.components||a:l(e.components),r.createElement(i.Provider,{value:n},e.children)}},1086:(e,n,s)=>{"use strict";s.d(n,{A:()=>i});var r=s(4848),a=s(4164);function i(e){let{level:n,id:s,link:i=!0,children:l,number:t,className:c="",style:o={},...d}=e;return(0,r.jsxs)("h".concat(n),{className:(0,a.A)("group flex whitespace-pre-wrap",c),id:s,style:{...o},...d,children:[i&&(0,r.jsx)("a",{href:"#".concat(s),className:"after:hash absolute opacity-0 group-hover:opacity-100",style:{marginLeft:"-1em",paddingRight:"0.5em",color:"#a1a1aa",textDecoration:"none"},"aria-label":"Anchor"}),(0,r.jsx)("span",{children:l})]})}i.h1=e=>(0,r.jsx)(i,{level:1,...e}),i.h2=e=>(0,r.jsx)(i,{level:2,...e}),i.h3=e=>(0,r.jsx)(i,{level:3,...e}),i.h4=e=>(0,r.jsx)(i,{level:4,...e})},8877:(e,n,s)=>{"use strict";s.d(n,{p:()=>k});var r=s(4848),a=s(6540),i=s(6715),l=s(1106),t=s(3368),c=s(4164);let o=e=>{let[n,s]=(0,a.useState)(e),r=(0,a.useRef)([]),i=(0,a.useRef)(0),l=()=>{let e=document.querySelectorAll(".prose h2[id], .prose h3[id]");for(let n=0;n<e.length;n+=1){let s=e[n];r.current.push({el:s,id:s.id})}},t=()=>{let e=window.scrollY;i.current=window.innerHeight,r.current.forEach(n=>{let s=n.el.getBoundingClientRect();n.offset=e+s.top})},c=()=>{let e=r.current[0],n=window.scrollY,a=r.current.filter(e=>{let{offset:s}=e;return s>=n}
1)[0];r.current.forEach(s=>{n+i.current/2>s.offset&&(e=s)}),r.current.indexOf(a)<r.current.indexOf(e)&&(e=a),e&&e.id&&s(e.id)},o=()=>{c()},d=()=>{t(),c()},h=()=>{window.addEventListener("scroll",o),window.addEventListener("resize",d)},p=()=>{window.removeEventListener("scroll",o),window.removeEventListener("resize",d)};return(0,a.useEffect)(()=>(l(),t(),c(),h(),()=>p()),[]),n};function d(e){let{tableOfContents:n,onClick:s}=e,i=o(n[0].slug);return(0,r.jsx)("ul",{className:"table-of-contents overflow-x-hidden shrink-0",onClick:s,children:n.map(e=>{let n=i===e.slug,s=e.children.findIndex(e=>{let{slug:n}=e;return n===i})>-1;return(0,r.jsxs)(a.Fragment,{children:[(0,r.jsx)("li",{className:"my-1",children:(0,r.jsx)("a",{href:"#".concat(e.slug),className:(0,c.A)("block rounded-full py-1.5 !text-on-surface-darker !no-underline",{"hover:!text-on-surface-dark":!n,"!text-primary":s,"!text-primary":n}),children:e.title})}),e.children.map(e=>{let n=i===e.slug;return(0,r.jsx)("li",{className:"ml-2",children:(0,r.jsx)("a",{href:"#".concat(e.slug),className:(0,c.A)("block rounded-full px-3 py-1 !text-on-surface-darker !no-underline",{"hover:!text-on-surface-dark":!n,"!text-primary":n}),children:e.title})},e.slug)})]},e.slug)})})}var h=s(6033);let p=[...s(1061),...h],x=e=>e.startsWith("http")?e:"/images/sponsors/".concat(e);function j(){return window.__NO_SPONSORS__?null:(0,r.jsxs)("div",{className:"mb-4","data-sponsors":"",children:[(0,r.jsxs)("div",{className:"mb-2 flex items-center justify-between",children:[(0,r.jsx)("span",{children:"Sponsors"}),(0,r.jsx)("a",{href:"https://sponsors.nolimits4web.com",target:"_blank",className:"text-xs text-primary no-underline",children:"Become a sponsor"})]}),(0,r.jsx)("div",{className:"flex flex-wrap gap-1",children:p.filter(e=>{let{plan:n,active:s}=e;return"Sponsor"!==n&&s}).map((e,n)=>{let{link:s,title:a,image:i}=e;return(0,r.jsx)("a",{className:"flex items-center justify-center hover:opacity-80 bg-white",href:s,title:a+n,rel:"sponsored",target:"_blank",children:i&&(0,r.jsx)("img",{className:"h-7 w-7 object-contain lg:h-8 lg:w-8",alt:a,loading:"lazy",src:x(i)})},a)})})]})}let m=a.useLayoutEffect;var u=s(8578),g=s(1325),N=s(2888);function k(e){let{children:n,meta:s={},pageTitle:c="",beforePageTitle:o="",afterPageTitle:h=""}=e,p=(0,i.useRouter)(),x=(0,a.useRef)(null),[k,f]=(0,a.useState)([]),[v,w]=(0,a.useState)(!1);return m(()=>{let e;let n=[];return x.current.querySelectorAll("h2, h3").forEach(s=>{let r=s.getAttribute("id"),a=s.textContent.trim();e="h3"===s.nodeName.toLowerCase();let i={slug:r,title:a,children:[]};if(e){let e=Math.max(n.length-1,0);n[e]||(n[e]={children:[]}),n[e].children.push(i)}else n.push(i)}),f(n),()=>{}},[]),(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(N.s,{withSidebar:!0}),(0,r.jsxs)("div",{id:s.containerId,className:"mx-auto flex w-full justify-between px-4 sm:px-6 md:px-8 relative",children:[s&&(0,r.jsxs)(t,{children:[(0,r.jsx)("title",{children:s.title},"title"),(0,r.jsx)("meta",{property:"og:title",content:s.title}),(0,r.jsx)("meta",{name:"twitter:title",content:s.title}),s.description&&(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("meta",{name:"description",content:s.description},"description"),(0,r.jsx)("meta",{property:"og:description",content:s.description},"og:description"),(0,r.jsx)("meta",{name:"twitter:description",content:s.description},"twitter:description")]})]}),(0,r.jsx)(u.$,{className:"!fixed bottom-4 right-4 z-40 lg:hidden bg-surface-1 border border-outline backdrop-blur-lg w-16 h-16",onClick:()=>w(!0),children:(0,r.jsx)("svg",{className:"h-6 w-6",xmlns:"http://www.w3.org/2000/svg",height:"24",viewBox:"0 -960 960 960",width:"24",fill:"currentColor",children:(0,r.jsx)("path",{d:"M120-240v-80h720v80H120Zm0-200v-80h720v80H120Zm0-200v-80h720v80H120Z"})})}),(0,r.jsx)("div",{className:"fixed right-0 top-0 z-50 h-full w-full bg-black/40 lg:z-40 lg:!hidden ".concat(v?"block":"hidden"),onClick:()=>w(!1)}),(0,r.jsx)("div",{className:"fixed left-2 top-2 bottom-2 z-50 mr-10 h-[calc(100vh-16px)] w-64 flex-none text-sm lg:relative lg:z-40 lg:left-0 lg:-top-34 lg:!block lg:h-auto lg:rounded-none ".concat(v?"block":"hidden"),children:(0,r.jsxs)("div",{className:"h-full overflow-y-auto overscroll-contain p-4 lg:sticky lg:top-4 bg-surface-1 border rounded-3xl border-outline backdrop-blur-2xl flex flex-col lg:h-[calc(100vh-32px)]",children:[(0,r.jsx)(j,{}
1),k.length>0&&(0,r.jsx)(d,{onClick:e=>{e.target&&e.target.closest("a")&&w(!1)},tableOfContents:k})]})}),(0,r.jsxs)("div",{className:"dark:prose-dark prose mx-auto min-w-0 max-w-none flex-auto pb-8 pt-10 2xl:max-w-[940px]",ref:x,children:[o,(c||s.title)&&(0,r.jsx)("h1",{children:c||s.title}),h,n,(0,r.jsx)("div",{className:"mt-4 border-t border-outline pt-4 text-right text-sm",children:(0,r.jsx)(l,{href:"https://github.com/nolimits4web/swiper-website/edit/master/src/pages".concat(p.pathname,".mdx"),children:"Edit this page on GitHub"})})]}),(0,r.jsx)("div",{className:"hidden h-px w-[calc(256px+40px)] shrink-0 2xl:block"})]}),(0,r.jsx)(g.A,{})]})}}},e=>{var n=n=>e(e.s=n);e.O(0,[950,636,593,792],()=>n(5462)),_N_E=e.O()}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.