entangle-ui 0.6.2 → 0.7.0

package/dist/types/components/primitives/Code/Code.d.ts

@@ -0,0 +1,301 @@
+import { CodeSize } from './Code.types.js';
+import React from 'react';
+
+/**
+ * Small inline `<code>` primitive with theme-aware background and font.
+ *
+ * Complements `ChatCodeBlock` (block-level) — use `Code` for short inline
+ * snippets inside sentences and markdown renderers.
+ *
+ * @example
+ * ```tsx
+ * <Text>Run <Code>npm install</Code> to add the package.</Text>
+ * ```
+ */
+declare const Code: React.NamedExoticComponent<{
+    children: React.ReactNode;
+    size?: CodeSize | undefined;
+    id?: string | undefined | undefined;
+    className?: string | undefined | undefined;
+    testId?: string | undefined;
+    style?: React.CSSProperties | undefined;
+    ref?: React.Ref<HTMLElement> | undefined;
+    defaultChecked?: boolean | undefined | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined | undefined;
+    suppressHydrationWarning?: boolean | undefined | undefined;
+    accessKey?: string | undefined | undefined;
+    autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
+    autoFocus?: boolean | undefined | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+    contextMenu?: string | undefined | undefined;
+    dir?: string | undefined | undefined;
+    draggable?: (boolean | "true" | "false") | undefined;
+    enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
+    hidden?: boolean | undefined | undefined;
+    lang?: string | undefined | undefined;
+    nonce?: string | undefined | undefined;
+    slot?: string | undefined | undefined;
+    spellCheck?: (boolean | "true" | "false") | undefined;
+    tabIndex?: number | undefined | undefined;
+    title?: string | undefined | undefined;
+    translate?: "yes" | "no" | undefined | undefined;
+    radioGroup?: string | undefined | undefined;
+    role?: React.AriaRole | undefined;
+    about?: string | undefined | undefined;
+    content?: string | undefined | undefined;
+    datatype?: string | undefined | undefined;
+    inlist?: any;
+    prefix?: string | undefined | undefined;
+    property?: string | undefined | undefined;
+    rel?: string | undefined | undefined;
+    resource?: string | undefined | undefined;
+    rev?: string | undefined | undefined;
+    typeof?: string | undefined | undefined;
+    vocab?: string | undefined | undefined;
+    autoCorrect?: string | undefined | undefined;
+    autoSave?: string | undefined | undefined;
+    color?: string | undefined | undefined;
+    itemProp?: string | undefined | undefined;
+    itemScope?: boolean | undefined | undefined;
+    itemType?: string | undefined | undefined;
+    itemID?: string | undefined | undefined;
+    itemRef?: string | undefined | undefined;
+    results?: number | undefined | undefined;
+    security?: string | undefined | undefined;
+    unselectable?: "on" | "off" | undefined | undefined;
+    popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
+    popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
+    popoverTarget?: string | undefined | undefined;
+    inert?: boolean | undefined | undefined;
+    inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
+    is?: string | undefined | undefined;
+    exportparts?: string | undefined | undefined;
+    part?: string | undefined | undefined;
+    "aria-activedescendant"?: string | undefined | undefined;
+    "aria-atomic"?: (boolean | "true" | "false") | undefined;
+    "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
+    "aria-braillelabel"?: string | undefined | undefined;
+    "aria-brailleroledescription"?: string | undefined | undefined;
+    "aria-busy"?: (boolean | "true" | "false") | undefined;
+    "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+    "aria-colcount"?: number | undefined | undefined;
+    "aria-colindex"?: number | undefined | undefined;
+    "aria-colindextext"?: string | undefined | undefined;
+    "aria-colspan"?: number | undefined | undefined;
+    "aria-controls"?: string | undefined | undefined;
+    "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
+    "aria-describedby"?: string | undefined | undefined;
+    "aria-description"?: string | undefined | undefined;
+    "aria-details"?: string | undefined | undefined;
+    "aria-disabled"?: (boolean | "true" | "false") | undefined;
+    "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
+    "aria-errormessage"?: string | undefined | undefined;
+    "aria-expanded"?: (boolean | "true" | "false") | undefined;
+    "aria-flowto"?: string | undefined | undefined;
+    "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+    "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
+    "aria-hidden"?: (boolean | "true" | "false") | undefined;
+    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
+    "aria-keyshortcuts"?: string | undefined | undefined;
+    "aria-label"?: string | undefined | undefined;
+    "aria-labelledby"?: string | undefined | undefined;
+    "aria-level"?: number | undefined | undefined;
+    "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
+    "aria-modal"?: (boolean | "true" | "false") | undefined;
+    "aria-multiline"?: (boolean | "true" | "false") | undefined;
+    "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
+    "aria-owns"?: string | undefined | undefined;
+    "aria-placeholder"?: string | undefined | undefined;
+    "aria-posinset"?: number | undefined | undefined;
+    "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+    "aria-readonly"?: (boolean | "true" | "false") | undefined;
+    "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
+    "aria-required"?: (boolean | "true" | "false") | undefined;
+    "aria-roledescription"?: string | undefined | undefined;
+    "aria-rowcount"?: number | undefined | undefined;
+    "aria-rowindex"?: number | undefined | undefined;
+    "aria-rowindextext"?: string | undefined | undefined;
+    "aria-rowspan"?: number | undefined | undefined;
+    "aria-selected"?: (boolean | "true" | "false") | undefined;
+    "aria-setsize"?: number | undefined | undefined;
+    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
+    "aria-valuemax"?: number | undefined | undefined;
+    "aria-valuemin"?: number | undefined | undefined;
+    "aria-valuenow"?: number | undefined | undefined;
+    "aria-valuetext"?: string | undefined | undefined;
+    dangerouslySetInnerHTML?: {
+        __html: string | TrustedHTML;
+    } | undefined | undefined;
+    onCopy?: React.ClipboardEventHandler<HTMLElement> | undefined;
+    onCopyCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
+    onCut?: React.ClipboardEventHandler<HTMLElement> | undefined;
+    onCutCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
+    onPaste?: React.ClipboardEventHandler<HTMLElement> | undefined;
+    onPasteCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
+    onCompositionEnd?: React.CompositionEventHandler<HTMLElement> | undefined;
+    onCompositionEndCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
+    onCompositionStart?: React.CompositionEventHandler<HTMLElement> | undefined;
+    onCompositionStartCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
+    onCompositionUpdate?: React.CompositionEventHandler<HTMLElement> | undefined;
+    onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
+    onFocus?: React.FocusEventHandler<HTMLElement> | undefined;
+    onFocusCapture?: React.FocusEventHandler<HTMLElement> | undefined;
+    onBlur?: React.FocusEventHandler<HTMLElement> | undefined;
+    onBlurCapture?: React.FocusEventHandler<HTMLElement> | undefined;
+    onChange?: React.ChangeEventHandler<HTMLElement, Element> | undefined;
+    onChangeCapture?: React.ChangeEventHandler<HTMLElement, Element> | undefined;
+    onBeforeInput?: React.InputEventHandler<HTMLElement> | undefined;
+    onBeforeInputCapture?: React.InputEventHandler<HTMLElement> | undefined;
+    onInput?: React.InputEventHandler<HTMLElement> | undefined;
+    onInputCapture?: React.InputEventHandler<HTMLElement> | undefined;
+    onReset?: React.ReactEventHandler<HTMLElement> | undefined;
+    onResetCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onSubmit?: React.SubmitEventHandler<HTMLElement> | undefined;
+    onSubmitCapture?: React.SubmitEventHandler<HTMLElement> | undefined;
+    onInvalid?: React.ReactEventHandler<HTMLElement> | undefined;
+    onInvalidCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onLoad?: React.ReactEventHandler<HTMLElement> | undefined;
+    onLoadCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onError?: React.ReactEventHandler<HTMLElement> | undefined;
+    onErrorCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onKeyDown?: React.KeyboardEventHandler<HTMLElement> | undefined;
+    onKeyDownCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
+    onKeyPress?: React.KeyboardEventHandler<HTMLElement> | undefined;
+    onKeyPressCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
+    onKeyUp?: React.KeyboardEventHandler<HTMLElement> | undefined;
+    onKeyUpCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
+    onAbort?: React.ReactEventHandler<HTMLElement> | undefined;
+    onAbortCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onCanPlay?: React.ReactEventHandler<HTMLElement> | undefined;
+    onCanPlayCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onCanPlayThrough?: React.ReactEventHandler<HTMLElement> | undefined;
+    onCanPlayThroughCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onDurationChange?: React.ReactEventHandler<HTMLElement> | undefined;
+    onDurationChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onEmptied?: React.ReactEventHandler<HTMLElement> | undefined;
+    onEmptiedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onEncrypted?: React.ReactEventHandler<HTMLElement> | undefined;
+    onEncryptedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onEnded?: React.ReactEventHandler<HTMLElement> | undefined;
+    onEndedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onLoadedData?: React.ReactEventHandler<HTMLElement> | undefined;
+    onLoadedDataCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onLoadedMetadata?: React.ReactEventHandler<HTMLElement> | undefined;
+    onLoadedMetadataCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onLoadStart?: React.ReactEventHandler<HTMLElement> | undefined;
+    onLoadStartCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onPause?: React.ReactEventHandler<HTMLElement> | undefined;
+    onPauseCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onPlay?: React.ReactEventHandler<HTMLElement> | undefined;
+    onPlayCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onPlaying?: React.ReactEventHandler<HTMLElement> | undefined;
+    onPlayingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onProgress?: React.ReactEventHandler<HTMLElement> | undefined;
+    onProgressCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onRateChange?: React.ReactEventHandler<HTMLElement> | undefined;
+    onRateChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onSeeked?: React.ReactEventHandler<HTMLElement> | undefined;
+    onSeekedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onSeeking?: React.ReactEventHandler<HTMLElement> | undefined;
+    onSeekingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onStalled?: React.ReactEventHandler<HTMLElement> | undefined;
+    onStalledCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onSuspend?: React.ReactEventHandler<HTMLElement> | undefined;
+    onSuspendCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onTimeUpdate?: React.ReactEventHandler<HTMLElement> | undefined;
+    onTimeUpdateCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onVolumeChange?: React.ReactEventHandler<HTMLElement> | undefined;
+    onVolumeChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onWaiting?: React.ReactEventHandler<HTMLElement> | undefined;
+    onWaitingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onAuxClick?: React.MouseEventHandler<HTMLElement> | undefined;
+    onAuxClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
+    onClick?: React.MouseEventHandler<HTMLElement> | undefined;
+    onClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
+    onContextMenu?: React.MouseEventHandler<HTMLElement> | undefined;
+    onContextMenuCapture?: React.MouseEventHandler<HTMLElement> | undefined;
+    onDoubleClick?: React.MouseEventHandler<HTMLElement> | undefined;
+    onDoubleClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
+    onDrag?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragCapture?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragEnd?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragEndCapture?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragEnter?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragEnterCapture?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragExit?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragExitCapture?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragLeave?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragLeaveCapture?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragOver?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragOverCapture?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragStart?: React.DragEventHandler<HTMLElement> | undefined;
+    onDragStartCapture?: React.DragEventHandler<HTMLElement> | undefined;
+    onDrop?: React.DragEventHandler<HTMLElement> | undefined;
+    onDropCapture?: React.DragEventHandler<HTMLElement> | undefined;
+    onMouseDown?: React.MouseEventHandler<HTMLElement> | undefined;
+    onMouseDownCapture?: React.MouseEventHandler<HTMLElement> | undefined;
+    onMouseEnter?: React.MouseEventHandler<HTMLElement> | undefined;
+    onMouseLeave?: React.MouseEventHandler<HTMLElement> | undefined;
+    onMouseMove?: React.MouseEventHandler<HTMLElement> | undefined;
+    onMouseMoveCapture?: React.MouseEventHandler<HTMLElement> | undefined;
+    onMouseOut?: React.MouseEventHandler<HTMLElement> | undefined;
+    onMouseOutCapture?: React.MouseEventHandler<HTMLElement> | undefined;
+    onMouseOver?: React.MouseEventHandler<HTMLElement> | undefined;
+    onMouseOverCapture?: React.MouseEventHandler<HTMLElement> | undefined;
+    onMouseUp?: React.MouseEventHandler<HTMLElement> | undefined;
+    onMouseUpCapture?: React.MouseEventHandler<HTMLElement> | undefined;
+    onSelect?: React.ReactEventHandler<HTMLElement> | undefined;
+    onSelectCapture?: React.ReactEventHandler<HTMLElement> | undefined;
+    onTouchCancel?: React.TouchEventHandler<HTMLElement> | undefined;
+    onTouchCancelCapture?: React.TouchEventHandler<HTMLElement> | undefined;
+    onTouchEnd?: React.TouchEventHandler<HTMLElement> | undefined;
+    onTouchEndCapture?: React.TouchEventHandler<HTMLElement> | undefined;
+    onTouchMove?: React.TouchEventHandler<HTMLElement> | undefined;
+    onTouchMoveCapture?: React.TouchEventHandler<HTMLElement> | undefined;
+    onTouchStart?: React.TouchEventHandler<HTMLElement> | undefined;
+    onTouchStartCapture?: React.TouchEventHandler<HTMLElement> | undefined;
+    onPointerDown?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerDownCapture?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerMove?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerMoveCapture?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerUp?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerUpCapture?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerCancel?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerCancelCapture?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerEnter?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerLeave?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerOver?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerOverCapture?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerOut?: React.PointerEventHandler<HTMLElement> | undefined;
+    onPointerOutCapture?: React.PointerEventHandler<HTMLElement> | undefined;
+    onGotPointerCapture?: React.PointerEventHandler<HTMLElement> | undefined;
+    onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLElement> | undefined;
+    onLostPointerCapture?: React.PointerEventHandler<HTMLElement> | undefined;
+    onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLElement> | undefined;
+    onScroll?: React.UIEventHandler<HTMLElement> | undefined;
+    onScrollCapture?: React.UIEventHandler<HTMLElement> | undefined;
+    onScrollEnd?: React.UIEventHandler<HTMLElement> | undefined;
+    onScrollEndCapture?: React.UIEventHandler<HTMLElement> | undefined;
+    onWheel?: React.WheelEventHandler<HTMLElement> | undefined;
+    onWheelCapture?: React.WheelEventHandler<HTMLElement> | undefined;
+    onAnimationStart?: React.AnimationEventHandler<HTMLElement> | undefined;
+    onAnimationStartCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
+    onAnimationEnd?: React.AnimationEventHandler<HTMLElement> | undefined;
+    onAnimationEndCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
+    onAnimationIteration?: React.AnimationEventHandler<HTMLElement> | undefined;
+    onAnimationIterationCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
+    onToggle?: React.ToggleEventHandler<HTMLElement> | undefined;
+    onBeforeToggle?: React.ToggleEventHandler<HTMLElement> | undefined;
+    onTransitionCancel?: React.TransitionEventHandler<HTMLElement> | undefined;
+    onTransitionCancelCapture?: React.TransitionEventHandler<HTMLElement> | undefined;
+    onTransitionEnd?: React.TransitionEventHandler<HTMLElement> | undefined;
+    onTransitionEndCapture?: React.TransitionEventHandler<HTMLElement> | undefined;
+    onTransitionRun?: React.TransitionEventHandler<HTMLElement> | undefined;
+    onTransitionRunCapture?: React.TransitionEventHandler<HTMLElement> | undefined;
+    onTransitionStart?: React.TransitionEventHandler<HTMLElement> | undefined;
+    onTransitionStartCapture?: React.TransitionEventHandler<HTMLElement> | undefined;
+}>;
+
+export { Code };

