> ## Documentation Index > Fetch the complete documentation index at: https://docs.replit.com/llms.txt > Use this file to discover all available pages before exploring further. # Éditeur de projet > Découvrez ce qu'est l'éditeur de projet : votre base sur Replit où vous parlez à Agent, voyez votre application prendre forme et gérez tout. export const AgentCarousel = ({correctChoice = ""}) => { const outputTypes = [{ name: "Web", iconSvg: '' }, { name: "Mobile", iconSvg: '' }, { name: "Slides", iconSvg: '' }, { name: "Animation", iconSvg: '' }, { name: "Design", iconSvg: '' }, { name: "Data Visualization", iconSvg: '' }, { name: "Automation", iconSvg: '' }, { name: "3D Game", iconSvg: '' }, { name: "Document", iconSvg: '' }, { name: "Spreadsheet", iconSvg: '' }]; const ITEMS_PER_PAGE = 5; const ITEM_WIDTH = 96; const VISIBLE_WIDTH = ITEMS_PER_PAGE * ITEM_WIDTH; const trackId = "ac-carousel-track"; const checkSvg = ''; const updateHint = selectedName => { const hintEl = document.getElementById("ac-carousel-hint"); if (!hintEl || !correctChoice) return; if (!selectedName) { hintEl.innerHTML = ""; return; } if (selectedName === correctChoice) { hintEl.innerHTML = `Great choice!`; } else { hintEl.innerHTML = `You can build anything you want! For this quickstart, try selecting ${correctChoice}.`; } }; const toggleOutputType = name => { const btn = document.querySelector(`.agent-carousel-wrap [data-option-name="${name}"]`); const pillsContainer = document.getElementById("agent-input-pills"); if (!btn) return; const isSelected = btn.dataset.selected === "true"; const type = outputTypes.find(t => t.name === name); if (isSelected) { btn.dataset.selected = "false"; btn.style.background = "var(--ai-option-bg)"; const iconEl = btn.querySelector(".option-icon"); if (iconEl && type) iconEl.innerHTML = type.iconSvg; if (pillsContainer) { const pill = document.getElementById(`pill-${name}`); if (pill) pill.remove(); } updateHint(null); } else { document.querySelectorAll('[data-option-name][data-selected="true"]').forEach(prevBtn => { const prevName = prevBtn.dataset.optionName; prevBtn.dataset.selected = "false"; prevBtn.style.background = "var(--ai-option-bg)"; const prevIconEl = prevBtn.querySelector(".option-icon"); const prevType = outputTypes.find(t => t.name === prevName); if (prevIconEl && prevType) prevIconEl.innerHTML = prevType.iconSvg; if (pillsContainer) { const prevPill = document.getElementById(`pill-${prevName}`); if (prevPill) prevPill.remove(); } }); btn.dataset.selected = "true"; btn.style.background = "var(--ai-option-selected-bg)"; const iconEl = btn.querySelector(".option-icon"); if (iconEl) iconEl.innerHTML = checkSvg; if (pillsContainer && type) { const pill = document.createElement("span"); pill.id = `pill-${name}`; pill.style.cssText = "display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 8px 0 8px;border-radius:32px;background:var(--ai-pill-bg);color:var(--ai-pill-text);font-size:14px;white-space:nowrap;cursor:default;"; pill.innerHTML = `${type.iconSvg.replace(/]*>/, "").replace("", "")}${name}`; pill.querySelector(`[data-pill-remove="${name}"]`).addEventListener("click", () => toggleOutputType(name)); pillsContainer.appendChild(pill); } updateHint(name); } }; const slideCarousel = direction => { const track = document.getElementById(trackId); if (!track) return; const currentPage = parseInt(track.dataset.page || "0", 10); const totalPages = Math.ceil(outputTypes.length / ITEMS_PER_PAGE); let newPage = currentPage + direction; if (newPage < 0) newPage = totalPages - 1; if (newPage >= totalPages) newPage = 0; track.dataset.page = String(newPage); track.style.transform = `translateX(-${newPage * ITEMS_PER_PAGE * ITEM_WIDTH}px)`; }; if (typeof document !== "undefined" && !document.getElementById("agent-carousel-styles")) { const style = document.createElement("style"); style.id = "agent-carousel-styles"; style.textContent = ` .agent-carousel-wrap { --ai-option-bg: var(--replit-docs-bg-muted, #F1F1EE); --ai-option-border: var(--replit-docs-border, #DEDAD5); --ai-option-hover-bg: var(--replit-docs-bg-elevated, #F1F1EE); --ai-option-selected-bg: var(--replit-docs-bg-elevated, #F1F1EE); --ai-text-secondary: var(--replit-docs-text-muted, #5C5C5C); --ai-icon-default: var(--replit-docs-text-subtle, #858585); --ai-icon-hover: var(--replit-docs-text-muted, #5C5C5C); } .dark .agent-carousel-wrap, html.dark .agent-carousel-wrap, [data-theme="dark"] .agent-carousel-wrap { --ai-option-bg: var(--replit-docs-bg-elevated, #222223); --ai-option-border: var(--replit-docs-border, #39393D); --ai-option-hover-bg: var(--replit-docs-bg-muted, #222223); --ai-option-selected-bg: var(--replit-docs-bg-muted, #222223); --ai-text-secondary: var(--replit-docs-text-muted, #B8B8BE); --ai-icon-default: var(--replit-docs-text-subtle, #8E8F97); --ai-icon-hover: var(--replit-docs-text-muted, #B8B8BE); } @keyframes agent-carousel-fade-in { from { transform: translateY(10px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } .agent-carousel-wrap .ac-option-btn[data-selected="true"] { background: var(--ai-option-selected-bg) !important; } .agent-carousel-wrap .ac-option-btn[data-correct="true"][data-selected="true"] { border-color: #22c55e !important; background: rgba(34, 197, 94, 0.08) !important; } @keyframes ac-hint-fade-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } } .agent-carousel-wrap .ac-hint { text-align: center; font-size: 13px; margin-top: 12px; animation: ac-hint-fade-in 200ms ease-out; } .agent-carousel-wrap .ac-hint-correct { color: #22c55e; } .agent-carousel-wrap .ac-hint-nudge { color: var(--ai-text-secondary); } @media (hover: hover) { .agent-carousel-wrap .ac-option-btn:not([data-selected="true"]):hover { background: var(--ai-option-hover-bg); } .agent-carousel-wrap .ac-nav-btn:hover svg { color: var(--ai-icon-hover); } } .agent-carousel-wrap { overflow: hidden; box-sizing: border-box; } `; document.head.appendChild(style); } const ArrowLeftIcon = ; const ArrowRightIcon = ; const optionIconStyle = { display: "flex", alignItems: "center", justifyContent: "center", width: "48px", height: "48px", border: "1px solid var(--ai-option-border)", borderRadius: "12px", background: "var(--ai-option-bg)", cursor: "pointer", color: "var(--ai-text-secondary)", padding: 0, transition: "background 120ms ease-out", flexShrink: 0 }; return
{outputTypes.map(type =>
{type.name}
)}
{correctChoice && }
; }; export const AgentInput = ({defaultPrompt = "", highlightPlan = false, highlightStart = false, showTypewriter = true}) => { const AGENT_INPUT_TYPEWRITER_SCRIPT_ID = "replit-docs-typewriter-core"; const AGENT_INPUT_TYPEWRITER_SRC = "https://unpkg.com/typewriter-effect@2.18.2/dist/core.js"; const AGENT_INPUT_TYPEWRITER_PROMPTS = ["Build a project tracker for my team", "Design a landing page for my coffee shop", "Add Stripe payments to my app"]; const AGENT_INPUT_TYPING_SPEED = 40; const AGENT_INPUT_DELETE_SPEED = 20; const AGENT_INPUT_PAUSE_AFTER = 2000; const AGENT_INPUT_START_DELAY = 500; const getAgentInputTypewriterLoader = () => { if (typeof window === "undefined") { return null; } if (!window.__replitDocsAgentInputTypewriterLoader) { window.__replitDocsAgentInputTypewriterLoader = {}; } return window.__replitDocsAgentInputTypewriterLoader; }; const ensureAgentInputTypewriterCore = () => { if (typeof window === "undefined" || typeof document === "undefined") { return Promise.resolve(null); } if (window.Typewriter) { return Promise.resolve(window.Typewriter); } const loader = getAgentInputTypewriterLoader(); if (loader.promise) { return loader.promise; } loader.promise = new Promise((resolve, reject) => { const handleLoad = () => { if (window.Typewriter) { resolve(window.Typewriter); return; } loader.promise = null; reject(new Error("Typewriter core loaded without a global Typewriter export.")); }; const handleError = () => { loader.promise = null; reject(new Error("Failed to load typewriter core.")); }; const existingScript = document.getElementById(AGENT_INPUT_TYPEWRITER_SCRIPT_ID); if (existingScript) { existingScript.addEventListener("load", handleLoad, { once: true }); existingScript.addEventListener("error", handleError, { once: true }); return; } const script = document.createElement("script"); script.id = AGENT_INPUT_TYPEWRITER_SCRIPT_ID; script.src = AGENT_INPUT_TYPEWRITER_SRC; script.async = true; script.addEventListener("load", handleLoad, { once: true }); script.addEventListener("error", handleError, { once: true }); document.head.appendChild(script); }); return loader.promise; }; const getAgentInputTypewriterRegistry = () => { if (typeof window === "undefined") { return null; } if (!window.__replitDocsAgentInputTypewriters) { window.__replitDocsAgentInputTypewriters = new WeakMap(); } return window.__replitDocsAgentInputTypewriters; }; const findAgentInputContainer = node => node?.closest?.("[data-agent-input-container]") || null; const getAgentInputElements = container => ({ textarea: container?.querySelector?.('[data-agent-input-role="textarea"]') || null, startButton: container?.querySelector?.('[data-agent-input-role="start-button"]') || null, pillsContainer: container?.querySelector?.('[data-agent-input-role="pills"]') || null }); const getAgentInputPromptValue = container => { const {textarea} = getAgentInputElements(container); return textarea?.value?.trim() || ""; }; const updateAgentInputButtonState = container => { const {startButton} = getAgentInputElements(container); if (!startButton) { return; } const hasText = getAgentInputPromptValue(container).length > 0; startButton.style.opacity = hasText ? "1" : "0.4"; startButton.style.cursor = hasText ? "pointer" : "not-allowed"; }; const stopAgentInputTypewriter = (textarea, {placeholder, clearDemo = false} = {}) => { if (typeof window === "undefined" || !textarea) { return; } const registry = getAgentInputTypewriterRegistry(); const record = registry?.get(textarea); if (!record) { if (placeholder) { textarea.setAttribute("placeholder", placeholder); } return; } record.stopped = true; if (record.startTimer) { window.clearTimeout(record.startTimer); } if (record.writeFrame) { window.cancelAnimationFrame(record.writeFrame); } if (record.typewriter?.stop) { record.typewriter.stop(); } textarea.removeEventListener("focus", record.handleFocus); textarea.removeEventListener("pointerdown", record.handlePointerDown); textarea.removeEventListener("input", record.handleInput); if (clearDemo && textarea.value === record.pendingValue) { textarea.value = ""; } textarea.setAttribute("placeholder", placeholder || ""); updateAgentInputButtonState(record.container); registry.delete(textarea); }; const startAgentInputTypewriter = (container, {defaultPrompt, placeholder, showTypewriter}) => { if (typeof window === "undefined" || typeof document === "undefined" || !container) { return; } const {textarea} = getAgentInputElements(container); if (!textarea) { return; } if (!showTypewriter || defaultPrompt) { stopAgentInputTypewriter(textarea, { placeholder }); textarea.setAttribute("placeholder", placeholder); updateAgentInputButtonState(container); return; } const registry = getAgentInputTypewriterRegistry(); const existingRecord = registry.get(textarea); if (existingRecord && !existingRecord.stopped) { updateAgentInputButtonState(container); return; } textarea.setAttribute("placeholder", ""); if (textarea.value) { textarea.value = ""; } updateAgentInputButtonState(container); const record = { container, element: textarea, pendingValue: "", renderedValue: "", stopped: false, startTimer: null, writeFrame: null, typewriter: null, handleFocus: null, handlePointerDown: null, handleInput: null }; const queueValue = nextValue => { record.pendingValue = nextValue; if (record.writeFrame) { return; } record.writeFrame = window.requestAnimationFrame(() => { record.writeFrame = null; if (record.stopped || registry.get(textarea) !== record || !textarea.isConnected) { return; } if (textarea.value !== record.pendingValue) { textarea.value = record.pendingValue; } updateAgentInputButtonState(container); }); }; const stopDemo = () => { stopAgentInputTypewriter(textarea, { placeholder, clearDemo: true }); }; record.handleFocus = stopDemo; record.handlePointerDown = stopDemo; record.handleInput = stopDemo; registry.set(textarea, record); textarea.addEventListener("focus", record.handleFocus, { once: true }); textarea.addEventListener("pointerdown", record.handlePointerDown, { once: true }); textarea.addEventListener("input", record.handleInput, { once: true }); record.startTimer = window.setTimeout(() => { ensureAgentInputTypewriterCore().then(Typewriter => { if (!Typewriter || record.stopped || registry.get(textarea) !== record || !textarea.isConnected) { return; } const typewriter = new Typewriter(null, { loop: true, delay: AGENT_INPUT_TYPING_SPEED, deleteSpeed: AGENT_INPUT_DELETE_SPEED, cursor: "", skipAddStyles: true, wrapperClassName: "", cursorClassName: "", onCreateTextNode: character => { record.renderedValue += character; queueValue(record.renderedValue); return null; }, onRemoveNode: () => { record.renderedValue = record.renderedValue.slice(0, -1); queueValue(record.renderedValue); } }); AGENT_INPUT_TYPEWRITER_PROMPTS.forEach(prompt => { typewriter.typeString(prompt).pauseFor(AGENT_INPUT_PAUSE_AFTER).deleteAll(AGENT_INPUT_DELETE_SPEED).pauseFor(400); }); record.typewriter = typewriter; typewriter.start(); }).catch(() => { stopAgentInputTypewriter(textarea, { placeholder }); }); }, AGENT_INPUT_START_DELAY); }; if (typeof document !== "undefined" && !window.LZString) { const script = document.createElement("script"); script.src = "https://cdnjs.cloudflare.com/ajax/libs/lz-string/1.5.0/lz-string.min.js"; document.head.appendChild(script); } const placeholder = "Describe your idea, Replit will bring it to life..."; const outputTypes = [{ name: "Web", iconSvg: '', icon: }, { name: "Mobile", iconSvg: '', icon: }, { name: "Slides", iconSvg: '', icon: }, { name: "Animation", iconSvg: '', icon: }, { name: "Design", iconSvg: '', icon: }]; const checkSvg = ''; if (typeof document !== "undefined" && !document.getElementById("agent-input-styles")) { const style = document.createElement("style"); style.id = "agent-input-styles"; style.textContent = ` /* Theme variables - light mode */ [data-agent-input-container] { --ai-surface-bg: var(--replit-docs-bg, #F6F6F4); --ai-surface-higher: var(--replit-docs-bg-elevated, #F1F1EE); --ai-border-default: var(--replit-docs-border, #DEDAD5); --ai-border-strong: var(--replit-docs-border-strong, #CAC4BE); --ai-text-secondary: var(--replit-docs-text-muted, #5C5C5C); --ai-text-tertiary: var(--replit-docs-text-subtle, #858585); --ai-text-primary: var(--replit-docs-text, #1D1D1D); --ai-button-bg: var(--replit-docs-bg-muted, #F1F1EE); --ai-button-bg-hover: var(--replit-docs-bg-elevated, #F1F1EE); --ai-icon-default: var(--replit-docs-text-subtle, #858585); --ai-icon-hover: var(--replit-docs-text-muted, #5C5C5C); --ai-shadow: 0 2px 6px #00000005; --ai-option-bg: var(--replit-docs-bg-elevated, #F1F1EE); --ai-option-border: var(--replit-docs-border, #DEDAD5); --ai-option-hover-bg: var(--replit-docs-bg-muted, #F1F1EE); --ai-option-selected-bg: var(--replit-docs-bg-muted, #F1F1EE); --ai-pill-bg: #CDDCF1; --ai-pill-text: var(--replit-docs-text-muted, #5C5C5C); } /* Theme variables - dark mode */ .dark [data-agent-input-container], html.dark [data-agent-input-container], [data-theme="dark"] [data-agent-input-container] { --ai-surface-bg: var(--replit-docs-bg, #1E1E1F); --ai-surface-higher: var(--replit-docs-bg-elevated, #222223); --ai-border-default: var(--replit-docs-border, #39393D); --ai-border-strong: var(--replit-docs-border-strong, #4A4A50); --ai-text-secondary: var(--replit-docs-text-muted, #B8B8BE); --ai-text-tertiary: var(--replit-docs-text-subtle, #8E8F97); --ai-text-primary: var(--replit-docs-text, #F5F5F5); --ai-button-bg: var(--replit-docs-bg-elevated, #222223); --ai-button-bg-hover: var(--replit-docs-bg-muted, #222223); --ai-icon-default: var(--replit-docs-text-subtle, #8E8F97); --ai-icon-hover: var(--replit-docs-text-muted, #B8B8BE); --ai-shadow: 0 2px 6px #00000020; --ai-option-bg: var(--replit-docs-bg-elevated, #222223); --ai-option-border: var(--replit-docs-border, #39393D); --ai-option-hover-bg: var(--replit-docs-bg-muted, #222223); --ai-option-selected-bg: var(--replit-docs-bg-muted, #222223); --ai-pill-bg: #2A3A4D; --ai-pill-text: #D0D8E4; } .agent-input-container { box-sizing: border-box; } /* Entry animation */ @keyframes agent-input-fade-in-up { from { transform: translateY(10px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } /* Hover state for input box */ [data-agent-input-container]:has([data-agent-input-role="inner"]:hover) [data-agent-input-role="inner"] { border-color: #85C7FF !important; } /* Focus state for input box */ [data-agent-input-container]:has([data-agent-input-role="inner"]:focus-within) [data-agent-input-role="inner"] { border-color: #0079F2 !important; } /* Icon button hover */ @media (hover: hover) { [data-agent-input-container] .ai-icon-btn:hover { background: var(--ai-button-bg-hover); } [data-agent-input-container] .ai-icon-btn:hover svg { color: var(--ai-icon-hover); } [data-agent-input-container] .ai-option-btn:not([data-selected="true"]):hover { background: var(--ai-option-hover-bg); } [data-agent-input-container] .ai-plan-btn:hover { background: var(--ai-button-bg-hover); } [data-agent-input-container] .ai-nav-btn:hover svg { color: var(--ai-icon-hover); } [data-agent-input-container] .ai-pill-close:hover { opacity: 0.7; } } @keyframes plan-border-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } [data-agent-input-container] .ai-plan-wrap { position: relative; border-radius: 32px; padding: 2px; overflow: hidden; } [data-agent-input-container] .ai-plan-wrap::before { content: ''; position: absolute; inset: -50%; background: conic-gradient( #3b82f6, #8b5cf6, #ec4899, #f59e0b, #10b981, #3b82f6 ); animation: plan-border-spin 1s linear infinite; } [data-agent-input-container] .ai-plan-wrap .ai-plan-btn-highlight { position: relative; background: var(--ai-surface-higher); color: var(--ai-text-primary); font-weight: 400; border: none; border-radius: 32px; z-index: 1; } [data-agent-input-container] .ai-plan-wrap.ai-plan-off::before { animation: none; background: transparent; } [data-agent-input-container] .ai-plan-wrap.ai-plan-off .ai-plan-btn-highlight { background: var(--ai-button-bg); color: var(--ai-text-secondary); } /* Plan checkbox styles */ [data-agent-input-container] .ai-plan-checkbox-label { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 8px; border-radius: var(--border-radius-6, 6px); background: var(--ai-button-bg); cursor: pointer; font-size: 12px; font-family: inherit; color: var(--ai-text-secondary); transition: background 120ms ease-out; user-select: none; } @media (hover: hover) { [data-agent-input-container] .ai-plan-checkbox-label:hover { background: var(--ai-button-bg-hover); } } [data-agent-input-container] .ai-plan-checkbox-input { width: 20px; height: 20px; margin: 0; accent-color: #0079F2; cursor: pointer; } [data-agent-input-container] .ai-start-wrap { position: relative; display: inline-flex; padding: 3px; border-radius: 8px; overflow: hidden; } [data-agent-input-container] .ai-start-wrap::before { content: ''; position: absolute; inset: -50%; background: conic-gradient( #3b82f6, #8b5cf6, #ec4899, #f59e0b, #10b981, #3b82f6 ); animation: plan-border-spin 1s linear infinite; } [data-agent-input-container] .ai-start-wrap .ai-start-btn-highlight { position: relative; background: var(--ai-surface-higher); border: none; border-radius: 6px; z-index: 1; } `; document.head.appendChild(style); } const getLink = (container, promptOverride) => { if (typeof document === "undefined" || !window.LZString) return ""; const prompt = promptOverride || getAgentInputPromptValue(container); if (!prompt) return ""; const encoded = window.LZString.compressToEncodedURIComponent(prompt); const utm = "utm_source=replit-docs&utm_medium=docs&utm_campaign=docs-intro-agent-input&utm_content=homepage-prompt-box"; return `https://replit.com/?prompt=${encoded}&referrer=replit-docs&${utm}`; }; const handleStartClick = e => { e.preventDefault(); const container = findAgentInputContainer(e.currentTarget); const link = getLink(container); if (link) window.open(link, "_blank"); }; const toggleOutputType = name => { const btn = document.querySelector(`[data-option-name="${name}"]`); const pillsContainer = document.getElementById("agent-input-pills"); if (!btn || !pillsContainer) return; const isSelected = btn.dataset.selected === "true"; if (isSelected) { btn.dataset.selected = "false"; btn.style.background = "var(--ai-option-bg)"; const iconEl = btn.querySelector(".option-icon"); const type = outputTypes.find(t => t.name === name); if (iconEl && type) iconEl.innerHTML = type.iconSvg; const pill = document.getElementById(`pill-${name}`); if (pill) pill.remove(); } else { document.querySelectorAll('[data-option-name][data-selected="true"]').forEach(prevBtn => { const prevName = prevBtn.dataset.optionName; prevBtn.dataset.selected = "false"; prevBtn.style.background = "var(--ai-option-bg)"; const prevIconEl = prevBtn.querySelector(".option-icon"); const prevType = outputTypes.find(t => t.name === prevName); if (prevIconEl && prevType) prevIconEl.innerHTML = prevType.iconSvg; const prevPill = document.getElementById(`pill-${prevName}`); if (prevPill) prevPill.remove(); }); btn.dataset.selected = "true"; btn.style.background = "var(--ai-option-selected-bg)"; const iconEl = btn.querySelector(".option-icon"); if (iconEl) iconEl.innerHTML = checkSvg; const type = outputTypes.find(t => t.name === name); if (type) { const pill = document.createElement("span"); pill.id = `pill-${name}`; pill.style.cssText = "display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 8px 0 8px;border-radius:32px;background:var(--ai-pill-bg);color:var(--ai-pill-text);font-size:14px;white-space:nowrap;cursor:default;"; pill.innerHTML = `${type.iconSvg.replace(/]*>/, "").replace("", "")}${name}`; pill.querySelector(`[data-pill-remove="${name}"]`).addEventListener("click", () => toggleOutputType(name)); pillsContainer.appendChild(pill); } } }; const PlusIcon = ; const MicIcon = ; const ArrowUpIcon = ; const ArrowLeftIcon = ; const ArrowRightIcon = ; const iconBtnStyle = { display: "flex", alignItems: "center", justifyContent: "center", width: "28px", height: "28px", border: "none", borderRadius: "6px", background: "transparent", cursor: "pointer", color: "var(--ai-icon-default)", padding: 0, transition: "background 120ms ease-out" }; const optionIconStyle = { display: "flex", alignItems: "center", justifyContent: "center", width: "48px", height: "48px", border: "1px solid var(--ai-option-border)", borderRadius: "12px", background: "var(--ai-option-bg)", cursor: "pointer", color: "var(--ai-text-secondary)", padding: 0, transition: "background 120ms ease-out", flexShrink: 0 }; const initAgentInput = container => { if (!container) { return; } updateAgentInputButtonState(container); startAgentInputTypewriter(container, { defaultPrompt, placeholder, showTypewriter }); const ta = container.querySelector('[data-agent-input-role="textarea"]'); if (ta && ta.value) { requestAnimationFrame(() => { ta.style.height = "auto"; ta.style.height = ta.scrollHeight + "px"; }); } }; return
{}
{}