@chaibuilder/pages 0.16.7 → 0.16.9

package/dist/ai-panel-other-lang-CQVkWTd3.js

@@ -1,150 +0,0 @@
-import { jsxs as a, Fragment as H, jsx as e } from "react/jsx-runtime";
-import { aj as L } from "./index-DdQbaicX.js";
-import { useTranslation as Q, useSelectedBlock as X, useI18nBlocks as Y, useStreamMultipleBlocksProps as Z } from "@chaibuilder/sdk";
-import { Bot as $, InfoIcon as ee, Plus as te } from "lucide-react";
-import { lazy as g, useRef as se, useEffect as ae, Suspense as f } from "react";
-import { g as oe } from "./prompt-helper-D0QRFyFX.js";
-const re = g(() => import("./ai-panel-message-bubble-DPAaAMAZ.js")), ne = g(() => import("./ai-translation-prompt-B8VdHfLY.js")), le = g(() => import("./ai-prompt-input-C3TnCYfz.js")), fe = ({
-  fetch: P,
-  input: l,
-  messages: c,
-  setInput: x,
-  isLoading: o,
-  handleStop: j,
-  handleReset: I,
-  setMessages: b,
-  setIsLoading: d,
-  selectedLang: i,
-  currentBlock: O,
-  fallbackLang: R,
-  abortController: u,
-  setAbortController: D,
-  forceNewConversation: m,
-  suggestNewConversation: F,
-  selectedModel: p = "google/gemini-2.5-flash",
-  onModelChange: z
-}) => {
-  const { t: s } = Q(), y = se(null), w = X(), N = Y(), M = Z(), U = () => {
-    var t;
-    (t = y.current) == null || t.scrollIntoView({ behavior: "smooth" });
-  };
-  ae(() => {
-    U();
-  }, [c, o]);
-  const v = async (t, r, _) => {
-    var S;
-    const k = (t == null ? void 0 : t.toLowerCase()) === "translate", T = {
-      id: Date.now().toString(),
-      role: "user",
-      content: oe({
-        fallbackLang: R,
-        userInput: r || t,
-        language: i,
-        blocks: k ? N() : N(i)
-      }),
-      userMessage: r || t || s("Translate the content")
-    };
-    d(!0);
-    const q = new AbortController();
-    D(q);
-    const C = { id: Date.now().toString(), role: "assistant", content: "" };
-    b((B) => [...B, T, C]), d(!0);
-    try {
-      const A = await P({ body: { action: "ASK_AI", data: {
-        messages: [T],
-        initiator: k ? "TRANSLATE_CONTENT" : "UPDATE_CONTENT",
-        model: _ || p
-      } }, streamResponse: !0 });
-      if (!A.ok)
-        throw new Error(s("Failed to get AI response"));
-      const E = (S = A.body) == null ? void 0 : S.getReader(), J = new TextDecoder();
-      let n = "";
-      if (!E) throw new Error(s("Response body is not readable"));
-      for (; ; ) {
-        const { done: V, value: W } = await E.read();
-        if (V)
-          break;
-        const G = J.decode(W, { stream: !0 });
-        n += G, b((h) => (h[h.length - 1].content = n, [...h]));
-      }
-      const K = JSON.parse(n == null ? void 0 : n.replace("```json", "").replace("```", ""));
-      M(K);
-    } catch {
-      u == null || u.abort();
-    } finally {
-      d(!1), x("");
-    }
-  };
-  return /* @__PURE__ */ a(H, { children: [
-    /* @__PURE__ */ e("div", { className: "py-2", children: /* @__PURE__ */ e(f, { fallback: /* @__PURE__ */ e("div", { children: s("Loading...") }), children: /* @__PURE__ */ e(
-      ne,
-      {
-        isLoading: o,
-        selectedBlock: w,
-        selectedLang: i,
-        onClick: v
-      }
-    ) }) }),
-    /* @__PURE__ */ a("div", { className: "flex-1 space-y-3 overflow-y-auto py-4", children: [
-      c.length === 0 && /* @__PURE__ */ a("div", { className: "flex-1 space-y-3 overflow-y-auto py-4", children: [
-        /* @__PURE__ */ a("div", { className: "mx-auto mt-8 text-center text-gray-500", children: [
-          /* @__PURE__ */ e($, { size: 48, className: "mx-auto mb-4 text-gray-300" }),
-          /* @__PURE__ */ e("p", { className: "mx-auto max-w-[75%] text-sm", children: s("Start a conversation with the AI assistant to translate/edit your content") })
-        ] }),
-        /* @__PURE__ */ a("div", { className: "relative rounded-lg border px-3 py-2 text-sm text-muted-foreground", children: [
-          /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ e(ee, { className: "h-3 w-3" }),
-            /* @__PURE__ */ e("span", { className: "text-xs", children: s(
-              "Only content can be edited in secondary languages. To edit layout, styles and more, switch to the default language."
-            ) })
-          ] }),
-          /* @__PURE__ */ e("div", { className: "mt-1", children: /* @__PURE__ */ e(L, { showAdd: !1, variant: "outline", goToDefaultLang: !0 }) })
-        ] })
-      ] }),
-      c.map(
-        (t, r) => t.role !== "system" && /* @__PURE__ */ e(f, { fallback: /* @__PURE__ */ e("div", { children: s("Loading...") }), children: /* @__PURE__ */ e(
-          re,
-          {
-            message: t,
-            isUser: t.role === "user",
-            isLoading: t.role === "assistant" && o && r === c.length - 1
-          }
-        ) }, r)
-      ),
-      F && !o && /* @__PURE__ */ e(
-        "button",
-        {
-          onClick: I,
-          className: "flex w-full items-center justify-center gap-2 rounded-lg border border-blue-200 bg-blue-50 p-1.5 text-left transition-colors hover:bg-blue-100",
-          children: /* @__PURE__ */ e("div", { className: "flex flex-col", children: /* @__PURE__ */ a("span", { className: "flex items-center gap-1 text-xs font-medium text-blue-700", children: [
-            /* @__PURE__ */ e(te, { className: "h-4 w-4 capitalize text-blue-600" }),
-            m ? s("Start ") : "",
-            " ",
-            s("New Conversation"),
-            " ",
-            !m && /* @__PURE__ */ e("span", { className: "text-[10px] font-extralight text-blue-600", children: s("For best results") })
-          ] }) })
-        }
-      ),
-      /* @__PURE__ */ e("div", { ref: y })
-    ] }),
-    !m && /* @__PURE__ */ e("div", { className: "border-gray-200 pb-2", children: /* @__PURE__ */ e(f, { fallback: /* @__PURE__ */ e("div", { children: s("Loading...") }), children: /* @__PURE__ */ e(
-      le,
-      {
-        input: l,
-        setInput: x,
-        onSend: v,
-        onStop: j,
-        isLoading: o,
-        selectedLang: i,
-        currentBlock: w || O,
-        disabled: (l == null ? void 0 : l.length) === 0,
-        selectedModel: p,
-        onModelChange: z
-      }
-    ) }) })
-  ] });
-};
-export {
-  fe as default
-};