package/dist/types/components/primitives/Code/Code.types.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { BaseComponent } from '../../../types/common.js';
+import { Prettify } from '../../../types/utilities.js';
+
+type CodeSize = 'xs' | 'sm' | 'md';
+interface CodeBaseProps extends BaseComponent<HTMLElement> {
+    /** Inline code content. */
+    children: React.ReactNode;
+    /**
+     * Font size scale — relative to surrounding text.
+     * @default "sm"
+     */
+    size?: CodeSize;
+}
+type CodeProps = Prettify<CodeBaseProps>;
+
+export type { CodeBaseProps, CodeProps, CodeSize };

package/dist/types/components/primitives/TextArea/TextArea.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import { TextAreaProps } from './TextArea.types.js';
+
+/**
+ * Multi-line text input with optional auto-resize.
+ *
+ * Visual parity with `Input` — uses the same border, focus ring, and error
+ * states. Auto-resize activates when `minRows` or `maxRows` is set and
+ * disables the native resize handle.
+ *
+ * @example
+ * ```tsx
+ * <TextArea
+ *   label="Description"
+ *   minRows={3}
+ *   maxRows={8}
+ *   value={value}
+ *   onChange={setValue}
+ *   showCount
+ *   maxLength={500}
+ * />
+ * ```
+ */
+declare const TextArea: React.FC<TextAreaProps>;
+
+export { TextArea };

