mcp-use 2.0.0-beta.6 → 2.0.0-beta.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.tsbuildinfo +1 -1
- package/dist/chunk-FC2Z2VFO.js +99 -0
- package/dist/chunk-FC2Z2VFO.js.map +1 -0
- package/dist/chunk-FCGJJVL2.js +739 -0
- package/dist/chunk-FCGJJVL2.js.map +1 -0
- package/dist/{chunk-PMPGMSYA.js → chunk-QUUANIE4.js} +27 -80
- package/dist/chunk-QUUANIE4.js.map +1 -0
- package/dist/chunk-STCR3P5O.js +95 -0
- package/dist/chunk-STCR3P5O.js.map +1 -0
- package/dist/chunk-Z326HADF.js +82 -0
- package/dist/chunk-Z326HADF.js.map +1 -0
- package/dist/commands/build.js +5 -2
- package/dist/commands/build.js.map +1 -1
- package/dist/config.d.ts +12 -0
- package/dist/config.d.ts.map +1 -1
- package/dist/fetch-app.d.ts +26 -0
- package/dist/fetch-app.d.ts.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +47 -19
- package/dist/index.js.map +1 -1
- package/dist/inspector-shell.d.ts +1 -1
- package/dist/inspector-shell.d.ts.map +1 -1
- package/dist/landing-handler-VQRYCQOV.js +31 -0
- package/dist/landing-handler-VQRYCQOV.js.map +1 -0
- package/dist/landing-handler.d.ts +22 -0
- package/dist/landing-handler.d.ts.map +1 -0
- package/dist/landing.d.ts +65 -0
- package/dist/landing.d.ts.map +1 -0
- package/dist/landing.js +7 -0
- package/dist/landing.js.map +1 -0
- package/dist/oauth/better-auth.d.ts +29 -0
- package/dist/oauth/better-auth.d.ts.map +1 -0
- package/dist/oauth/better-auth.js +76 -0
- package/dist/oauth/better-auth.js.map +1 -0
- package/dist/oauth/index.js +2 -1
- package/dist/server.d.ts.map +1 -1
- package/dist/views/document.d.ts.map +1 -1
- package/dist/views/routes.d.ts.map +1 -1
- package/package.json +10 -2
- package/dist/chunk-PMPGMSYA.js.map +0 -1
- package/dist/chunk-VV2P4ZFZ.js +0 -187
- package/dist/chunk-VV2P4ZFZ.js.map +0 -1
|
@@ -0,0 +1,739 @@
|
|
|
1
|
+
// src/landing.ts
|
|
2
|
+
function escapeHtml(text) {
|
|
3
|
+
return text.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'");
|
|
4
|
+
}
|
|
5
|
+
function serializeScriptJson(value) {
|
|
6
|
+
return JSON.stringify(value).replace(/</g, "\\u003c").replace(/>/g, "\\u003e");
|
|
7
|
+
}
|
|
8
|
+
function sanitizeServerName(name) {
|
|
9
|
+
return name.replace(/[^a-zA-Z0-9-_]/g, "_").toLowerCase();
|
|
10
|
+
}
|
|
11
|
+
function generateCursorDeepLink(url, name) {
|
|
12
|
+
const config = { url };
|
|
13
|
+
const configJson = JSON.stringify(config);
|
|
14
|
+
const base64Config = typeof Buffer !== "undefined" ? Buffer.from(configJson).toString("base64") : btoa(configJson);
|
|
15
|
+
const sanitizedName = sanitizeServerName(name);
|
|
16
|
+
return `cursor://anysphere.cursor-deeplink/mcp/install?config=${encodeURIComponent(base64Config)}&name=${encodeURIComponent(sanitizedName)}`;
|
|
17
|
+
}
|
|
18
|
+
function generateVSCodeDeepLink(url, name) {
|
|
19
|
+
const config = {
|
|
20
|
+
url,
|
|
21
|
+
name: sanitizeServerName(name),
|
|
22
|
+
type: "http"
|
|
23
|
+
};
|
|
24
|
+
const configJson = JSON.stringify(config);
|
|
25
|
+
const urlEncodedConfig = encodeURIComponent(configJson);
|
|
26
|
+
return `vscode:mcp/install?${urlEncodedConfig}`;
|
|
27
|
+
}
|
|
28
|
+
function generateVSCodeInsidersDeepLink(url, name) {
|
|
29
|
+
const config = {
|
|
30
|
+
url,
|
|
31
|
+
name: sanitizeServerName(name),
|
|
32
|
+
type: "http"
|
|
33
|
+
};
|
|
34
|
+
const configJson = JSON.stringify(config);
|
|
35
|
+
const urlEncodedConfig = encodeURIComponent(configJson);
|
|
36
|
+
return `vscode-insiders:mcp/install?${urlEncodedConfig}`;
|
|
37
|
+
}
|
|
38
|
+
function generateClaudeCommand(url, name) {
|
|
39
|
+
const sanitizedName = sanitizeServerName(name);
|
|
40
|
+
const quotedUrl = `'${url.replace(/'/g, "'\\''")}'`;
|
|
41
|
+
return `claude mcp add --transport http "${sanitizedName}" ${quotedUrl}`;
|
|
42
|
+
}
|
|
43
|
+
var MANUFACT_INSPECTOR_ORIGIN = "https://inspector.manufact.com";
|
|
44
|
+
function getManufactInspectorUrl(serverUrl) {
|
|
45
|
+
const params = new URLSearchParams({
|
|
46
|
+
autoConnect: serverUrl,
|
|
47
|
+
tab: "chat"
|
|
48
|
+
});
|
|
49
|
+
return `${MANUFACT_INSPECTOR_ORIGIN}/inspector?${params.toString()}`;
|
|
50
|
+
}
|
|
51
|
+
var LOGO_SVG_PATHS = {
|
|
52
|
+
path1: "M105.933 0C164.437 0.000115889 211.865 47.607 211.865 106.333C211.865 131.828 210.494 158.401 221.068 181.6L228.976 198.947C243.585 230.997 269.266 256.7 301.304 271.336L316.156 278.121C340.143 289.079 367.695 287.335 394.067 287.335C452.572 287.335 500 334.942 500 393.668C500 452.394 452.572 500.001 394.067 500.001C335.563 500.001 288.135 452.394 288.135 393.668C288.135 368.974 289.241 343.275 278.992 320.807L270.587 302.38C255.949 270.289 230.214 244.565 198.118 229.939L180.164 221.758C157.282 211.331 131.078 212.666 105.933 212.666C47.4278 212.666 4.92992e-05 165.059 0 106.333C0 47.607 47.4278 0 105.933 0Z",
|
|
53
|
+
circle: { cx: 100.426, cy: 399.575, r: 100.426 },
|
|
54
|
+
path2: "M500 100.426C500 155.889 455.037 200.851 399.574 200.851C344.11 200.851 299.148 155.889 299.148 100.426C299.148 44.962 344.11 0 399.574 0C455.037 0 500 44.962 500 100.426Z"
|
|
55
|
+
};
|
|
56
|
+
var LINE_INTERSECTION_PATH = "M10.5 4C10.5 7.31371 7.81371 10 4.5 10H0.5V11H4.5C7.81371 11 10.5 13.6863 10.5 17V21H11.5V17C11.5 13.6863 14.1863 11 17.5 11H21.5V10H17.5C14.1863 10 11.5 7.31371 11.5 4V0H10.5V4Z";
|
|
57
|
+
function getMeshGradientScript() {
|
|
58
|
+
const VERT = `#version 300 es
|
|
59
|
+
in vec4 a_position;
|
|
60
|
+
out vec2 v_objectUV;
|
|
61
|
+
void main(){
|
|
62
|
+
gl_Position=a_position;
|
|
63
|
+
v_objectUV=a_position.xy*0.5+0.5;
|
|
64
|
+
}`;
|
|
65
|
+
const FRAG = `#version 300 es
|
|
66
|
+
precision mediump float;
|
|
67
|
+
uniform float u_time;
|
|
68
|
+
uniform vec4 u_colors[4];
|
|
69
|
+
uniform float u_colorsCount;
|
|
70
|
+
uniform float u_distortion;
|
|
71
|
+
uniform float u_swirl;
|
|
72
|
+
uniform float u_grainMixer;
|
|
73
|
+
uniform float u_grainOverlay;
|
|
74
|
+
in vec2 v_objectUV;
|
|
75
|
+
out vec4 fragColor;
|
|
76
|
+
#define PI 3.14159265359
|
|
77
|
+
vec2 rotate(vec2 uv,float th){return mat2(cos(th),sin(th),-sin(th),cos(th))*uv;}
|
|
78
|
+
float hash21(vec2 p){
|
|
79
|
+
p=fract(p*vec2(0.3183099,0.3678794))+0.1;
|
|
80
|
+
p+=dot(p,p+19.19);
|
|
81
|
+
return fract(p.x*p.y);
|
|
82
|
+
}
|
|
83
|
+
float valueNoise(vec2 st){
|
|
84
|
+
vec2 i=floor(st);vec2 f=fract(st);
|
|
85
|
+
float a=hash21(i),b=hash21(i+vec2(1.,0.)),c=hash21(i+vec2(0.,1.)),d=hash21(i+vec2(1.,1.));
|
|
86
|
+
vec2 u=f*f*(3.-2.*f);
|
|
87
|
+
return mix(mix(a,b,u.x),mix(c,d,u.x),u.y);
|
|
88
|
+
}
|
|
89
|
+
vec2 getPosition(int i,float t){
|
|
90
|
+
float a=float(i)*.37,b=.6+fract(float(i)/3.)*.9,c=.8+fract(float(i+1)/4.);
|
|
91
|
+
float x=sin(t*b+a),y=cos(t*c+a*1.5);
|
|
92
|
+
return .5+.5*vec2(x,y);
|
|
93
|
+
}
|
|
94
|
+
void main(){
|
|
95
|
+
vec2 uv=v_objectUV;uv+=.5;
|
|
96
|
+
vec2 grainUV=uv*1000.;
|
|
97
|
+
float grain=valueNoise(grainUV);
|
|
98
|
+
float mixerGrain=.4*u_grainMixer*(grain-.5);
|
|
99
|
+
float t=.5*(u_time+41.5);
|
|
100
|
+
float radius=smoothstep(0.,1.,length(uv-.5));
|
|
101
|
+
float center=1.-radius;
|
|
102
|
+
for(float i=1.;i<=2.;i++){
|
|
103
|
+
uv.x+=u_distortion*center/i*sin(t+i*.4*smoothstep(0.,1.,uv.y))*cos(.2*t+i*2.4*smoothstep(0.,1.,uv.y));
|
|
104
|
+
uv.y+=u_distortion*center/i*cos(t+i*2.*smoothstep(0.,1.,uv.x));
|
|
105
|
+
}
|
|
106
|
+
vec2 uvR=uv-vec2(.5);
|
|
107
|
+
float angle=3.*u_swirl*radius;
|
|
108
|
+
uvR=rotate(uvR,-angle);uvR+=vec2(.5);
|
|
109
|
+
vec3 color=vec3(0.);float opacity=0.,totalWeight=0.;
|
|
110
|
+
for(int i=0;i<4;i++){
|
|
111
|
+
if(i>=int(u_colorsCount))break;
|
|
112
|
+
vec2 pos=getPosition(i,t)+mixerGrain;
|
|
113
|
+
vec3 cf=u_colors[i].rgb*u_colors[i].a;
|
|
114
|
+
float opacityF=u_colors[i].a;
|
|
115
|
+
float dist=length(uvR-pos);
|
|
116
|
+
dist=pow(dist,3.5);
|
|
117
|
+
float w=1./(dist+1e-3);
|
|
118
|
+
color+=cf*w;opacity+=opacityF*w;totalWeight+=w;
|
|
119
|
+
}
|
|
120
|
+
color/=max(1e-4,totalWeight);
|
|
121
|
+
opacity/=max(1e-4,totalWeight);
|
|
122
|
+
float grainO=valueNoise(rotate(grainUV,1.)+vec2(3.));
|
|
123
|
+
grainO=mix(grainO,valueNoise(rotate(grainUV,2.)+vec2(-1.)),.5);
|
|
124
|
+
grainO=pow(grainO,1.3);
|
|
125
|
+
float grainOV=grainO*2.-1.;
|
|
126
|
+
vec3 grainOC=vec3(step(0.,grainOV));
|
|
127
|
+
float grainOS=u_grainOverlay*abs(grainOV);
|
|
128
|
+
grainOS=pow(grainOS,.8);
|
|
129
|
+
color=mix(color,grainOC,.35*grainOS);
|
|
130
|
+
opacity+=.5*grainOS;
|
|
131
|
+
fragColor=vec4(color,clamp(opacity,0.,1.));
|
|
132
|
+
}`;
|
|
133
|
+
return `(function(){
|
|
134
|
+
var c=document.getElementById('mesh-bg');
|
|
135
|
+
if(!c)return;
|
|
136
|
+
var wrap=c.parentElement;
|
|
137
|
+
if(!wrap)return;
|
|
138
|
+
var gl=c.getContext('webgl2');
|
|
139
|
+
if(!gl)return;
|
|
140
|
+
function compileShader(typ,src){
|
|
141
|
+
var s=gl.createShader(typ);
|
|
142
|
+
gl.shaderSource(s,src);
|
|
143
|
+
gl.compileShader(s);
|
|
144
|
+
if(!gl.getShaderParameter(s,gl.COMPILE_STATUS)){console.error(gl.getShaderInfoLog(s));return null;}
|
|
145
|
+
return s;
|
|
146
|
+
}
|
|
147
|
+
var vs=compileShader(gl.VERTEX_SHADER,${JSON.stringify(VERT)});
|
|
148
|
+
var fs=compileShader(gl.FRAGMENT_SHADER,${JSON.stringify(FRAG)});
|
|
149
|
+
if(!vs||!fs)return;
|
|
150
|
+
var prog=gl.createProgram();
|
|
151
|
+
gl.attachShader(prog,vs);
|
|
152
|
+
gl.attachShader(prog,fs);
|
|
153
|
+
gl.linkProgram(prog);
|
|
154
|
+
if(!gl.getProgramParameter(prog,gl.LINK_STATUS)){console.error(gl.getProgramInfoLog(prog));return;}
|
|
155
|
+
gl.useProgram(prog);
|
|
156
|
+
var posLoc=gl.getAttribLocation(prog,'a_position');
|
|
157
|
+
var buf=gl.createBuffer();
|
|
158
|
+
gl.bindBuffer(gl.ARRAY_BUFFER,buf);
|
|
159
|
+
gl.bufferData(gl.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,-1,1,1,-1,1,1]),gl.STATIC_DRAW);
|
|
160
|
+
gl.enableVertexAttribArray(posLoc);
|
|
161
|
+
gl.vertexAttribPointer(posLoc,2,gl.FLOAT,false,0,0);
|
|
162
|
+
function hexToRgba(hex){
|
|
163
|
+
var r=(parseInt(hex.slice(1,3),16))/255;
|
|
164
|
+
var g=(parseInt(hex.slice(3,5),16))/255;
|
|
165
|
+
var b=(parseInt(hex.slice(5,7),16))/255;
|
|
166
|
+
return[r,g,b,1];
|
|
167
|
+
}
|
|
168
|
+
var colors=[hexToRgba('#e0eaff'),hexToRgba('#f9ffbd'),hexToRgba('#dedede'),hexToRgba('#ffffff')];
|
|
169
|
+
var uTime=gl.getUniformLocation(prog,'u_time');
|
|
170
|
+
var uColors=[gl.getUniformLocation(prog,'u_colors[0]'),gl.getUniformLocation(prog,'u_colors[1]'),gl.getUniformLocation(prog,'u_colors[2]'),gl.getUniformLocation(prog,'u_colors[3]')];
|
|
171
|
+
var uColorsCount=gl.getUniformLocation(prog,'u_colorsCount');
|
|
172
|
+
var uDistortion=gl.getUniformLocation(prog,'u_distortion');
|
|
173
|
+
var uSwirl=gl.getUniformLocation(prog,'u_swirl');
|
|
174
|
+
var uGrainMixer=gl.getUniformLocation(prog,'u_grainMixer');
|
|
175
|
+
var uGrainOverlay=gl.getUniformLocation(prog,'u_grainOverlay');
|
|
176
|
+
var time=0,speed=1,raf;
|
|
177
|
+
function resize(){
|
|
178
|
+
var dpr=Math.min(2,window.devicePixelRatio||1);
|
|
179
|
+
c.width=Math.floor(wrap.clientWidth*dpr);
|
|
180
|
+
c.height=Math.floor(wrap.clientHeight*dpr);
|
|
181
|
+
gl.viewport(0,0,c.width,c.height);
|
|
182
|
+
}
|
|
183
|
+
function draw(){
|
|
184
|
+
if(document.hidden){raf=requestAnimationFrame(draw);return;}
|
|
185
|
+
time+=0.016*speed;
|
|
186
|
+
gl.uniform1f(uTime,time);
|
|
187
|
+
for(var i=0;i<4;i++)gl.uniform4fv(uColors[i],colors[i]);
|
|
188
|
+
gl.uniform1f(uColorsCount,4);
|
|
189
|
+
gl.uniform1f(uDistortion,0.8);
|
|
190
|
+
gl.uniform1f(uSwirl,0.1);
|
|
191
|
+
gl.uniform1f(uGrainMixer,0);
|
|
192
|
+
gl.uniform1f(uGrainOverlay,0.3);
|
|
193
|
+
gl.drawArrays(gl.TRIANGLES,0,6);
|
|
194
|
+
raf=requestAnimationFrame(draw);
|
|
195
|
+
}
|
|
196
|
+
resize();
|
|
197
|
+
new ResizeObserver(resize).observe(wrap);
|
|
198
|
+
draw();
|
|
199
|
+
})();`;
|
|
200
|
+
}
|
|
201
|
+
function generateLandingPage(options) {
|
|
202
|
+
const {
|
|
203
|
+
name: protocolName,
|
|
204
|
+
title,
|
|
205
|
+
version,
|
|
206
|
+
url,
|
|
207
|
+
description,
|
|
208
|
+
tools,
|
|
209
|
+
prompts,
|
|
210
|
+
resources,
|
|
211
|
+
iconUrl
|
|
212
|
+
} = options;
|
|
213
|
+
const name = title ?? protocolName;
|
|
214
|
+
const cursorDeepLink = generateCursorDeepLink(url, name);
|
|
215
|
+
const vscodeDeepLink = generateVSCodeDeepLink(url, name);
|
|
216
|
+
const vscodeInsidersDeepLink = generateVSCodeInsidersDeepLink(url, name);
|
|
217
|
+
const claudeCommand = generateClaudeCommand(url, name);
|
|
218
|
+
const manufactInspectorUrl = getManufactInspectorUrl(url);
|
|
219
|
+
const safeName = escapeHtml(name);
|
|
220
|
+
const safeDescription = description ? escapeHtml(description) : "";
|
|
221
|
+
const rawMetaDescription = description || `${name} MCP Server \u2014 Connect with Claude Code, Cursor, and VS Code. Model Context Protocol server.`;
|
|
222
|
+
const metaDescription = escapeHtml(rawMetaDescription);
|
|
223
|
+
const pageTitle = `${safeName} MCP Server \u2014 Connect with Claude Code, Cursor & VS Code`;
|
|
224
|
+
const jsonLd = serializeScriptJson({
|
|
225
|
+
"@context": "https://schema.org",
|
|
226
|
+
"@type": "SoftwareApplication",
|
|
227
|
+
name,
|
|
228
|
+
softwareVersion: version,
|
|
229
|
+
description: rawMetaDescription,
|
|
230
|
+
applicationCategory: "DeveloperApplication"
|
|
231
|
+
});
|
|
232
|
+
const normalizedTools = tools && tools.length > 0 ? tools.map((tool) => ({
|
|
233
|
+
name: tool.title ?? tool.name,
|
|
234
|
+
...tool.description !== void 0 && {
|
|
235
|
+
description: tool.description
|
|
236
|
+
}
|
|
237
|
+
})) : [];
|
|
238
|
+
const toolsListHtml = normalizedTools.length > 0 ? normalizedTools.map(
|
|
239
|
+
(t) => `<div class="spec-item"><code class="spec-name">${escapeHtml(t.name)}</code>${t.description ? `<p class="spec-desc">${escapeHtml(t.description)}</p>` : ""}</div>`
|
|
240
|
+
).join("\n") : "";
|
|
241
|
+
const promptsListHtml = prompts && prompts.length > 0 ? prompts.map(
|
|
242
|
+
(p) => `<div class="spec-item"><code class="spec-name">${escapeHtml(p.title ?? p.name)}</code>${p.description ? `<p class="spec-desc">${escapeHtml(p.description)}</p>` : ""}</div>`
|
|
243
|
+
).join("\n") : "";
|
|
244
|
+
const resourcesListHtml = resources && resources.length > 0 ? resources.map(
|
|
245
|
+
(r) => `<div class="spec-item"><code class="spec-uri">${escapeHtml(r.uri)}</code>${r.description ? `<p class="spec-desc">${escapeHtml(r.description)}</p>` : ""}</div>`
|
|
246
|
+
).join("\n") : "";
|
|
247
|
+
return `<!DOCTYPE html>
|
|
248
|
+
<html lang="en">
|
|
249
|
+
<head>
|
|
250
|
+
<meta charset="UTF-8">
|
|
251
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
252
|
+
<title>${pageTitle}</title>
|
|
253
|
+
<meta name="description" content="${metaDescription}">
|
|
254
|
+
<meta property="og:title" content="${pageTitle}">
|
|
255
|
+
<meta property="og:description" content="${metaDescription}">
|
|
256
|
+
<meta property="og:type" content="website">
|
|
257
|
+
<meta name="twitter:card" content="summary">
|
|
258
|
+
<meta name="twitter:title" content="${pageTitle}">
|
|
259
|
+
<meta name="twitter:description" content="${metaDescription}">
|
|
260
|
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
261
|
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
262
|
+
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
263
|
+
<script type="application/ld+json">${jsonLd}</script>
|
|
264
|
+
<style>
|
|
265
|
+
* { box-sizing: border-box; }
|
|
266
|
+
body {
|
|
267
|
+
margin: 0;
|
|
268
|
+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
|
269
|
+
font-size: 16px;
|
|
270
|
+
line-height: 1.6;
|
|
271
|
+
color: #1e293b;
|
|
272
|
+
background-color: #fdfcfc;
|
|
273
|
+
min-height: 100vh;
|
|
274
|
+
}
|
|
275
|
+
.layout {
|
|
276
|
+
max-width: 48rem;
|
|
277
|
+
margin: 0 auto;
|
|
278
|
+
padding: 2rem 1.5rem;
|
|
279
|
+
position: relative;
|
|
280
|
+
}
|
|
281
|
+
.rail-left, .rail-right {
|
|
282
|
+
position: absolute;
|
|
283
|
+
top: 0;
|
|
284
|
+
bottom: 0;
|
|
285
|
+
width: 1px;
|
|
286
|
+
background: rgba(0,0,0,0.08);
|
|
287
|
+
}
|
|
288
|
+
.rail-left { left: 1.5rem; }
|
|
289
|
+
.rail-right { right: 1.5rem; }
|
|
290
|
+
.rail-top, .rail-bottom {
|
|
291
|
+
height: 1px;
|
|
292
|
+
background: rgba(0,0,0,0.08);
|
|
293
|
+
position: absolute;
|
|
294
|
+
left: 1.5rem;
|
|
295
|
+
right: 1.5rem;
|
|
296
|
+
}
|
|
297
|
+
.rail-top { top: 0; }
|
|
298
|
+
.rail-bottom { bottom: 0; }
|
|
299
|
+
.corner {
|
|
300
|
+
position: absolute;
|
|
301
|
+
width: 22px;
|
|
302
|
+
height: 21px;
|
|
303
|
+
color: rgba(0,0,0,0.08);
|
|
304
|
+
}
|
|
305
|
+
.corner-tl { left: 1.5rem; top: 0; transform: translate(-50%, -50%); }
|
|
306
|
+
.corner-tr { right: 1.5rem; top: 0; transform: translate(50%, -50%); left: auto; }
|
|
307
|
+
.corner-bl { left: 1.5rem; bottom: 0; transform: translate(-50%, 50%); top: auto; }
|
|
308
|
+
.corner-br { right: 1.5rem; bottom: 0; transform: translate(50%, 50%); left: auto; top: auto; }
|
|
309
|
+
.card {
|
|
310
|
+
background: #fff;
|
|
311
|
+
border-top: 1px solid rgba(0,0,0,0.08);
|
|
312
|
+
border-bottom: 1px solid rgba(0,0,0,0.08);
|
|
313
|
+
margin-bottom: 1.5rem;
|
|
314
|
+
overflow: hidden;
|
|
315
|
+
}
|
|
316
|
+
.card-header {
|
|
317
|
+
padding: 1.5rem 1.5rem 0.5rem;
|
|
318
|
+
}
|
|
319
|
+
.card-content { padding: 0 1.5rem 1.5rem; }
|
|
320
|
+
.hero-card .card-header {
|
|
321
|
+
text-align: center;
|
|
322
|
+
padding: 0 1.5rem 1.25rem;
|
|
323
|
+
}
|
|
324
|
+
.hero-card .card-header.has-icon {
|
|
325
|
+
padding-top: 1.5rem;
|
|
326
|
+
}
|
|
327
|
+
.hero-icon {
|
|
328
|
+
width: 64px;
|
|
329
|
+
height: 64px;
|
|
330
|
+
border-radius: 14px;
|
|
331
|
+
object-fit: contain;
|
|
332
|
+
margin-bottom: 0.75rem;
|
|
333
|
+
}
|
|
334
|
+
.hero-row {
|
|
335
|
+
display: flex;
|
|
336
|
+
align-items: center;
|
|
337
|
+
justify-content: center;
|
|
338
|
+
gap: 0.75rem;
|
|
339
|
+
margin-bottom: 0.35rem;
|
|
340
|
+
}
|
|
341
|
+
.hero h1 {
|
|
342
|
+
font-size: 1.75rem;
|
|
343
|
+
font-weight: 700;
|
|
344
|
+
color: #172037;
|
|
345
|
+
margin: 0.75rem 0 0;
|
|
346
|
+
}
|
|
347
|
+
.hero-card .card-header.has-icon .hero h1 { margin-top: 0; }
|
|
348
|
+
.hero .version { font-size: 0.95rem; color: #64748b; font-weight: 500; }
|
|
349
|
+
.hero-description {
|
|
350
|
+
color: rgba(23,32,55,0.8);
|
|
351
|
+
font-size: 1rem;
|
|
352
|
+
margin: 0.35rem 0 0;
|
|
353
|
+
max-width: 36rem;
|
|
354
|
+
margin-left: auto;
|
|
355
|
+
margin-right: auto;
|
|
356
|
+
}
|
|
357
|
+
.logo-symbol {
|
|
358
|
+
display: inline-block;
|
|
359
|
+
cursor: default;
|
|
360
|
+
flex-shrink: 0;
|
|
361
|
+
}
|
|
362
|
+
.logo-symbol svg {
|
|
363
|
+
width: 32px;
|
|
364
|
+
height: 32px;
|
|
365
|
+
color: #172037;
|
|
366
|
+
}
|
|
367
|
+
.logo-fill { transition: opacity 0.2s ease; }
|
|
368
|
+
.logo-stroke path,
|
|
369
|
+
.logo-stroke circle {
|
|
370
|
+
fill: none;
|
|
371
|
+
stroke: currentColor;
|
|
372
|
+
stroke-width: 6;
|
|
373
|
+
stroke-linecap: round;
|
|
374
|
+
stroke-linejoin: round;
|
|
375
|
+
stroke-dasharray: 2000;
|
|
376
|
+
stroke-dashoffset: 2000;
|
|
377
|
+
opacity: 0;
|
|
378
|
+
}
|
|
379
|
+
.logo-symbol:hover .logo-fill {
|
|
380
|
+
animation: logo-fill-out 0.2s forwards, logo-fill-in 0.6s 0.9s forwards;
|
|
381
|
+
}
|
|
382
|
+
.logo-symbol:hover .logo-stroke path,
|
|
383
|
+
.logo-symbol:hover .logo-stroke circle {
|
|
384
|
+
opacity: 1;
|
|
385
|
+
animation: logo-draw 0.7s 0.2s ease-in-out forwards;
|
|
386
|
+
}
|
|
387
|
+
@keyframes logo-fill-out { to { opacity: 0; } }
|
|
388
|
+
@keyframes logo-fill-in { to { opacity: 1; } }
|
|
389
|
+
@keyframes logo-draw { to { stroke-dashoffset: 0; } }
|
|
390
|
+
.footer-content { text-align: center; padding: 2.5rem 1.5rem; border-top: 1px solid rgba(0,0,0,0.08); display: flex; justify-content: center; align-items: center; }
|
|
391
|
+
.footer-brand-link { justify-content: center; }
|
|
392
|
+
.footer-brand-link .logo-symbol svg { width: 22px; height: 22px; }
|
|
393
|
+
.hero-powered { display: inline-flex; align-items: center; justify-content: center; gap: 0.35rem; margin-top: 0.75rem; font-family: "Outfit", -apple-system, BlinkMacSystemFont, sans-serif; font-size: 0.875rem; font-weight: 500; color: rgba(23,32,55,0.6); }
|
|
394
|
+
.hero-powered a { color: #000; text-decoration: none; display: inline-flex; align-items: center; }
|
|
395
|
+
.hero-powered a:hover { text-decoration: underline; }
|
|
396
|
+
.footer-brand-link { display: inline-flex; align-items: center; gap: 0.5rem; font-family: "Outfit", -apple-system, BlinkMacSystemFont, sans-serif; font-size: 1.5rem; font-weight: 600; color: #172037; text-decoration: none; }
|
|
397
|
+
.footer-brand-link:hover { color: #0f172a; }
|
|
398
|
+
.hero-url-block { display: flex; justify-content: center; margin: 0.75rem 0; }
|
|
399
|
+
.hero-cta-row {
|
|
400
|
+
display: flex;
|
|
401
|
+
justify-content: center;
|
|
402
|
+
margin: 0.35rem 0 0.5rem;
|
|
403
|
+
}
|
|
404
|
+
.hero-primary-btn {
|
|
405
|
+
display: inline-block;
|
|
406
|
+
padding: 0.625rem 1.25rem;
|
|
407
|
+
background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);
|
|
408
|
+
color: #fff;
|
|
409
|
+
border-radius: 9999px;
|
|
410
|
+
text-decoration: none;
|
|
411
|
+
font-weight: 600;
|
|
412
|
+
font-size: 0.9375rem;
|
|
413
|
+
box-shadow: 0 1px 2px rgba(0,0,0,0.12), 0 2px 8px rgba(15,23,42,0.15);
|
|
414
|
+
transition: background 0.15s;
|
|
415
|
+
border: 1px solid rgba(0,0,0,0.12);
|
|
416
|
+
}
|
|
417
|
+
.hero-primary-btn:hover {
|
|
418
|
+
background: linear-gradient(180deg, #334155 0%, #1e293b 100%);
|
|
419
|
+
text-decoration: none;
|
|
420
|
+
color: #fff;
|
|
421
|
+
}
|
|
422
|
+
.hero-url-block .url-block { max-width: 100%; }
|
|
423
|
+
.hero-url-block .url-box {
|
|
424
|
+
font-size: 0.938rem;
|
|
425
|
+
background: #fff;
|
|
426
|
+
border: 1px solid rgba(0,0,0,0.12);
|
|
427
|
+
border-radius: 9999px;
|
|
428
|
+
padding: 0.75rem 3rem 0.75rem 1rem;
|
|
429
|
+
margin: 1rem 0;
|
|
430
|
+
}
|
|
431
|
+
.hero-powered .gh-icon { width: 18px; height: 18px; margin-right: 0.25rem; vertical-align: -0.2em; }
|
|
432
|
+
.hero-powered .gh-shield { height: 18px; width: auto; margin-left: 0.4rem; vertical-align: -0.2em; }
|
|
433
|
+
.card-title { font-size: 1.25rem; font-weight: 600; color: #172037; margin: 0 0 0.25rem; }
|
|
434
|
+
.card-desc { font-size: 0.875rem; color: rgba(23,32,55,0.8); margin: 0 0 1rem; }
|
|
435
|
+
.url-block {
|
|
436
|
+
position: relative;
|
|
437
|
+
margin: 1rem 0;
|
|
438
|
+
}
|
|
439
|
+
.url-block .url-box {
|
|
440
|
+
margin: 0;
|
|
441
|
+
padding-right: 2.75rem;
|
|
442
|
+
}
|
|
443
|
+
.url-block .copy-btn { top: 50%; right: 0.5rem; transform: translateY(-50%); }
|
|
444
|
+
.url-box {
|
|
445
|
+
font-family: ui-monospace, monospace;
|
|
446
|
+
font-size: 0.813rem;
|
|
447
|
+
background: #f8fafc;
|
|
448
|
+
padding: 0.5rem 0.75rem;
|
|
449
|
+
border-radius: 6px;
|
|
450
|
+
color: #475569;
|
|
451
|
+
margin: 1rem 0;
|
|
452
|
+
}
|
|
453
|
+
.spec-section { margin-top: 1.5rem; }
|
|
454
|
+
.spec-section h3 { font-size: 1rem; font-weight: 600; color: #172037; margin: 0 0 0.75rem; }
|
|
455
|
+
.spec-item { margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid #f1f5f9; }
|
|
456
|
+
.spec-item:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
|
|
457
|
+
.spec-name, .spec-uri { font-family: ui-monospace, monospace; font-size: 0.813rem; background: #f1f5f9; padding: 0.2rem 0.4rem; border-radius: 4px; }
|
|
458
|
+
.spec-uri { word-break: break-all; }
|
|
459
|
+
.spec-desc { margin: 0.5rem 0 0; font-size: 0.875rem; color: #64748b; line-height: 1.5; }
|
|
460
|
+
.tabs-row {
|
|
461
|
+
display: flex;
|
|
462
|
+
gap: 2px;
|
|
463
|
+
background: rgba(23,32,55,0.05);
|
|
464
|
+
padding: 3px;
|
|
465
|
+
border-radius: 8px;
|
|
466
|
+
margin-bottom: 1.5rem;
|
|
467
|
+
flex-wrap: wrap;
|
|
468
|
+
}
|
|
469
|
+
.tab {
|
|
470
|
+
flex: 1;
|
|
471
|
+
min-width: 80px;
|
|
472
|
+
padding: 0.5rem 0.75rem;
|
|
473
|
+
font-size: 0.813rem;
|
|
474
|
+
font-weight: 500;
|
|
475
|
+
border: none;
|
|
476
|
+
border-radius: 6px;
|
|
477
|
+
background: transparent;
|
|
478
|
+
color: #64748b;
|
|
479
|
+
cursor: pointer;
|
|
480
|
+
transition: background 0.15s, color 0.15s;
|
|
481
|
+
}
|
|
482
|
+
.tab:hover { color: #172037; background: rgba(255,255,255,0.6); }
|
|
483
|
+
.tab.active { background: #fff; color: #172037; border: 1px solid rgba(0,0,0,0.1); box-shadow: 0 1px 2px rgba(0,0,0,0.04); }
|
|
484
|
+
.tab-panel { display: none; }
|
|
485
|
+
.tab-panel.active { display: block; }
|
|
486
|
+
.tab-panel h3 { font-size: 1.125rem; font-weight: 600; color: #172037; margin: 0 0 1rem; }
|
|
487
|
+
.install-btn {
|
|
488
|
+
display: inline-block;
|
|
489
|
+
padding: 0.375rem 0.875rem;
|
|
490
|
+
background: #0f172a;
|
|
491
|
+
color: #fff;
|
|
492
|
+
border-radius: 9999px;
|
|
493
|
+
text-decoration: none;
|
|
494
|
+
font-weight: 500;
|
|
495
|
+
font-size: 0.813rem;
|
|
496
|
+
margin-bottom: 1rem;
|
|
497
|
+
transition: background 0.15s;
|
|
498
|
+
}
|
|
499
|
+
.install-btn:hover { background: #1e293b; }
|
|
500
|
+
.code-block {
|
|
501
|
+
position: relative;
|
|
502
|
+
margin: 1rem 0;
|
|
503
|
+
}
|
|
504
|
+
.code-block pre {
|
|
505
|
+
margin: 0;
|
|
506
|
+
padding: 0.5rem 0.75rem;
|
|
507
|
+
background: #f8fafc;
|
|
508
|
+
color: #475569;
|
|
509
|
+
border-radius: 8px;
|
|
510
|
+
font-family: ui-monospace, monospace;
|
|
511
|
+
font-size: 0.875rem;
|
|
512
|
+
overflow-x: auto;
|
|
513
|
+
border: 1px solid rgba(0,0,0,0.08);
|
|
514
|
+
}
|
|
515
|
+
.code-block .copy-btn { top: 50%; right: 0.375rem; transform: translateY(-50%); }
|
|
516
|
+
.copy-btn {
|
|
517
|
+
position: absolute;
|
|
518
|
+
top: 0.5rem;
|
|
519
|
+
right: 0.5rem;
|
|
520
|
+
width: 2rem;
|
|
521
|
+
height: 2rem;
|
|
522
|
+
padding: 0;
|
|
523
|
+
border: none;
|
|
524
|
+
border-radius: 6px;
|
|
525
|
+
background: #fff;
|
|
526
|
+
color: #172037;
|
|
527
|
+
cursor: pointer;
|
|
528
|
+
display: flex;
|
|
529
|
+
align-items: center;
|
|
530
|
+
justify-content: center;
|
|
531
|
+
transition: background 0.15s;
|
|
532
|
+
}
|
|
533
|
+
.copy-btn:hover { background: #f1f5f9; }
|
|
534
|
+
.copy-btn.copied { background: #fff; color: #172037; }
|
|
535
|
+
.copy-btn svg { width: 14px; height: 14px; }
|
|
536
|
+
ol.steps { margin: 0; padding-left: 1.25rem; }
|
|
537
|
+
ol.steps li { margin: 0.5rem 0; color: #475569; }
|
|
538
|
+
a { color: #0522a5; text-decoration: none; }
|
|
539
|
+
a:hover { text-decoration: underline; }
|
|
540
|
+
.hero-gradient-wrap {
|
|
541
|
+
position: relative;
|
|
542
|
+
padding: 1.5rem;
|
|
543
|
+
overflow: hidden;
|
|
544
|
+
}
|
|
545
|
+
.hero-gradient-wrap canvas {
|
|
546
|
+
position: absolute;
|
|
547
|
+
inset: 0;
|
|
548
|
+
width: 100%;
|
|
549
|
+
height: 100%;
|
|
550
|
+
display: block;
|
|
551
|
+
}
|
|
552
|
+
.hero-inner {
|
|
553
|
+
position: relative;
|
|
554
|
+
z-index: 1;
|
|
555
|
+
background: rgba(253,252,252,0.9);
|
|
556
|
+
-webkit-backdrop-filter: blur(12px);
|
|
557
|
+
backdrop-filter: blur(12px);
|
|
558
|
+
padding: 1.25rem 1.5rem;
|
|
559
|
+
border: 1px solid rgba(0,0,0,0.06);
|
|
560
|
+
}
|
|
561
|
+
.hero-inner .card-header { padding: 0; }
|
|
562
|
+
.hero-inner .card-header.has-icon { padding-top: 0.5rem; }
|
|
563
|
+
</style>
|
|
564
|
+
</head>
|
|
565
|
+
<body>
|
|
566
|
+
<div class="layout">
|
|
567
|
+
<div class="rail-left"></div>
|
|
568
|
+
<div class="rail-right"></div>
|
|
569
|
+
<div class="rail-top"></div>
|
|
570
|
+
<div class="rail-bottom"></div>
|
|
571
|
+
<svg class="corner corner-tl" viewBox="0 0 22 21" fill="none"><path d="${LINE_INTERSECTION_PATH}" fill="currentColor"/></svg>
|
|
572
|
+
<svg class="corner corner-tr" viewBox="0 0 22 21" fill="none"><path d="${LINE_INTERSECTION_PATH}" fill="currentColor"/></svg>
|
|
573
|
+
<svg class="corner corner-bl" viewBox="0 0 22 21" fill="none"><path d="${LINE_INTERSECTION_PATH}" fill="currentColor"/></svg>
|
|
574
|
+
<svg class="corner corner-br" viewBox="0 0 22 21" fill="none"><path d="${LINE_INTERSECTION_PATH}" fill="currentColor"/></svg>
|
|
575
|
+
|
|
576
|
+
<div class="card hero-card">
|
|
577
|
+
<div class="hero-gradient-wrap" id="hero-gradient-wrap">
|
|
578
|
+
<canvas id="mesh-bg" aria-hidden="true"></canvas>
|
|
579
|
+
<div class="hero-inner">
|
|
580
|
+
<div class="card-header ${iconUrl ? "has-icon" : ""}">
|
|
581
|
+
${iconUrl ? `<img src="${escapeHtml(iconUrl)}" alt="" class="hero-icon" width="64" height="64" />` : ""}
|
|
582
|
+
<div class="hero-row">
|
|
583
|
+
<h1>${safeName} <span class="version">(v${escapeHtml(version)})</span></h1>
|
|
584
|
+
</div>
|
|
585
|
+
${safeDescription ? `<p class="hero-description">${safeDescription}</p>` : ""}
|
|
586
|
+
<div class="hero-url-block">
|
|
587
|
+
<div class="url-block">
|
|
588
|
+
<div class="url-box" data-copy="${escapeHtml(url)}">${escapeHtml(url)}</div>
|
|
589
|
+
<button type="button" class="copy-btn" data-copy="${escapeHtml(url)}" aria-label="Copy URL"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect width="14" height="14" x="8" y="8" rx="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg></button>
|
|
590
|
+
</div>
|
|
591
|
+
</div>
|
|
592
|
+
<div class="hero-cta-row">
|
|
593
|
+
<a href="${escapeHtml(manufactInspectorUrl)}" class="hero-primary-btn" target="_blank" rel="noopener noreferrer">Open in Inspector</a>
|
|
594
|
+
</div>
|
|
595
|
+
<div class="hero-powered">
|
|
596
|
+
<span>Powered by</span>
|
|
597
|
+
<a href="https://github.com/mcp-use/mcp-use" target="_blank" rel="noopener noreferrer">
|
|
598
|
+
<svg class="gh-icon" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/></svg>
|
|
599
|
+
github.com/mcp-use/mcp-use
|
|
600
|
+
<img src="https://img.shields.io/github/stars/mcp-use/mcp-use" alt="GitHub stars" class="gh-shield" width="90" height="18" loading="lazy" />
|
|
601
|
+
</a>
|
|
602
|
+
</div>
|
|
603
|
+
</div>
|
|
604
|
+
</div>
|
|
605
|
+
</div>
|
|
606
|
+
</div>
|
|
607
|
+
|
|
608
|
+
<div class="card">
|
|
609
|
+
<div class="card-header">
|
|
610
|
+
<h2 class="card-title">Installation Guide</h2>
|
|
611
|
+
<p class="card-desc">Choose your preferred MCP client</p>
|
|
612
|
+
</div>
|
|
613
|
+
<div class="card-content">
|
|
614
|
+
<div class="tabs-row" role="tablist">
|
|
615
|
+
<button type="button" class="tab active" role="tab" data-tab="claude-code" aria-selected="true">Claude Code</button>
|
|
616
|
+
<button type="button" class="tab" role="tab" data-tab="cursor" aria-selected="false">Cursor</button>
|
|
617
|
+
<button type="button" class="tab" role="tab" data-tab="vscode" aria-selected="false">VS Code</button>
|
|
618
|
+
<button type="button" class="tab" role="tab" data-tab="vscode-insiders" aria-selected="false">VS Code Insiders</button>
|
|
619
|
+
<button type="button" class="tab" role="tab" data-tab="chatgpt" aria-selected="false">ChatGPT</button>
|
|
620
|
+
</div>
|
|
621
|
+
|
|
622
|
+
<div id="panel-claude-code" class="tab-panel active">
|
|
623
|
+
<h3>Install in Claude Code</h3>
|
|
624
|
+
<p>Run this command in your terminal:</p>
|
|
625
|
+
<div class="code-block">
|
|
626
|
+
<pre data-copy="${escapeHtml(claudeCommand)}">${escapeHtml(claudeCommand)}</pre>
|
|
627
|
+
<button type="button" class="copy-btn" aria-label="Copy"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect width="14" height="14" x="8" y="8" rx="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg></button>
|
|
628
|
+
</div>
|
|
629
|
+
</div>
|
|
630
|
+
|
|
631
|
+
<div id="panel-cursor" class="tab-panel">
|
|
632
|
+
<h3>Install in Cursor</h3>
|
|
633
|
+
<p>Click the button below to add this MCP server to Cursor:</p>
|
|
634
|
+
<a href="${cursorDeepLink}" class="install-btn">Open in Cursor</a>
|
|
635
|
+
<p>Or add manually: Settings \u2192 MCP \u2192 Add server</p>
|
|
636
|
+
</div>
|
|
637
|
+
|
|
638
|
+
<div id="panel-vscode" class="tab-panel">
|
|
639
|
+
<h3>Install in VS Code</h3>
|
|
640
|
+
<p>Click the button below to add this MCP server to VS Code:</p>
|
|
641
|
+
<a href="${vscodeDeepLink}" class="install-btn">Open in VS Code</a>
|
|
642
|
+
<p>Or add manually: Settings \u2192 MCP \u2192 Add server</p>
|
|
643
|
+
</div>
|
|
644
|
+
|
|
645
|
+
<div id="panel-vscode-insiders" class="tab-panel">
|
|
646
|
+
<h3>Install in VS Code Insiders</h3>
|
|
647
|
+
<p>Click the button below to add this MCP server to VS Code Insiders:</p>
|
|
648
|
+
<a href="${vscodeInsidersDeepLink}" class="install-btn">Open in VS Code Insiders</a>
|
|
649
|
+
<p>Or add manually: Settings \u2192 MCP \u2192 Add server</p>
|
|
650
|
+
</div>
|
|
651
|
+
|
|
652
|
+
<div id="panel-chatgpt" class="tab-panel">
|
|
653
|
+
<h3>Connect with ChatGPT</h3>
|
|
654
|
+
<ol class="steps">
|
|
655
|
+
<li><strong>Enable Developer Mode:</strong> Settings \u2192 Connectors \u2192 Advanced \u2192 Developer mode</li>
|
|
656
|
+
<li><strong>Import this MCP server:</strong> Go to Connectors tab and add: ${escapeHtml(url)}</li>
|
|
657
|
+
<li><strong>Use in conversations:</strong> Choose the MCP server from the Plus menu</li>
|
|
658
|
+
</ol>
|
|
659
|
+
</div>
|
|
660
|
+
</div>
|
|
661
|
+
</div>
|
|
662
|
+
|
|
663
|
+
${toolsListHtml || promptsListHtml || resourcesListHtml ? `
|
|
664
|
+
<div class="card">
|
|
665
|
+
<div class="card-header">
|
|
666
|
+
<h2 class="card-title">Primitives</h2>
|
|
667
|
+
${toolsListHtml ? `<div class="spec-section"><h3>Tools (${normalizedTools.length})</h3>${toolsListHtml}</div>` : ""}
|
|
668
|
+
${promptsListHtml ? `<div class="spec-section"><h3>Prompts (${prompts.length})</h3>${promptsListHtml}</div>` : ""}
|
|
669
|
+
${resourcesListHtml ? `<div class="spec-section"><h3>Resources (${resources.length})</h3>${resourcesListHtml}</div>` : ""}
|
|
670
|
+
</div>
|
|
671
|
+
</div>
|
|
672
|
+
` : ""}
|
|
673
|
+
|
|
674
|
+
<footer class="footer-content">
|
|
675
|
+
<a href="https://manufact.com" target="_blank" rel="noopener noreferrer" class="footer-brand-link" aria-label="Manufact">
|
|
676
|
+
<span class="logo-symbol">
|
|
677
|
+
<svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg">
|
|
678
|
+
<g class="logo-fill" fill="currentColor" fill-rule="nonzero">
|
|
679
|
+
<path d="${LOGO_SVG_PATHS.path1}"/>
|
|
680
|
+
<circle cx="${LOGO_SVG_PATHS.circle.cx}" cy="${LOGO_SVG_PATHS.circle.cy}" r="${LOGO_SVG_PATHS.circle.r}"/>
|
|
681
|
+
<path d="${LOGO_SVG_PATHS.path2}"/>
|
|
682
|
+
</g>
|
|
683
|
+
<g class="logo-stroke">
|
|
684
|
+
<path d="${LOGO_SVG_PATHS.path1}"/>
|
|
685
|
+
<circle cx="${LOGO_SVG_PATHS.circle.cx}" cy="${LOGO_SVG_PATHS.circle.cy}" r="${LOGO_SVG_PATHS.circle.r}"/>
|
|
686
|
+
<path d="${LOGO_SVG_PATHS.path2}"/>
|
|
687
|
+
</g>
|
|
688
|
+
</svg>
|
|
689
|
+
</span>
|
|
690
|
+
<span>Manufact</span>
|
|
691
|
+
</a>
|
|
692
|
+
</footer>
|
|
693
|
+
</div>
|
|
694
|
+
|
|
695
|
+
<script>${getMeshGradientScript()}</script>
|
|
696
|
+
<script>
|
|
697
|
+
(function(){
|
|
698
|
+
var tabs = document.querySelectorAll('.tab');
|
|
699
|
+
var panels = document.querySelectorAll('.tab-panel');
|
|
700
|
+
tabs.forEach(function(tab){
|
|
701
|
+
tab.addEventListener('click', function(){
|
|
702
|
+
var target = tab.getAttribute('data-tab');
|
|
703
|
+
tabs.forEach(function(t){ t.classList.remove('active'); t.setAttribute('aria-selected','false'); });
|
|
704
|
+
panels.forEach(function(p){
|
|
705
|
+
var match = p.id === 'panel-' + target;
|
|
706
|
+
p.classList.toggle('active', match);
|
|
707
|
+
p.hidden = !match;
|
|
708
|
+
});
|
|
709
|
+
tab.classList.add('active');
|
|
710
|
+
tab.setAttribute('aria-selected','true');
|
|
711
|
+
});
|
|
712
|
+
});
|
|
713
|
+
var copySvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect width="14" height="14" x="8" y="8" rx="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg>';
|
|
714
|
+
var checkSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>';
|
|
715
|
+
document.querySelectorAll('.copy-btn').forEach(function(btn){
|
|
716
|
+
btn.addEventListener('click', function(){
|
|
717
|
+
var text = btn.getAttribute('data-copy');
|
|
718
|
+
if (!text) {
|
|
719
|
+
var pre = btn.parentElement.querySelector('pre');
|
|
720
|
+
text = pre ? (pre.getAttribute('data-copy') || pre.textContent) : '';
|
|
721
|
+
}
|
|
722
|
+
if (text) navigator.clipboard.writeText(text).then(function(){
|
|
723
|
+
btn.classList.add('copied');
|
|
724
|
+
btn.innerHTML = checkSvg;
|
|
725
|
+
setTimeout(function(){ btn.classList.remove('copied'); btn.innerHTML = copySvg; }, 2000);
|
|
726
|
+
});
|
|
727
|
+
});
|
|
728
|
+
});
|
|
729
|
+
panels.forEach(function(p){ if(!p.classList.contains('active')) p.hidden = true; });
|
|
730
|
+
})();
|
|
731
|
+
</script>
|
|
732
|
+
</body>
|
|
733
|
+
</html>`;
|
|
734
|
+
}
|
|
735
|
+
|
|
736
|
+
export {
|
|
737
|
+
generateLandingPage
|
|
738
|
+
};
|
|
739
|
+
//# sourceMappingURL=chunk-FCGJJVL2.js.map
|