Textarea

Basic

// Package textarea holds the site's example gsx components for ui/textarea.
package textarea

import "github.com/gsxhq/gsxui/ui"

// Basic renders a Textarea with placeholder text.
component Basic() {
	<ui.Textarea value="" placeholder="Type your message here."/>
}

States

package textarea

import "github.com/gsxhq/gsxui/ui"

// States renders Textarea with a pre-filled value, then disabled and
// invalid variants.
component States() {
	<div class="flex max-w-sm flex-col gap-3">
		<ui.Textarea value="Filled in already." placeholder="Message"/>
		<ui.Textarea value="" placeholder="Disabled" disabled/>
		<ui.Textarea value="" placeholder="Invalid" aria-invalid="true"/>
	</div>
}

RTL

شاركنا أفكارك حول خدمتنا.

package textarea

import "github.com/gsxhq/gsxui/ui"

// Rtl mirrors shadcn's own textarea-rtl demo: a Field pairing a label,
// Textarea, and description, translated to Arabic and wrapped in dir="rtl".
component Rtl() {
	<ui.Field dir="rtl" lang="ar" class="w-full max-w-xs">
		<ui.FieldLabel for="textarea-rtl-feedback">التعليقات</ui.FieldLabel>
		<ui.Textarea id="textarea-rtl-feedback" value="" placeholder="تعليقاتك تساعدنا على التحسين..." rows="4"/>
		<ui.FieldDescription>شاركنا أفكارك حول خدمتنا.</ui.FieldDescription>
	</ui.Field>
}