package/dist/types/components/primitives/TextArea/TextArea.types.d.ts

@@ -0,0 +1,76 @@
+import React from 'react';
+import { BaseComponent, Size } from '../../../types/common.js';
+import { Prettify } from '../../../types/utilities.js';
+
+type TextAreaSize = Size;
+type TextAreaResize = 'none' | 'vertical' | 'horizontal' | 'both';
+interface TextAreaBaseProps extends Omit<BaseComponent<HTMLTextAreaElement>, 'onChange' | 'size' | 'css' | 'defaultValue'> {
+    /** Controlled value. */
+    value?: string;
+    /** Uncontrolled initial value. */
+    defaultValue?: string;
+    /** Placeholder text. */
+    placeholder?: string;
+    /**
+     * Size scale (matches Input).
+     * @default "md"
+     */
+    size?: TextAreaSize;
+    /** @default false */
+    disabled?: boolean;
+    /** @default false */
+    error?: boolean;
+    /** @default false */
+    required?: boolean;
+    /** @default false */
+    readOnly?: boolean;
+    /** Label rendered above the textarea (uses FormLabel). */
+    label?: string;
+    /** Helper text below the textarea. */
+    helperText?: string;
+    /** Error message shown when `error` is true; overrides `helperText`. */
+    errorMessage?: string;
+    /**
+     * User resize direction. Auto-resize (via `minRows`/`maxRows`) forces
+     * this to `'none'`.
+     * @default "vertical"
+     */
+    resize?: TextAreaResize;
+    /**
+     * Initial number of rows (used when not auto-sizing).
+     * @default 3
+     */
+    rows?: number;
+    /**
+     * Minimum rows when auto-sizing. Setting this (or `maxRows`) enables
+     * auto-resize.
+     */
+    minRows?: number;
+    /** Maximum rows when auto-sizing. Overflow scrolls above this. */
+    maxRows?: number;
+    /**
+     * Render in monospace font.
+     * @default false
+     */
+    monospace?: boolean;
+    /** Maximum allowed character count (HTML attribute). */
+    maxLength?: number;
+    /**
+     * Show character count below the textarea. Pair with `maxLength`
+     * to show `123/500`.
+     * @default false
+     */
+    showCount?: boolean;
+    /** Change handler returning the string value directly. */
+    onChange?: (value: string) => void;
+    onFocus?: (event: React.FocusEvent<HTMLTextAreaElement>) => void;
+    onBlur?: (event: React.FocusEvent<HTMLTextAreaElement>) => void;
+    onKeyDown?: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;
+    /** @internal passed through to the underlying <textarea>. */
+    name?: string;
+    /** @internal passed through to the underlying <textarea>. */
+    id?: string;
+}
+type TextAreaProps = Prettify<TextAreaBaseProps>;
+
+export type { TextAreaBaseProps, TextAreaProps, TextAreaResize, TextAreaSize };

