CoolFace
Apppublic

admin08077/Githubgemini

sourceHugging Faceotherupdated 10mo agoView on Hugging Face
0likes
PromptCraftPad-CLnFwMOJ.js3 linesDownload Raw Back to assets
1import{r as l,j as t}from"./react-DKy9e2uO.js";import{u as y,S as w}from"./index-Ck8YGBbR.js";import"./bottleneck-Cpj98o6Y.js";import"./react-dom-CpxHE_eW.js";import"./scheduler-DYLXRpC5.js";import"./idb-Dob3nYDb.js";import"./@google-D80DdW2m.js";import"./marked-CesSW9Du.js";import"./jszip-s56H2EZ-.js";const R=()=>{const[a,d]=y("devcore_prompts",[{id:1,name:"React Component Generator",text:"Generate a React component named {name} that {description}. Style it with Tailwind CSS."}]),[r,o]=l.useState(a[0]||null),[b,x]=l.useState(null),[m,u]=l.useState(""),[i,f]=l.useState({}),c=l.useMemo(()=>r?[...r.text.matchAll(/\{(\w+)\}/g)].map(e=>e[1]):[],[r]),h=l.useMemo(()=>r?c.reduce((e,s)=>e.replace(new RegExp(`\\{${s}\\}`,"g"),i[s]||`{${s}}`),r.text):"",[r,i,c]);l.useEffect(()=>{!r&&a.length>0&&o(a[0]),r&&o(a.find(e=>e.id===r.id)||null)},[a,r]);const g=e=>{if(!r)return;const s={...r,text:e.target.value};d(a.map(n=>n.id===s.id?s:n))},p=(e,s)=>{d(a.map(n=>n.id===e?{...n,name:s}:n)),x(null)},j=()=>{const e={id:Date.now(),name:"New Untitled Prompt",text:""};d([...a,e]),o(e)},N=e=>{d(a.filter(s=>s.id!==e)),(r==null?void 0:r.id)===e&&o(a.length>1?a[0]:null)};return t.jsxs("div",{className:"h-full flex flex-col p-4 sm:p-6 lg:p-8 text-text-primary",children:[t.jsxs("header",{className:"mb-6",children:[t.jsxs("h1",{className:"text-3xl font-bold flex items-center",children:[t.jsx(w,{}),t.jsx("span",{className:"ml-3",children:"Prompt Craft Pad"})]}),t.jsx("p",{className:"text-text-secondary mt-1",children:"Create, save, and manage your favorite AI prompts."})]}),t.jsxs("div",{className:"flex-grow flex gap-6 min-h-0",children:[t.jsxs("aside",{className:"w-1/3 bg-surface border border-border p-4 rounded-lg flex flex-col",children:[t.jsx("h3",{className:"font-bold mb-2",children:"My Prompts"}),t.jsx("ul",{className:"space-y-2 flex-grow overflow-y-auto",children:a.map(e=>t.jsxs("li",{className:"group flex items-center justify-between",children:[t.jsx("div",{className:`w-full text-left rounded-md ${(r==null?void 0:r.id)===e.id?"bg-primary/10":""}`,children:t.jsxs("button",{onClick:()=>o(e),onDoubleClick:()=>{x(e.id),u(e.name)},className:`w-full text-left px-3 py-2 ${(r==null?void 0:r.id)===e.id?"text-primary":"hover:bg-gray-100"}`,children:[" ",b===e.id?t.jsx("input",{autoFocus:!0,value:m,onChange:s=>u(s.target.value),onBlur:()=>p(e.id,m),onKeyDown:s=>s.key==="Enter"&&p(e.id,m),className:"bg-gray-100 text-text-primary w-full"}):e.name," "]})}),t.jsx("button",{onClick:()=>N(e.id),className:"ml-2 p-1 text-text-secondary hover:text-red-500 opacity-0 group-hover:opacity-100",children:"×"})]},e.id))}),t.jsx("div",{className:"mt-4 pt-4 border-t border-border",children:t.jsx("button",{onClick:j,className:"btn-primary w-full text-sm py-2",children:"Add New Prompt"})})]}),t.jsx("main",{className:"w-2/3 flex flex-col gap-4",children:r?t.jsxs(t.Fragment,{children:[t.jsx("textarea",{value:r.text,onChange:g,className:"flex-grow p-4 bg-surface border border-border rounded-md resize-none font-mono text-sm focus:ring-2 focus:ring-primary focus:outline-none"}),c.length>0&&t.jsxs("div",{className:"flex-shrink-0 bg-surface border border-border p-4 rounded-lg",children:[t.jsx("h4",{className:"font-bold mb-2",children:"Test Variables"}),t.jsx("div",{className:"grid grid-cols-2 gap-2",children:c.map(e=>t.jsxs("div",{children:[t.jsx("label",{className:"text-xs",children:e}),t.jsx("input",{type:"text",value:i[e]||"",onChange:s=>f({...i,[e]:s.target.value}),className:"w-full bg-background border border-border px-2 py-1 rounded text-sm"})]},e))}),t.jsx("h4",{className:"font-bold mt-4 mb-2",children:"Live Preview"}),t.jsx("p",{className:"text-sm p-2 bg-background rounded border border-border",children:h})]})]}):t.jsx("div",{className:"flex-grow flex items-center justify-center bg-background rounded-lg text-text-secondary border border-border",children:"Select a prompt or create a new one."})})]})]})};export{R as PromptCraftPad};2//# sourceMappingURL=PromptCraftPad-CLnFwMOJ.js.map3