package/dist/ai-panel-quick-prompts-BfMsNuRu.js

@@ -1,46 +0,0 @@
-import { jsxs as s, Fragment as d, jsx as a } from "react/jsx-runtime";
-import { useTranslation as h, mergeClasses as c } from "@chaibuilder/sdk";
-import { ChevronsUpDown as f } from "lucide-react";
-import { useState as x } from "react";
-import { L as N, U as w, A as g } from "./prompt-helper-D0QRFyFX.js";
-const E = ({ onSelect: p, currentBlock: e, selectedLang: r }) => {
-  const { t } = h(), [o, i] = x(!1), l = r ? N : e ? w : g;
-  return /* @__PURE__ */ s(d, { children: [
-    /* @__PURE__ */ s(
-      "div",
-      {
-        onClick: () => i(!o),
-        className: c(
-          "flex h-6 w-full cursor-pointer items-center justify-between gap-2 px-2",
-          e ? "bg-green-50/80 text-green-500 hover:bg-green-50" : "bg-primary/5 text-primary hover:bg-primary/10"
-        ),
-        children: [
-          /* @__PURE__ */ a("span", { className: "truncate whitespace-nowrap text-xs font-medium leading-none", children: e ? /* @__PURE__ */ s("span", { children: [
-            /* @__PURE__ */ a("span", { className: "font-extralight", children: t(r ? "Edit Content:" : "Edit:") }),
-            " ",
-            e._name || e._type
-          ] }) : t("Quick Prompts") }),
-          /* @__PURE__ */ a(f, { className: "h-3 w-3" })
-        ]
-      }
-    ),
-    o && /* @__PURE__ */ a("div", { className: "max-h-60 w-full overflow-y-auto bg-white px-1 pb-1", children: l.map((n, m) => /* @__PURE__ */ a(
-      "div",
-      {
-        className: "flex cursor-pointer items-center gap-x-1 p-1 text-xs leading-none hover:text-blue-700",
-        onClick: () => {
-          p(`${t(r || e ? "Update" : "Add New")} ${n.label}`, n.prompt), i(!1);
-        },
-        children: /* @__PURE__ */ s("span", { className: "truncate whitespace-nowrap", children: [
-          e ? null : /* @__PURE__ */ a("span", { className: "font-thin text-muted-foreground", children: t("Add New") }),
-          " ",
-          n.label
-        ] })
-      },
-      m
-    )) })
-  ] });
-};
-export {
-  E as default
-};

