@nick-skriabin/glyph 0.1.69 → 0.1.71

package/dist/index.d.ts

@@ -84,6 +84,69 @@ interface AppHandle {
     exit(code?: number): void;
 }
 
+/**
+ * DOM-like imperative handles for focusable components.
+ * Use these with React refs to programmatically control components.
+ *
+ * @example
+ * ```tsx
+ * const inputRef = useRef<InputHandle>(null);
+ *
+ * // Programmatic focus
+ * inputRef.current?.focus();
+ *
+ * // Read current value
+ * console.log(inputRef.current?.value);
+ *
+ * <Input ref={inputRef} onChange={setValue} />
+ * ```
+ */
+/** Base handle shared by all focusable elements */
+interface FocusableHandle {
+    /** Programmatically focus this element */
+    focus(): void;
+    /** Programmatically blur (unfocus) this element */
+    blur(): void;
+    /** Whether this element is currently focused */
+    readonly isFocused: boolean;
+}
+/** Handle for Button */
+interface ButtonHandle extends FocusableHandle {
+}
+/** Handle for Input — exposes current value */
+interface InputHandle extends FocusableHandle {
+    /** Current text value */
+    readonly value: string;
+}
+/** Handle for Select — exposes current selected value */
+interface SelectHandle extends FocusableHandle {
+    /** Currently selected value (undefined if nothing selected) */
+    readonly value: string | undefined;
+    /** Whether the dropdown is currently open */
+    readonly isOpen: boolean;
+}
+/** Handle for Checkbox — exposes checked state */
+interface CheckboxHandle extends FocusableHandle {
+    /** Whether the checkbox is currently checked */
+    readonly checked: boolean;
+}
+/** Handle for Radio — exposes selected value */
+interface RadioHandle<T = string> extends FocusableHandle {
+    /** Currently selected value */
+    readonly value: T | undefined;
+}
+/** Handle for List — exposes selected index */
+interface ListHandle extends FocusableHandle {
+    /** Currently selected index */
+    readonly selectedIndex: number;
+}
+/** Handle for Image */
+interface ImageHandle extends FocusableHandle {
+}
+/** Handle for Text (when focusable) */
+interface TextHandle extends FocusableHandle {
+}
+
 declare function render(element: ReactElement, opts?: RenderOptions): AppHandle;
 
 type GlyphNodeType = "box" | "text" | "input";
@@ -123,7 +186,7 @@ interface TextProps {
     focusable?: boolean;
     focusedStyle?: Style;
 }