package/dist/types/index.d.ts

@@ -1,6 +1,6 @@
 export { ThemeVars, vars } from './theme/contract.css.js';
 export { DarkThemeValues, darkThemeValues } from './theme/darkTheme.css.js';
-export { Brand, DeepPartial, DeepReadonly, KeyOf, LiteralUnion, NonEmptyArray, Prettify, RequireFields, StrictExclude, ValueOf } from './types/utilities.js';
+export { createCustomTheme } from './theme/createCustomTheme.js';
 export { VanillaThemeProvider, VanillaThemeProviderProps } from './theme/VanillaThemeProvider.js';
 export { ThemeProvider, ThemeProviderProps } from './theme/ThemeProvider.js';
 export { Accordion } from './components/layout/Accordion/Accordion.js';
@@ -8,8 +8,14 @@ export { AccordionItem } from './components/layout/Accordion/AccordionItem.js';
 export { AccordionTrigger } from './components/layout/Accordion/AccordionTrigger.js';
 export { AccordionContent } from './components/layout/Accordion/AccordionContent.js';
 export { AccordionContentProps, AccordionItemProps, AccordionProps, AccordionSize, AccordionTriggerProps, AccordionVariant } from './components/layout/Accordion/Accordion.types.js';
+export { Divider } from './components/layout/Divider/Divider.js';
+export { DividerOrientation, DividerProps, DividerSpacing, DividerVariant } from './components/layout/Divider/Divider.types.js';
 export { Flex, FlexAlign, FlexAlignContent, FlexDirection, FlexJustify, FlexProps, FlexSpacing, FlexWrap } from './components/layout/Flex/Flex.js';
 export { Grid, GridProps, GridSize, GridSpacing } from './components/layout/Grid/Grid.js';
