@kohryan/moodui 0.0.8 → 0.0.10

package/dist/ui/assets/index-BKsInBa3.js

@@ -0,0 +1,7 @@
+import{createRoot as e}from"react-dom/client";var t=Object.create,n=Object.defineProperty,r=Object.getOwnPropertyDescriptor,i=Object.getOwnPropertyNames,a=Object.getPrototypeOf,o=Object.prototype.hasOwnProperty,s=(e,t)=>()=>(t||(e((t={exports:{}}).exports,t),e=null),t.exports),c=(e,t,a,s)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var c=i(t),l=0,u=c.length,d;l<u;l++)d=c[l],!o.call(e,d)&&d!==a&&n(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(s=r(t,d))||s.enumerable});return e},l=(e,r,i)=>(i=e==null?{}:t(a(e)),c(r||!e||!e.__esModule?n(i,`default`,{value:e,enumerable:!0}):i,e));(function(){let e=document.createElement(`link`).relList;if(e&&e.supports&&e.supports(`modulepreload`))return;for(let e of document.querySelectorAll(`link[rel="modulepreload"]`))n(e);new MutationObserver(e=>{for(let t of e)if(t.type===`childList`)for(let e of t.addedNodes)e.tagName===`LINK`&&e.rel===`modulepreload`&&n(e)}).observe(document,{childList:!0,subtree:!0});function t(e){let t={};return e.integrity&&(t.integrity=e.integrity),e.referrerPolicy&&(t.referrerPolicy=e.referrerPolicy),e.crossOrigin===`use-credentials`?t.credentials=`include`:e.crossOrigin===`anonymous`?t.credentials=`omit`:t.credentials=`same-origin`,t}function n(e){if(e.ep)return;e.ep=!0;let n=t(e);fetch(e.href,n)}})();var u=s((e=>{var t=Symbol.for(`react.fragment`),n={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},r=Object.assign,i={};function a(e,t,r){this.props=e,this.context=t,this.refs=i,this.updater=r||n}a.prototype.isReactComponent={},a.prototype.setState=function(e,t){if(typeof e!=`object`&&typeof e!=`function`&&e!=null)throw Error(`takes an object of state variables to update or a function which returns an object of state variables.`);this.updater.enqueueSetState(this,e,t,`setState`)},a.prototype.forceUpdate=function(e){this.updater.enqueueForceUpdate(this,e,`forceUpdate`)};function o(){}o.prototype=a.prototype;function s(e,t,r){this.props=e,this.context=t,this.refs=i,this.updater=r||n}var c=s.prototype=new o;c.constructor=s,r(c,a.prototype),c.isPureReactComponent=!0,Array.isArray;var l={H:null,A:null,T:null,S:null};e.Fragment=t,e.useCallback=function(e,t){return l.H.useCallback(e,t)},e.useState=function(e){return l.H.useState(e)}})),d=s(((e,t)=>{t.exports=u()}));function f(e){let t=[];if(!h(e))return{ok:!1,errors:[`spec must be an object`]};e.version!==1&&t.push(`spec.version must be 1`);let n=e.root,r=m(n,`spec.root`);return r.ok||t.push(...r.errors),t.length>0?{ok:!1,errors:t}:{ok:!0,value:e}}function p(e){let t=f(e);if(!t.ok){let e=[`Invalid MoodUI spec:`,...t.errors.map(e=>`- ${e}`)].join(`
+`);throw Error(e)}return t.value}function m(e,t){let n=[];if(!h(e))return{ok:!1,errors:[`${t} must be an object`]};let r=e.type;if(!g(r))return{ok:!1,errors:[`${t}.type must be a string`]};switch(r){case`box`:{let r=e.children;if(r!=null)if(!Array.isArray(r))n.push(`${t}.children must be an array`);else for(let e=0;e<r.length;e+=1){let i=r[e],a=m(i,`${t}.children[${e}]`);a.ok||n.push(...a.errors)}break}case`text`:{let r=e.props;h(r)?g(r.value)||n.push(`${t}.props.value must be a string`):n.push(`${t}.props must be an object`);break}case`button`:{let r=e.props;h(r)?g(r.label)||n.push(`${t}.props.label must be a string`):n.push(`${t}.props must be an object`);break}case`input`:{let r=e.props;r!=null&&!h(r)&&n.push(`${t}.props must be an object if provided`);break}case`image`:{let r=e.props;h(r)?g(r.src)||n.push(`${t}.props.src must be a string`):n.push(`${t}.props must be an object`);break}case`spacer`:{let r=e.props;r!=null&&!h(r)&&n.push(`${t}.props must be an object if provided`);break}default:n.push(`${t}.type must be one of: box | text | button | input | image | spacer`)}return n.length>0?{ok:!1,errors:n}:{ok:!0,value:e}}function h(e){return typeof e==`object`&&!!e&&!Array.isArray(e)}function g(e){return typeof e==`string`}function _(e,t={}){let n=p(e),r=t.componentName??`MoodUIScreen`,i=v(n.root,{indent:2,onActionProp:`onAction`});return[`import * as React from "react";`,``,`export type MoodUIScreenActionHandler = (actionId: string) => void;`,``,`export type MoodUIScreenProps = {`,`  onAction?: MoodUIScreenActionHandler;`,`};`,``,`export function ${r}(props: MoodUIScreenProps) {`,`  const { onAction } = props;`,`  return (`,i,`  );`,`}`,``].join(`
+`)}function v(e,t){switch(e.type){case`box`:return y(`div`,e,t,()=>{let n=e.children??[];return n.length===0?[]:n.map(e=>v(e,{...t,indent:t.indent+2}))});case`text`:{let n=e.props?.as??`p`,r=A(e.props?.value??``);return y(n,e,t,()=>[j(t.indent+2)+r])}case`button`:{let n=A(e.props?.label??``),r=e.props?.actionId;return y(`button`,e,t,()=>[j(t.indent+2)+n],r?{onClick:`() => ${t.onActionProp}?.(${O(r)})`}:void 0)}case`input`:return b(`input`,e,t);case`image`:return b(`img`,e,t);case`spacer`:{let n=e.props?.size??8;return y(`div`,{type:`box`,props:{style:{width:T(n),height:T(n)}},children:[]},t,()=>[])}}}function y(e,t,n,r,i){let a=r(),o=x(e,t,i),s=`<${e}${o.length?` `+o.join(` `):``}>`,c=`</${e}>`;return a.length===0?j(n.indent)+s+c:[j(n.indent)+s,...a,j(n.indent)+c].join(`
+`)}function b(e,t,n){let r=x(e,t);return j(n.indent)+`<${e}${r.length?` `+r.join(` `):``} />`}function x(e,t,n){let r=t.props??{},i=[];r.id&&i.push(`id=${D(r.id)}`),r.testId&&i.push(`data-testid=${D(r.testId)}`),r.className&&i.push(`className=${D(r.className)}`);let a=w(S(e,t),r.style)??{};if(e===`input`&&(r.name&&i.push(`name=${D(r.name)}`),r.placeholder&&i.push(`placeholder=${D(r.placeholder)}`),r.defaultValue&&i.push(`defaultValue=${D(r.defaultValue)}`)),e===`img`&&(r.src&&i.push(`src=${D(r.src)}`),r.alt&&i.push(`alt=${D(r.alt)}`),r.fit&&(a.objectFit=r.fit)),Object.keys(a).length>0&&i.push(`style={(${O(a)} as React.CSSProperties)}`),n)for(let[e,t]of Object.entries(n))i.push(`${e}={${t}}`);return i}function S(e,t){let n=t.props??{},r={};if(n.width!=null&&(r.width=T(n.width)),n.height!=null&&(r.height=T(n.height)),n.background!=null&&(r.background=n.background),n.borderRadius!=null&&(r.borderRadius=T(n.borderRadius)),C(r,`margin`,n.margin),C(r,`padding`,n.padding),t.type===`box`&&(r.display=`flex`,r.flexDirection=E(n.direction)??`column`,n.gap!=null&&(r.gap=T(n.gap)),n.align!=null&&(r.alignItems=n.align),n.justify!=null&&(r.justifyContent=n.justify),n.wrap!=null&&(r.flexWrap=n.wrap)),t.type===`text`&&(n.color!=null&&(r.color=n.color),n.fontSize!=null&&(r.fontSize=T(n.fontSize)),n.fontWeight!=null&&(r.fontWeight=n.fontWeight),n.textAlign!=null&&(r.textAlign=n.textAlign),e.startsWith(`h`)&&(r.margin=0)),t.type===`button`){r.cursor=`pointer`,r.border=`none`,r.padding=`10px 14px`,r.borderRadius=10;let e=n.variant??`primary`;e===`primary`?(r.background=`#111827`,r.color=`#ffffff`):e===`secondary`?(r.background=`#e5e7eb`,r.color=`#111827`):(r.background=`transparent`,r.color=`#111827`),n.disabled&&(r.opacity=.6,r.cursor=`not-allowed`)}return t.type===`input`&&(r.padding=`10px 12px`,r.borderRadius=10,r.border=`1px solid #d1d5db`,r.outline=`none`),t.type===`image`&&(n.fit!=null&&(r.objectFit=n.fit),r.maxWidth=`100%`),r}function C(e,t,n){if(n==null)return;if(typeof n==`number`||typeof n==`string`){e[t]=T(n);return}if(typeof n!=`object`||Array.isArray(n))return;let r=n,i=r.all,a=r.x,o=r.y;i!=null&&(e[t]=T(i)),a!=null&&(e[`${t}Left`]=T(a),e[`${t}Right`]=T(a)),o!=null&&(e[`${t}Top`]=T(o),e[`${t}Bottom`]=T(o)),r.top!=null&&(e[`${t}Top`]=T(r.top)),r.right!=null&&(e[`${t}Right`]=T(r.right)),r.bottom!=null&&(e[`${t}Bottom`]=T(r.bottom)),r.left!=null&&(e[`${t}Left`]=T(r.left))}function w(e,t){if(!(!e&&!t))return e?t?{...e,...t}:e:t}function T(e){return e}function E(e){if(e===`row`||e===`column`)return e;if(e===`horizontal`)return`row`;if(e===`vertical`)return`column`}function D(e){return`{${O(e)}}`}function O(e){return e===null?`null`:e===void 0?`undefined`:typeof e==`string`?JSON.stringify(e):typeof e==`number`||typeof e==`boolean`?String(e):Array.isArray(e)?`[${e.map(O).join(`, `)}]`:typeof e==`object`?`{ ${Object.entries(e).filter(([,e])=>e!==void 0).map(([e,t])=>`${k(e)}: ${O(t)}`).join(`, `)} }`:`undefined`}function k(e){return/^[A-Za-z_$][A-Za-z0-9_$]*$/.test(e)?e:JSON.stringify(e)}function A(e){return e.replace(/&/g,`&amp;`).replace(/</g,`&lt;`).replace(/>/g,`&gt;`)}function j(e){return` `.repeat(e)}var M=s((e=>{var t=Symbol.for(`react.transitional.element`),n=Symbol.for(`react.fragment`);function r(e,n,r){var i=null;if(r!==void 0&&(i=``+r),n.key!==void 0&&(i=``+n.key),`key`in n)for(var a in r={},n)a!==`key`&&(r[a]=n[a]);else r=n;return n=r.ref,{$$typeof:t,type:e,key:i,ref:n===void 0?null:n,props:r}}e.Fragment=n,e.jsx=r,e.jsxs=r})),N=s(((e,t)=>{t.exports=M()})),P=l(d()),F=N();function I(e){return(0,F.jsx)(F.Fragment,{children:L(e.spec.root,e.onAction)})}function L(e,t){switch(e.type){case`box`:{let n=z(e),r=e.children?.map((e,n)=>(0,F.jsx)(P.Fragment,{children:L(e,t)},n));return(0,F.jsx)(`div`,{...R(e),style:n,children:r})}case`text`:{let t=e.props?.as??`p`,n=z(e);return(0,F.jsx)(t,{...R(e),style:n,children:e.props?.value??``})}case`button`:{let n=z(e),r=e.props?.actionId;return(0,F.jsx)(`button`,{...R(e),style:n,disabled:e.props?.disabled??!1,onClick:r?()=>t?.(r):void 0,children:e.props?.label??``})}case`input`:{let t=z(e);return(0,F.jsx)(`input`,{...R(e),style:t,name:e.props?.name,placeholder:e.props?.placeholder,defaultValue:e.props?.defaultValue})}case`image`:{let t=z(e);return(0,F.jsx)(`img`,{...R(e),style:t,src:e.props?.src,alt:e.props?.alt??``})}case`spacer`:{let t=e.props?.size??8;return(0,F.jsx)(`div`,{style:{width:t,height:t}})}}}function R(e){let t=e.props??{};return{id:typeof t.id==`string`?t.id:void 0,className:typeof t.className==`string`?t.className:void 0,"data-testid":typeof t.testId==`string`?t.testId:void 0}}function z(e){let t=e.props??{},n={},r=V(t.width),i=V(t.height),a=V(t.borderRadius);if(r!=null&&(n.width=r),i!=null&&(n.height=i),typeof t.background==`string`&&(n.background=t.background),a!=null&&(n.borderRadius=a),B(n,`margin`,t.margin),B(n,`padding`,t.padding),e.type===`box`){n.display=`flex`,t.direction===`row`||t.direction===`column`?n.flexDirection=t.direction:n.flexDirection=`column`;let e=V(t.gap);e!=null&&(n.gap=e),typeof t.align==`string`&&(n.alignItems=t.align),typeof t.justify==`string`&&(n.justifyContent=t.justify),(t.wrap===`nowrap`||t.wrap===`wrap`)&&(n.flexWrap=t.wrap)}if(e.type===`text`){typeof t.color==`string`&&(n.color=t.color);let r=V(t.fontSize);r!=null&&(n.fontSize=r),(typeof t.fontWeight==`string`||typeof t.fontWeight==`number`)&&(n.fontWeight=t.fontWeight),typeof t.textAlign==`string`&&(n.textAlign=t.textAlign);let i=e.props?.as;typeof i==`string`&&i.startsWith(`h`)&&(n.margin=0)}if(e.type===`button`){n.cursor=e.props?.disabled?`not-allowed`:`pointer`,n.border=`none`,n.padding??=`10px 14px`,n.borderRadius??=10;let t=e.props?.variant??`primary`;t===`primary`?(n.background??=`#111827`,n.color??=`#ffffff`):t===`secondary`?(n.background??=`#e5e7eb`,n.color??=`#111827`):(n.background??=`transparent`,n.color??=`#111827`),e.props?.disabled&&(n.opacity=.6)}if(e.type===`input`&&(n.padding??=`10px 12px`,n.borderRadius??=10,n.border??=`1px solid #d1d5db`,n.outline??=`none`),e.type===`image`){n.maxWidth??=`100%`;let t=e.props?.fit;t!=null&&(n.objectFit=t)}return t.style&&typeof t.style==`object`&&!Array.isArray(t.style)&&Object.assign(n,t.style),n}function B(e,t,n){if(n==null)return;let r=e;if(typeof n==`number`||typeof n==`string`){r[t]=V(n);return}if(typeof n!=`object`||Array.isArray(n))return;let i=n,a=i.all,o=i.x,s=i.y;a!=null&&(r[t]=V(a)),o!=null&&(r[`${t}Left`]=V(o),r[`${t}Right`]=V(o)),s!=null&&(r[`${t}Top`]=V(s),r[`${t}Bottom`]=V(s)),i.top!=null&&(r[`${t}Top`]=V(i.top)),i.right!=null&&(r[`${t}Right`]=V(i.right)),i.bottom!=null&&(r[`${t}Bottom`]=V(i.bottom)),i.left!=null&&(r[`${t}Left`]=V(i.left))}function V(e){if(typeof e==`number`||typeof e==`string`)return e}async function H(e,t){let n=t.maxAttempts??2;if(n<1)throw Error(`maxAttempts must be >= 1`);let r=U(),i=W(t.prompt),a=``,o;for(let s=1;s<=n;s+=1){let n=[{role:`system`,content:r},{role:`user`,content:i}];s>1&&n.push({role:`user`,content:`Perbaiki output kamu supaya valid JSON dan valid MoodUISpec. Output hanya JSON.`});let c=await e.chat({model:t.model,temperature:t.temperature,messages:n});a=c;try{return{spec:p(G(c)),raw:c}}catch(e){o=e}}let s=o instanceof Error?o.message:String(o);throw Error(`Failed to generate valid MoodUISpec. Last error: ${s}\n\nRaw:\n${a}`)}function U(){return[`Kamu adalah generator JSON untuk MoodUI.`,`TUGAS: keluarkan 1 objek JSON yang valid, sesuai schema MoodUISpec versi 1.`,`JANGAN keluarkan markdown, JANGAN ada penjelasan, JANGAN pakai backticks.`,``,`MoodUISpec shape:`,`{`,`  "version": 1,`,`  "root": MoodUINode`,`}`,``,`MoodUINode union:`,`- box: { type:'box', props?: { direction?, gap?, align?, justify?, wrap?, ...common }, children?: MoodUINode[] }`,`- text: { type:'text', props: { value: string, as?, color?, fontSize?, fontWeight?, textAlign?, ...common } }`,`- button: { type:'button', props: { label: string, variant?, actionId?, disabled?, ...common } }`,`- input: { type:'input', props?: { name?, placeholder?, defaultValue?, ...common } }`,`- image: { type:'image', props: { src: string, alt?, fit?, ...common } }`,`- spacer: { type:'spacer', props?: { size? } }`,``,`common props:`,`- id, testId, className, style(object), padding, margin, background, borderRadius, width, height`,``,`Rules:`,`- root wajib ada`,`- minimal pakai box sebagai container utama`,`- semua string pakai double quotes (JSON standard)`,`- jangan pakai function / JS expression apa pun`].join(`
+`)}function W(e){return[`Buat UI dari request ini:`,e].join(`
+`)}function G(e){let t=e.indexOf(`{`);if(t<0)throw Error(`No JSON object found`);let n=0,r=!1,i=!1;for(let a=t;a<e.length;a+=1){let o=e[a];if(r){i?i=!1:o===`\\`?i=!0:o===`"`&&(r=!1);continue}if(o===`"`){r=!0;continue}if(o===`{`?n+=1:o===`}`&&--n,n===0){let n=e.slice(t,a+1);return JSON.parse(n)}}throw Error(`Unterminated JSON object`)}function K(e){let t=(e.baseUrl??`https://generativelanguage.googleapis.com`).replace(/\/+$/,``),n=e.fetchFn??fetch,r=e.apiKey;return{async chat(e){let{systemInstruction:i,contents:a}=q(e.messages),o=await n(`${t}/v1beta/models/${encodeURIComponent(e.model)}:generateContent?key=${encodeURIComponent(r)}`,{method:`POST`,headers:{"content-type":`application/json`},body:JSON.stringify({...i?{systemInstruction:i}:{},contents:a,generationConfig:e.temperature==null?void 0:{temperature:e.temperature}})});if(!o.ok){let e=await J(o);throw Error(`Gemini generateContent failed (${o.status}): ${e}`)}let s=(await o.json())?.candidates?.[0]?.content?.parts,c=Array.isArray(s)?s.map(e=>typeof e?.text==`string`?e.text:``).join(``):void 0;if(typeof c!=`string`||c.length===0)throw Error(`Gemini response missing candidates[0].content.parts[].text`);return c}}}function q(e){let t=e.filter(e=>e.role===`system`).map(e=>e.content).filter(e=>e.trim().length>0),n=t.length>0?{role:`system`,parts:[{text:t.join(`
+`)}]}:void 0,r=e.filter(e=>e.role!==`system`).map(e=>({role:e.role===`assistant`?`model`:`user`,parts:[{text:e.content}]}));return r.length===0&&r.push({role:`user`,parts:[{text:``}]}),{systemInstruction:n,contents:r}}async function J(e){try{return await e.text()}catch{return``}}function Y(e={}){let t=e.baseUrl??`http://localhost:11434`,n=e.fetchFn??fetch;return{async chat(e){let r=await n(`${t}/api/chat`,{method:`POST`,headers:{"content-type":`application/json`},body:JSON.stringify({model:e.model,messages:e.messages,stream:!1,options:e.temperature==null?void 0:{temperature:e.temperature}})});if(!r.ok){let e=await X(r);throw Error(`Ollama chat failed (${r.status}): ${e}`)}let i=(await r.json())?.message?.content;if(typeof i!=`string`)throw Error(`Ollama response missing message.content`);return i}}}async function X(e){try{return await e.text()}catch{return``}}function Z(e){let t=e.fetchFn??fetch,n=e.baseUrl.replace(/\/+$/,``),r=e.apiKey,i=e.defaultHeaders??{};return{async chat(e){let a=await t(`${n}/v1/chat/completions`,{method:`POST`,headers:{"content-type":`application/json`,authorization:`Bearer ${r}`,...i},body:JSON.stringify({model:e.model,messages:e.messages,temperature:e.temperature})});if(!a.ok){let e=await Q(a);throw Error(`Chat completion failed (${a.status}): ${e}`)}let o=(await a.json())?.choices?.[0]?.message?.content;if(typeof o!=`string`)throw Error(`Response missing choices[0].message.content`);return o}}}async function Q(e){try{return await e.text()}catch{return``}}async function $(e){let{spec:t,raw:n}=await H(e.provider===`gemini`?K({apiKey:e.apiKey,baseUrl:e.baseUrl}):e.provider===`ollama`?Y({baseUrl:e.baseUrl}):Z({apiKey:e.apiKey,baseUrl:e.baseUrl}),{model:e.model,prompt:e.prompt,temperature:e.temperature,maxAttempts:e.maxAttempts});return{spec:t,raw:n,code:_(t,{componentName:e.componentName})}}function ee(e){let t=e.provider??`gemini`,[n,r]=P.useState(e.model??`gemini-3-flash-preview`),[i,a]=P.useState(e.apiKey??``),[o,s]=P.useState(e.baseUrl??``),[c,l]=P.useState(e.defaultPrompt??`Buat UI mood tracker: judul, input mood, tombol Simpan (actionId save_mood), dan section riwayat.`),[u,d]=P.useState(!1),[f,p]=P.useState(null),[m,h]=P.useState(null),[g,_]=P.useState(``),[v,y]=P.useState(!1),b=P.useCallback(async()=>{d(!0),p(null),y(!1);try{let r=t===`ollama`?await $({provider:`ollama`,model:n,baseUrl:o||void 0,prompt:c,componentName:e.componentName}):t===`openai-compatible`?await $({provider:`openai-compatible`,model:n,baseUrl:o||``,apiKey:i,prompt:c,componentName:e.componentName}):await $({provider:`gemini`,model:n,apiKey:i,baseUrl:o||void 0,prompt:c,componentName:e.componentName});h(r.spec),_(r.code)}catch(e){p(e instanceof Error?e.message:String(e))}finally{d(!1)}},[i,o,n,c,e.componentName,t]),x=e.componentName??`MoodScreen`,S=P.useCallback(async()=>{if(g)try{await navigator.clipboard.writeText(g),y(!0),setTimeout(()=>y(!1),2e3)}catch(e){console.error(`Failed to copy:`,e)}},[g]),C=P.useCallback(()=>{if(!g)return;let e=new Blob([g],{type:`text/plain`}),t=URL.createObjectURL(e),n=document.createElement(`a`);n.href=t,n.download=`${x}.tsx`,document.body.appendChild(n),n.click(),document.body.removeChild(n),URL.revokeObjectURL(t)},[g,x]),w=P.useCallback(async()=>{if(g)try{let e=await(await window.showSaveFilePicker({suggestedName:`${x}.tsx`,types:[{description:`TypeScript Files`,accept:{"text/plain":[`.tsx`]}}]})).createWritable();await e.write(g),await e.close()}catch(e){e.name?.includes(`AbortError`)||console.error(`Failed to save file:`,e)}},[g,x]);return(0,F.jsxs)(`div`,{style:{display:`grid`,gridTemplateColumns:`1fr 1fr`,gap:16},children:[(0,F.jsxs)(`div`,{style:{display:`flex`,flexDirection:`column`,gap:12},children:[(0,F.jsx)(`div`,{style:{fontWeight:700,fontSize:16},children:`MoodUI Prompt`}),(0,F.jsxs)(`div`,{style:{display:`flex`,gap:8,flexWrap:`wrap`},children:[(0,F.jsx)(`input`,{value:t,readOnly:!0,style:{padding:`10px 12px`,borderRadius:10,border:`1px solid #d1d5db`,background:`#f3f4f6`,width:200}}),(0,F.jsx)(`input`,{value:n,onChange:e=>r(e.target.value),placeholder:`model`,style:{padding:`10px 12px`,borderRadius:10,border:`1px solid #d1d5db`,flex:`1 1 220px`}})]}),t===`ollama`?null:(0,F.jsx)(`input`,{value:i,onChange:e=>a(e.target.value),placeholder:`API key`,type:`password`,style:{padding:`10px 12px`,borderRadius:10,border:`1px solid #d1d5db`}}),(0,F.jsx)(`input`,{value:o,onChange:e=>s(e.target.value),placeholder:t===`ollama`?`baseUrl (optional) e.g. http://localhost:11434`:`baseUrl (optional)`,style:{padding:`10px 12px`,borderRadius:10,border:`1px solid #d1d5db`}}),(0,F.jsx)(`textarea`,{value:c,onChange:e=>l(e.target.value),rows:10,style:{padding:12,borderRadius:12,border:`1px solid #d1d5db`,fontFamily:`ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace`,fontSize:12}}),(0,F.jsx)(`button`,{type:`button`,onClick:b,disabled:u,style:{padding:`10px 12px`,borderRadius:10,border:`1px solid #111827`,background:`#111827`,color:`#ffffff`,cursor:u?`not-allowed`:`pointer`},children:u?`Generating...`:`Generate`}),f?(0,F.jsx)(`pre`,{style:{margin:0,padding:12,borderRadius:12,border:`1px solid #7f1d1d`,background:`#fef2f2`,color:`#7f1d1d`,whiteSpace:`pre-wrap`},children:f}):null]}),(0,F.jsxs)(`div`,{style:{display:`flex`,flexDirection:`column`,gap:12},children:[(0,F.jsx)(`div`,{style:{fontWeight:700,fontSize:16},children:`Preview`}),(0,F.jsx)(`div`,{style:{minHeight:240,padding:16,borderRadius:16,background:`#ffffff`,border:`1px solid #e5e7eb`},children:m?(0,F.jsx)(I,{spec:m}):(0,F.jsx)(`div`,{style:{color:`#6b7280`},children:`Belum ada hasil`})}),(0,F.jsxs)(`div`,{style:{display:`flex`,justifyContent:`space-between`,alignItems:`center`},children:[(0,F.jsx)(`div`,{style:{fontWeight:700,fontSize:16},children:`React Code`}),(0,F.jsxs)(`div`,{style:{display:`flex`,gap:8},children:[(0,F.jsx)(`button`,{type:`button`,onClick:S,disabled:!g,style:{padding:`6px 12px`,borderRadius:8,border:v?`1px solid #16a34a`:`1px solid #6b7280`,background:v?`#dcfce7`:`#ffffff`,color:v?`#16a34a`:`#374151`,cursor:g?`pointer`:`not-allowed`,fontSize:12},children:v?`Copied!`:`Copy`}),(0,F.jsx)(`button`,{type:`button`,onClick:w,disabled:!g,style:{padding:`6px 12px`,borderRadius:8,border:`1px solid #059669`,background:`#059669`,color:`#ffffff`,cursor:g?`pointer`:`not-allowed`,fontSize:12},children:`Save to File`}),(0,F.jsx)(`button`,{type:`button`,onClick:C,disabled:!g,style:{padding:`6px 12px`,borderRadius:8,border:`1px solid #111827`,background:`#111827`,color:`#ffffff`,cursor:g?`pointer`:`not-allowed`,fontSize:12},children:`Download`})]})]}),(0,F.jsx)(`textarea`,{value:g,readOnly:!0,rows:12,style:{padding:12,borderRadius:12,border:`1px solid #d1d5db`,fontFamily:`ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace`,fontSize:12}})]})]})}e(document.getElementById(`root`)).render((0,F.jsx)(`div`,{style:{minHeight:`100vh`,padding:24,background:`#0b1220`},children:(0,F.jsx)(`div`,{style:{maxWidth:1100,margin:`0 auto`,background:`#fff`,padding:16,borderRadius:16},children:(0,F.jsx)(ee,{provider:`gemini`,model:`gemini-3-flash-preview`})})}));