@entropix/react 0.1.0 → 0.2.0

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-import { AccessibilityProps, KeyboardHandlerConfig, KeyIntent, UseDialogOptions, UseTabsOptions, UseAccordionOptions, UseMenuOptions } from '@entropix/core';
+import { AccessibilityProps, KeyboardHandlerConfig, KeyIntent, UseDialogOptions, UseTabsOptions, UseAccordionOptions, UseMenuOptions, UseRadioGroupOptions, UseSelectOptions } from '@entropix/core';
 import * as react from 'react';
 import react__default from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
@@ -225,6 +225,187 @@ interface MenuItemProps {
 }
 declare function MenuItem({ index, onSelect, disabled, children, className, }: MenuItemProps): react_jsx_runtime.JSX.Element;
 
+interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "disabled" | "value" | "size"> {
+    /** Controlled value */
+    value?: string;
+    /** Default value for uncontrolled mode */
+    defaultValue?: string;
+    /** Called when the value changes */
+    onChange?: (value: string) => void;
+    /** Whether the input is disabled */
+    disabled?: boolean;
+    /** Whether the input is read-only */
+    readOnly?: boolean;
+    /** Whether the input is required */
+    required?: boolean;
+    /** Whether the input is in an invalid state */
+    invalid?: boolean;
+    /** Label text */
+    label?: string;
+    /** Helper text displayed below the input */
+    helperText?: string;
+    /** Error message displayed below the input (sets invalid=true when present) */
+    errorMessage?: string;
+    /** Visual variant */
+    variant?: "default" | "filled";
+    /** Size */
+    size?: "sm" | "md" | "lg";
+}
+/**
+ * Input component — web adapter for @entropix/core's useInput.
+ *
+ * Renders a wrapper div with label, input, helper text, and error message.
+ * Sets data-state, data-variant, and data-size attributes for CSS targeting.
+ */
+declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
+
+interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange" | "disabled" | "value"> {
+    /** Controlled value */
+    value?: string;
+    /** Default value for uncontrolled mode */
+    defaultValue?: string;
+    /** Called when the value changes */
+    onChange?: (value: string) => void;
+    /** Whether the textarea is disabled */
+    disabled?: boolean;
+    /** Whether the textarea is read-only */
+    readOnly?: boolean;
+    /** Whether the textarea is required */
+    required?: boolean;
+    /** Whether the textarea is in an invalid state */
+    invalid?: boolean;
+    /** Label text */
+    label?: string;
+    /** Helper text displayed below the textarea */
+    helperText?: string;
+    /** Error message displayed below the textarea (sets invalid=true when present) */
+    errorMessage?: string;
+    /** Visual variant */
+    variant?: "default" | "filled";
+    /** Size */
+    size?: "sm" | "md" | "lg";
+    /** Number of visible text rows */
+    rows?: number;
+    /** Resize behavior */
+    resize?: "none" | "vertical" | "both";
+}
+/**
+ * Textarea component — web adapter for @entropix/core's useInput.
+ *
+ * Renders a wrapper div with label, textarea, helper text, and error message.
+ * Sets data-state, data-variant, and data-size attributes for CSS targeting.
+ */
+declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
+
+interface CheckboxProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange" | "disabled"> {
+    /** Controlled checked state */
+    checked?: boolean;
+    /** Default checked state for uncontrolled mode */
+    defaultChecked?: boolean;
+    /** Called when checked state changes */
+    onChange?: (checked: boolean) => void;
+    /** Whether the checkbox is disabled */
+    disabled?: boolean;
+    /** Accessible label text */
+    label?: string;
+    /** Whether the checkbox is in an indeterminate state */
+    indeterminate?: boolean;
+}
+/**
+ * Checkbox component — web adapter for @entropix/core's useToggle.
+ *
+ * Renders a `<button type="button">` with role="checkbox" containing
+ * an indicator span and a label span.
+ * Sets data-state="checked"|"unchecked"|"indeterminate" for CSS targeting.
+ */
+declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface RadioGroupProps extends UseRadioGroupOptions {
+    /** Label for the radio group */
+    label?: string;
+    children: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * RadioGroup component — web adapter for @entropix/core's useRadioGroup.
+ *
+ * Renders a `<div role="radiogroup">` that provides context to RadioItem children.
+ * Sets data-orientation for CSS targeting.
+ */
+declare function RadioGroup({ children, label, className, ...options }: RadioGroupProps): react_jsx_runtime.JSX.Element;
+
+interface RadioItemProps {
+    /** The value this radio option represents */
+    value: string;
+    /** Whether this specific radio is disabled */
+    disabled?: boolean;
+    /** Label text */
+    label?: string;
+    children?: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * RadioItem component — a single radio option within a RadioGroup.
+ *
+ * Renders a `<button type="button" role="radio">` with an indicator
+ * circle and label. Sets data-state="checked"|"unchecked" for CSS targeting.
+ */
+declare function RadioItem({ value, disabled, label, children, className, }: RadioItemProps): react_jsx_runtime.JSX.Element;
+
+interface SelectProps extends UseSelectOptions {
+    /** Label for the select */
+    label?: string;
+    children: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * Select component — web adapter for @entropix/core's useSelect.
+ *
+ * Provides context to SelectTrigger, SelectContent, and SelectOption children.
+ */
+declare function Select({ children, label, className, ...options }: SelectProps): react_jsx_runtime.JSX.Element;
+
+interface SelectTriggerProps {
+    /** Placeholder text when no value is selected */
+    placeholder?: string;
+    children?: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * SelectTrigger — renders like a styled input with a chevron.
+ *
+ * Displays the currently selected value or placeholder text.
+ */
+declare function SelectTrigger({ placeholder, children, className, }: SelectTriggerProps): react_jsx_runtime.JSX.Element;
+
+interface SelectContentProps {
+    children: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * SelectContent — renders the dropdown container for options.
+ *
+ * Only visible when the select is open.
+ */
+declare function SelectContent({ children, className }: SelectContentProps): react_jsx_runtime.JSX.Element | null;
+
+interface SelectOptionProps {
+    /** The value this option represents */
+    value: string;
+    /** The index of this option in the list (auto-assigned by SelectContent if omitted) */
+    index?: number;
+    /** Whether this option is disabled */
+    disabled?: boolean;
+    children: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * SelectOption — renders an option within SelectContent.
+ *
+ * Sets data-state="selected"|"unselected" for CSS targeting.
+ */
+declare function SelectOption({ value, index, disabled, children, className, }: SelectOptionProps): react_jsx_runtime.JSX.Element;
+
 /**
  * Breakpoint values in pixels, matching @entropix/tokens breakpoint primitives.
  */
@@ -376,4 +557,4 @@ interface DividerProps extends React.HTMLAttributes<HTMLHRElement> {
  */
 declare const Divider: react.ForwardRefExoticComponent<DividerProps & react.RefAttributes<HTMLHRElement>>;
 
-export { Accordion, AccordionItem, type AccordionItemProps, AccordionPanel, type AccordionPanelProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, BREAKPOINTS, type Breakpoint, Button, type ButtonProps, Container, type ContainerProps, type ContainerSize, Dialog, DialogClose, type DialogCloseProps, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogOverlay, type DialogOverlayProps, type DialogProps, DialogTitle, type DialogTitleProps, DialogTrigger, type DialogTriggerProps, Divider, type DividerProps, Inline, type InlineProps, Menu, MenuContent, type MenuContentProps, MenuItem, type MenuItemProps, type MenuProps, MenuTrigger, type MenuTriggerProps, type SpacingSize$1 as SpacingSize, Stack, type StackProps, Switch, type SwitchProps, Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, Toggle, type ToggleProps, mapAccessibilityToAria, useBreakpoint, useBreakpointValue, useFocusRestore, useFocusTrap, useKeyboardHandler, useMediaQuery };
+export { Accordion, AccordionItem, type AccordionItemProps, AccordionPanel, type AccordionPanelProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, BREAKPOINTS, type Breakpoint, Button, type ButtonProps, Checkbox, type CheckboxProps, Container, type ContainerProps, type ContainerSize, Dialog, DialogClose, type DialogCloseProps, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogOverlay, type DialogOverlayProps, type DialogProps, DialogTitle, type DialogTitleProps, DialogTrigger, type DialogTriggerProps, Divider, type DividerProps, Inline, type InlineProps, Input, type InputProps, Menu, MenuContent, type MenuContentProps, MenuItem, type MenuItemProps, type MenuProps, MenuTrigger, type MenuTriggerProps, RadioGroup, type RadioGroupProps, RadioItem, type RadioItemProps, Select, SelectContent, type SelectContentProps, SelectOption, type SelectOptionProps, type SelectProps, SelectTrigger, type SelectTriggerProps, type SpacingSize$1 as SpacingSize, Stack, type StackProps, Switch, type SwitchProps, Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, Textarea, type TextareaProps, Toggle, type ToggleProps, mapAccessibilityToAria, useBreakpoint, useBreakpointValue, useFocusRestore, useFocusTrap, useKeyboardHandler, useMediaQuery };

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { AccessibilityProps, KeyboardHandlerConfig, KeyIntent, UseDialogOptions, UseTabsOptions, UseAccordionOptions, UseMenuOptions } from '@entropix/core';
+import { AccessibilityProps, KeyboardHandlerConfig, KeyIntent, UseDialogOptions, UseTabsOptions, UseAccordionOptions, UseMenuOptions, UseRadioGroupOptions, UseSelectOptions } from '@entropix/core';
 import * as react from 'react';
 import react__default from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
@@ -225,6 +225,187 @@ interface MenuItemProps {
 }
 declare function MenuItem({ index, onSelect, disabled, children, className, }: MenuItemProps): react_jsx_runtime.JSX.Element;
 
+interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "disabled" | "value" | "size"> {
+    /** Controlled value */
+    value?: string;
+    /** Default value for uncontrolled mode */
+    defaultValue?: string;
+    /** Called when the value changes */
+    onChange?: (value: string) => void;
+    /** Whether the input is disabled */
+    disabled?: boolean;
+    /** Whether the input is read-only */
+    readOnly?: boolean;
+    /** Whether the input is required */
+    required?: boolean;
+    /** Whether the input is in an invalid state */
+    invalid?: boolean;
+    /** Label text */
+    label?: string;
+    /** Helper text displayed below the input */
+    helperText?: string;
+    /** Error message displayed below the input (sets invalid=true when present) */
+    errorMessage?: string;
+    /** Visual variant */
+    variant?: "default" | "filled";
+    /** Size */
+    size?: "sm" | "md" | "lg";
+}
+/**
+ * Input component — web adapter for @entropix/core's useInput.
+ *
+ * Renders a wrapper div with label, input, helper text, and error message.
+ * Sets data-state, data-variant, and data-size attributes for CSS targeting.
+ */
+declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
+
+interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange" | "disabled" | "value"> {
+    /** Controlled value */
+    value?: string;
+    /** Default value for uncontrolled mode */
+    defaultValue?: string;
+    /** Called when the value changes */
+    onChange?: (value: string) => void;
+    /** Whether the textarea is disabled */
+    disabled?: boolean;
+    /** Whether the textarea is read-only */
+    readOnly?: boolean;
+    /** Whether the textarea is required */
+    required?: boolean;
+    /** Whether the textarea is in an invalid state */
+    invalid?: boolean;
+    /** Label text */
+    label?: string;
+    /** Helper text displayed below the textarea */
+    helperText?: string;
+    /** Error message displayed below the textarea (sets invalid=true when present) */
+    errorMessage?: string;
+    /** Visual variant */
+    variant?: "default" | "filled";
+    /** Size */
+    size?: "sm" | "md" | "lg";
+    /** Number of visible text rows */
+    rows?: number;
+    /** Resize behavior */
+    resize?: "none" | "vertical" | "both";
+}
+/**
+ * Textarea component — web adapter for @entropix/core's useInput.
+ *
+ * Renders a wrapper div with label, textarea, helper text, and error message.
+ * Sets data-state, data-variant, and data-size attributes for CSS targeting.
+ */
+declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
+
+interface CheckboxProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange" | "disabled"> {
+    /** Controlled checked state */
+    checked?: boolean;
+    /** Default checked state for uncontrolled mode */
+    defaultChecked?: boolean;
+    /** Called when checked state changes */
+    onChange?: (checked: boolean) => void;
+    /** Whether the checkbox is disabled */
+    disabled?: boolean;
+    /** Accessible label text */
+    label?: string;
+    /** Whether the checkbox is in an indeterminate state */
+    indeterminate?: boolean;
+}
+/**
+ * Checkbox component — web adapter for @entropix/core's useToggle.
+ *
+ * Renders a `<button type="button">` with role="checkbox" containing
+ * an indicator span and a label span.
+ * Sets data-state="checked"|"unchecked"|"indeterminate" for CSS targeting.
+ */
+declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface RadioGroupProps extends UseRadioGroupOptions {
+    /** Label for the radio group */
+    label?: string;
+    children: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * RadioGroup component — web adapter for @entropix/core's useRadioGroup.
+ *
+ * Renders a `<div role="radiogroup">` that provides context to RadioItem children.
+ * Sets data-orientation for CSS targeting.
+ */
+declare function RadioGroup({ children, label, className, ...options }: RadioGroupProps): react_jsx_runtime.JSX.Element;
+
+interface RadioItemProps {
+    /** The value this radio option represents */
+    value: string;
+    /** Whether this specific radio is disabled */
+    disabled?: boolean;
+    /** Label text */
+    label?: string;
+    children?: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * RadioItem component — a single radio option within a RadioGroup.
+ *
+ * Renders a `<button type="button" role="radio">` with an indicator
+ * circle and label. Sets data-state="checked"|"unchecked" for CSS targeting.
+ */
+declare function RadioItem({ value, disabled, label, children, className, }: RadioItemProps): react_jsx_runtime.JSX.Element;
+
+interface SelectProps extends UseSelectOptions {
+    /** Label for the select */
+    label?: string;
+    children: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * Select component — web adapter for @entropix/core's useSelect.
+ *
+ * Provides context to SelectTrigger, SelectContent, and SelectOption children.
+ */
+declare function Select({ children, label, className, ...options }: SelectProps): react_jsx_runtime.JSX.Element;
+
+interface SelectTriggerProps {
+    /** Placeholder text when no value is selected */
+    placeholder?: string;
+    children?: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * SelectTrigger — renders like a styled input with a chevron.
+ *
+ * Displays the currently selected value or placeholder text.
+ */
+declare function SelectTrigger({ placeholder, children, className, }: SelectTriggerProps): react_jsx_runtime.JSX.Element;
+
+interface SelectContentProps {
+    children: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * SelectContent — renders the dropdown container for options.
+ *
+ * Only visible when the select is open.
+ */
+declare function SelectContent({ children, className }: SelectContentProps): react_jsx_runtime.JSX.Element | null;
+
+interface SelectOptionProps {
+    /** The value this option represents */
+    value: string;
+    /** The index of this option in the list (auto-assigned by SelectContent if omitted) */
+    index?: number;
+    /** Whether this option is disabled */
+    disabled?: boolean;
+    children: react__default.ReactNode;
+    className?: string;
+}
+/**
+ * SelectOption — renders an option within SelectContent.
+ *
+ * Sets data-state="selected"|"unselected" for CSS targeting.
+ */
+declare function SelectOption({ value, index, disabled, children, className, }: SelectOptionProps): react_jsx_runtime.JSX.Element;
+
 /**
  * Breakpoint values in pixels, matching @entropix/tokens breakpoint primitives.
  */
@@ -376,4 +557,4 @@ interface DividerProps extends React.HTMLAttributes<HTMLHRElement> {
  */
 declare const Divider: react.ForwardRefExoticComponent<DividerProps & react.RefAttributes<HTMLHRElement>>;
 
-export { Accordion, AccordionItem, type AccordionItemProps, AccordionPanel, type AccordionPanelProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, BREAKPOINTS, type Breakpoint, Button, type ButtonProps, Container, type ContainerProps, type ContainerSize, Dialog, DialogClose, type DialogCloseProps, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogOverlay, type DialogOverlayProps, type DialogProps, DialogTitle, type DialogTitleProps, DialogTrigger, type DialogTriggerProps, Divider, type DividerProps, Inline, type InlineProps, Menu, MenuContent, type MenuContentProps, MenuItem, type MenuItemProps, type MenuProps, MenuTrigger, type MenuTriggerProps, type SpacingSize$1 as SpacingSize, Stack, type StackProps, Switch, type SwitchProps, Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, Toggle, type ToggleProps, mapAccessibilityToAria, useBreakpoint, useBreakpointValue, useFocusRestore, useFocusTrap, useKeyboardHandler, useMediaQuery };
+export { Accordion, AccordionItem, type AccordionItemProps, AccordionPanel, type AccordionPanelProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, BREAKPOINTS, type Breakpoint, Button, type ButtonProps, Checkbox, type CheckboxProps, Container, type ContainerProps, type ContainerSize, Dialog, DialogClose, type DialogCloseProps, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogOverlay, type DialogOverlayProps, type DialogProps, DialogTitle, type DialogTitleProps, DialogTrigger, type DialogTriggerProps, Divider, type DividerProps, Inline, type InlineProps, Input, type InputProps, Menu, MenuContent, type MenuContentProps, MenuItem, type MenuItemProps, type MenuProps, MenuTrigger, type MenuTriggerProps, RadioGroup, type RadioGroupProps, RadioItem, type RadioItemProps, Select, SelectContent, type SelectContentProps, SelectOption, type SelectOptionProps, type SelectProps, SelectTrigger, type SelectTriggerProps, type SpacingSize$1 as SpacingSize, Stack, type StackProps, Switch, type SwitchProps, Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, Textarea, type TextareaProps, Toggle, type ToggleProps, mapAccessibilityToAria, useBreakpoint, useBreakpointValue, useFocusRestore, useFocusTrap, useKeyboardHandler, useMediaQuery };