+export { ListItem } from './components/layout/ListItem/ListItem.js';
+export { ListItemDensity, ListItemProps } from './components/layout/ListItem/ListItem.types.js';
+export { PageHeader } from './components/layout/PageHeader/PageHeader.js';
+export { PageHeaderProps, PageHeaderSize } from './components/layout/PageHeader/PageHeader.types.js';
 export { PanelSurface } from './components/layout/PanelSurface/PanelSurface.js';
 export { PanelSurfaceBodyProps, PanelSurfaceFooterProps, PanelSurfaceHeaderProps, PanelSurfaceProps, PanelSurfaceSize } from './components/layout/PanelSurface/PanelSurface.types.js';
 export { ScrollArea } from './components/layout/ScrollArea/ScrollArea.js';
@@ -19,10 +25,14 @@ export { SplitPane } from './components/layout/SplitPane/SplitPane.js';
 export { SplitPanePanel } from './components/layout/SplitPane/SplitPanePanel.js';
 export { PanelConfig, PanelSize, SplitDirection, SplitPanePanelProps, SplitPaneProps } from './components/layout/SplitPane/SplitPane.types.js';
 export { Stack } from './components/layout/Stack/Stack.js';
+export { Badge } from './components/primitives/Badge/Badge.js';
+export { BadgeColor, BadgeProps, BadgeSize, BadgeVariant } from './components/primitives/Badge/Badge.types.js';
 export { Button, ButtonProps, ButtonSize, ButtonVariant } from './components/primitives/Button/Button.js';
 export { Checkbox } from './components/primitives/Checkbox/Checkbox.js';
 export { CheckboxGroup } from './components/primitives/Checkbox/CheckboxGroup.js';
 export { CheckboxGroupProps, CheckboxProps, CheckboxSize, CheckboxVariant } from './components/primitives/Checkbox/Checkbox.types.js';
