@hienlh/ppm 0.9.12 → 0.9.13

package/dist/web/assets/{browser-tab-CWkYQN8G.js → browser-tab-BSyNzK_i.js}

@@ -1 +1 @@
-import{o as e}from"./chunk-CFjPhJqf.js";import{t}from"./react-nm2Ru1Pt.js";import{l as n,t as r}from"./tab-store-CeOacjuH.js";import{t as i}from"./jsx-runtime-O3jQaKZd.js";import{t as a}from"./api-client-BfBM3I7n.js";import{et as o,lt as s,q as c,ut as l}from"./index-E0N-qark.js";var u=e(t(),1),d=i();function f({metadata:e,tabId:t}){let i=e?.port||0,[f,p]=(0,u.useState)(i?String(i):``),[m,h]=(0,u.useState)(null),[g,_]=(0,u.useState)(!1),[v,y]=(0,u.useState)(null),b=(0,u.useRef)(null),x=r(e=>e.updateTab),S=(0,u.useCallback)(async n=>{_(!0),y(null),h(null);try{h((await a.post(`/api/preview/tunnel`,{port:n})).url),t&&x(t,{title:`localhost:${n}`,metadata:{...e,port:n}})}catch(e){y(e.message||`Failed to start tunnel for port ${n}`)}finally{_(!1)}},[t,e,x]),C=(0,u.useCallback)(async()=>{let e=parseInt(f,10);if(e){try{await a.del(`/api/preview/tunnel/${e}`)}catch{}h(null),t&&x(t,{title:`Browser`})}},[f,t,x]);return m?(0,d.jsxs)(`div`,{className:`flex flex-col h-full w-full bg-background`,children:[(0,d.jsxs)(`div`,{className:`flex items-center gap-1.5 px-2 py-1.5 border-b border-border bg-surface shrink-0`,children:[(0,d.jsx)(l,{className:`size-4 text-text-subtle shrink-0`}),(0,d.jsxs)(`span`,{className:`text-xs text-text-primary font-medium`,children:[`localhost:`,f]}),(0,d.jsxs)(`span`,{className:`text-xs text-text-subtle truncate ml-1`,children:[`(`,m,`)`]}),(0,d.jsx)(`div`,{className:`flex-1`}),(0,d.jsx)(`button`,{onClick:()=>{if(b.current){let e=b.current.src;b.current.src=``,requestAnimationFrame(()=>{b.current&&(b.current.src=e)})}},className:`p-1.5 rounded hover:bg-surface-elevated transition-colors`,title:`Reload`,children:(0,d.jsx)(o,{className:`size-3.5`})}),(0,d.jsx)(`button`,{onClick:()=>window.open(m,`_blank`),className:`p-1.5 rounded hover:bg-surface-elevated transition-colors`,title:`Open in browser`,children:(0,d.jsx)(n,{className:`size-3.5`})}),(0,d.jsx)(`button`,{onClick:C,className:`p-1.5 rounded hover:bg-surface-elevated text-red-400 transition-colors`,title:`Stop tunnel`,children:(0,d.jsx)(c,{className:`size-3.5`})})]}),(0,d.jsxs)(`div`,{className:`flex-1 relative min-h-0`,children:[(0,d.jsx)(`iframe`,{ref:b,src:m,className:`w-full h-full border-0`,sandbox:`allow-scripts allow-forms allow-same-origin allow-popups allow-modals`,onLoad:()=>_(!1)}),g&&(0,d.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center bg-background/50`,children:(0,d.jsx)(s,{className:`size-5 animate-spin text-text-secondary`})})]})]}):(0,d.jsxs)(`div`,{className:`flex flex-col items-center justify-center h-full gap-4 p-6`,children:[(0,d.jsx)(l,{className:`size-12 text-text-subtle`}),(0,d.jsx)(`h2`,{className:`text-lg font-medium text-text-primary`,children:`Open Localhost`}),(0,d.jsx)(`p`,{className:`text-sm text-text-secondary text-center max-w-sm`,children:`Enter the port of your local dev server to preview it here.`}),(0,d.jsxs)(`form`,{onSubmit:e=>{e.preventDefault();let t=parseInt(f,10);t>=1&&t<=65535?S(t):y(`Port must be 1-65535`)},className:`flex items-center gap-2 w-full max-w-xs`,children:[(0,d.jsxs)(`div`,{className:`flex-1 flex items-center gap-2 px-3 py-2.5 rounded-lg bg-surface border border-border focus-within:border-accent/50 transition-colors`,children:[(0,d.jsx)(`span`,{className:`text-sm text-text-subtle shrink-0`,children:`localhost:`}),(0,d.jsx)(`input`,{type:`number`,value:f,onChange:e=>p(e.target.value),placeholder:`3000`,min:1,max:65535,autoFocus:!0,className:`flex-1 bg-transparent text-sm text-text-primary outline-none placeholder:text-text-subtle min-w-0 [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none`})]}),(0,d.jsx)(`button`,{type:`submit`,disabled:g||!f,className:`px-4 py-2.5 rounded-lg bg-accent text-white text-sm font-medium hover:bg-accent/90 disabled:opacity-50 transition-colors shrink-0`,children:g?(0,d.jsx)(s,{className:`size-4 animate-spin`}):`Open`})]}),v&&(0,d.jsx)(`p`,{className:`text-sm text-red-400`,children:v}),g&&(0,d.jsxs)(`div`,{className:`flex items-center gap-2 text-sm text-text-secondary`,children:[(0,d.jsx)(s,{className:`size-4 animate-spin`}),(0,d.jsx)(`span`,{children:`Starting tunnel... (may take a few seconds)`})]})]})}export{f as BrowserTab};
+import{o as e}from"./chunk-CFjPhJqf.js";import{t}from"./react-nm2Ru1Pt.js";import{l as n,t as r}from"./tab-store-CeOacjuH.js";import{t as i}from"./jsx-runtime-O3jQaKZd.js";import{t as a}from"./api-client-BfBM3I7n.js";import{et as o,lt as s,q as c,ut as l}from"./index-B--rhmx5.js";var u=e(t(),1),d=i();function f({metadata:e,tabId:t}){let i=e?.port||0,[f,p]=(0,u.useState)(i?String(i):``),[m,h]=(0,u.useState)(null),[g,_]=(0,u.useState)(!1),[v,y]=(0,u.useState)(null),b=(0,u.useRef)(null),x=r(e=>e.updateTab),S=(0,u.useCallback)(async n=>{_(!0),y(null),h(null);try{h((await a.post(`/api/preview/tunnel`,{port:n})).url),t&&x(t,{title:`localhost:${n}`,metadata:{...e,port:n}})}catch(e){y(e.message||`Failed to start tunnel for port ${n}`)}finally{_(!1)}},[t,e,x]),C=(0,u.useCallback)(async()=>{let e=parseInt(f,10);if(e){try{await a.del(`/api/preview/tunnel/${e}`)}catch{}h(null),t&&x(t,{title:`Browser`})}},[f,t,x]);return m?(0,d.jsxs)(`div`,{className:`flex flex-col h-full w-full bg-background`,children:[(0,d.jsxs)(`div`,{className:`flex items-center gap-1.5 px-2 py-1.5 border-b border-border bg-surface shrink-0`,children:[(0,d.jsx)(l,{className:`size-4 text-text-subtle shrink-0`}),(0,d.jsxs)(`span`,{className:`text-xs text-text-primary font-medium`,children:[`localhost:`,f]}),(0,d.jsxs)(`span`,{className:`text-xs text-text-subtle truncate ml-1`,children:[`(`,m,`)`]}),(0,d.jsx)(`div`,{className:`flex-1`}),(0,d.jsx)(`button`,{onClick:()=>{if(b.current){let e=b.current.src;b.current.src=``,requestAnimationFrame(()=>{b.current&&(b.current.src=e)})}},className:`p-1.5 rounded hover:bg-surface-elevated transition-colors`,title:`Reload`,children:(0,d.jsx)(o,{className:`size-3.5`})}),(0,d.jsx)(`button`,{onClick:()=>window.open(m,`_blank`),className:`p-1.5 rounded hover:bg-surface-elevated transition-colors`,title:`Open in browser`,children:(0,d.jsx)(n,{className:`size-3.5`})}),(0,d.jsx)(`button`,{onClick:C,className:`p-1.5 rounded hover:bg-surface-elevated text-red-400 transition-colors`,title:`Stop tunnel`,children:(0,d.jsx)(c,{className:`size-3.5`})})]}),(0,d.jsxs)(`div`,{className:`flex-1 relative min-h-0`,children:[(0,d.jsx)(`iframe`,{ref:b,src:m,className:`w-full h-full border-0`,sandbox:`allow-scripts allow-forms allow-same-origin allow-popups allow-modals`,onLoad:()=>_(!1)}),g&&(0,d.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center bg-background/50`,children:(0,d.jsx)(s,{className:`size-5 animate-spin text-text-secondary`})})]})]}):(0,d.jsxs)(`div`,{className:`flex flex-col items-center justify-center h-full gap-4 p-6`,children:[(0,d.jsx)(l,{className:`size-12 text-text-subtle`}),(0,d.jsx)(`h2`,{className:`text-lg font-medium text-text-primary`,children:`Open Localhost`}),(0,d.jsx)(`p`,{className:`text-sm text-text-secondary text-center max-w-sm`,children:`Enter the port of your local dev server to preview it here.`}),(0,d.jsxs)(`form`,{onSubmit:e=>{e.preventDefault();let t=parseInt(f,10);t>=1&&t<=65535?S(t):y(`Port must be 1-65535`)},className:`flex items-center gap-2 w-full max-w-xs`,children:[(0,d.jsxs)(`div`,{className:`flex-1 flex items-center gap-2 px-3 py-2.5 rounded-lg bg-surface border border-border focus-within:border-accent/50 transition-colors`,children:[(0,d.jsx)(`span`,{className:`text-sm text-text-subtle shrink-0`,children:`localhost:`}),(0,d.jsx)(`input`,{type:`number`,value:f,onChange:e=>p(e.target.value),placeholder:`3000`,min:1,max:65535,autoFocus:!0,className:`flex-1 bg-transparent text-sm text-text-primary outline-none placeholder:text-text-subtle min-w-0 [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none`})]}),(0,d.jsx)(`button`,{type:`submit`,disabled:g||!f,className:`px-4 py-2.5 rounded-lg bg-accent text-white text-sm font-medium hover:bg-accent/90 disabled:opacity-50 transition-colors shrink-0`,children:g?(0,d.jsx)(s,{className:`size-4 animate-spin`}):`Open`})]}),v&&(0,d.jsx)(`p`,{className:`text-sm text-red-400`,children:v}),g&&(0,d.jsxs)(`div`,{className:`flex items-center gap-2 text-sm text-text-secondary`,children:[(0,d.jsx)(s,{className:`size-4 animate-spin`}),(0,d.jsx)(`span`,{children:`Starting tunnel... (may take a few seconds)`})]})]})}export{f as BrowserTab};