alice.pds.demo.boltless.dev / core
This repository has no description
0
Fork 0

Configure Feed

Select the types of activity you want to include in your feed.

web/components: clamp Textarea's resize handle to its min height

min-h-64 was on the wrapper div, but the native resize handle only ever
resizes the textarea itself, so dragging down shrank the textarea to its own
min-h-24 (96px) while the wrapper stayed at 256px — the handle detached from
the bottom border and left ~160px of dead space inside the field.

the floor now lives on the textarea, two pixels short of 16rem so the
wrapper's border keeps the outer box at exactly the exported
textareaMinHeight. rows can't do this job: it sets the resting height, not a
limit, so the handle drags straight past it.

measured in storybook with a real pointer drag on the handle: the textarea
clamps at 254px inside a 256px wrapper, matching MarkdownEditor's preview
pane, and growing upward is unaffected.

Signed-off-by: eti <eti@eti.tf>

author
eti committer
dawn date (Jul 30, 2026, 7:45 PM +0300) commit 7745e7c8 parent 81d9ad8a change-id nxypssmu
+9 -4
+9 -4
web/src/lib/components/ui/Textarea.svelte
··· 1 1 <script module lang="ts"> 2 2 import { tv, type VariantProps } from "$lib/tv"; 3 3 4 - // exported so anything that swaps itself in for the field — MarkdownEditor's preview pane — 5 - // can match its height and avoid resizing the box as you toggle between them. 4 + // the field's resting height, exported so anything that swaps itself in for the field — 5 + // MarkdownEditor's preview pane — can match it and avoid resizing the box as you toggle 6 + // between them. 6 7 export const textareaMinHeight = "min-h-64"; 7 8 8 9 export const textareaField = tv({ 9 10 slots: { 10 - root: `relative flex ${textareaMinHeight} items-start gap-1 rounded border bg-background-default transition-colors`, 11 + root: "relative flex items-start gap-1 rounded border bg-background-default transition-colors", 12 + // the floor has to live on the textarea, not the root: the resize handle only ever 13 + // shrinks the textarea, so a min-height on the root would let the handle drag past the 14 + // box's own minimum and leave dead space under the field. keep this in sync with 15 + // textareaMinHeight above — it's 2px shorter because the root's border sits outside it. 11 16 textarea: 12 - "min-h-24 flex-1 self-stretch bg-transparent py-2 text-sm leading-6 outline-none placeholder:text-foreground-placeholder read-only:resize-none disabled:cursor-not-allowed disabled:resize-none" 17 + "min-h-[calc(16rem-2px)] flex-1 self-stretch bg-transparent py-2 text-sm leading-6 outline-none placeholder:text-foreground-placeholder read-only:resize-none disabled:cursor-not-allowed disabled:resize-none" 13 18 }, 14 19 variants: { 15 20 error: {