From c1e28224aa2e1450031669d9a7e359b63e04687d Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Wed, 22 Jul 2026 19:40:59 +0200
Subject: Init

---
 src/ui/objects/TextField.tsx | 62 ++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 62 insertions(+)
 create mode 100644 src/ui/objects/TextField.tsx

(limited to 'src/ui/objects/TextField.tsx')

diff --git a/src/ui/objects/TextField.tsx b/src/ui/objects/TextField.tsx
new file mode 100644
index 0000000..dc7893a
--- /dev/null
+++ b/src/ui/objects/TextField.tsx
@@ -0,0 +1,62 @@
+import type { HTMLAttributes } from "corvos/plugins/jsx.ts";
+
+export type Props = HTMLAttributes<"input"> & {
+	"pre"?: JSX.Element;
+	"post"?: JSX.Element;
+	"invalid"?: boolean;
+	"pill"?: boolean;
+	"x-model"?: string;
+};
+
+export const TextField = ({
+	pre,
+	post,
+	disabled,
+	invalid,
+	pill,
+	placeholder,
+	readonly,
+	value,
+	pattern,
+	required,
+	"x-model": xModel,
+	class: cls,
+	...props
+}: Props) => {
+	const extended = !!pre || !!post;
+
+	return (
+		<div
+			class:list={[
+				"o-text-field",
+				{
+					"is-disabled": disabled,
+					"is-invalid": invalid,
+					"l-media": extended,
+					"l-media--gapless": extended,
+					"o-text-field--extended": extended,
+					"o-text-field--pill": pill,
+				},
+				cls,
+			]}
+			{...props}
+		>
+			{pre}{" "}
+			<input
+				class="o-text-field__native"
+				class:list={{
+					"l-media__block": extended,
+					"l-media__block--main": extended,
+				}}
+				disabled={disabled}
+				pattern={pattern}
+				placeholder={placeholder}
+				readonly={readonly}
+				required={required}
+				value={value}
+				x-model={xModel}
+			/>{" "}
+			{post} <div class="o-text-field__bg"></div>
+		</div>
+	);
+};
-- 
cgit v1.3.1