Split prompts into pre/prompt/post and tidy the AIGen video form.

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>
2026-09-01 18:39:02 -05:00
parent ed04dcfee3
commit f788fd4bb4
22 changed files with 753 additions and 199 deletions
@@ -0,0 +1,71 @@
+<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>