@intlayer/design-system 8.4.4 → 8.4.6

package/dist/esm/components/TextArea/ContentEditableTextArea.mjs

@@ -0,0 +1,444 @@
+'use client';
+
+import { cn } from "../../utils/cn.mjs";
+import { inputVariants } from "../Input/Input.mjs";
+import { useEffect, useImperativeHandle, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/TextArea/ContentEditableTextArea.tsx
+const ZERO_WIDTH_SPACE = "​";
+const getTextFromContainer = (container) => {
+	const lineEls = container.querySelectorAll("[data-line]");
+	if (lineEls.length === 0) return (container.textContent ?? "").split(ZERO_WIDTH_SPACE).join("");
+	return Array.from(lineEls).map((el) => {
+		const raw = el.querySelector("[data-editable]")?.textContent ?? el.textContent ?? "";
+		return raw === ZERO_WIDTH_SPACE ? "" : raw.split(ZERO_WIDTH_SPACE).join("");
+	}).join("\n");
+};
+const splitLines = (text) => {
+	const lines = text.split("\n");
+	return lines.length === 0 ? [""] : lines;
+};
+const createGraphemeSegmenter = () => {
+	if (typeof Intl === "undefined" || !("Segmenter" in Intl)) return null;
+	const SegmenterCtor = Intl.Segmenter;
+	return new SegmenterCtor(void 0, { granularity: "grapheme" });
+};
+const graphemeSegmenter = createGraphemeSegmenter();
+/**
+* Find the previous grapheme cluster boundary for safe deletion.
+* Falls back to code-point-aware deletion if Intl.Segmenter is unavailable.
+*/
+const prevGraphemeBoundary = (text, offset) => {
+	if (offset <= 0) return 0;
+	if (graphemeSegmenter) {
+		const segments = [...graphemeSegmenter.segment(text.slice(0, offset))];
+		const last = segments[segments.length - 1];
+		return last ? offset - last.segment.length : offset - 1;
+	}
+	const code = text.charCodeAt(offset - 1);
+	if (code >= 56320 && code <= 57343 && offset >= 2) return offset - 2;
+	return offset - 1;
+};
+/**
+* Find the next grapheme cluster boundary for safe forward deletion.
+*/
+const nextGraphemeBoundary = (text, offset) => {
+	if (offset >= text.length) return text.length;
+	if (graphemeSegmenter) {
+		const first = [...graphemeSegmenter.segment(text.slice(offset))][0];
+		return first ? offset + first.segment.length : offset + 1;
+	}
+	const code = text.charCodeAt(offset);
+	if (code >= 55296 && code <= 56319 && offset + 1 < text.length) return offset + 2;
+	return offset + 1;
+};
+/**
+* Find the previous word boundary for Option+Backspace.
+*/
+const prevWordBoundary = (text, offset) => {
+	if (offset <= 0) return 0;
+	let i = offset - 1;
+	while (i > 0 && /\s/.test(text[i - 1])) i--;
+	while (i > 0 && /\S/.test(text[i - 1])) i--;
+	return i;
+};
+/**
+* Find the next word boundary for Option+Delete.
+*/
+const nextWordBoundary = (text, offset) => {
+	if (offset >= text.length) return text.length;
+	let i = offset;
+	while (i < text.length && /\S/.test(text[i])) i++;
+	while (i < text.length && /\s/.test(text[i])) i++;
+	return i;
+};
+/**
+* Find the start of the current line (for Cmd+Backspace).
+*/
+const lineStart = (text, offset) => {
+	return text.slice(0, offset).lastIndexOf("\n") + 1;
+};
+/**
+* Find the end of the current line (for Cmd+Delete).
+*/
+const lineEnd = (text, offset) => {
+	const nextNewline = text.indexOf("\n", offset);
+	return nextNewline === -1 ? text.length : nextNewline;
+};
+const useContentEditable = ({ value, defaultValue, onChange, disabled = false }) => {
+	const initialValue = value ?? defaultValue ?? "";
+	const [lines, setLines] = useState(() => splitLines(initialValue));
+	const containerRef = useRef(null);
+	const pendingCaretRef = useRef(null);
+	const isControlled = value !== void 0;
+	const linesRef = useRef(lines);
+	linesRef.current = lines;
+	useEffect(() => {
+		if (isControlled && value !== void 0) setLines(splitLines(value));
+	}, [value, isControlled]);
+	const getText = () => linesRef.current.join("\n");
+	const getCaretPosition = () => {
+		const sel = window.getSelection();
+		if (!sel?.rangeCount || !containerRef.current) return null;
+		const range = sel.getRangeAt(0);
+		const lineEls = containerRef.current.querySelectorAll("[data-line]");
+		for (let i = 0; i < lineEls.length; i++) if (lineEls[i].contains(range.startContainer)) return {
+			line: i,
+			offset: range.startOffset
+		};
+		return null;
+	};
+	const getSelectionOffsets = () => {
+		const sel = window.getSelection();
+		if (!sel?.rangeCount || !containerRef.current) return null;
+		const range = sel.getRangeAt(0);
+		const lineEls = containerRef.current.querySelectorAll("[data-line]");
+		const currentLines = linesRef.current;
+		const findOffset = (node, nodeOffset) => {
+			for (let i = 0; i < lineEls.length; i++) if (lineEls[i].contains(node)) {
+				let flat = 0;
+				for (let j = 0; j < i; j++) flat += currentLines[j].length + 1;
+				return flat + Math.min(nodeOffset, currentLines[i]?.length ?? 0);
+			}
+			if (node === containerRef.current) {
+				if (nodeOffset === 0) return 0;
+				return currentLines.join("\n").length;
+			}
+			return 0;
+		};
+		const start = findOffset(range.startContainer, range.startOffset);
+		const end = findOffset(range.endContainer, range.endOffset);
+		return {
+			start: Math.min(start, end),
+			end: Math.max(start, end),
+			hasSelection: !range.collapsed
+		};
+	};
+	const setCaretPosition = (pos) => {
+		if (!containerRef.current) return;
+		const lineEl = containerRef.current.querySelectorAll("[data-line]")[pos.line];
+		if (!lineEl) return;
+		const editable = lineEl.querySelector("[data-editable]");
+		const node = editable?.firstChild ?? editable ?? lineEl.firstChild ?? lineEl;
+		const sel = window.getSelection();
+		if (!sel) return;
+		const range = document.createRange();
+		const maxOff = Math.min(pos.offset, node.textContent?.length ?? 0);
+		try {
+			range.setStart(node, maxOff);
+			range.collapse(true);
+			sel.removeAllRanges();
+			sel.addRange(range);
+		} catch {
+			range.selectNodeContents(node);
+			range.collapse(false);
+			sel.removeAllRanges();
+			sel.addRange(range);
+		}
+	};
+	useEffect(() => {
+		if (pendingCaretRef.current && containerRef.current) {
+			setCaretPosition(pendingCaretRef.current);
+			pendingCaretRef.current = null;
+		}
+	});
+	const flatOffsetFromCaret = (pos) => {
+		const currentLines = linesRef.current;
+		let offset = 0;
+		for (let i = 0; i < pos.line; i++) offset += currentLines[i].length + 1;
+		return offset + pos.offset;
+	};
+	const caretFromFlatOffset = (flat, targetLines) => {
+		let rem = flat;
+		for (let i = 0; i < targetLines.length; i++) {
+			if (rem <= targetLines[i].length) return {
+				line: i,
+				offset: rem
+			};
+			rem -= targetLines[i].length + 1;
+		}
+		return {
+			line: targetLines.length - 1,
+			offset: targetLines[targetLines.length - 1]?.length ?? 0
+		};
+	};
+	const getCursorOffset = () => {
+		const pos = getCaretPosition();
+		if (!pos) return 0;
+		return flatOffsetFromCaret(pos);
+	};
+	/**
+	* Applies a text mutation: computes new lines, sets pending caret, updates state.
+	*/
+	const applyTextChange = (newText, caretOffset) => {
+		const newLines = splitLines(newText);
+		pendingCaretRef.current = caretFromFlatOffset(caretOffset, newLines);
+		setLines(newLines);
+		onChange?.(newText);
+	};
+	const handleInput = () => {
+		if (pendingCaretRef.current !== null) return;
+		if (disabled || !containerRef.current) return;
+		const caretPos = getCaretPosition();
+		const newText = getTextFromContainer(containerRef.current);
+		const newLines = splitLines(newText);
+		pendingCaretRef.current = caretPos;
+		setLines(newLines);
+		onChange?.(newText);
+	};
+	const handleKeyDown = (e) => {
+		if (disabled) {
+			e.preventDefault();
+			return;
+		}
+		if (e.nativeEvent.isComposing) return;
+		if ((e.metaKey || e.ctrlKey) && e.key === "z") {
+			e.preventDefault();
+			return;
+		}
+		const selInfo = getSelectionOffsets();
+		if (!selInfo) return;
+		const currentText = linesRef.current.join("\n");
+		if (e.key === "Enter") {
+			e.preventDefault();
+			applyTextChange(currentText.slice(0, selInfo.start) + "\n" + currentText.slice(selInfo.end), selInfo.start + 1);
+			return;
+		}
+		if (e.key === "Backspace") {
+			e.preventDefault();
+			if (selInfo.hasSelection) applyTextChange(currentText.slice(0, selInfo.start) + currentText.slice(selInfo.end), selInfo.start);
+			else {
+				if (selInfo.start === 0) return;
+				let deleteFrom;
+				if (e.metaKey) deleteFrom = lineStart(currentText, selInfo.start);
+				else if (e.altKey) deleteFrom = prevWordBoundary(currentText, selInfo.start);
+				else deleteFrom = prevGraphemeBoundary(currentText, selInfo.start);
+				applyTextChange(currentText.slice(0, deleteFrom) + currentText.slice(selInfo.start), deleteFrom);
+			}
+			return;
+		}
+		if (e.key === "Delete") {
+			e.preventDefault();
+			if (selInfo.hasSelection) applyTextChange(currentText.slice(0, selInfo.start) + currentText.slice(selInfo.end), selInfo.start);
+			else {
+				if (selInfo.start >= currentText.length) return;
+				let deleteTo;
+				if (e.metaKey) deleteTo = lineEnd(currentText, selInfo.start);
+				else if (e.altKey) deleteTo = nextWordBoundary(currentText, selInfo.start);
+				else deleteTo = nextGraphemeBoundary(currentText, selInfo.start);
+				applyTextChange(currentText.slice(0, selInfo.start) + currentText.slice(deleteTo), selInfo.start);
+			}
+			return;
+		}
+	};
+	const handleCut = (e) => {
+		if (disabled) {
+			e.preventDefault();
+			return;
+		}
+		e.preventDefault();
+		const selInfo = getSelectionOffsets();
+		if (!selInfo || !selInfo.hasSelection) return;
+		const currentText = linesRef.current.join("\n");
+		const selectedText = currentText.slice(selInfo.start, selInfo.end);
+		e.clipboardData.setData("text/plain", selectedText);
+		applyTextChange(currentText.slice(0, selInfo.start) + currentText.slice(selInfo.end), selInfo.start);
+	};
+	const handlePaste = (e) => {
+		if (disabled) {
+			e.preventDefault();
+			return;
+		}
+		e.preventDefault();
+		const pastedText = e.clipboardData.getData("text/plain");
+		if (!pastedText) return;
+		const selInfo = getSelectionOffsets();
+		if (!selInfo) return;
+		const currentText = linesRef.current.join("\n");
+		applyTextChange(currentText.slice(0, selInfo.start) + pastedText + currentText.slice(selInfo.end), selInfo.start + pastedText.length);
+	};
+	const handleBeforeInput = (e) => {
+		if (disabled) return;
+		const inputEvent = e.nativeEvent;
+		if (inputEvent.isComposing) return;
+		const inputType = inputEvent.inputType;
+		if (inputType === "insertParagraph" || inputType === "insertLineBreak") return;
+		if (inputType === "deleteContentBackward" || inputType === "deleteContentForward") {
+			e.preventDefault();
+			const selInfo = getSelectionOffsets();
+			if (!selInfo) return;
+			const currentText = linesRef.current.join("\n");
+			if (selInfo.hasSelection) applyTextChange(currentText.slice(0, selInfo.start) + currentText.slice(selInfo.end), selInfo.start);
+			else if (inputType === "deleteContentBackward") {
+				if (selInfo.start === 0) return;
+				const deleteFrom = prevGraphemeBoundary(currentText, selInfo.start);
+				applyTextChange(currentText.slice(0, deleteFrom) + currentText.slice(selInfo.start), deleteFrom);
+			} else {
+				if (selInfo.start >= currentText.length) return;
+				const deleteTo = nextGraphemeBoundary(currentText, selInfo.start);
+				applyTextChange(currentText.slice(0, selInfo.start) + currentText.slice(deleteTo), selInfo.start);
+			}
+			return;
+		}
+		if (inputType === "insertReplacementText") {
+			e.preventDefault();
+			const selInfo = getSelectionOffsets();
+			if (!selInfo) return;
+			const currentText = linesRef.current.join("\n");
+			const replacement = inputEvent.data ?? inputEvent.dataTransfer?.getData("text/plain") ?? "";
+			applyTextChange(currentText.slice(0, selInfo.start) + replacement + currentText.slice(selInfo.end), selInfo.start + replacement.length);
+			return;
+		}
+		if (inputType === "insertText" && inputEvent.data) {
+			e.preventDefault();
+			const selInfo = getSelectionOffsets();
+			if (!selInfo) return;
+			const currentText = linesRef.current.join("\n");
+			const inserted = inputEvent.data;
+			applyTextChange(currentText.slice(0, selInfo.start) + inserted + currentText.slice(selInfo.end), selInfo.start + inserted.length);
+		}
+	};
+	const handleDrop = (e) => {
+		e.preventDefault();
+	};
+	const handleDragOver = (e) => {
+		e.preventDefault();
+	};
+	return {
+		lines,
+		containerRef,
+		getText,
+		handleInput,
+		handleBeforeInput,
+		handleKeyDown,
+		handleCut,
+		handlePaste,
+		handleDrop,
+		handleDragOver,
+		getCaretPosition,
+		setCaretPosition,
+		getCursorOffset,
+		caretFromFlatOffset
+	};
+};
+const Line = ({ index, text, isLast, ghostText }) => /* @__PURE__ */ jsxs("span", {
+	"data-line": index,
+	className: "block min-h-[1.5rem]",
+	children: [
+		/* @__PURE__ */ jsx("span", {
+			"data-editable": true,
+			children: text || "​"
+		}),
+		ghostText && /* @__PURE__ */ jsx("span", {
+			"data-ghost": true,
+			className: "pointer-events-none select-none text-neutral",
+			"aria-hidden": "true",
+			children: ghostText
+		}),
+		!isLast && /* @__PURE__ */ jsx("br", {})
+	]
+});
+const LINE_HEIGHT = 24;
+const LINE_PADDING = 12;
+const ContentEditableTextArea = ({ value, defaultValue, onChange, placeholder, disabled = false, minRows = 1, maxRows = 999, autoSize = true, validationStyleEnabled = false, variant, ghostText, ghostLine, ghostOffset, onClick, className, dir = "auto", ref, ...rest }) => {
+	const { lines, containerRef, getText, handleInput, handleBeforeInput, handleKeyDown, handleCut, handlePaste, handleDrop, handleDragOver, getCursorOffset, setCaretPosition, caretFromFlatOffset } = useContentEditable({
+		value,
+		defaultValue,
+		onChange,
+		disabled
+	});
+	const elRef = useRef(null);
+	const setRef = (el) => {
+		elRef.current = el;
+		containerRef.current = el;
+	};
+	useImperativeHandle(ref, () => ({
+		getContainer: () => elRef.current,
+		getText,
+		focus: () => elRef.current?.focus(),
+		getCursorOffset,
+		setCursorAtOffset: (offset) => {
+			setCaretPosition(caretFromFlatOffset(offset, lines));
+		}
+	}));
+	useEffect(() => {
+		if (!autoSize || !elRef.current) return;
+		const el = elRef.current;
+		const max = LINE_HEIGHT * maxRows + LINE_PADDING;
+		const min = LINE_HEIGHT * minRows + LINE_PADDING;
+		el.style.height = "auto";
+		const sh = el.scrollHeight;
+		el.style.height = `${Math.max(Math.min(sh, max), min)}px`;
+		el.style.overflowY = sh > max ? "auto" : "hidden";
+	}, [
+		lines,
+		autoSize,
+		maxRows,
+		minRows
+	]);
+	const isEmpty = lines.length === 1 && lines[0] === "";
+	const hasGhost = ghostText && ghostLine !== void 0 && ghostOffset !== void 0;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "relative w-full",
+		children: [isEmpty && placeholder && /* @__PURE__ */ jsx("div", {
+			className: "pointer-events-none absolute inset-0 select-none px-2 py-3 text-base text-neutral-400 leading-[1.5rem] md:py-2 md:text-sm",
+			"aria-hidden": "true",
+			children: placeholder
+		}), /* @__PURE__ */ jsx("div", {
+			...rest,
+			ref: setRef,
+			role: "textbox",
+			"aria-multiline": "true",
+			"aria-placeholder": placeholder,
+			"aria-disabled": disabled,
+			"aria-autocomplete": hasGhost ? "inline" : void 0,
+			tabIndex: disabled ? -1 : 0,
+			contentEditable: !disabled,
+			suppressContentEditableWarning: true,
+			dir,
+			onInput: handleInput,
+			onBeforeInput: handleBeforeInput,
+			onKeyDown: handleKeyDown,
+			onCut: handleCut,
+			onPaste: handlePaste,
+			onDrop: handleDrop,
+			onDragOver: handleDragOver,
+			onClick,
+			className: cn("resize-none whitespace-pre-wrap break-words outline-none", inputVariants({
+				variant,
+				validationStyleEnabled: validationStyleEnabled ? "enabled" : "disabled"
+			}), autoSize && "overflow-y-auto", className),
+			children: lines.map((text, i) => /* @__PURE__ */ jsx(Line, {
+				index: i,
+				text,
+				isLast: i === lines.length - 1,
+				ghostText: hasGhost && ghostLine === i ? ghostText : void 0
+			}, i))
+		})]
+	});
+};
+
+//#endregion
+export { ContentEditableTextArea, useContentEditable };
+//# sourceMappingURL=ContentEditableTextArea.mjs.map