package/dist/ai-panel-quick-prompts-CGKAAn9A.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("@chaibuilder/sdk"),m=require("lucide-react"),x=require("react"),r=require("./prompt-helper-DIy7u3rt.cjs"),u=({onSelect:p,currentBlock:s,selectedLang:a})=>{const{t}=l.useTranslation(),[i,o]=x.useState(!1),c=a?r.LANGUAGE_CONTENT_ACTIONS:s?r.UPDATE_ACTIONS:r.ADD_NEW_SECTIONS;return e.jsxs(e.Fragment,{children:[e.jsxs("div",{onClick:()=>o(!i),className:l.mergeClasses("flex h-6 w-full cursor-pointer items-center justify-between gap-2 px-2",s?"bg-green-50/80 text-green-500 hover:bg-green-50":"bg-primary/5 text-primary hover:bg-primary/10"),children:[e.jsx("span",{className:"truncate whitespace-nowrap text-xs font-medium leading-none",children:s?e.jsxs("span",{children:[e.jsx("span",{className:"font-extralight",children:t(a?"Edit Content:":"Edit:")})," ",s._name||s._type]}):t("Quick Prompts")}),e.jsx(m.ChevronsUpDown,{className:"h-3 w-3"})]}),i&&e.jsx("div",{className:"max-h-60 w-full overflow-y-auto bg-white px-1 pb-1",children:c.map((n,d)=>e.jsx("div",{className:"flex cursor-pointer items-center gap-x-1 p-1 text-xs leading-none hover:text-blue-700",onClick:()=>{p(`${t(a||s?"Update":"Add New")} ${n.label}`,n.prompt),o(!1)},children:e.jsxs("span",{className:"truncate whitespace-nowrap",children:[s?null:e.jsx("span",{className:"font-thin text-muted-foreground",children:t("Add New")})," ",n.label]})},d))})]})};exports.default=u;

package/dist/ai-prompt-input-C3TnCYfz.js

