aidev / assets /ColorPaletteGenerator-BK2OFSOe.js
admin08077's picture
Upload 107 files
63c17a0 verified
import{r,j as e}from"./react-D_B_5QVd.js";import{Z as u}from"./react-colorful-yV61q6mf.js";import{W as b,S as h,L as c}from"./index-BdwitBZy.js";import"./jszip-C9ownNzX.js";import"./react-dom-EAO2-NBm.js";import"./scheduler-DYLXRpC5.js";import"./@google-4tyssLU_.js";import"./marked-CesSW9Du.js";import"./idb-Dob3nYDb.js";const S=()=>{const[s,i]=r.useState("#0047AB"),[d,m]=r.useState(["#0047AB","#3366CC","#6688D1","#99AADD","#CCD3E8","#F0F2F5"]),[a,l]=r.useState(!1),[o,n]=r.useState(""),x=r.useCallback(async()=>{l(!0),n("");try{const t=await b(s);m(t.colors)}catch(t){const f=t instanceof Error?t.message:"An unknown error occurred.";n(`Failed to generate palette: ${f}`)}finally{l(!1)}},[s]),p=t=>{navigator.clipboard.writeText(t)};return e.jsxs("div",{className:"h-full flex flex-col p-4 sm:p-6 lg:p-8 text-text-primary",children:[e.jsxs("header",{className:"mb-6 text-center",children:[e.jsxs("h1",{className:"text-3xl font-bold flex items-center justify-center",children:[e.jsx(h,{}),e.jsx("span",{className:"ml-3",children:"AI Color Palette Generator"})]}),e.jsx("p",{className:"text-text-secondary mt-1",children:"Pick a base color and let Gemini design a beautiful palette for you."})]}),e.jsxs("div",{className:"flex-grow flex flex-col md:flex-row items-center justify-center gap-8",children:[e.jsxs("div",{className:"flex flex-col items-center gap-4",children:[e.jsx(u,{color:s,onChange:i,className:"!w-64 !h-64"}),e.jsx("div",{className:"p-2 bg-surface rounded-md font-mono text-lg border border-border",style:{color:s},children:s}),e.jsx("button",{onClick:x,disabled:a,className:"btn-primary w-full flex items-center justify-center px-6 py-3",children:a?e.jsx(c,{}):"Generate Palette"}),o&&e.jsx("p",{className:"text-red-500 text-sm mt-2",children:o})]}),e.jsxs("div",{className:"flex flex-col gap-2 w-full max-w-sm",children:[e.jsx("label",{className:"text-sm font-medium text-text-secondary mb-2",children:"Generated Palette:"}),a?e.jsx("div",{className:"flex items-center justify-center h-48",children:e.jsx(c,{})}):d.map(t=>e.jsxs("div",{className:"group flex items-center justify-between p-4 rounded-md shadow-md border border-border",style:{backgroundColor:t},children:[e.jsx("span",{className:"font-mono font-bold text-black/70 mix-blend-overlay",children:t}),e.jsx("button",{onClick:()=>p(t),className:"opacity-0 group-hover:opacity-100 transition-opacity bg-white/30 hover:bg-white/50 px-3 py-1 rounded text-xs text-black font-semibold backdrop-blur-sm",children:"Copy"})]},t))]})]})]})};export{S as ColorPaletteGenerator};
//# sourceMappingURL=ColorPaletteGenerator-BK2OFSOe.js.map