cloudflare-tunnel-kit 0.1.6 → 0.1.8
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/README.md +2 -2
- package/dist/cli/main.js +5 -2
- package/dist/ui/page.js +16 -8
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -6,7 +6,7 @@ An open-source toolkit for creating and integrating Cloudflare Tunnels through t
|
|
|
6
6
|
|
|
7
7
|
## Current version
|
|
8
8
|
|
|
9
|
-
`0.1.
|
|
9
|
+
`0.1.8` is the current MVP and includes:
|
|
10
10
|
|
|
11
11
|
- A reusable TypeScript API for validation, plan generation, execution, and redaction.
|
|
12
12
|
- The `cf-tunnel` CLI with `init`, `create`, `quick`, `start`, `stop`, `status`, `doctor`, and `ui` commands.
|
|
@@ -122,7 +122,7 @@ Start the local UI:
|
|
|
122
122
|
npx cf-tunnel ui
|
|
123
123
|
```
|
|
124
124
|
|
|
125
|
-
The command prints startup progress, chooses an available loopback port, and opens the browser automatically. If the browser cannot be opened, copy the printed `http://127.0.0.1:<port>` URL. Use `npx cf-tunnel ui --no-open` when you only want the URL.
|
|
125
|
+
The command prints startup progress, chooses an available loopback port, and opens the browser automatically. If the browser cannot be opened, copy the printed `http://127.0.0.1:<port>` URL. Use `npx cf-tunnel ui --no-open` when you only want the URL. To use a fixed port, pass `--port 8787`; when omitted, `CLOUDFLARE_TUNNEL_KIT_UI_PORT` is used if set, otherwise an available port is selected. Ports are always bound to `127.0.0.1`.
|
|
126
126
|
|
|
127
127
|
The UI binds to loopback by default and does not send the copied prompt anywhere.
|
|
128
128
|
|
package/dist/cli/main.js
CHANGED
|
@@ -9,15 +9,18 @@ const args = process.argv.slice(2);
|
|
|
9
9
|
const command = args[0] ?? 'init';
|
|
10
10
|
const packageVersion = JSON.parse(readFileSync(new URL('../../package.json', import.meta.url), 'utf8')).version;
|
|
11
11
|
const value = (name) => { const index = args.indexOf(name); return index >= 0 ? args[index + 1] : undefined; };
|
|
12
|
-
function help() { console.log(`cloudflare-tunnel-kit ${packageVersion}\n\nUsage from an installed project:\n npx cf-tunnel\n npx cf-tunnel ui\n\nCommands: init create quick start stop restart status doctor ui\nOptions: --url URL --name NAME --hostname HOST --profile custom|laravel --project ID --dry-run --yes --json --no-open`); }
|
|
12
|
+
function help() { console.log(`cloudflare-tunnel-kit ${packageVersion}\n\nUsage from an installed project:\n npx cf-tunnel\n npx cf-tunnel ui [--port PORT]\n\nCommands: init create quick start stop restart status doctor ui\nOptions: --url URL --name NAME --hostname HOST --profile custom|laravel --project ID --port PORT --dry-run --yes --json --no-open\nUI port precedence: --port, CLOUDFLARE_TUNNEL_KIT_UI_PORT, automatic`); }
|
|
13
13
|
function interactiveRequired() { console.error('[INTERACTIVE_INPUT_REQUIRED] This command needs wizard input, but the terminal is not interactive.\nRun `npx cf-tunnel ui` or provide all required flags with `--yes`.'); process.exit(2); }
|
|
14
|
+
function resolveUiPort() { const raw = value('--port') ?? process.env.CLOUDFLARE_TUNNEL_KIT_UI_PORT; if (raw === undefined || raw === '')
|
|
15
|
+
return 0; const port = Number(raw); if (!Number.isInteger(port) || port < 0 || port > 65535)
|
|
16
|
+
throw new Error(`Invalid UI port "${raw}". Use an integer from 0 to 65535.`); return port; }
|
|
14
17
|
async function startUi() {
|
|
15
18
|
console.log('Starting Cloudflare Tunnel Kit UI on this machine...');
|
|
16
19
|
const service = createTunnelKitService({ dataDir: process.env.CLOUDFLARE_TUNNEL_KIT_DATA_DIR });
|
|
17
20
|
const server = createServer({ service, version: packageVersion });
|
|
18
21
|
server.once('error', error => { console.error(`Unable to start the local UI: ${error.message}`); console.error('Run `npx cf-tunnel ui` again after checking local server permissions.'); process.exitCode = 1; service.close(); });
|
|
19
22
|
console.log(`Cloudflare Tunnel Kit v${packageVersion}`);
|
|
20
|
-
server.listen(
|
|
23
|
+
server.listen(resolveUiPort(), '127.0.0.1', async () => { const address = server.address(); if (!address || typeof address === 'string')
|
|
21
24
|
return; const url = `http://127.0.0.1:${address.port}`; console.log(`UI ready at ${url}`); if (!args.includes('--no-open'))
|
|
22
25
|
console.log((await launchBrowser(url)).message); });
|
|
23
26
|
process.once('SIGINT', () => server.close(() => { service.close(); process.exit(130); }));
|
package/dist/ui/page.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export function dashboardPage(version = '0.1.
|
|
1
|
+
export function dashboardPage(version = '0.1.8') {
|
|
2
2
|
return String.raw `<!doctype html>
|
|
3
3
|
<html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
|
|
4
4
|
<title>Cloudflare Tunnel Kit v${escapeAttribute(version)}</title>
|
|
@@ -7,27 +7,35 @@ export function dashboardPage(version = '0.1.5') {
|
|
|
7
7
|
*{box-sizing:border-box}body{margin:0;font:15px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}button,input,select{font:inherit}button{cursor:pointer}.shell{min-height:100vh}.topbar{height:68px;background:#101827;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,72px);box-shadow:0 1px 0 #ffffff18}.brand{display:flex;align-items:center;gap:12px;font-weight:760;letter-spacing:-.02em}.logo{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,#ffad38,var(--orange));display:grid;place-items:center;color:white;font-size:19px;box-shadow:0 8px 24px #f4812050}.top-actions{display:flex;gap:10px}.main{max-width:1180px;margin:0 auto;padding:42px 28px 70px}.hero{display:grid;grid-template-columns:1.4fr .8fr;gap:24px;align-items:stretch}.hero-copy,.health-panel,.section{background:var(--panel);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}.hero-copy{padding:38px;background:radial-gradient(circle at 100% 0,#eaf3ff 0,transparent 42%),#fff}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}h1{font-size:clamp(30px,4vw,48px);line-height:1.05;letter-spacing:-.045em;margin:10px 0 14px}.lead{font-size:17px;color:var(--muted);max-width:650px;margin:0 0 26px}.actions{display:flex;flex-wrap:wrap;gap:12px}.btn{border:0;border-radius:11px;padding:11px 16px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn.primary{background:var(--blue);color:white;box-shadow:0 8px 18px #1665d835}.btn.primary:hover{background:var(--blue2)}.btn.secondary{background:#edf3fc;color:#174b91}.btn.ghost{background:white;color:var(--ink);border:1px solid var(--line)}.btn.danger{background:#fff0f1;color:var(--red)}.health-panel{padding:28px}.health-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.health-title h2,.section-head h2{margin:0;font-size:19px;letter-spacing:-.02em}.check{display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--line)}.check:first-of-type{border:0}.dot{width:10px;height:10px;border-radius:50%;margin-top:6px;background:#aab3c3}.dot.ok{background:var(--green);box-shadow:0 0 0 4px #dff5ed}.check b{display:block}.check span{color:var(--muted);font-size:13px}.section{margin-top:24px;padding:28px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:20px}.section-head p{margin:4px 0 0;color:var(--muted)}.projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.empty{grid-column:1/-1;border:1px dashed #cfd6e3;border-radius:16px;padding:42px;text-align:center;color:var(--muted);background:#fafbfc}.card{border:1px solid var(--line);border-radius:16px;padding:20px;background:#fff;min-width:0}.card-top{display:flex;justify-content:space-between;gap:12px}.card h3{margin:0;font-size:17px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.badge{font-size:12px;font-weight:750;padding:4px 9px;border-radius:999px;background:#eef1f6;color:#536078;white-space:nowrap}.badge.running{background:#dcf6eb;color:#08734d}.badge.attention{background:#fff0d9;color:#9a5b00}.meta{margin:16px 0;color:var(--muted);font-size:13px;display:grid;gap:6px}.meta code{overflow:hidden;text-overflow:ellipsis}.card-actions{display:flex;gap:8px}.card-actions .btn{padding:8px 11px;font-size:13px}.notice{padding:12px 14px;border-radius:11px;background:#fff6e9;color:#854e00;margin:14px 0;font-size:13px}.hidden{display:none!important}
|
|
8
8
|
dialog{border:0;border-radius:22px;padding:0;width:min(680px,calc(100vw - 30px));box-shadow:0 30px 100px #11182755}dialog::backdrop{background:#10182799;backdrop-filter:blur(3px)}.dialog-head{padding:24px 28px 18px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:flex-start}.dialog-head h2{margin:0;font-size:22px}.dialog-head p{margin:5px 0 0;color:var(--muted)}.close{border:0;background:#f0f2f6;border-radius:9px;width:34px;height:34px}.dialog-body{padding:25px 28px}.steps{display:flex;gap:8px;margin-bottom:24px}.step{height:5px;flex:1;border-radius:4px;background:#e3e7ee}.step.active{background:var(--blue)}label{display:block;font-weight:700;margin:15px 0 6px}.hint{font-size:12px;color:var(--muted);margin-top:5px}input,select{width:100%;padding:11px 12px;border:1px solid #cfd6e3;border-radius:10px;background:white;color:var(--ink);outline:none}input:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 3px #1665d81a}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.dialog-foot{padding:18px 28px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:10px}.review{background:#f6f8fb;border-radius:13px;padding:16px}.review ul{margin:8px 0 0;padding-left:20px}.result{white-space:pre-wrap;background:#101827;color:#e7edf8;border-radius:13px;padding:16px;max-height:280px;overflow:auto;font:12px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace}.toast{position:fixed;right:24px;bottom:24px;background:#101827;color:#fff;padding:13px 17px;border-radius:11px;box-shadow:var(--shadow);z-index:20}
|
|
9
9
|
@media(max-width:850px){.hero{grid-template-columns:1fr}.projects{grid-template-columns:1fr 1fr}}@media(max-width:580px){.main{padding:24px 15px}.topbar{padding:0 16px}.top-actions .btn span{display:none}.hero-copy,.health-panel,.section{border-radius:16px}.hero-copy{padding:26px}.projects{grid-template-columns:1fr}.grid2{grid-template-columns:1fr}.dialog-head,.dialog-body,.dialog-foot{padding-left:19px;padding-right:19px}.actions>.btn{width:100%}}
|
|
10
|
+
.drawer{position:fixed;inset:0;z-index:30;visibility:hidden;pointer-events:none}.drawer.open{visibility:visible;pointer-events:auto}.drawer-overlay{position:absolute;inset:0;background:#10182799;opacity:0;transition:opacity 180ms ease}.drawer.open .drawer-overlay{opacity:1}.drawer-panel{position:absolute;top:0;right:0;height:100%;width:min(680px,100vw);background:var(--panel);box-shadow:-18px 0 50px #11182735;transform:translateX(100%);transition:transform 220ms ease;display:flex;flex-direction:column;overflow:auto}.drawer.open .drawer-panel{transform:translateX(0)}
|
|
10
11
|
</style></head><body><div class="shell">
|
|
11
12
|
<header class="topbar"><div class="brand"><div class="logo">☁</div><span>Cloudflare Tunnel Kit <small>v${escapeAttribute(version)}</small></span></div><div class="top-actions"><button class="btn ghost" data-action="doctor">System check</button></div></header>
|
|
12
13
|
<main class="main"><section class="hero"><div class="hero-copy"><div class="eyebrow">Local tunnel manager</div><h1>Your tunnels,<br>without the guesswork.</h1><p class="lead">Expose a local project through a temporary URL or connect your own Cloudflare domain. Every change is reviewed before it runs.</p><div class="actions"><button class="btn primary" data-new="quick">⚡ Create Quick Tunnel</button><button class="btn secondary" data-new="named">◎ Use a custom domain</button></div></div><aside class="health-panel"><div class="health-title"><h2>Environment</h2><button class="btn ghost" data-action="doctor">Run checks</button></div><div id="checks"><div class="check"><i class="dot"></i><div><b>Not checked yet</b><span>Run system checks before your first tunnel.</span></div></div></div></aside></section>
|
|
13
14
|
<section class="section"><div class="section-head"><div><h2>Saved projects</h2><p>Settings and history stored only on this machine.</p></div><button class="btn ghost" data-action="refresh">↻ Refresh</button></div><div class="projects" id="projects"><div class="empty">Loading your projects…</div></div></section></main></div>
|
|
14
|
-
<
|
|
15
|
+
<div id="wizard" class="drawer" aria-hidden="true"><div class="drawer-overlay" data-close></div><section class="drawer-panel" role="dialog" aria-modal="true" aria-labelledby="wizard-title" tabindex="-1"><div class="dialog-head"><div><h2 id="wizard-title">Create a tunnel</h2><p id="wizard-subtitle">Step-by-step setup</p></div><button class="close" data-close aria-label="Close">×</button></div><div class="dialog-body"><div class="steps"><i class="step active"></i><i class="step"></i><i class="step"></i></div>
|
|
15
16
|
<form id="setup-form"><div id="fields"><label>Project name</label><input name="displayName" required placeholder="My local app"><label>Project folder</label><input name="projectPath" required value="${escapeAttribute(process.cwd())}"><label>Local application URL</label><input name="localUrl" required value="http://127.0.0.1:8000"><div id="named-fields" class="hidden"><div class="grid2"><div><label>Tunnel name</label><input name="tunnelName" placeholder="my-project"></div><div><label>Public hostname</label><input name="hostname" placeholder="dev.example.com"></div></div><p class="hint">The root domain must already be managed by your Cloudflare account.</p></div><label>Project type</label><select name="profile"><option value="custom">Custom</option><option value="laravel">Laravel</option></select></div>
|
|
16
|
-
<div id="review" class="hidden"><div class="review"><b>Review changes</b><ul id="effects"></ul></div><div class="notice" id="named-notice">A custom domain setup may open Cloudflare login in your browser. Existing DNS records are never overwritten automatically.</div></div><div id="running" class="hidden"><div class="result" id="result">Waiting…</div></div></form></div><div class="dialog-foot"><button class="btn ghost" data-close>Cancel</button><button class="btn primary" id="continue">Review changes</button></div></
|
|
17
|
+
<div id="review" class="hidden"><div class="review"><b>Review changes</b><ul id="effects"></ul></div><div class="notice" id="named-notice">A custom domain setup may open Cloudflare login in your browser. Existing DNS records are never overwritten automatically.</div></div><div id="running" class="hidden"><div class="result" id="result">Waiting…</div></div></form></div><div class="dialog-foot"><button class="btn ghost" data-close>Cancel</button><button class="btn primary" id="continue">Review changes</button></div></section></div>
|
|
17
18
|
<div class="toast hidden" id="toast"></div>
|
|
18
19
|
<script>
|
|
19
|
-
let mode='quick',stage=0,plan=null,token='';const q=s=>document.querySelector(s),qa=s=>[...document.querySelectorAll(s)];
|
|
20
|
+
let mode='quick',stage=0,plan=null,token='',wizardTrigger=null,running=false;const q=s=>document.querySelector(s),qa=s=>[...document.querySelectorAll(s)];
|
|
20
21
|
const esc=v=>String(v??'').replace(/[&<>"']/g,c=>({'&':'&','<':'<','>':'>','"':'"',"'":'''}[c]));
|
|
21
22
|
async function api(url,options={}){const headers={'content-type':'application/json',...(options.headers||{})};if(token)headers['x-confirmation-token']=token;const r=await fetch(url,{...options,headers});const body=await r.json().catch(()=>({error:'Invalid server response'}));if(!r.ok)throw new Error(body.error||body.issues?.[0]?.reason||'Request failed');return body}
|
|
22
23
|
function toast(message){const el=q('#toast');el.textContent=message;el.classList.remove('hidden');setTimeout(()=>el.classList.add('hidden'),3200)}
|
|
23
|
-
async function load(){try{const data=await api('/api/projects');renderProjects(data.projects)}catch(e){q('#projects').innerHTML='<div class="empty">'+esc(e.message)+'</div>'}}
|
|
24
|
+
async function load(){try{const data=await api('/api/projects');renderProjects(data.projects);enhanceProjectCards(data.projects)}catch(e){q('#projects').innerHTML='<div class="empty">'+esc(e.message)+'</div>'}}
|
|
24
25
|
function renderProjects(items){q('#projects').innerHTML=items.length?items.map(p=>'<article class="card"><div class="card-top"><h3>'+esc(p.displayName)+'</h3><span class="badge '+(p.status==='Running'?'running':p.status==='Needs attention'?'attention':'')+'">'+esc(p.status)+'</span></div><div class="meta"><span>'+esc(p.kind==='named'?p.hostname||'Custom domain':'Quick Tunnel')+'</span><code>'+esc(p.localUrl||p.path)+'</code></div><div class="card-actions">'+(p.status==='Running'?'<button class="btn ghost" data-project="'+p.id+'" data-command="stop">Stop</button>':'<button class="btn secondary" data-project="'+p.id+'" data-command="start">Start</button>')+'<button class="btn ghost" data-project="'+p.id+'" data-command="retry">Retry setup</button><button class="btn danger" data-project="'+p.id+'" data-command="remove-local">Remove local</button></div></article>').join(''):'<div class="empty"><b>No saved projects yet.</b><br>Create a Quick Tunnel or connect a custom domain to get started.</div>'}
|
|
25
|
-
function
|
|
26
|
+
function enhanceProjectCards(items){items.forEach((project,index)=>{const card=qa('.card')[index];if(!card)return;const actions=card.querySelector('.card-actions');const details=document.createElement('button');details.type='button';details.className='btn ghost';details.dataset.action='details';details.dataset.project=project.id;details.textContent='Details';actions?.append(details);if(!project.publicUrl)return;const meta=card.querySelector('.meta');const row=document.createElement('div');row.className='public-url';row.innerHTML='<a href="'+esc(project.publicUrl)+'" target="_blank" rel="noreferrer">'+esc(project.publicUrl)+'</a><button type="button" class="btn ghost copy-url" data-copy-url="'+esc(project.publicUrl)+'">Copy URL</button>';meta?.append(row)})}
|
|
27
|
+
async function showDetails(id){try{const project=await api('/api/projects/'+encodeURIComponent(id));const health=project.health||{};const logs=project.logs||'No logs recorded.';toast('Local: '+(health.localProcess||'unknown')+' · Connector: '+(health.cloudflareConnector||'unknown')+' · Hostname: '+(health.publicHostname||'unchecked'));const card=qa('.card').find(item=>item.querySelector('[data-project="'+CSS.escape(id)+'"]'));if(card){let panel=card.querySelector('.details');if(!panel){panel=document.createElement('div');panel.className='details';card.append(panel)}panel.innerHTML='<b>Health</b><div>Local process: '+esc(health.localProcess||'unknown')+'</div><div>Cloudflare connector: '+esc(health.cloudflareConnector||'unknown')+'</div><div>Public hostname: '+esc(health.publicHostname||'unchecked')+'</div><pre>'+esc(logs)+'</pre>'}}catch(e){toast(e.message)}}
|
|
28
|
+
function openWizard(nextMode,trigger){mode=nextMode;stage=0;plan=null;wizardTrigger=trigger;q('#setup-form').reset();q('[name=projectPath]').value=${JSON.stringify(process.cwd())};q('[name=localUrl]').value='http://127.0.0.1:8000';q('#named-fields').classList.toggle('hidden',mode!=='named');q('#named-notice').classList.toggle('hidden',mode!=='named');q('#wizard-title').textContent=mode==='named'?'Set up a custom domain':'Create a Quick Tunnel';q('#wizard-subtitle').textContent=mode==='named'?'Cloudflare login, tunnel, DNS, and connector':'No Cloudflare login required';showStage();const drawer=q('#wizard');drawer.classList.add('open');drawer.setAttribute('aria-hidden','false');document.body.style.overflow='hidden';q('.drawer-panel').focus()}
|
|
29
|
+
function closeWizard(){if(running)return;const drawer=q('#wizard');drawer.classList.remove('open');drawer.setAttribute('aria-hidden','true');document.body.style.overflow='';if(wizardTrigger?.focus)wizardTrigger.focus();wizardTrigger=null}
|
|
30
|
+
function canClose(target){if(running)return false;const overlay=q('.drawer-overlay');return target===overlay||Boolean(target.closest?.('[data-close]'))}
|
|
26
31
|
function showStage(){q('#fields').classList.toggle('hidden',stage!==0);q('#review').classList.toggle('hidden',stage!==1);q('#running').classList.toggle('hidden',stage!==2);qa('.step').forEach((el,i)=>el.classList.toggle('active',i<=stage));q('#continue').textContent=stage===0?'Review changes':stage===1?'Confirm and run':'Done'}
|
|
27
32
|
function values(){const data=Object.fromEntries(new FormData(q('#setup-form')));return {...data,profile:data.profile||'custom'}}
|
|
28
|
-
async function next(){try{if(stage===0){const data=values();if(mode==='named'&&(!data.tunnelName||!data.hostname))throw new Error('Tunnel name and public hostname are required.');plan=await api('/api/plans/'+mode,{method:'POST',body:JSON.stringify(data)});q('#effects').innerHTML=plan.effects.map(x=>'<li>'+esc(x)+'</li>').join('');stage=1;showStage()}else if(stage===1){stage=2;showStage();q('#result').textContent='Running validated workflow…';const result=await api('/api/execute',{method:'POST',body:JSON.stringify({planId:plan.id,confirmations:plan.confirmations})});q('#result').textContent=JSON.stringify(result,null,2);await load()}else
|
|
33
|
+
async function next(){try{if(stage===0){const data=values();if(mode==='named'&&(!data.tunnelName||!data.hostname))throw new Error('Tunnel name and public hostname are required.');plan=await api('/api/plans/'+mode,{method:'POST',body:JSON.stringify(data)});q('#effects').innerHTML=plan.effects.map(x=>'<li>'+esc(x)+'</li>').join('');stage=1;showStage()}else if(stage===1){stage=2;running=true;showStage();q('#result').textContent='Running validated workflow…';const result=await api('/api/execute',{method:'POST',body:JSON.stringify({planId:plan.id,confirmations:plan.confirmations})});q('#result').textContent=JSON.stringify(result,null,2);await load()}else closeWizard()}catch(e){toast(e.message)}finally{if(stage===2)running=false}}
|
|
29
34
|
async function doctor(){try{const data=await api('/api/doctor');q('#checks').innerHTML=data.checks.map(c=>'<div class="check"><i class="dot '+(c.state==='passed'?'ok':'')+'"></i><div><b>'+esc(c.name)+'</b><span>'+esc(c.detail)+'</span></div></div>').join('')}catch(e){toast(e.message)}}
|
|
30
|
-
document.addEventListener('click',async e=>{const t=e.target.closest('button');if(
|
|
35
|
+
document.addEventListener('click',async e=>{if(canClose(e.target)){closeWizard();return}const t=e.target.closest('button');if(t?.dataset.new)openWizard(t.dataset.new,t);if(t?.id==='continue'){e.preventDefault();await next()}if(t?.dataset.action==='refresh')await load();if(t?.dataset.action==='doctor')await doctor();if(t?.dataset.project){if(t.dataset.command==='remove-local'&&!confirm('Remove this project from the local dashboard? Cloudflare tunnel and DNS resources will not be deleted.'))return;try{await api('/api/projects/'+t.dataset.project+'/'+t.dataset.command,{method:'POST',body:'{}'});await load()}catch(err){toast(err.message)}}});
|
|
36
|
+
document.addEventListener('keydown',e=>{if(e.key==='Escape'&&q('#wizard').classList.contains('open')&&!running)closeWizard()});
|
|
37
|
+
document.addEventListener('click',async e=>{const button=e.target.closest?.('.copy-url');if(!button)return;try{await navigator.clipboard.writeText(button.dataset.copyUrl||'');toast('Tunnel URL copied')}catch{toast('Copy failed. Select the URL manually.')}});
|
|
38
|
+
document.addEventListener('click',async e=>{const button=e.target.closest?.('[data-action="details"]');if(button?.dataset.project)await showDetails(button.dataset.project)});
|
|
31
39
|
api('/api/session').then(x=>{token=x.confirmationToken;load();doctor()}).catch(e=>toast(e.message));
|
|
32
40
|
</script></body></html>`;
|
|
33
41
|
}
|