+export { Code } from './components/primitives/Code/Code.js';
+export { CodeProps, CodeSize } from './components/primitives/Code/Code.types.js';
 export { Collapsible } from './components/primitives/Collapsible/Collapsible.js';
 export { CollapsibleProps, CollapsibleSize } from './components/primitives/Collapsible/Collapsible.types.js';
 export { Icon, IconProps, IconSize } from './components/primitives/Icon/Icon.js';
@@ -36,8 +46,11 @@ export { PopoverTrigger } from './components/primitives/Popover/PopoverTrigger.j
 export { PopoverCloseProps, PopoverContentProps, PopoverPlacement, PopoverProps, PopoverTriggerProps } from './components/primitives/Popover/Popover.types.js';
 export { Switch, SwitchProps, SwitchSize } from './components/primitives/Switch/Switch.js';
 export { Text, TextAlign, TextColor, TextElement, TextLineHeight, TextProps, TextSize, TextVariant, TextWeight } from './components/primitives/Text/Text.js';
+export { TextArea } from './components/primitives/TextArea/TextArea.js';
+export { TextAreaProps, TextAreaResize, TextAreaSize } from './components/primitives/TextArea/TextArea.types.js';
 export { Tooltip, TooltipProps } from './components/primitives/Tooltip/Tooltip.js';
 export { CollisionAvoidance, TooltipCollisionConfig, TooltipCollisionStrategy, TooltipPlacement } from './components/primitives/Tooltip/types.js';
+export { Brand, DeepPartial, DeepReadonly, KeyOf, LiteralUnion, NonEmptyArray, Prettify, RequireFields, StrictExclude, ValueOf } from './types/utilities.js';
 export { BaseComponent, Size, Variant } from './types/common.js';
 export { ColorPicker } from './components/controls/ColorPicker/ColorPicker.js';
 export { ColorSwatch } from './components/controls/ColorPicker/ColorSwatch.js';
@@ -81,6 +94,10 @@ export { DialogBody } from './components/feedback/Dialog/DialogBody.js';
 export { DialogFooter } from './components/feedback/Dialog/DialogFooter.js';
 export { DialogClose } from './components/feedback/Dialog/DialogClose.js';
 export { DialogBodyProps, DialogFooterProps, DialogHeaderProps, DialogProps, DialogSize } from './components/feedback/Dialog/Dialog.types.js';