@@ -1,222 +0,0 @@
-import { jsxs as n, jsx as t } from "react/jsx-runtime";
-import { useTranslation as C } from "@chaibuilder/sdk";
-import { Zap as P, X as F, Paperclip as H, Square as O, Send as U } from "lucide-react";
-import { lazy as q, useRef as T, useState as D, useEffect as A } from "react";
-import { DropdownMenu as Q, DropdownMenuTrigger as W, DropdownMenuContent as X, DropdownMenuItem as Y } from "@chaibuilder/sdk/ui";
-const b = [
-  {
-    id: "google/gemini-2.5-flash",
-    name: "Gemini 2.5 Flash",
-    creditsPer1000Tokens: 1
-  },
-  {
-    id: "openai/gpt-5",
-    name: "GPT-5",
-    creditsPer1000Tokens: 3
-  },
-  {
-    id: "openai/gpt-4o",
-    name: "GPT-4o",
-    creditsPer1000Tokens: 2.5
-  },
-  {
-    id: "anthropic/claude-3-5-haiku-20241022",
-    name: "Haiku 4.5",
-    creditsPer1000Tokens: 1.5
-  },
-  {
-    id: "anthropic/claude-3-5-sonnet-20241022",
-    name: "Sonnet 4.5",
-    creditsPer1000Tokens: 2.8
-  },
-  {
-    id: "anthropic/claude-3-5-sonnet-20240620",
-    name: "Sonnet 4",
-    creditsPer1000Tokens: 2.5
-  },
-  {
-    id: "google/gemini-pro",
-    name: "Gemini Pro",
-    creditsPer1000Tokens: 1.2
-  },
-  {
-    id: "xai/grok-4",
-    name: "Grok 4",
-    creditsPer1000Tokens: 2.2
-  }
-], Z = (r) => `${Math.ceil(r)}x`, B = ({ selectedModel: r, onModelChange: c, disabled: d }) => {
-  const x = b.find((a) => a.id === r) || b[0], o = (a) => {
-    c(a);
-  };
-  return /* @__PURE__ */ n(Q, { children: [
-    /* @__PURE__ */ t(W, { asChild: !0, children: /* @__PURE__ */ n(
-      "button",
-      {
-        type: "button",
-        disabled: d,
-        className: `flex !hidden items-center gap-1 rounded border border-gray-200 bg-white px-2 py-1 text-xs transition-colors ${d ? "cursor-not-allowed opacity-50" : "cursor-pointer hover:border-gray-300"}`,
-        children: [
-          /* @__PURE__ */ t(P, { className: "h-3 w-3 text-blue-500" }),
-          /* @__PURE__ */ t("span", { className: "max-w-20 truncate font-medium", children: x.name })
-        ]
-      }
-    ) }),
-    /* @__PURE__ */ t(X, { className: "w-64", align: "start", children: b.map((a) => /* @__PURE__ */ n(
-      Y,
-      {
-        onClick: () => o(a.id),
-        className: `flex items-center justify-between ${r === a.id ? "bg-blue-50" : ""}`,
-        children: [
-          /* @__PURE__ */ t("span", { className: "text-sm font-medium", children: a.name }),
-          /* @__PURE__ */ n("div", { className: "flex items-center gap-1", children: [
-            /* @__PURE__ */ t(P, { className: "h-3 w-3 text-blue-500" }),
-            /* @__PURE__ */ t("span", { className: "text-xs font-medium text-gray-700", children: Z(a.creditsPer1000Tokens) })
-          ] })
-        ]
-      },
-      a.id
-    )) })
-  ] });
-}, J = q(() => import("./ai-panel-quick-prompts-BfMsNuRu.js")), I = "chai-ai-selected-model", ae = ({
-  input: r,
-  setInput: c,
-  onSend: d,
-  onStop: x,
-  isLoading: o,
-  disabled: a,
-  currentBlock: w,
-  selectedLang: s,
-  selectedModel: G = "google/gemini-2.5-flash",
-  onModelChange: i
-}) => {
-  const { t: l } = C(), f = T(null), v = T(null), [m, p] = D(null), [g, y] = D(G);
-  A(() => {
-    if (!s) {
-      const e = localStorage.getItem(I);
-      e && (y(e), i == null || i(e));
-    }
-  }, [s, i]);
-  const M = (e) => {
-    y(e), i == null || i(e), s || localStorage.setItem(I, e);
-  }, R = (e) => {
-    e.key === "Enter" && !e.shiftKey && (e.preventDefault(), r.trim() && !o && (d(r == null ? void 0 : r.trim(), void 0, m || void 0, g), p(null)));
-  }, $ = () => {
-    const e = f.current;
-    e && (e.style.height = "auto", e.style.height = Math.min(e.scrollHeight, 120) + "px");
-  }, j = (e) => {
-    var h;
-    const u = (h = e.target.files) == null ? void 0 : h[0];
-    if (u && u.type.startsWith("image/")) {
-      const k = new FileReader();
-      k.onload = (K) => {
-        var N, S;
-        const _ = (N = K.target) == null ? void 0 : N.result;
-        p(_), c(l("Generate UI based on given image ")), (S = f.current) == null || S.focus();
-      }, k.readAsDataURL(u);
-    }
-    e.target.value = "";
-  }, z = () => {
-    var e;
-    (e = v.current) == null || e.click();
-  }, E = () => {
-    d(r == null ? void 0 : r.trim(), void 0, m || void 0, g), p(null);
-  };
-  return A(() => {
-    $();
-  }, [r]), /* @__PURE__ */ n("div", { className: "relative", children: [
-    !m && !(s && !w) && /* @__PURE__ */ t(
-      "div",
-      {
-        className: `mx-auto flex w-full max-w-[95%] flex-col items-center overflow-hidden rounded-t-md border-x border-t border-gray-200 ${o ? "pointer-events-none opacity-50" : ""}`,
-        children: /* @__PURE__ */ t(
-          J,
-          {
-            currentBlock: w,
-            selectedLang: s,
-            onSelect: (e, u) => {
-              var h;
-              c(u + " "), (h = f.current) == null || h.focus();
-            }
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ n("div", { className: "rounded-lg border border-gray-200 bg-white", children: [
-      m && /* @__PURE__ */ n("div", { className: "relative flex w-max items-center justify-start gap-x-2 px-2 pt-2", children: [
-        /* @__PURE__ */ t("img", { src: m, alt: "Selected attachment", className: "max-h-16 max-w-full rounded-md border" }),
-        /* @__PURE__ */ t(
-          "button",
-          {
-            onClick: () => p(null),
-            className: "absolute -right-0 -top-0 flex items-center rounded-full bg-red-400 p-1 text-xs text-white hover:bg-red-500",
-            title: l("Remove image"),
-            children: /* @__PURE__ */ t(F, { className: "h-2 w-2" })
-          }
-        )
-      ] }),
-      /* @__PURE__ */ t(
-        "textarea",
-        {
-          ref: f,
-          value: r,
-          onChange: (e) => c(e.target.value),
-          onKeyDown: R,
-          placeholder: l(s ? "Ask to update content" : "Ask me anything..."),
-          className: `max-h-[200px] min-h-[60px] w-full resize-none rounded-lg border-none px-3 py-2 text-sm outline-none ${o ? "cursor-not-allowed opacity-50" : ""}`,
-          rows: 3,
-          disabled: o
-        }
-      ),
-      /* @__PURE__ */ n("div", { className: "flex items-center justify-between p-2", children: [
-        s ? /* @__PURE__ */ t("div", {}) : /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ t(
-            "button",
-            {
-              disabled: o,
-              onClick: z,
-              className: `p-1.5 text-gray-400 hover:text-gray-500 ${o || s ? "cursor-not-allowed opacity-50" : ""}`,
-              title: l("Attach Image"),
-              children: /* @__PURE__ */ t(H, { size: 16 })
-            }
-          ),
-          /* @__PURE__ */ t(B, { selectedModel: g, onModelChange: M, disabled: o })
-        ] }),
-        /* @__PURE__ */ t(
-          "input",
-          {
-            disabled: o,
-            ref: v,
-            type: "file",
-            accept: "image/*",
-            onChange: j,
-            className: "hidden"
-          }
-        ),
-        o ? /* @__PURE__ */ n(
-          "button",
-          {
-            onClick: x,
-            className: "z-50 flex items-center gap-x-1 rounded-md bg-red-500 p-1.5 text-white transition-colors hover:bg-red-600",
-            title: l("Stop generation"),
-            children: [
-              /* @__PURE__ */ t(O, { size: 16 }),
-              " ",
-              /* @__PURE__ */ t("span", { className: "text-xs", children: l("Stop") })
-            ]
-          }
-        ) : /* @__PURE__ */ t(
-          "button",
-          {
-            onClick: E,
-            disabled: !r.trim() || a,
-            className: `rounded-md bg-blue-500 p-1.5 text-white ${!r.trim() || a ? "cursor-not-allowed opacity-50" : "transition-colors hover:bg-blue-600"}`,
-            children: /* @__PURE__ */ t(U, { size: 16 })
-          }
-        )
-      ] })
-    ] })
-  ] });
-};
-export {
-  ae as default
-};

package/dist/ai-prompt-input-CffQQOKA.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),z=require("@chaibuilder/sdk"),d=require("lucide-react"),l=require("react"),g=require("@chaibuilder/sdk/ui"),v=[{id:"google/gemini-2.5-flash",name:"Gemini 2.5 Flash",creditsPer1000Tokens:1},{id:"openai/gpt-5",name:"GPT-5",creditsPer1000Tokens:3},{id:"openai/gpt-4o",name:"GPT-4o",creditsPer1000Tokens:2.5},{id:"anthropic/claude-3-5-haiku-20241022",name:"Haiku 4.5",creditsPer1000Tokens:1.5},{id:"anthropic/claude-3-5-sonnet-20241022",name:"Sonnet 4.5",creditsPer1000Tokens:2.8},{id:"anthropic/claude-3-5-sonnet-20240620",name:"Sonnet 4",creditsPer1000Tokens:2.5},{id:"google/gemini-pro",name:"Gemini Pro",creditsPer1000Tokens:1.2},{id:"xai/grok-4",name:"Grok 4",creditsPer1000Tokens:2.2}],K=s=>`${Math.ceil(s)}x`,O=({selectedModel:s,onModelChange:c,disabled:m})=>{const b=v.find(r=>r.id===s)||v[0],a=r=>{c(r)};return e.jsxs(g.DropdownMenu,{children:[e.jsx(g.DropdownMenuTrigger,{asChild:!0,children:e.jsxs("button",{type:"button",disabled:m,className:`flex !hidden items-center gap-1 rounded border border-gray-200 bg-white px-2 py-1 text-xs transition-colors ${m?"cursor-not-allowed opacity-50":"cursor-pointer hover:border-gray-300"}`,children:[e.jsx(d.Zap,{className:"h-3 w-3 text-blue-500"}),e.jsx("span",{className:"max-w-20 truncate font-medium",children:b.name})]})}),e.jsx(g.DropdownMenuContent,{className:"w-64",align:"start",children:v.map(r=>e.jsxs(g.DropdownMenuItem,{onClick:()=>a(r.id),className:`flex items-center justify-between ${s===r.id?"bg-blue-50":""}`,children:[e.jsx("span",{className:"text-sm font-medium",children:r.name}),e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx(d.Zap,{className:"h-3 w-3 text-blue-500"}),e.jsx("span",{className:"text-xs font-medium text-gray-700",children:K(r.creditsPer1000Tokens)})]})]},r.id))})]})},_=l.lazy(()=>Promise.resolve().then(()=>require("./ai-panel-quick-prompts-CGKAAn9A.cjs"))),T="chai-ai-selected-model",C=({input:s,setInput:c,onSend:m,onStop:b,isLoading:a,disabled:r,currentBlock:w,selectedLang:n,selectedModel:R="google/gemini-2.5-flash",onModelChange:o})=>{const{t:i}=z.useTranslation(),f=l.useRef(null),y=l.useRef(null),[u,p]=l.useState(null),[j,k]=l.useState(R);l.useEffect(()=>{if(!n){const t=localStorage.getItem(T);t&&(k(t),o==null||o(t))}},[n,o]);const D=t=>{k(t),o==null||o(t),n||localStorage.setItem(T,t)},A=t=>{t.key==="Enter"&&!t.shiftKey&&(t.preventDefault(),s.trim()&&!a&&(m(s==null?void 0:s.trim(),void 0,u||void 0,j),p(null)))},I=()=>{const t=f.current;t&&(t.style.height="auto",t.style.height=Math.min(t.scrollHeight,120)+"px")},M=t=>{var h;const x=(h=t.target.files)==null?void 0:h[0];if(x&&x.type.startsWith("image/")){const N=new FileReader;N.onload=G=>{var S,P;const $=(S=G.target)==null?void 0:S.result;p($),c(i("Generate UI based on given image ")),(P=f.current)==null||P.focus()},N.readAsDataURL(x)}t.target.value=""},q=()=>{var t;(t=y.current)==null||t.click()},E=()=>{m(s==null?void 0:s.trim(),void 0,u||void 0,j),p(null)};return l.useEffect(()=>{I()},[s]),e.jsxs("div",{className:"relative",children:[!u&&!(n&&!w)&&e.jsx("div",{className:`mx-auto flex w-full max-w-[95%] flex-col items-center overflow-hidden rounded-t-md border-x border-t border-gray-200 ${a?"pointer-events-none opacity-50":""}`,children:e.jsx(_,{currentBlock:w,selectedLang:n,onSelect:(t,x)=>{var h;c(x+" "),(h=f.current)==null||h.focus()}})}),e.jsxs("div",{className:"rounded-lg border border-gray-200 bg-white",children:[u&&e.jsxs("div",{className:"relative flex w-max items-center justify-start gap-x-2 px-2 pt-2",children:[e.jsx("img",{src:u,alt:"Selected attachment",className:"max-h-16 max-w-full rounded-md border"}),e.jsx("button",{onClick:()=>p(null),className:"absolute -right-0 -top-0 flex items-center rounded-full bg-red-400 p-1 text-xs text-white hover:bg-red-500",title:i("Remove image"),children:e.jsx(d.X,{className:"h-2 w-2"})})]}),e.jsx("textarea",{ref:f,value:s,onChange:t=>c(t.target.value),onKeyDown:A,placeholder:i(n?"Ask to update content":"Ask me anything..."),className:`max-h-[200px] min-h-[60px] w-full resize-none rounded-lg border-none px-3 py-2 text-sm outline-none ${a?"cursor-not-allowed opacity-50":""}`,rows:3,disabled:a}),e.jsxs("div",{className:"flex items-center justify-between p-2",children:[n?e.jsx("div",{}):e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("button",{disabled:a,onClick:q,className:`p-1.5 text-gray-400 hover:text-gray-500 ${a||n?"cursor-not-allowed opacity-50":""}`,title:i("Attach Image"),children:e.jsx(d.Paperclip,{size:16})}),e.jsx(O,{selectedModel:j,onModelChange:D,disabled:a})]}),e.jsx("input",{disabled:a,ref:y,type:"file",accept:"image/*",onChange:M,className:"hidden"}),a?e.jsxs("button",{onClick:b,className:"z-50 flex items-center gap-x-1 rounded-md bg-red-500 p-1.5 text-white transition-colors hover:bg-red-600",title:i("Stop generation"),children:[e.jsx(d.Square,{size:16})," ",e.jsx("span",{className:"text-xs",children:i("Stop")})]}):e.jsx("button",{onClick:E,disabled:!s.trim()||r,className:`rounded-md bg-blue-500 p-1.5 text-white ${!s.trim()||r?"cursor-not-allowed opacity-50":"transition-colors hover:bg-blue-600"}`,children:e.jsx(d.Send,{size:16})})]})]})]})};exports.default=C;