@capitaltg/vero 1.12.0 → 1.13.1

package/dist/types/index.d.ts

@@ -58,13 +58,13 @@ declare type AlertSize = 'sm' | 'default';
 
 declare type AlertVariant = 'success' | 'warning' | 'danger' | 'info';
 
-export declare const Autocomplete: <T, K extends keyof T, L extends keyof T>(props: AutocompleteProps<T, K, L> & {
+export declare const Autocomplete: <T>(props: AutocompleteProps<T> & {
     ref?: default_2.ForwardedRef<HTMLButtonElement>;
 }) => default_2.ReactElement;
 
 declare type AutocompleteFormAttributes = Pick<React.SelectHTMLAttributes<HTMLSelectElement>, 'name' | 'required' | 'autoFocus'>;
 
-export declare interface AutocompleteProps<T, K extends keyof T, L extends keyof T> extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'disabled' | 'value'>, AutocompleteFormAttributes {
+export declare interface AutocompleteProps<T> extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'disabled' | 'value'>, AutocompleteFormAttributes {
     /**
      * Async function to fetch options based on user input.
      * Receives the current input value and returns a promise that resolves to an array of options.
@@ -77,26 +77,42 @@ export declare interface AutocompleteProps<T, K extends keyof T, L extends keyof
      */
     options?: T[];
     /**
-     * The currently selected value. Must match the value of one of the options using the valueKey.
+     * The currently selected value as a string.
      * Use an empty string ('') to represent no selection.
      */
-    value: T[K] | '';
+    value: string;
     /**
-     * The key to use for the value property in option objects.
-     * Must be a key of T.
+     * Derives the unique string value for an option, used for selection matching and onChange.
+     * Required unless all options are uniquely identifiable by another means.
      */
-    valueKey: K;
+    getOptionValue?: (option: T) => string;
     /**
-     * The key to use for the label property in option objects.
-     * Must be a key of T.
+     * Derives the display label for an option.
+     * Used as the default label in the dropdown and trigger, and as the field searched when
+     * filtering static options. If not provided, filtering falls back to the option value string.
      */
-    labelKey: L;
+    getOptionLabel?: (option: T) => string;
     /**
      * Callback function invoked when the selected value changes.
-     * @param value - The selected value from the option object.
+     * @param value - The selected option's value as a string, or empty string when clearing.
      * @param item - The full option object, or undefined when clearing the selection.
      */
-    onChange: (value: T[K], item?: T) => void;
+    onChange: (value: string, item?: T) => void;
+    /**
+     * Custom render function for the selected value shown in the trigger button.
+     * Receives the full selected option object. Falls back to getOptionLabel, then the raw value string.
+     * @param option - The currently selected option object.
+     * @returns A React node to render inside the trigger.
+     */
+    renderValue?: (option: T) => React.ReactNode;
+    /**
+     * Custom render function for each option in the dropdown.
+     * Receives the option object and whether it's currently selected.
+     * If not provided, defaults to rendering a Check icon and the getOptionLabel value.
+     * @param isSelected - Whether this option is currently selected.
+     * @returns A React node to render for this option.
+     */
+    renderOption?: (option: T, isSelected: boolean) => React.ReactNode;
     /**
      * Placeholder text displayed when no option is selected.
      * @default 'Select an option...'
@@ -122,7 +138,6 @@ export declare interface AutocompleteProps<T, K extends keyof T, L extends keyof
     maxSuggestions?: number;
     /**
      * Debounce delay for async searches in milliseconds.
-     * Prevents excessive API calls by waiting for the user to stop typing.
      * @default 300
      */
     debounceMs?: number;
@@ -152,27 +167,15 @@ export declare interface AutocompleteProps<T, K extends keyof T, L extends keyof
     zIndex?: number;
     /**
      * Whether the component is disabled.
-     * When true, the autocomplete cannot be interacted with.
      * @default false
      */
     isDisabled?: boolean;
-    /**
-     * Custom render function for each option in the dropdown.
-     * Receives the option object and whether it's currently selected.
-     * If not provided, defaults to rendering a Check icon and the option label.
-     * @param option - The option object of type T.
-     * @param isSelected - Whether this option is currently selected.
-     * @returns A React node to render for this option.
-     */
-    renderOption?: (option: T, isSelected: boolean) => React.ReactNode;
     /**
      * The name attribute for form submission.
-     * This is required for the autocomplete value to be included in form data.
      */
     name?: string;
     /**
      * Whether the autocomplete is required for form validation.
-     * When true, the form cannot be submitted without a selection.
      */
     required?: boolean;
     /**
@@ -229,6 +232,7 @@ export declare interface CheckboxGroupProps extends Omit<HTMLAttributes<HTMLDivE
     value: string[];
     onChange: (value: string[]) => void;
     className?: string;
+    isDisabled?: boolean;
     /** Number of columns for default and tile variants (vertical orientation). Defaults to 1. */
     columns?: 1 | 2 | 3 | 4;
     orientation?: 'horizontal' | 'vertical';
@@ -240,6 +244,7 @@ export declare interface CheckboxOption {
     id: string;
     label: string;
     description?: string;
+    isDisabled?: boolean;
     /** Optional explicit id for the checkbox input. Defaults to `${groupId}-${id}` when CheckboxGroup has an id. */
     inputId?: string;
 }
@@ -374,6 +379,8 @@ export declare interface DateRangePickerProps extends Omit<ButtonHTMLAttributes<
     className?: string;
     zIndex?: number;
     isDisabled?: boolean;
+    startMonth?: Date;
+    endMonth?: Date;
     /**
      * The name attribute for form submission.
      * This is required for the date range picker value to be included in form data.
@@ -444,6 +451,7 @@ export declare interface DropdownButtonProps extends Omit<ComponentPropsWithoutR
     className?: string;
     isDisabled?: boolean;
     align?: 'start' | 'center' | 'end';
+    zIndex?: number;
 }
 
 export declare interface DropdownItem {
@@ -602,7 +610,8 @@ export declare const Radio: React_2.ForwardRefExoticComponent<RadioProps & React
 
 export declare const RadioGroup: React_2.ForwardRefExoticComponent<RadioGroupProps & React_2.RefAttributes<HTMLDivElement>>;
 
-declare type RadioGroupBaseProps = Omit<ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>, 'onValueChange' | 'onChange'> & {
+declare type RadioGroupBaseProps = Omit<ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>, 'onValueChange' | 'onChange' | 'disabled'> & {
+    isDisabled?: boolean;
     value?: string;
     onChange?: (value: string) => void;
     className?: string;
@@ -630,6 +639,7 @@ export declare interface RadioOption {
     value: string;
     label: string;
     description?: string;
+    isDisabled?: boolean;
     /** Optional explicit id for the radio input. Defaults to `${groupId}-${value}` when RadioGroup has an id. */
     id?: string;
 }
@@ -647,9 +657,7 @@ export declare interface RadioProps extends Omit<ComponentPropsWithoutRef<typeof
  */
 export declare function resetZIndexConfig(): void;
 
-declare const Select: React_2.ForwardRefExoticComponent<SelectProps & React_2.RefAttributes<HTMLButtonElement>>;
-export { Select }
-export { Select as SingleSelect }
+export declare const Select: React_2.ForwardRefExoticComponent<SelectProps & React_2.RefAttributes<HTMLButtonElement>>;
 
 export declare const SelectContent: React_2.ForwardRefExoticComponent<SelectContentProps & React_2.RefAttributes<HTMLDivElement>>;
 
@@ -734,6 +742,10 @@ declare type SingleOrAccordionProps = {
     onValueChange?: (value: string) => void;
 };
 
+/** @deprecated Use `Select` instead. */
+export declare const SingleSelect: React_2.ForwardRefExoticComponent<SelectProps & React_2.RefAttributes<HTMLButtonElement>>;
+
+/** @deprecated Use `SelectProps` instead. */
 export declare type SingleSelectProps = SelectProps;
 
 export declare interface Step {
@@ -801,7 +813,9 @@ export declare interface SwitchGroupProps extends Omit<HTMLAttributes<HTMLDivEle
     options: SwitchOption[];
     value: string[];
     className?: string;
+    isDisabled?: boolean;
     columns?: 1 | 2 | 3 | 4;
+    orientation?: 'horizontal' | 'vertical';
     onChange: (value: string[]) => void;
 }
 
@@ -838,9 +852,11 @@ export declare interface TabsProps extends ComponentPropsWithoutRef<typeof TabsP
     defaultValue?: string;
 }
 
-export declare const TabsTrigger: React_2.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React_2.RefAttributes<HTMLButtonElement>, "ref"> & React_2.RefAttributes<HTMLButtonElement>>;
+export declare const TabsTrigger: React_2.ForwardRefExoticComponent<TabsTriggerProps & React_2.RefAttributes<HTMLButtonElement>>;
 
-export declare type TabsTriggerProps = ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>;
+export declare interface TabsTriggerProps extends Omit<ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>, 'disabled'> {
+    isDisabled?: boolean;
+}
 
 export declare const Textarea: default_2.ForwardRefExoticComponent<TextareaProps & default_2.RefAttributes<HTMLTextAreaElement>>;
 
@@ -851,7 +867,7 @@ export declare interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLT
 
 declare type TextTransform = 'uppercase' | 'lowercase' | 'trim' | 'none';
 
-export declare const Tooltip: React_2.ForwardRefExoticComponent<TooltipProps & React_2.RefAttributes<never>>;
+export declare const Tooltip: React_2.ForwardRefExoticComponent<TooltipProps & React_2.RefAttributes<HTMLDivElement>>;
 
 export declare interface TooltipProps extends Omit<ComponentPropsWithoutRef<typeof TooltipPrimitive.Root>, 'children'> {
     children: ReactNode;
@@ -899,7 +915,6 @@ declare type UseAriaDisabledActive = {
     onPointerDownCapture: (evt: React.PointerEvent) => void;
     onKeyDown: (evt: React.KeyboardEvent) => void;
     onKeyUp: (evt: React.KeyboardEvent) => void;
-    onKeyPress: (evt: React.KeyboardEvent) => void;
     onInput: (evt: React.FormEvent) => void;
     onSubmit: (evt: React.FormEvent) => void;
     onReset: (evt: React.FormEvent) => void;
@@ -971,4 +986,14 @@ export declare type UseFormGroupLayoutOptions = {
     columns?: 1 | 2 | 3 | 4;
 };
 
+/**
+ * Validates that a form control has either a label or aria-label, but not both.
+ *
+ * @param componentName - The name of the component (e.g., 'Radio', 'Checkbox') for error messages
+ * @param label - The label prop value
+ * @param ariaLabel - The aria-label prop value
+ * @throws Error if validation fails
+ */
+export declare function validateFormControlProps(componentName: string, label?: React_2.ReactNode, ariaLabel?: string): void;
+
 export { }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@capitaltg/vero",
-  "version": "1.12.0",
+  "version": "1.13.1",
   "description": "Accessible, modern, open source React component library inspired by USWDS built with Radix UI",
   "type": "module",
   "main": "dist/index.js",