+export { EmptyState } from './components/feedback/EmptyState/EmptyState.js';
+export { EmptyStateProps, EmptyStateVariant } from './components/feedback/EmptyState/EmptyState.types.js';
+export { Spinner } from './components/feedback/Spinner/Spinner.js';
+export { SpinnerColor, SpinnerProps, SpinnerSize, SpinnerVariant } from './components/feedback/Spinner/Spinner.types.js';
 export { ToastProvider } from './components/feedback/Toast/ToastProvider.js';
 export { useToast } from './components/feedback/Toast/useToast.js';
 export { ToastData, ToastPosition, ToastProviderProps, ToastSeverity, UseToastReturn } from './components/feedback/Toast/Toast.types.js';
@@ -106,10 +123,12 @@ export { ChatContextChip } from './components/editor/ChatPanel/ChatContextChip.j
 export { ChatEmptyState } from './components/editor/ChatPanel/ChatEmptyState.js';
 export { ChatActionBar } from './components/editor/ChatPanel/ChatActionBar.js';
 export { ChatInputToolbar } from './components/editor/ChatPanel/ChatInputToolbar.js';
+export { ChatMarkdownRenderer } from './components/editor/ChatPanel/ChatMarkdownRenderer.js';
 export { useChatMessages } from './components/editor/ChatPanel/useChatMessages.js';
 export { useChatInput } from './components/editor/ChatPanel/useChatInput.js';
 export { useChatScroll } from './components/editor/ChatPanel/useChatScroll.js';
-export { ChatActionBarProps, ChatAttachmentChipProps, ChatAttachmentData, ChatBubbleProps, ChatCodeBlockProps, ChatContextChipProps, ChatEmptyStateProps, ChatInputProps, ChatInputToolbarProps, ChatMessageData, ChatMessageListProps, ChatMessageProps, ChatMessageRole, ChatMessageStatus, ChatPanelDensity, ChatPanelProps, ChatToolCallData, ChatToolCallProps, ChatToolCallStatus, ChatTypingIndicatorProps, UseChatInputOptions, UseChatInputReturn, UseChatMessagesOptions, UseChatMessagesReturn, UseChatScrollOptions, UseChatScrollReturn } from './components/editor/ChatPanel/ChatPanel.types.js';
+export { ChatActionBarProps, ChatAttachmentChipProps, ChatAttachmentData, ChatBubbleProps, ChatCodeBlockProps, ChatContextChipProps, ChatEmptyStateProps, ChatInputProps, ChatInputToolbarProps, ChatMessageData, ChatMessageListProps, ChatMessageListScrollApi, ChatMessageProps, ChatMessageRole, ChatMessageStatus, ChatPanelDensity, ChatPanelProps, ChatToolCallData, ChatToolCallProps, ChatToolCallStatus, ChatTypingIndicatorProps, UseChatInputOptions, UseChatInputReturn, UseChatMessagesOptions, UseChatMessagesReturn, UseChatScrollOptions, UseChatScrollReturn } from './components/editor/ChatPanel/ChatPanel.types.js';
+export { ChatMarkdownRendererProps } from './components/editor/ChatPanel/ChatMarkdownRenderer.types.js';
 export { AppShell, useAppShell } from './components/shell/AppShell/AppShell.js';
 export { AppShellContextValue, AppShellProps, AppShellSlotProps, AppShellToolbarSlotProps, ToolbarPosition } from './components/shell/AppShell/AppShell.types.js';
 export { FloatingManager, FloatingPanel } from './components/shell/FloatingPanel/FloatingPanel.js';