package/dist/esm/components/TextArea/ContentEditableTextArea.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContentEditableTextArea.mjs","names":[],"sources":["../../../../src/components/TextArea/ContentEditableTextArea.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@utils/cn';\nimport type { VariantProps } from 'class-variance-authority';\nimport {\n  type ClipboardEvent,\n  type DragEvent,\n  type FC,\n  type FormEvent,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type MutableRefObject,\n  type Ref,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport { type InputVariant, inputVariants } from '../Input';\n\ntype CaretPosition = {\n  line: number;\n  offset: number;\n};\n\ntype UseContentEditableOptions = {\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n  disabled?: boolean;\n};\n\nconst ZERO_WIDTH_SPACE = '\\u200B';\n\nconst getTextFromContainer = (container: HTMLDivElement): string => {\n  const lineEls = container.querySelectorAll('[data-line]');\n  if (lineEls.length === 0) {\n    return (container.textContent ?? '').split(ZERO_WIDTH_SPACE).join('');\n  }\n\n  return Array.from(lineEls)\n    .map((el) => {\n      const editable = el.querySelector('[data-editable]');\n      const raw = editable?.textContent ?? el.textContent ?? '';\n      return raw === ZERO_WIDTH_SPACE\n        ? ''\n        : raw.split(ZERO_WIDTH_SPACE).join('');\n    })\n    .join('\\n');\n};\n\nconst splitLines = (text: string): string[] => {\n  const lines = text.split('\\n');\n  return lines.length === 0 ? [''] : lines;\n};\n\n// Cached Intl.Segmenter for grapheme-aware deletion (emoji, CJK, etc.)\n// Intl.Segmenter is ES2022+ but we feature-detect at runtime.\ntype GraphemeSegmenter = {\n  segment: (input: string) => Iterable<{ segment: string }>;\n};\n\nconst createGraphemeSegmenter = (): GraphemeSegmenter | null => {\n  if (typeof Intl === 'undefined' || !('Segmenter' in Intl)) return null;\n  const SegmenterCtor = (\n    Intl as unknown as Record<\n      string,\n      new (\n        ...args: unknown[]\n      ) => GraphemeSegmenter\n    >\n  ).Segmenter;\n  return new SegmenterCtor(undefined, { granularity: 'grapheme' });\n};\n\nconst graphemeSegmenter = createGraphemeSegmenter();\n\n/**\n * Find the previous grapheme cluster boundary for safe deletion.\n * Falls back to code-point-aware deletion if Intl.Segmenter is unavailable.\n */\nconst prevGraphemeBoundary = (text: string, offset: number): number => {\n  if (offset <= 0) return 0;\n\n  if (graphemeSegmenter) {\n    const segments = [...graphemeSegmenter.segment(text.slice(0, offset))];\n    const last = segments[segments.length - 1];\n    return last ? offset - last.segment.length : offset - 1;\n  }\n\n  // Fallback: handle surrogate pairs\n  const code = text.charCodeAt(offset - 1);\n  if (code >= 0xdc00 && code <= 0xdfff && offset >= 2) {\n    return offset - 2;\n  }\n  return offset - 1;\n};\n\n/**\n * Find the next grapheme cluster boundary for safe forward deletion.\n */\nconst nextGraphemeBoundary = (text: string, offset: number): number => {\n  if (offset >= text.length) return text.length;\n\n  if (graphemeSegmenter) {\n    const segments = [...graphemeSegmenter.segment(text.slice(offset))];\n    const first = segments[0];\n    return first ? offset + first.segment.length : offset + 1;\n  }\n\n  // Fallback: handle surrogate pairs\n  const code = text.charCodeAt(offset);\n  if (code >= 0xd800 && code <= 0xdbff && offset + 1 < text.length) {\n    return offset + 2;\n  }\n  return offset + 1;\n};\n\n/**\n * Find the previous word boundary for Option+Backspace.\n */\nconst prevWordBoundary = (text: string, offset: number): number => {\n  if (offset <= 0) return 0;\n  let i = offset - 1;\n  // Skip whitespace\n  while (i > 0 && /\\s/.test(text[i - 1])) i--;\n  // Skip word characters\n  while (i > 0 && /\\S/.test(text[i - 1])) i--;\n  return i;\n};\n\n/**\n * Find the next word boundary for Option+Delete.\n */\nconst nextWordBoundary = (text: string, offset: number): number => {\n  if (offset >= text.length) return text.length;\n  let i = offset;\n  // Skip word characters\n  while (i < text.length && /\\S/.test(text[i])) i++;\n  // Skip whitespace\n  while (i < text.length && /\\s/.test(text[i])) i++;\n  return i;\n};\n\n/**\n * Find the start of the current line (for Cmd+Backspace).\n */\nconst lineStart = (text: string, offset: number): number => {\n  const before = text.slice(0, offset);\n  const lastNewline = before.lastIndexOf('\\n');\n  return lastNewline + 1;\n};\n\n/**\n * Find the end of the current line (for Cmd+Delete).\n */\nconst lineEnd = (text: string, offset: number): number => {\n  const nextNewline = text.indexOf('\\n', offset);\n  return nextNewline === -1 ? text.length : nextNewline;\n};\n\nexport const useContentEditable = ({\n  value,\n  defaultValue,\n  onChange,\n  disabled = false,\n}: UseContentEditableOptions) => {\n  const initialValue = value ?? defaultValue ?? '';\n  const [lines, setLines] = useState<string[]>(() => splitLines(initialValue));\n  const containerRef = useRef<HTMLDivElement | null>(null);\n  const pendingCaretRef = useRef<CaretPosition | null>(null);\n  const isControlled = value !== undefined;\n\n  // Keep a ref to the latest lines to avoid stale closures in rapid typing\n  const linesRef = useRef(lines);\n  linesRef.current = lines;\n\n  useEffect(() => {\n    if (isControlled && value !== undefined) {\n      setLines(splitLines(value));\n    }\n  }, [value, isControlled]);\n\n  const getText = () => linesRef.current.join('\\n');\n\n  const getCaretPosition = (): CaretPosition | null => {\n    const sel = window.getSelection();\n    if (!sel?.rangeCount || !containerRef.current) return null;\n\n    const range = sel.getRangeAt(0);\n    const lineEls = containerRef.current.querySelectorAll('[data-line]');\n\n    for (let i = 0; i < lineEls.length; i++) {\n      if (lineEls[i].contains(range.startContainer)) {\n        return { line: i, offset: range.startOffset };\n      }\n    }\n    return null;\n  };\n\n  const getSelectionOffsets = (): {\n    start: number;\n    end: number;\n    hasSelection: boolean;\n  } | null => {\n    const sel = window.getSelection();\n    if (!sel?.rangeCount || !containerRef.current) return null;\n\n    const range = sel.getRangeAt(0);\n    const lineEls = containerRef.current.querySelectorAll('[data-line]');\n    const currentLines = linesRef.current;\n\n    const findOffset = (node: Node, nodeOffset: number): number => {\n      for (let i = 0; i < lineEls.length; i++) {\n        if (lineEls[i].contains(node)) {\n          let flat = 0;\n          for (let j = 0; j < i; j++) {\n            flat += currentLines[j].length + 1;\n          }\n          return flat + Math.min(nodeOffset, currentLines[i]?.length ?? 0);\n        }\n      }\n      // Selection is on the root container (e.g. select-all)\n      if (node === containerRef.current) {\n        if (nodeOffset === 0) return 0;\n        return currentLines.join('\\n').length;\n      }\n      return 0;\n    };\n\n    const start = findOffset(range.startContainer, range.startOffset);\n    const end = findOffset(range.endContainer, range.endOffset);\n\n    return {\n      start: Math.min(start, end),\n      end: Math.max(start, end),\n      hasSelection: !range.collapsed,\n    };\n  };\n\n  const setCaretPosition = (pos: CaretPosition) => {\n    if (!containerRef.current) return;\n\n    const lineEls = containerRef.current.querySelectorAll('[data-line]');\n    const lineEl = lineEls[pos.line];\n    if (!lineEl) return;\n\n    const editable = lineEl.querySelector('[data-editable]');\n    const node =\n      editable?.firstChild ?? editable ?? lineEl.firstChild ?? lineEl;\n\n    const sel = window.getSelection();\n    if (!sel) return;\n\n    const range = document.createRange();\n    const maxOff = Math.min(pos.offset, node.textContent?.length ?? 0);\n\n    try {\n      range.setStart(node, maxOff);\n      range.collapse(true);\n      sel.removeAllRanges();\n      sel.addRange(range);\n    } catch {\n      range.selectNodeContents(node);\n      range.collapse(false);\n      sel.removeAllRanges();\n      sel.addRange(range);\n    }\n  };\n\n  useEffect(() => {\n    if (pendingCaretRef.current && containerRef.current) {\n      setCaretPosition(pendingCaretRef.current);\n      pendingCaretRef.current = null;\n    }\n  });\n\n  const flatOffsetFromCaret = (pos: CaretPosition): number => {\n    const currentLines = linesRef.current;\n    let offset = 0;\n    for (let i = 0; i < pos.line; i++) {\n      offset += currentLines[i].length + 1;\n    }\n    return offset + pos.offset;\n  };\n\n  const caretFromFlatOffset = (\n    flat: number,\n    targetLines: string[]\n  ): CaretPosition => {\n    let rem = flat;\n    for (let i = 0; i < targetLines.length; i++) {\n      if (rem <= targetLines[i].length) {\n        return { line: i, offset: rem };\n      }\n      rem -= targetLines[i].length + 1;\n    }\n    return {\n      line: targetLines.length - 1,\n      offset: targetLines[targetLines.length - 1]?.length ?? 0,\n    };\n  };\n\n  const getCursorOffset = (): number => {\n    const pos = getCaretPosition();\n    if (!pos) return 0;\n    return flatOffsetFromCaret(pos);\n  };\n\n  /**\n   * Applies a text mutation: computes new lines, sets pending caret, updates state.\n   */\n  const applyTextChange = (newText: string, caretOffset: number) => {\n    const newLines = splitLines(newText);\n    pendingCaretRef.current = caretFromFlatOffset(caretOffset, newLines);\n    setLines(newLines);\n    onChange?.(newText);\n  };\n\n  const handleInput = () => {\n    if (pendingCaretRef.current !== null) return;\n    if (disabled || !containerRef.current) return;\n\n    const caretPos = getCaretPosition();\n    const newText = getTextFromContainer(containerRef.current);\n    const newLines = splitLines(newText);\n\n    pendingCaretRef.current = caretPos;\n    setLines(newLines);\n    onChange?.(newText);\n  };\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLDivElement>) => {\n    if (disabled) {\n      e.preventDefault();\n      return;\n    }\n\n    // Don't intercept during IME composition (CJK input)\n    if (e.nativeEvent.isComposing) return;\n\n    // Block undo/redo - browser would mutate DOM out of sync with React\n    if ((e.metaKey || e.ctrlKey) && e.key === 'z') {\n      e.preventDefault();\n      return;\n    }\n\n    const selInfo = getSelectionOffsets();\n    if (!selInfo) return;\n\n    const currentText = linesRef.current.join('\\n');\n\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      const newText =\n        currentText.slice(0, selInfo.start) +\n        '\\n' +\n        currentText.slice(selInfo.end);\n      applyTextChange(newText, selInfo.start + 1);\n      return;\n    }\n\n    if (e.key === 'Backspace') {\n      e.preventDefault();\n\n      if (selInfo.hasSelection) {\n        const newText =\n          currentText.slice(0, selInfo.start) + currentText.slice(selInfo.end);\n        applyTextChange(newText, selInfo.start);\n      } else {\n        if (selInfo.start === 0) return;\n\n        let deleteFrom: number;\n        if (e.metaKey) {\n          // Cmd+Backspace: delete to start of line\n          deleteFrom = lineStart(currentText, selInfo.start);\n        } else if (e.altKey) {\n          // Option+Backspace: delete previous word\n          deleteFrom = prevWordBoundary(currentText, selInfo.start);\n        } else {\n          // Regular backspace: delete one grapheme\n          deleteFrom = prevGraphemeBoundary(currentText, selInfo.start);\n        }\n\n        const newText =\n          currentText.slice(0, deleteFrom) + currentText.slice(selInfo.start);\n        applyTextChange(newText, deleteFrom);\n      }\n      return;\n    }\n\n    if (e.key === 'Delete') {\n      e.preventDefault();\n\n      if (selInfo.hasSelection) {\n        const newText =\n          currentText.slice(0, selInfo.start) + currentText.slice(selInfo.end);\n        applyTextChange(newText, selInfo.start);\n      } else {\n        if (selInfo.start >= currentText.length) return;\n\n        let deleteTo: number;\n        if (e.metaKey) {\n          // Cmd+Delete: delete to end of line\n          deleteTo = lineEnd(currentText, selInfo.start);\n        } else if (e.altKey) {\n          // Option+Delete: delete next word\n          deleteTo = nextWordBoundary(currentText, selInfo.start);\n        } else {\n          // Regular delete: delete one grapheme\n          deleteTo = nextGraphemeBoundary(currentText, selInfo.start);\n        }\n\n        const newText =\n          currentText.slice(0, selInfo.start) + currentText.slice(deleteTo);\n        applyTextChange(newText, selInfo.start);\n      }\n      return;\n    }\n  };\n\n  const handleCut = (e: ClipboardEvent<HTMLDivElement>) => {\n    if (disabled) {\n      e.preventDefault();\n      return;\n    }\n\n    e.preventDefault();\n    const selInfo = getSelectionOffsets();\n    if (!selInfo || !selInfo.hasSelection) return;\n\n    const currentText = linesRef.current.join('\\n');\n    const selectedText = currentText.slice(selInfo.start, selInfo.end);\n\n    // Write selected text to clipboard\n    e.clipboardData.setData('text/plain', selectedText);\n\n    // Delete the selected text\n    const newText =\n      currentText.slice(0, selInfo.start) + currentText.slice(selInfo.end);\n    applyTextChange(newText, selInfo.start);\n  };\n\n  const handlePaste = (e: ClipboardEvent<HTMLDivElement>) => {\n    if (disabled) {\n      e.preventDefault();\n      return;\n    }\n\n    e.preventDefault();\n    const pastedText = e.clipboardData.getData('text/plain');\n    if (!pastedText) return;\n\n    const selInfo = getSelectionOffsets();\n    if (!selInfo) return;\n\n    const currentText = linesRef.current.join('\\n');\n    const newText =\n      currentText.slice(0, selInfo.start) +\n      pastedText +\n      currentText.slice(selInfo.end);\n    applyTextChange(newText, selInfo.start + pastedText.length);\n  };\n\n  const handleBeforeInput = (e: FormEvent<HTMLDivElement>) => {\n    if (disabled) return;\n\n    const inputEvent = e.nativeEvent as InputEvent;\n\n    // Don't intercept during IME composition (CJK input)\n    if (inputEvent.isComposing) return;\n\n    const inputType = inputEvent.inputType;\n\n    // Skip types handled by handleKeyDown (when keydown fires)\n    if (inputType === 'insertParagraph' || inputType === 'insertLineBreak') {\n      return;\n    }\n\n    // Handle deletions as fallback for mobile keyboards that don't fire keydown\n    if (\n      inputType === 'deleteContentBackward' ||\n      inputType === 'deleteContentForward'\n    ) {\n      e.preventDefault();\n      const selInfo = getSelectionOffsets();\n      if (!selInfo) return;\n\n      const currentText = linesRef.current.join('\\n');\n\n      if (selInfo.hasSelection) {\n        const newText =\n          currentText.slice(0, selInfo.start) + currentText.slice(selInfo.end);\n        applyTextChange(newText, selInfo.start);\n      } else if (inputType === 'deleteContentBackward') {\n        if (selInfo.start === 0) return;\n        const deleteFrom = prevGraphemeBoundary(currentText, selInfo.start);\n        const newText =\n          currentText.slice(0, deleteFrom) + currentText.slice(selInfo.start);\n        applyTextChange(newText, deleteFrom);\n      } else {\n        if (selInfo.start >= currentText.length) return;\n        const deleteTo = nextGraphemeBoundary(currentText, selInfo.start);\n        const newText =\n          currentText.slice(0, selInfo.start) + currentText.slice(deleteTo);\n        applyTextChange(newText, selInfo.start);\n      }\n      return;\n    }\n\n    // Handle spell-check replacements\n    if (inputType === 'insertReplacementText') {\n      e.preventDefault();\n      const selInfo = getSelectionOffsets();\n      if (!selInfo) return;\n\n      const currentText = linesRef.current.join('\\n');\n      const replacement =\n        inputEvent.data ?? inputEvent.dataTransfer?.getData('text/plain') ?? '';\n      const newText =\n        currentText.slice(0, selInfo.start) +\n        replacement +\n        currentText.slice(selInfo.end);\n      applyTextChange(newText, selInfo.start + replacement.length);\n      return;\n    }\n\n    if (inputType === 'insertText' && inputEvent.data) {\n      e.preventDefault();\n\n      const selInfo = getSelectionOffsets();\n      if (!selInfo) return;\n\n      const currentText = linesRef.current.join('\\n');\n      const inserted = inputEvent.data;\n      const newText =\n        currentText.slice(0, selInfo.start) +\n        inserted +\n        currentText.slice(selInfo.end);\n      applyTextChange(newText, selInfo.start + inserted.length);\n    }\n  };\n\n  const handleDrop = (e: DragEvent<HTMLDivElement>) => {\n    // Block drag-and-drop to prevent uncontrolled DOM mutations\n    e.preventDefault();\n  };\n\n  const handleDragOver = (e: DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n  };\n\n  return {\n    lines,\n    containerRef,\n    getText,\n    handleInput,\n    handleBeforeInput,\n    handleKeyDown,\n    handleCut,\n    handlePaste,\n    handleDrop,\n    handleDragOver,\n    getCaretPosition,\n    setCaretPosition,\n    getCursorOffset,\n    caretFromFlatOffset,\n  };\n};\n\ntype LineProps = {\n  index: number;\n  text: string;\n  isLast: boolean;\n  ghostText?: string;\n};\n\nconst Line: FC<LineProps> = ({ index, text, isLast, ghostText }) => (\n  <span data-line={index} className=\"block min-h-[1.5rem]\">\n    <span data-editable>{text || '\\u200B'}</span>\n    {ghostText && (\n      <span\n        data-ghost\n        className=\"pointer-events-none select-none text-neutral\"\n        aria-hidden=\"true\"\n      >\n        {ghostText}\n      </span>\n    )}\n    {!isLast && <br />}\n  </span>\n);\n\nexport type ContentEditableTextAreaHandle = {\n  getContainer: () => HTMLDivElement | null;\n  getText: () => string;\n  focus: () => void;\n  getCursorOffset: () => number;\n  setCursorAtOffset: (offset: number) => void;\n};\n\nexport type ContentEditableTextAreaProps = Omit<\n  HTMLAttributes<HTMLDivElement>,\n  'onChange' | 'defaultValue'\n> & {\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n  placeholder?: string;\n  disabled?: boolean;\n  minRows?: number;\n  maxRows?: number;\n  autoSize?: boolean;\n  validationStyleEnabled?: boolean;\n  variant?: InputVariant | `${InputVariant}`;\n  ghostText?: string;\n  ghostLine?: number;\n  ghostOffset?: number;\n  ref?: Ref<ContentEditableTextAreaHandle>;\n  dir?: 'ltr' | 'rtl' | 'auto';\n} & Omit<\n    VariantProps<typeof inputVariants>,\n    'validationStyleEnabled' | 'variant'\n  >;\n\nconst LINE_HEIGHT = 24;\nconst LINE_PADDING = 12;\n\nexport const ContentEditableTextArea: FC<ContentEditableTextAreaProps> = ({\n  value,\n  defaultValue,\n  onChange,\n  placeholder,\n  disabled = false,\n  minRows = 1,\n  maxRows = 999,\n  autoSize = true,\n  validationStyleEnabled = false,\n  variant,\n  ghostText,\n  ghostLine,\n  ghostOffset,\n  onClick,\n  className,\n  dir = 'auto',\n  ref,\n  ...rest\n}) => {\n  const {\n    lines,\n    containerRef,\n    getText,\n    handleInput,\n    handleBeforeInput,\n    handleKeyDown,\n    handleCut,\n    handlePaste,\n    handleDrop,\n    handleDragOver,\n    getCursorOffset,\n    setCaretPosition,\n    caretFromFlatOffset,\n  } = useContentEditable({ value, defaultValue, onChange, disabled });\n\n  const elRef = useRef<HTMLDivElement | null>(null);\n\n  const setRef = (el: HTMLDivElement | null) => {\n    elRef.current = el;\n    (containerRef as MutableRefObject<HTMLDivElement | null>).current = el;\n  };\n\n  useImperativeHandle(ref, () => ({\n    getContainer: () => elRef.current,\n    getText,\n    focus: () => elRef.current?.focus(),\n    getCursorOffset,\n    setCursorAtOffset: (offset: number) => {\n      setCaretPosition(caretFromFlatOffset(offset, lines));\n    },\n  }));\n\n  useEffect(() => {\n    if (!autoSize || !elRef.current) return;\n\n    const el = elRef.current;\n    const max = LINE_HEIGHT * maxRows + LINE_PADDING;\n    const min = LINE_HEIGHT * minRows + LINE_PADDING;\n\n    el.style.height = 'auto';\n    const sh = el.scrollHeight;\n    el.style.height = `${Math.max(Math.min(sh, max), min)}px`;\n    el.style.overflowY = sh > max ? 'auto' : 'hidden';\n  }, [lines, autoSize, maxRows, minRows]);\n\n  const isEmpty = lines.length === 1 && lines[0] === '';\n  const hasGhost =\n    ghostText && ghostLine !== undefined && ghostOffset !== undefined;\n\n  return (\n    <div className=\"relative w-full\">\n      {isEmpty && placeholder && (\n        <div\n          className=\"pointer-events-none absolute inset-0 select-none px-2 py-3 text-base text-neutral-400 leading-[1.5rem] md:py-2 md:text-sm\"\n          aria-hidden=\"true\"\n        >\n          {placeholder}\n        </div>\n      )}\n\n      <div\n        {...rest}\n        ref={setRef}\n        role=\"textbox\"\n        aria-multiline=\"true\"\n        aria-placeholder={placeholder}\n        aria-disabled={disabled}\n        aria-autocomplete={hasGhost ? 'inline' : undefined}\n        tabIndex={disabled ? -1 : 0}\n        contentEditable={!disabled}\n        suppressContentEditableWarning\n        dir={dir}\n        onInput={handleInput}\n        onBeforeInput={handleBeforeInput}\n        onKeyDown={handleKeyDown}\n        onCut={handleCut}\n        onPaste={handlePaste}\n        onDrop={handleDrop}\n        onDragOver={handleDragOver}\n        onClick={onClick}\n        className={cn(\n          'resize-none whitespace-pre-wrap break-words outline-none',\n          inputVariants({\n            variant,\n            validationStyleEnabled: validationStyleEnabled\n              ? 'enabled'\n              : 'disabled',\n          }),\n          autoSize && 'overflow-y-auto',\n          className\n        )}\n      >\n        {lines.map((text, i) => (\n          <Line\n            key={i}\n            index={i}\n            text={text}\n            isLast={i === lines.length - 1}\n            ghostText={hasGhost && ghostLine === i ? ghostText : undefined}\n          />\n        ))}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/esm/components/TextArea/TextArea.mjs

