{#if recording} { recording = false; await tick(); document.getElementById('chat-input')?.focus(); }} on:confirm={async (e) => { const { text, filename } = e.detail; content = `${content}${text} `; recording = false; await tick(); document.getElementById('chat-input')?.focus(); }} /> {:else}

{ submitHandler(); }} >

{#if $settings?.richTextInput ?? true}

0 || navigator.msMaxTouchPoints > 0 )} {placeholder} largeTextAsFile={$settings?.largeTextAsFile ?? false} on:keydown={async (e) => { e = e.detail.event; const isCtrlPressed = e.ctrlKey || e.metaKey; // metaKey is for Cmd key on Mac if ( !$mobile || !( 'ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0 ) ) { // Prevent Enter key from creating a new line // Uses keyCode '13' for Enter key for chinese/japanese keyboards if (e.keyCode === 13 && !e.shiftKey) { e.preventDefault(); } // Submit the content when Enter key is pressed if (content !== '' && e.keyCode === 13 && !e.shiftKey) { submitHandler(); } } if (e.key === 'Escape') { console.log('Escape'); } }} on:paste={async (e) => { e = e.detail.event; console.log(e); }} />

{:else}

{
										e = e.detail.event;
										const isCtrlPressed = e.ctrlKey || e.metaKey; // metaKey is for Cmd key on Mac
										if (
											!$mobile ||
											!(
												'ontouchstart' in window ||
												navigator.maxTouchPoints > 0 ||
												navigator.msMaxTouchPoints > 0
											)
										) {
											// Prevent Enter key from creating a new line
											// Uses keyCode '13' for Enter key for chinese/japanese keyboards
											if (e.keyCode === 13 && !e.shiftKey) {
												e.preventDefault();
											}

// Submit the content when Enter key is pressed
											if (content !== '' && e.keyCode === 13 && !e.shiftKey) {
												submitHandler();
											}
										}

if (e.key === 'Escape') {
											console.log('Escape');
										}
									}}
									rows="1"
									on:input={async (e) => {
										e.target.style.height = '';
										e.target.style.height = Math.min(e.target.scrollHeight, 320) + 'px';
									}}
									on:focus={async (e) => {
										e.target.style.height = '';
										e.target.style.height = Math.min(e.target.scrollHeight, 320) + 'px';
									}}
								/>
							{/if}

<div class="self-end mb-1.5 flex space-x-1 mr-1">
								{#if content === ''}
									<Tooltip content={$i18n.t('Record voice')}>
										<button
											id="voice-input-button"
											class=" text-gray-600 dark:text-gray-300 hover:text-gray-700 dark:hover:text-gray-200 transition rounded-full p-1.5 mr-0.5 self-center"
											type="button"
											on:click={async () => {
												try {
													let stream = await navigator.mediaDevices
														.getUserMedia({ audio: true })
														.catch(function (err) {
															toast.error(
																$i18n.t(`Permission denied when accessing microphone: {{error}}`, {
																	error: err
																})
															);
															return null;
														});

if (stream) {
														recording = true;
														const tracks = stream.getTracks();
														tracks.forEach((track) => track.stop());
													}
													stream = null;
												} catch {
													toast.error($i18n.t('Permission denied when accessing microphone'));
												}
											}}
											aria-label="Voice Input"
										>
											<svg
												xmlns="http://www.w3.org/2000/svg"
												viewBox="0 0 20 20"
												fill="currentColor"
												class="w-5 h-5 translate-y-[0.5px]"
											>
												<path d="M7 4a3 3 0 016 0v6a3 3 0 11-6 0V4z" />
												<path
													d="M5.5 9.643a.75.75 0 00-1.5 0V10c0 3.06 2.29 5.585 5.25 5.954V17.5h-1.5a.75.75 0 000 1.5h4.5a.75.75 0 000-1.5h-1.5v-1.546A6.001 6.001 0 0016 10v-.357a.75.75 0 00-1.5 0V10a4.5 4.5 0 01-9 0v-.357z"
												/>
											</svg>
										</button>
									</Tooltip>
								{/if}