-declare const Text: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<GlyphNode>>;
+declare const Text: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<TextHandle>>;
 
 type InputType = "text" | "number";
 interface InputProps {
@@ -157,7 +220,7 @@ interface InputProps {
      */
     type?: InputType;
 }
-declare function Input(props: InputProps): React.JSX.Element;
+declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<InputHandle>>;
 
 interface FocusScopeProps {
     trap?: boolean;
@@ -206,7 +269,7 @@ interface ButtonProps {
     children?: ReactNode;
     disabled?: boolean;
 }
-declare function Button({ onPress, style, focusedStyle, children, disabled, }: ButtonProps): React.JSX.Element;
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<ButtonHandle>>;
 
 /** Visible range passed to render function in virtualized mode */
 interface VisibleRange {
@@ -289,7 +352,7 @@ interface ListProps {
     /** Whether the list is focusable (default: true) */
     focusable?: boolean;
 }
-declare function List({ count, renderItem, selectedIndex: controlledIndex, onSelectionChange, onSelect, defaultSelectedIndex, disabledIndices, style, focusable, }: ListProps): React.JSX.Element;
+declare const List: React.ForwardRefExoticComponent<ListProps & React.RefAttributes<ListHandle>>;
 
 interface MenuItem {
     label: string;
@@ -395,7 +458,7 @@ interface SelectProps {
     /** Disabled state */
     disabled?: boolean;
 }
-declare function Select({ items, value, onChange, placeholder, style, focusedStyle, dropdownStyle, highlightColor, maxVisible, searchable, disabled, }: SelectProps): React.JSX.Element;
+declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<SelectHandle>>;
 
 interface CheckboxProps {
     /** Whether the checkbox is checked */
@@ -415,7 +478,7 @@ interface CheckboxProps {
     /** Custom character for unchecked state (default: " ") */
     uncheckedChar?: string;
 }
-declare function Checkbox({ checked, onChange, label, style, focusedStyle, disabled, checkedChar, uncheckedChar, }: CheckboxProps): React.JSX.Element;
+declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<CheckboxHandle>>;
 
 interface RadioItem<T = string> {
     /** Display label */
@@ -451,7 +514,11 @@ interface RadioProps<T = string> {
     /** Custom character for unselected state (default: "○") */
     unselectedChar?: string;
 }
-declare function Radio<T = string>({ items, value, onChange, style, itemStyle, focusedItemStyle, selectedItemStyle, disabled, direction, gap, selectedChar, unselectedChar, }: RadioProps<T>): React.JSX.Element;
+/**
+ * Radio group component with imperative handle support.
+ * Use `ref` to get `{ focus, blur, isFocused, value }`.
+ */
+declare const Radio: <T = string>(props: RadioProps<T> & React.RefAttributes<RadioHandle<T>>) => React.JSX.Element;
 
 interface AlertOptions {
     /** Text for the OK button (default: "OK") */
@@ -598,7 +665,7 @@ interface ImageProps {
      */
     unloadTrigger?: number;
 }
-declare function Image({ src, width, height, unloadTrigger, style, focusedStyle, placeholderStyle, focusable, disabled, inline, placeholder, onStateChange, onError, autoLoad, autoSize, maxWidth, maxHeight, }: ImageProps): React.JSX.Element;
+declare const Image: React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<ImageHandle>>;
 
 declare function useInput(handler: (key: Key) => void, deps?: any[]): void;
 
@@ -630,6 +697,8 @@ interface UseFocusableResult {
     isFocused: boolean;
     /** Programmatically request focus on this element */
     focus: () => void;
+    /** Programmatically blur (unfocus) this element */
+    blur: () => void;
     /** The focus ID (useful for conditional logic) */
     focusId: string | null;
 }
@@ -834,4 +903,4 @@ declare function detectTerminalCapabilities(debug?: boolean): TerminalCapabiliti
  */
 declare function supportsInlineImages(): boolean;
 
-export { type AlertOptions, type AnsiStyle, type AppHandle, type BorderStyle, Box, type BoxProps, Button, type ButtonProps, Checkbox, type CheckboxProps, type Color, type ConfirmOptions, type DialogContextValue, DialogHost, type DialogHostProps, type DimensionValue, type FocusRegistryValue, FocusScope, type FocusScopeProps, type FocusableElement, type HexColor, Image, type ImageProps, type ImageState, Input, type InputProps, type InputType, JumpNav, type JumpNavProps, type Key, Keybind, type KeybindProps, type LayoutRect, List, type ListItemInfo, type ListProps, type MaskOptions, Menu, type MenuItem, type MenuProps, type NamedColor, Portal, type PortalProps, Progress, type ProgressProps, type RGBColor, Radio, type RadioItem, type RadioProps, type RenderOptions, ScrollView, type ScrollViewProps, Select, type SelectItem, type SelectProps, Spacer, type SpacerProps, Spinner, type SpinnerProps, type Style, type StyledSegment, type TerminalCapabilities, Text, type TextAlign, type TextProps, type Toast, ToastHost, type ToastHostProps, type ToastPosition, type ToastVariant, type UseFocusableOptions, type UseFocusableResult, type VisibleRange, type WrapMode, createMask, detectTerminalCapabilities, masks, parseAnsi, render, stripAnsi, supportsInlineImages, useApp, useDialog, useFocus, useFocusRegistry, useFocusable, useInput, useLayout, useToast };
+export { type AlertOptions, type AnsiStyle, type AppHandle, type BorderStyle, Box, type BoxProps, Button, type ButtonHandle, type ButtonProps, Checkbox, type CheckboxHandle, type CheckboxProps, type Color, type ConfirmOptions, type DialogContextValue, DialogHost, type DialogHostProps, type DimensionValue, type FocusRegistryValue, FocusScope, type FocusScopeProps, type FocusableElement, type FocusableHandle, type HexColor, Image, type ImageHandle, type ImageProps, type ImageState, Input, type InputHandle, type InputProps, type InputType, JumpNav, type JumpNavProps, type Key, Keybind, type KeybindProps, type LayoutRect, List, type ListHandle, type ListItemInfo, type ListProps, type MaskOptions, Menu, type MenuItem, type MenuProps, type NamedColor, Portal, type PortalProps, Progress, type ProgressProps, type RGBColor, Radio, type RadioHandle, type RadioItem, type RadioProps, type RenderOptions, ScrollView, type ScrollViewProps, Select, type SelectHandle, type SelectItem, type SelectProps, Spacer, type SpacerProps, Spinner, type SpinnerProps, type Style, type StyledSegment, type TerminalCapabilities, Text, type TextAlign, type TextHandle, type TextProps, type Toast, ToastHost, type ToastHostProps, type ToastPosition, type ToastVariant, type UseFocusableOptions, type UseFocusableResult, type VisibleRange, type WrapMode, createMask, detectTerminalCapabilities, masks, parseAnsi, render, stripAnsi, supportsInlineImages, useApp, useDialog, useFocus, useFocusRegistry, useFocusable, useInput, useLayout, useToast };