@@ -1,2 +1,59 @@
-import{cn as e}from"../../utils/cn.mjs";import{inputVariants as t}from"../Input/Input.mjs";import{jsx as n}from"react/jsx-runtime";const r=({className:r,variant:i,validationStyleEnabled:a=!1,...o})=>n(`textarea`,{className:e(`resize-none`,t({variant:i,validationStyleEnabled:a?`enabled`:`disabled`,className:r})),...o});export{r as TextArea};
+import { cn } from "../../utils/cn.mjs";
+import { inputVariants } from "../Input/Input.mjs";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/TextArea/TextArea.tsx
+/**
+* TextArea Component
+*
+* A flexible textarea component that extends the standard HTML textarea with
+* design system styling variants, validation states, and consistent visual appearance.
+*
+* ## Features
+* - **Variant Support**: Multiple visual states (default, error, success, warning)
+* - **Validation Styling**: Optional validation feedback styling
+* - **Resize Control**: Disabled by default for consistent layout
+* - **Design System Integration**: Uses shared input variants for consistency
+* - **Accessibility**: Maintains all standard textarea accessibility features
+*
+* ## Use Cases
+* - Multi-line text input forms
+* - Comment and message composition
+* - Description and content fields
+* - Feedback and review forms
+* - Code snippet input (when combined with monospace styling)
+*
+* @example
+* ```tsx
+* // Basic textarea
+* <TextArea
+*   placeholder="Enter your thoughts..."
+*   rows={4}
+* />
+*
+* // Controlled with validation
+* const [content, setContent] = useState('');
+* const hasError = content.length < 10;
+*
+* <TextArea
+*   value={content}
+*   onChange={(e) => setContent(e.target.value)}
+*   variant={hasError ? InputVariant.ERROR : InputVariant.SUCCESS}
+*   validationStyleEnabled={true}
+*   placeholder="Minimum 10 characters required"
+*   className="min-h-[100px]"
+* />
+* ```
+*/
+const TextArea = ({ className, variant, validationStyleEnabled = false, ...props }) => /* @__PURE__ */ jsx("textarea", {
+	className: cn("resize-none", inputVariants({
+		variant,
+		validationStyleEnabled: validationStyleEnabled ? "enabled" : "disabled",
+		className
+	})),
+	...props
+});
+
+//#endregion
+export { TextArea };
 //# sourceMappingURL=TextArea.mjs.map