@@ -121,3 +140,4 @@ export { StatusBarItemProps, StatusBarProps, StatusBarSectionProps, StatusBarSec
 export { Toolbar } from './components/shell/Toolbar/Toolbar.js';
 export { ToolbarButtonProps, ToolbarButtonVariant, ToolbarGroupProps, ToolbarOrientation, ToolbarProps, ToolbarSeparatorProps, ToolbarSize, ToolbarSpacerProps, ToolbarToggleProps } from './components/shell/Toolbar/Toolbar.types.js';
 export { cx as cn, cx } from './utils/cx.js';
+export { animBlink, animFadeIn, animPulse, animSpin, blinkKeyframe, fadeInKeyframe, pulseKeyframe, spinKeyframe } from './utils/animations.css.js';

package/dist/types/theme/ThemeProvider.d.ts

@@ -2,12 +2,24 @@ import React from 'react';
 
 interface ThemeProviderProps {
     children: React.ReactNode;
+    /**
+     * When true, apply Entangle's dark-theme scrollbar styling globally
+     * (thin 8px track, muted thumb). The class is added to
+     * `document.body` and removed on unmount.
+     *
+     * Opt-in by design: many app shells run alongside other UI
+     * frameworks where forcing scrollbar styles would be invasive.
+     *
+     * @default false
+     */
+    globalScrollbars?: boolean;
 }
 /**
  * Theme provider for Entangle UI components.
  *
- * The dark theme is applied globally via CSS custom properties on `:root`.
- * This provider is a simple pass-through — most apps don't need it.
+ * The dark theme is applied globally via CSS custom properties on `:root`,
+ * so this provider is a pass-through for most apps. Use it to opt into
+ * additional global behaviors such as native-scrollbar theming.
  *
  * For scoped theme overrides, use `VanillaThemeProvider` with a custom
  * class generated by `createCustomTheme()`.

package/dist/types/theme/contract.css.d.ts

@@ -22,6 +22,7 @@ declare const vars: {
             secondary: `var(--${string})`;
             tertiary: `var(--${string})`;
             elevated: `var(--${string})`;
+            inset: `var(--${string})`;
         };
         surface: {
             default: `var(--${string})`;
@@ -29,6 +30,8 @@ declare const vars: {
             active: `var(--${string})`;
             disabled: `var(--${string})`;
             whiteOverlay: `var(--${string})`;
+            row: `var(--${string})`;
+            rowHover: `var(--${string})`;
         };
         border: {
             default: `var(--${string})`;

package/dist/types/theme/createCustomTheme.d.ts

@@ -0,0 +1,29 @@
+import { DeepPartial } from '../types/utilities.js';
+import { DarkThemeValues } from './darkTheme.css.js';
+
+type ThemeValues = DarkThemeValues;
+/**
+ * Creates a custom theme scoped to a CSS selector by deep-merging
+ * overrides onto the dark theme defaults.
+ *
+ * MUST be called in a .css.ts file (build-time only).
+ *
+ * @param selector - CSS selector to scope the theme to (e.g. '.my-brand', '[data-theme="light"]')
+ * @param overrides - Partial theme values to override
+ *
+ * @example
+ * ```typescript
+ * // my-theme.css.ts
+ * import { createCustomTheme } from 'entangle-ui/theme';
+ *
+ * createCustomTheme('.my-brand', {
+ *   colors: {
+ *     accent: { primary: '#ff6600' },
+ *   },
+ * });
+ * ```
+ */
+declare function createCustomTheme(selector: string, overrides: DeepPartial<ThemeValues>): void;
+
+export { createCustomTheme };
+export type { ThemeValues };

package/dist/types/theme/darkTheme.css.d.ts

@@ -9,6 +9,7 @@ declare const darkThemeValues: {
             readonly secondary: "#2d2d2d";
             readonly tertiary: "#3a3a3a";
             readonly elevated: "#404040";
+            readonly inset: "rgba(0, 0, 0, 0.2)";
         };
         readonly surface: {
             readonly default: "#2d2d2d";
@@ -16,6 +17,8 @@ declare const darkThemeValues: {
             readonly active: "#404040";
             readonly disabled: "#1f1f1f";
             readonly whiteOverlay: "rgba(255, 255, 255, 0.1)";
+            readonly row: "transparent";
+            readonly rowHover: "rgba(255, 255, 255, 0.03)";
         };
         readonly border: {
             readonly default: "#4a4a4a";

package/dist/types/utils/animations.css.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Shared keyframe and animation utility classes.
+ *
+ * Prefer these over redefining the same keyframes in every component —
+ * it keeps the built CSS small and ensures consistent motion across
+ * the library. Each utility class respects
+ * `@media (prefers-reduced-motion: reduce)` by disabling the animation.
+ */
+declare const spinKeyframe: string;
+declare const pulseKeyframe: string;
+declare const blinkKeyframe: string;
+declare const fadeInKeyframe: string;
+declare const animSpin: string;
+declare const animPulse: string;
+declare const animBlink: string;
+declare const animFadeIn: string;
+
+export { animBlink, animFadeIn, animPulse, animSpin, blinkKeyframe, fadeInKeyframe, pulseKeyframe, spinKeyframe };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "entangle-ui",
-  "version": "0.6.2",
+  "version": "0.7.0",
   "type": "module",
   "sideEffects": [
     "*.css",