TowstyandCursor
f788fd4bb4
Keep wrappers off the library mid-prompt so Use as input and Extend restore the same split, send stills to xAIGen as hidden inputs, and stop the two-column library from growing with the list. Co-authored-by: Cursor <cursoragent@cursor.com>
72 lines
2.0 KiB
Vue
72 lines
2.0 KiB
Vue
<template>
|
|
<div>
|
|
<textarea
|
|
:value="modelValue"
|
|
:rows="rows"
|
|
class="hidden w-full overflow-y-auto rounded-xl border border-white/10 bg-zinc-950 px-3 py-2 text-sm outline-none ring-amber-300/40 placeholder:text-zinc-600 [overflow-wrap:anywhere] focus:ring-2 md:block"
|
|
:class="textareaClass"
|
|
:placeholder="placeholder"
|
|
:disabled="disabled"
|
|
@input="onInput"
|
|
/>
|
|
<button
|
|
type="button"
|
|
class="w-full rounded-xl border border-white/10 bg-zinc-950 px-3 py-2 text-left md:hidden"
|
|
:disabled="disabled"
|
|
@click="drawerOpen = true"
|
|
>
|
|
<p v-if="modelValue.trim()" class="line-clamp-4 whitespace-pre-wrap text-sm text-zinc-200 [overflow-wrap:anywhere]">{{ modelValue }}</p>
|
|
<p v-else class="text-sm text-zinc-600">{{ placeholder }}</p>
|
|
<span class="mt-1 inline-block text-xs text-amber-200">{{ modelValue.trim() ? editLabel : writeLabel }}</span>
|
|
</button>
|
|
<PromptDrawer
|
|
:open="drawerOpen"
|
|
:title="title"
|
|
:text="modelValue"
|
|
:placeholder="placeholder"
|
|
:keep-items="keepItems"
|
|
:keep-heading="keepHeading"
|
|
@update:open="drawerOpen = $event"
|
|
@update:text="emit('update:modelValue', $event)"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { KeepPrompt } from '~/utils/keepPrompts'
|
|
|
|
const props = withDefaults(defineProps<{
|
|
modelValue?: string
|
|
rows?: number
|
|
placeholder?: string
|
|
title?: string
|
|
editLabel?: string
|
|
writeLabel?: string
|
|
textareaClass?: string
|
|
disabled?: boolean
|
|
keepItems?: KeepPrompt[]
|
|
keepHeading?: string
|
|
}>(), {
|
|
modelValue: '',
|
|
rows: 3,
|
|
placeholder: '',
|
|
title: 'Prompt',
|
|
editLabel: 'View / edit',
|
|
writeLabel: 'Write',
|
|
textareaClass: 'max-h-32 md:max-h-none',
|
|
disabled: false,
|
|
keepItems: () => [],
|
|
keepHeading: 'Saved prompts'
|
|
})
|
|
|
|
const emit = defineEmits<{
|
|
'update:modelValue': [value: string]
|
|
}>()
|
|
|
|
const drawerOpen = ref(false)
|
|
|
|
function onInput(event: Event) {
|
|
emit('update:modelValue', (event.target as HTMLTextAreaElement).value)
|
|
}
|
|
</script>
|