package/dist/esm/components/TextArea/TextArea.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.mjs","names":[],"sources":["../../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport type { VariantProps } from 'class-variance-authority';\nimport type { DetailedHTMLProps, FC, TextareaHTMLAttributes } from 'react';\nimport { type InputVariant, inputVariants } from '../Input';\n\n/**\n * Props for the TextArea component.\n *\n * Extends standard HTML textarea attributes with additional design system variants\n * and validation styling options.\n *\n * @example\n * ```tsx\n * // Basic usage\n * <TextArea placeholder=\"Enter your message...\" />\n *\n * // With error validation styling\n * <TextArea\n *   value={message}\n *   onChange={handleChange}\n *   variant={InputVariant.ERROR}\n *   validationStyleEnabled={true}\n *   placeholder=\"Message is required\"\n * />\n *\n * // Large multiline input\n * <TextArea\n *   rows={6}\n *   cols={50}\n *   variant={InputVariant.DEFAULT}\n *   className=\"min-h-[120px]\"\n *   placeholder=\"Write a detailed description...\"\n * />\n * ```\n */\nexport type TextAreaProps = DetailedHTMLProps<\n  DetailedHTMLProps<\n    TextareaHTMLAttributes<HTMLTextAreaElement>,\n    HTMLTextAreaElement\n  >,\n  HTMLTextAreaElement\n> & {\n  /** Enable validation styling based on the variant prop */\n  validationStyleEnabled?: boolean;\n} & Omit<\n    VariantProps<typeof inputVariants>,\n    'validationStyleEnabled' | 'variant'\n  > & {\n    /** Visual variant of the textarea (default, success, error, warning, etc.) */\n    variant?: InputVariant | `${InputVariant}`;\n  };\n\n/**\n * TextArea Component\n *\n * A flexible textarea component that extends the standard HTML textarea with\n * design system styling variants, validation states, and consistent visual appearance.\n *\n * ## Features\n * - **Variant Support**: Multiple visual states (default, error, success, warning)\n * - **Validation Styling**: Optional validation feedback styling\n * - **Resize Control**: Disabled by default for consistent layout\n * - **Design System Integration**: Uses shared input variants for consistency\n * - **Accessibility**: Maintains all standard textarea accessibility features\n *\n * ## Use Cases\n * - Multi-line text input forms\n * - Comment and message composition\n * - Description and content fields\n * - Feedback and review forms\n * - Code snippet input (when combined with monospace styling)\n *\n * @example\n * ```tsx\n * // Basic textarea\n * <TextArea\n *   placeholder=\"Enter your thoughts...\"\n *   rows={4}\n * />\n *\n * // Controlled with validation\n * const [content, setContent] = useState('');\n * const hasError = content.length < 10;\n *\n * <TextArea\n *   value={content}\n *   onChange={(e) => setContent(e.target.value)}\n *   variant={hasError ? InputVariant.ERROR : InputVariant.SUCCESS}\n *   validationStyleEnabled={true}\n *   placeholder=\"Minimum 10 characters required\"\n *   className=\"min-h-[100px]\"\n * />\n * ```\n */\nexport const TextArea: FC<TextAreaProps> = ({\n  className,\n  variant,\n  validationStyleEnabled = false,\n  ...props\n}) => (\n  <textarea\n    className={cn(\n      'resize-none',\n      inputVariants({\n        variant,\n        validationStyleEnabled: validationStyleEnabled ? 'enabled' : 'disabled',\n        className,\n      })\n    )}\n    {...props}\n  />\n);\n"],"mappings":"mIA8FA,MAAa,GAA+B,CAC1C,YACA,UACA,yBAAyB,GACzB,GAAG,KAEH,EAAC,WAAD,CACE,UAAW,EACT,cACA,EAAc,CACZ,UACA,uBAAwB,EAAyB,UAAY,WAC7D,YACD,CAAC,CACH,CACD,GAAI,EACJ,CAAA"}
+{"version":3,"file":"TextArea.mjs","names":[],"sources":["../../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport type { VariantProps } from 'class-variance-authority';\nimport type { DetailedHTMLProps, FC, TextareaHTMLAttributes } from 'react';\nimport { type InputVariant, inputVariants } from '../Input';\n\n/**\n * Props for the TextArea component.\n *\n * Extends standard HTML textarea attributes with additional design system variants\n * and validation styling options.\n *\n * @example\n * ```tsx\n * // Basic usage\n * <TextArea placeholder=\"Enter your message...\" />\n *\n * // With error validation styling\n * <TextArea\n *   value={message}\n *   onChange={handleChange}\n *   variant={InputVariant.ERROR}\n *   validationStyleEnabled={true}\n *   placeholder=\"Message is required\"\n * />\n *\n * // Large multiline input\n * <TextArea\n *   rows={6}\n *   cols={50}\n *   variant={InputVariant.DEFAULT}\n *   className=\"min-h-[120px]\"\n *   placeholder=\"Write a detailed description...\"\n * />\n * ```\n */\nexport type TextAreaProps = DetailedHTMLProps<\n  DetailedHTMLProps<\n    TextareaHTMLAttributes<HTMLTextAreaElement>,\n    HTMLTextAreaElement\n  >,\n  HTMLTextAreaElement\n> & {\n  /** Enable validation styling based on the variant prop */\n  validationStyleEnabled?: boolean;\n} & Omit<\n    VariantProps<typeof inputVariants>,\n    'validationStyleEnabled' | 'variant'\n  > & {\n    /** Visual variant of the textarea (default, success, error, warning, etc.) */\n    variant?: InputVariant | `${InputVariant}`;\n  };\n\n/**\n * TextArea Component\n *\n * A flexible textarea component that extends the standard HTML textarea with\n * design system styling variants, validation states, and consistent visual appearance.\n *\n * ## Features\n * - **Variant Support**: Multiple visual states (default, error, success, warning)\n * - **Validation Styling**: Optional validation feedback styling\n * - **Resize Control**: Disabled by default for consistent layout\n * - **Design System Integration**: Uses shared input variants for consistency\n * - **Accessibility**: Maintains all standard textarea accessibility features\n *\n * ## Use Cases\n * - Multi-line text input forms\n * - Comment and message composition\n * - Description and content fields\n * - Feedback and review forms\n * - Code snippet input (when combined with monospace styling)\n *\n * @example\n * ```tsx\n * // Basic textarea\n * <TextArea\n *   placeholder=\"Enter your thoughts...\"\n *   rows={4}\n * />\n *\n * // Controlled with validation\n * const [content, setContent] = useState('');\n * const hasError = content.length < 10;\n *\n * <TextArea\n *   value={content}\n *   onChange={(e) => setContent(e.target.value)}\n *   variant={hasError ? InputVariant.ERROR : InputVariant.SUCCESS}\n *   validationStyleEnabled={true}\n *   placeholder=\"Minimum 10 characters required\"\n *   className=\"min-h-[100px]\"\n * />\n * ```\n */\nexport const TextArea: FC<TextAreaProps> = ({\n  className,\n  variant,\n  validationStyleEnabled = false,\n  ...props\n}) => (\n  <textarea\n    className={cn(\n      'resize-none',\n      inputVariants({\n        variant,\n        validationStyleEnabled: validationStyleEnabled ? 'enabled' : 'disabled',\n        className,\n      })\n    )}\n    {...props}\n  />\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8FA,MAAa,YAA+B,EAC1C,WACA,SACA,yBAAyB,OACzB,GAAG,YAEH,oBAAC,YAAD;CACE,WAAW,GACT,eACA,cAAc;EACZ;EACA,wBAAwB,yBAAyB,YAAY;EAC7D;EACD,CAAC,CACH;CACD,GAAI;CACJ"}

package/dist/esm/components/TextArea/index.mjs

@@ -1 +1,6 @@
-import{TextArea as e}from"./TextArea.mjs";import{AutoSizedTextArea as t}from"./AutoSizeTextArea.mjs";import{AutoCompleteTextarea as n,useDebounce as r}from"./AutocompleteTextArea.mjs";export{n as AutoCompleteTextarea,t as AutoSizedTextArea,e as TextArea,r as useDebounce};
+import { ContentEditableTextArea, useContentEditable } from "./ContentEditableTextArea.mjs";
+import { AutoCompleteTextarea } from "./AutocompleteTextArea.mjs";
+import { TextArea } from "./TextArea.mjs";
+import { AutoSizedTextArea } from "./AutoSizeTextArea.mjs";
+
+export { AutoCompleteTextarea, AutoSizedTextArea, ContentEditableTextArea, TextArea, useContentEditable };