@parrot-co/parrot-ui 1.0.0-beta.2 → 1.0.0-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.mts CHANGED
@@ -1,8 +1,8 @@
1
1
  import * as React$1 from 'react';
2
2
  import React__default from 'react';
3
3
  import * as react_aria_components from 'react-aria-components';
4
- import { TextFieldProps, NumberFieldProps, ButtonProps as ButtonProps$1, ToggleButtonProps as ToggleButtonProps$1, CheckboxFieldProps, CheckboxGroupProps as CheckboxGroupProps$1, MenuTriggerProps as MenuTriggerProps$1, MenuProps as MenuProps$1, Placement, MenuItemProps as MenuItemProps$1, MenuSectionProps as MenuSectionProps$1, ListBoxProps as ListBoxProps$1, ListBoxItemProps as ListBoxItemProps$1, ListBoxSectionProps as ListBoxSectionProps$1, RadioFieldProps, RadioGroupProps as RadioGroupProps$1, SelectProps as SelectProps$1, CalendarProps as CalendarProps$1, DateValue, RangeCalendarProps as RangeCalendarProps$1, DateFieldProps as DateFieldProps$1, TimeFieldProps as TimeFieldProps$1, TimeValue, DatePickerProps as DatePickerProps$1, DateRangePickerProps as DateRangePickerProps$1, ProgressBarProps, SwitchFieldProps, SliderProps as SliderProps$1, Key, TabsProps as TabsProps$1, Selection, SortDescriptor, ModalOverlayProps, PopoverProps as PopoverProps$1, TagGroupProps as TagGroupProps$1, TagListProps, TagProps as TagProps$1, Color as Color$1, ColorAreaProps as ColorAreaProps$1, ColorFieldProps as ColorFieldProps$1, ColorSwatchPickerProps as ColorSwatchPickerProps$1, ColorSliderProps as ColorSliderProps$1, TooltipProps as TooltipProps$1 } from 'react-aria-components';
5
- import { OverlayTriggerProps } from 'react-stately';
4
+ import { TextFieldProps, NumberFieldProps, ButtonProps as ButtonProps$1, ToggleButtonProps as ToggleButtonProps$1, CheckboxFieldProps, CheckboxGroupProps as CheckboxGroupProps$1, MenuTriggerProps as MenuTriggerProps$1, MenuProps as MenuProps$1, Placement, MenuItemProps as MenuItemProps$1, MenuSectionProps as MenuSectionProps$1, ListBoxProps as ListBoxProps$1, ListBoxItemProps as ListBoxItemProps$1, ListBoxSectionProps as ListBoxSectionProps$1, RadioFieldProps, RadioGroupProps as RadioGroupProps$1, SelectProps as SelectProps$1, Key, CalendarProps as CalendarProps$1, DateValue, RangeCalendarProps as RangeCalendarProps$1, DateFieldProps as DateFieldProps$1, TimeFieldProps as TimeFieldProps$1, TimeValue, DatePickerProps as DatePickerProps$1, DateRangePickerProps as DateRangePickerProps$1, ProgressBarProps, SwitchFieldProps, SliderProps as SliderProps$1, TabsProps as TabsProps$1, Selection, SortDescriptor, ModalOverlayProps, PopoverProps as PopoverProps$1, TagGroupProps as TagGroupProps$1, TagListProps, TagProps as TagProps$1, Color as Color$1, ColorAreaProps as ColorAreaProps$1, ColorFieldProps as ColorFieldProps$1, ColorSwatchPickerProps as ColorSwatchPickerProps$1, ColorSliderProps as ColorSliderProps$1, TooltipProps as TooltipProps$1 } from 'react-aria-components';
5
+ import { SectionProps, ItemProps, OverlayTriggerProps } from 'react-stately';
6
6
 
7
7
  /**
8
8
  * Open registry of valid `color` values. Consumers extend it via module
@@ -84,9 +84,14 @@ type Appearance = "light" | "dark";
84
84
  type ButtonSize = "xs" | "sm" | "md" | "lg" | "xl";
85
85
  type SizeOption = "none" | "4xs" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl";
86
86
 
87
+ type Maybe<T> = T | null | undefined;
87
88
  type ActionStatus = "idle" | "loading" | "success" | "error";
88
89
  type Dict<T = unknown> = Record<string, T>;
89
90
  type ID = string | number;
91
+ type SectionElement<T> = React.ReactElement<SectionProps<T>>;
92
+ type ItemElement<T> = React.ReactElement<ItemProps<T>>;
93
+ type CollectionElement<T> = SectionElement<T> | ItemElement<T>;
94
+ type CollectionChildren<T> = CollectionElement<T> | CollectionElement<T>[] | ((item: T) => CollectionElement<T>);
90
95
  type Breakpoints = "base" | "sm" | "md" | "lg" | "xl" | "2xl";
91
96
  interface StyleProps<S extends string = string> {
92
97
  /** Use this to add classes to the component. you can also use the `className` prop. But i won't recommend to use both at the same time. */
@@ -99,8 +104,12 @@ interface StyleProps<S extends string = string> {
99
104
  type ResponsiveProp<T> = T | {
100
105
  [K in Breakpoints]?: T;
101
106
  };
107
+ interface ColorProps {
108
+ color?: Color;
109
+ variant?: ColorVariant;
110
+ }
102
111
 
103
- type FieldProps<S extends string> = InputProps & StyleProps<S | "wrapper" | "label" | "input" | "description"> & {
112
+ type FieldProps<S extends string> = InputProps & StyleProps<S | "wrapper" | "control" | "label" | "input" | "description"> & {
104
113
  children?: React__default.ReactNode;
105
114
  replaceDefaultControlWrapper?: boolean;
106
115
  };
@@ -135,6 +144,8 @@ type NumberInputProps = Omit<NumberFieldProps, "className" | "style" | "children
135
144
  };
136
145
  declare function NumberInput({ appearance, size, color, classNames, styles, append, prepend, placeholder, showSteppers, error, label, description, incrementIcon, decrementIcon, inputRef, wrapperRef, validationStatus, shape, radius, ...props }: NumberInputProps): React$1.JSX.Element;
137
146
 
147
+ declare function PasswordInput({ wrapperRef, ...props }: TextInputProps): React__default.JSX.Element;
148
+
138
149
  type PinInputType = "numeric" | "alphanumeric" | "all";
139
150
  type PinInputProps = Omit<FieldComponentProps<"input" | "control" | "group" | "slot">, "prepend" | "append" | "shape"> & {
140
151
  value?: string;
@@ -413,7 +424,8 @@ interface RadioItemProps extends Omit<RadioFieldProps, "className" | "style" | "
413
424
  declare function RadioItem({ className, style, classNames, styles, children, ...props }: RadioItemProps): React$1.JSX.Element;
414
425
 
415
426
  type SelectionMode = "single" | "multiple";
416
- interface SelectProps<T extends object, M extends SelectionMode = "single"> extends Omit<SelectProps$1<T, M>, "className" | "style" | "children" | "isInvalid" | "selectedKey" | "defaultSelectedKey" | "selectedKeys" | "defaultSelectedKeys" | "onSelectionChange">, Pick<ListBoxProps<T>, "items" | "labelKey" | "valueKey" | "sectionKey" | "renderOption" | "renderSectionLabel" | "disabledKeys" | "children">, StyleProps<"wrapper" | "trigger" | "value" | "placeholder" | "label" | "popover"> {
427
+ type SelectionValue<M extends SelectionMode> = M extends "multiple" ? Key[] : Key | null;
428
+ interface SelectProps<T extends object, M extends SelectionMode = "single"> extends Omit<SelectProps$1<T, M>, "className" | "style" | "children" | "isInvalid" | "selectedKey" | "defaultSelectedKey" | "selectedKeys" | "defaultSelectedKeys" | "onSelectionChange" | "onChange" | "value" | "defaultValue">, Pick<ListBoxProps<T>, "items" | "labelKey" | "valueKey" | "sectionKey" | "renderOption" | "renderSectionLabel" | "disabledKeys" | "children">, StyleProps<"wrapper" | "trigger" | "value" | "placeholder" | "label" | "popover"> {
417
429
  label?: React$1.ReactNode;
418
430
  description?: React$1.ReactNode;
419
431
  error?: React$1.ReactNode;
@@ -425,8 +437,13 @@ interface SelectProps<T extends object, M extends SelectionMode = "single"> exte
425
437
  showSectionSeparator?: boolean;
426
438
  showSelectionIndicator?: boolean;
427
439
  renderValue?: (value: T) => React$1.ReactNode;
440
+ /** Selected key(s). `Key[]` when `selectionMode="multiple"`, else `Key | null`. */
441
+ value?: SelectionValue<M>;
442
+ defaultValue?: SelectionValue<M>;
443
+ /** Fires with the selected `Key[]` (multiple) or `Key | null` (single). */
444
+ onChange?: (value: SelectionValue<M>) => void;
428
445
  }
429
- declare function Select<T extends object, M extends SelectionMode = "single">({ label, description, error, placeholder, appearance, renderValue, color, size, radius, listBoxColor, showSectionSeparator, showSelectionIndicator, items, children, labelKey, valueKey, sectionKey, renderOption, renderSectionLabel, disabledKeys, className, classNames, style, styles, "aria-label": ariaLabel, ...racProps }: SelectProps<T, M>): React$1.JSX.Element;
446
+ declare function Select<T extends object, M extends SelectionMode = "single">({ label, description, error, placeholder, appearance, renderValue, color, size, radius, listBoxColor, showSectionSeparator, showSelectionIndicator, items, children, labelKey, valueKey, sectionKey, renderOption, renderSectionLabel, disabledKeys, className, classNames, style, styles, value, defaultValue, onChange, "aria-label": ariaLabel, ...racProps }: SelectProps<T, M>): React$1.JSX.Element;
430
447
 
431
448
  interface CalendarProps extends Omit<CalendarProps$1<DateValue>, "className" | "style" | "children" | "visibleDuration"> {
432
449
  numberOfMonths?: number;
@@ -968,4 +985,4 @@ declare function pattern<T>(regex: RegExp, message?: string): FieldValidator<T>;
968
985
  declare function matches<T>(fieldName: keyof T & string, message?: string): FieldValidator<T>;
969
986
  declare function compose<T>(...fns: Array<FieldValidator<T>>): FieldValidator<T>;
970
987
 
971
- export { Avatar, AvatarGroup, type BaseModalProps, Button, ButtonGroup, Calendar, Checkbox, CheckboxGroup, CheckboxItem, ColorArea, ColorField, ColorPicker, ColorSlider, ColorSwatchPicker, ComboBox, type CustomToastRender, DateField, DatePicker, DateRangePicker, type FieldValidator, FileUploader, HoverCard, type HoverCardProps, IconButton, Input, ListBox, ListBoxItem, ListBoxSection, Loader, Menu, MenuContent, MenuItem, MenuSection, MenuTrigger, Modal, type ModalControls, type ModalDef, type ModalInputProps, type ModalKey, type ModalProps, ModalProvider, type ModalProviderProps, type ModalRegistry, type ModalResult, NumberInput, ListBoxItem as Option, type ParrotModalRegistry, PinInput, PinInputGroup, type PinInputGroupProps, type PinInputProps, PinInputSeparator, type PinInputSeparatorProps, PinInputSlot, type PinInputSlotProps, type PinInputType, Popover, PopoverContent, PopoverTrigger, Progress, Radio, RadioCard, RadioGroup, RadioItem, RangeCalendar, ListBoxSection as Section, Select, Separator, Slider, Space, Sticker, Switch, Tab, Table, Tabs, Tag, TagGroup, TagGroupItem, TagInput, Text, Textarea, ThemeProvider, TimeField, Timeline, type ToastAction, type ToastOptions, type ToastPosition, ToastRegion, type ToastRegionProps, type ToastVariant, Toggle, ToggleButton, ToggleGroup, Tooltip, type TooltipProps, type UseFormOptions, type UseFormReturn, compose, email, matches, max, maxLength, min, minLength, parseColor, pattern, required, toast, useForm, useModal, useModals, useTheme };
988
+ export { type ActionStatus, type Appearance, Avatar, AvatarGroup, type BaseModalProps, type Breakpoints, Button, ButtonGroup, Calendar, Checkbox, CheckboxGroup, CheckboxItem, type CollectionChildren, type CollectionElement, type Color, ColorArea, ColorField, ColorPicker, type ColorProps, ColorSlider, ColorSwatchPicker, type ColorVariant, ComboBox, type ControlSize, type CustomToastRender, DateField, DatePicker, DateRangePicker, type Dict, type FieldValidator, FileUploader, HoverCard, type HoverCardProps, type ID, IconButton, Input, type InputAppearance, type ItemElement, ListBox, ListBoxItem, ListBoxSection, Loader, type Maybe, Menu, MenuContent, MenuItem, MenuSection, MenuTrigger, Modal, type ModalControls, type ModalDef, type ModalInputProps, type ModalKey, type ModalProps, ModalProvider, type ModalProviderProps, type ModalRegistry, type ModalResult, NumberInput, ListBoxItem as Option, type ParrotColorRegistry, type ParrotModalRegistry, type ParrotVariantRegistry, PasswordInput, PinInput, PinInputGroup, type PinInputGroupProps, type PinInputProps, PinInputSeparator, type PinInputSeparatorProps, PinInputSlot, type PinInputSlotProps, type PinInputType, Popover, PopoverContent, PopoverTrigger, Progress, Radio, RadioCard, RadioGroup, RadioItem, type Radius, RangeCalendar, type ResponsiveProp, ListBoxSection as Section, type SectionElement, Select, Separator, type Size, Slider, Space, Sticker, type StyleProps, Switch, Tab, Table, Tabs, Tag, TagGroup, TagGroupItem, TagInput, Text, Textarea, ThemeProvider, TimeField, Timeline, type ToastAction, type ToastOptions, type ToastPosition, ToastRegion, type ToastRegionProps, type ToastVariant, Toggle, ToggleButton, ToggleGroup, Tooltip, type TooltipProps, type UseFormOptions, type UseFormReturn, type Variant, compose, email, matches, max, maxLength, min, minLength, parseColor, pattern, required, toast, useForm, useModal, useModals, useTheme };
package/dist/index.d.ts CHANGED
@@ -1,8 +1,8 @@
1
1
  import * as React$1 from 'react';
2
2
  import React__default from 'react';
3
3
  import * as react_aria_components from 'react-aria-components';
4
- import { TextFieldProps, NumberFieldProps, ButtonProps as ButtonProps$1, ToggleButtonProps as ToggleButtonProps$1, CheckboxFieldProps, CheckboxGroupProps as CheckboxGroupProps$1, MenuTriggerProps as MenuTriggerProps$1, MenuProps as MenuProps$1, Placement, MenuItemProps as MenuItemProps$1, MenuSectionProps as MenuSectionProps$1, ListBoxProps as ListBoxProps$1, ListBoxItemProps as ListBoxItemProps$1, ListBoxSectionProps as ListBoxSectionProps$1, RadioFieldProps, RadioGroupProps as RadioGroupProps$1, SelectProps as SelectProps$1, CalendarProps as CalendarProps$1, DateValue, RangeCalendarProps as RangeCalendarProps$1, DateFieldProps as DateFieldProps$1, TimeFieldProps as TimeFieldProps$1, TimeValue, DatePickerProps as DatePickerProps$1, DateRangePickerProps as DateRangePickerProps$1, ProgressBarProps, SwitchFieldProps, SliderProps as SliderProps$1, Key, TabsProps as TabsProps$1, Selection, SortDescriptor, ModalOverlayProps, PopoverProps as PopoverProps$1, TagGroupProps as TagGroupProps$1, TagListProps, TagProps as TagProps$1, Color as Color$1, ColorAreaProps as ColorAreaProps$1, ColorFieldProps as ColorFieldProps$1, ColorSwatchPickerProps as ColorSwatchPickerProps$1, ColorSliderProps as ColorSliderProps$1, TooltipProps as TooltipProps$1 } from 'react-aria-components';
5
- import { OverlayTriggerProps } from 'react-stately';
4
+ import { TextFieldProps, NumberFieldProps, ButtonProps as ButtonProps$1, ToggleButtonProps as ToggleButtonProps$1, CheckboxFieldProps, CheckboxGroupProps as CheckboxGroupProps$1, MenuTriggerProps as MenuTriggerProps$1, MenuProps as MenuProps$1, Placement, MenuItemProps as MenuItemProps$1, MenuSectionProps as MenuSectionProps$1, ListBoxProps as ListBoxProps$1, ListBoxItemProps as ListBoxItemProps$1, ListBoxSectionProps as ListBoxSectionProps$1, RadioFieldProps, RadioGroupProps as RadioGroupProps$1, SelectProps as SelectProps$1, Key, CalendarProps as CalendarProps$1, DateValue, RangeCalendarProps as RangeCalendarProps$1, DateFieldProps as DateFieldProps$1, TimeFieldProps as TimeFieldProps$1, TimeValue, DatePickerProps as DatePickerProps$1, DateRangePickerProps as DateRangePickerProps$1, ProgressBarProps, SwitchFieldProps, SliderProps as SliderProps$1, TabsProps as TabsProps$1, Selection, SortDescriptor, ModalOverlayProps, PopoverProps as PopoverProps$1, TagGroupProps as TagGroupProps$1, TagListProps, TagProps as TagProps$1, Color as Color$1, ColorAreaProps as ColorAreaProps$1, ColorFieldProps as ColorFieldProps$1, ColorSwatchPickerProps as ColorSwatchPickerProps$1, ColorSliderProps as ColorSliderProps$1, TooltipProps as TooltipProps$1 } from 'react-aria-components';
5
+ import { SectionProps, ItemProps, OverlayTriggerProps } from 'react-stately';
6
6
 
7
7
  /**
8
8
  * Open registry of valid `color` values. Consumers extend it via module
@@ -84,9 +84,14 @@ type Appearance = "light" | "dark";
84
84
  type ButtonSize = "xs" | "sm" | "md" | "lg" | "xl";
85
85
  type SizeOption = "none" | "4xs" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl";
86
86
 
87
+ type Maybe<T> = T | null | undefined;
87
88
  type ActionStatus = "idle" | "loading" | "success" | "error";
88
89
  type Dict<T = unknown> = Record<string, T>;
89
90
  type ID = string | number;
91
+ type SectionElement<T> = React.ReactElement<SectionProps<T>>;
92
+ type ItemElement<T> = React.ReactElement<ItemProps<T>>;
93
+ type CollectionElement<T> = SectionElement<T> | ItemElement<T>;
94
+ type CollectionChildren<T> = CollectionElement<T> | CollectionElement<T>[] | ((item: T) => CollectionElement<T>);
90
95
  type Breakpoints = "base" | "sm" | "md" | "lg" | "xl" | "2xl";
91
96
  interface StyleProps<S extends string = string> {
92
97
  /** Use this to add classes to the component. you can also use the `className` prop. But i won't recommend to use both at the same time. */
@@ -99,8 +104,12 @@ interface StyleProps<S extends string = string> {
99
104
  type ResponsiveProp<T> = T | {
100
105
  [K in Breakpoints]?: T;
101
106
  };
107
+ interface ColorProps {
108
+ color?: Color;
109
+ variant?: ColorVariant;
110
+ }
102
111
 
103
- type FieldProps<S extends string> = InputProps & StyleProps<S | "wrapper" | "label" | "input" | "description"> & {
112
+ type FieldProps<S extends string> = InputProps & StyleProps<S | "wrapper" | "control" | "label" | "input" | "description"> & {
104
113
  children?: React__default.ReactNode;
105
114
  replaceDefaultControlWrapper?: boolean;
106
115
  };
@@ -135,6 +144,8 @@ type NumberInputProps = Omit<NumberFieldProps, "className" | "style" | "children
135
144
  };
136
145
  declare function NumberInput({ appearance, size, color, classNames, styles, append, prepend, placeholder, showSteppers, error, label, description, incrementIcon, decrementIcon, inputRef, wrapperRef, validationStatus, shape, radius, ...props }: NumberInputProps): React$1.JSX.Element;
137
146
 
147
+ declare function PasswordInput({ wrapperRef, ...props }: TextInputProps): React__default.JSX.Element;
148
+
138
149
  type PinInputType = "numeric" | "alphanumeric" | "all";
139
150
  type PinInputProps = Omit<FieldComponentProps<"input" | "control" | "group" | "slot">, "prepend" | "append" | "shape"> & {
140
151
  value?: string;
@@ -413,7 +424,8 @@ interface RadioItemProps extends Omit<RadioFieldProps, "className" | "style" | "
413
424
  declare function RadioItem({ className, style, classNames, styles, children, ...props }: RadioItemProps): React$1.JSX.Element;
414
425
 
415
426
  type SelectionMode = "single" | "multiple";
416
- interface SelectProps<T extends object, M extends SelectionMode = "single"> extends Omit<SelectProps$1<T, M>, "className" | "style" | "children" | "isInvalid" | "selectedKey" | "defaultSelectedKey" | "selectedKeys" | "defaultSelectedKeys" | "onSelectionChange">, Pick<ListBoxProps<T>, "items" | "labelKey" | "valueKey" | "sectionKey" | "renderOption" | "renderSectionLabel" | "disabledKeys" | "children">, StyleProps<"wrapper" | "trigger" | "value" | "placeholder" | "label" | "popover"> {
427
+ type SelectionValue<M extends SelectionMode> = M extends "multiple" ? Key[] : Key | null;
428
+ interface SelectProps<T extends object, M extends SelectionMode = "single"> extends Omit<SelectProps$1<T, M>, "className" | "style" | "children" | "isInvalid" | "selectedKey" | "defaultSelectedKey" | "selectedKeys" | "defaultSelectedKeys" | "onSelectionChange" | "onChange" | "value" | "defaultValue">, Pick<ListBoxProps<T>, "items" | "labelKey" | "valueKey" | "sectionKey" | "renderOption" | "renderSectionLabel" | "disabledKeys" | "children">, StyleProps<"wrapper" | "trigger" | "value" | "placeholder" | "label" | "popover"> {
417
429
  label?: React$1.ReactNode;
418
430
  description?: React$1.ReactNode;
419
431
  error?: React$1.ReactNode;
@@ -425,8 +437,13 @@ interface SelectProps<T extends object, M extends SelectionMode = "single"> exte
425
437
  showSectionSeparator?: boolean;
426
438
  showSelectionIndicator?: boolean;
427
439
  renderValue?: (value: T) => React$1.ReactNode;
440
+ /** Selected key(s). `Key[]` when `selectionMode="multiple"`, else `Key | null`. */
441
+ value?: SelectionValue<M>;
442
+ defaultValue?: SelectionValue<M>;
443
+ /** Fires with the selected `Key[]` (multiple) or `Key | null` (single). */
444
+ onChange?: (value: SelectionValue<M>) => void;
428
445
  }
429
- declare function Select<T extends object, M extends SelectionMode = "single">({ label, description, error, placeholder, appearance, renderValue, color, size, radius, listBoxColor, showSectionSeparator, showSelectionIndicator, items, children, labelKey, valueKey, sectionKey, renderOption, renderSectionLabel, disabledKeys, className, classNames, style, styles, "aria-label": ariaLabel, ...racProps }: SelectProps<T, M>): React$1.JSX.Element;
446
+ declare function Select<T extends object, M extends SelectionMode = "single">({ label, description, error, placeholder, appearance, renderValue, color, size, radius, listBoxColor, showSectionSeparator, showSelectionIndicator, items, children, labelKey, valueKey, sectionKey, renderOption, renderSectionLabel, disabledKeys, className, classNames, style, styles, value, defaultValue, onChange, "aria-label": ariaLabel, ...racProps }: SelectProps<T, M>): React$1.JSX.Element;
430
447
 
431
448
  interface CalendarProps extends Omit<CalendarProps$1<DateValue>, "className" | "style" | "children" | "visibleDuration"> {
432
449
  numberOfMonths?: number;
@@ -968,4 +985,4 @@ declare function pattern<T>(regex: RegExp, message?: string): FieldValidator<T>;
968
985
  declare function matches<T>(fieldName: keyof T & string, message?: string): FieldValidator<T>;
969
986
  declare function compose<T>(...fns: Array<FieldValidator<T>>): FieldValidator<T>;
970
987
 
971
- export { Avatar, AvatarGroup, type BaseModalProps, Button, ButtonGroup, Calendar, Checkbox, CheckboxGroup, CheckboxItem, ColorArea, ColorField, ColorPicker, ColorSlider, ColorSwatchPicker, ComboBox, type CustomToastRender, DateField, DatePicker, DateRangePicker, type FieldValidator, FileUploader, HoverCard, type HoverCardProps, IconButton, Input, ListBox, ListBoxItem, ListBoxSection, Loader, Menu, MenuContent, MenuItem, MenuSection, MenuTrigger, Modal, type ModalControls, type ModalDef, type ModalInputProps, type ModalKey, type ModalProps, ModalProvider, type ModalProviderProps, type ModalRegistry, type ModalResult, NumberInput, ListBoxItem as Option, type ParrotModalRegistry, PinInput, PinInputGroup, type PinInputGroupProps, type PinInputProps, PinInputSeparator, type PinInputSeparatorProps, PinInputSlot, type PinInputSlotProps, type PinInputType, Popover, PopoverContent, PopoverTrigger, Progress, Radio, RadioCard, RadioGroup, RadioItem, RangeCalendar, ListBoxSection as Section, Select, Separator, Slider, Space, Sticker, Switch, Tab, Table, Tabs, Tag, TagGroup, TagGroupItem, TagInput, Text, Textarea, ThemeProvider, TimeField, Timeline, type ToastAction, type ToastOptions, type ToastPosition, ToastRegion, type ToastRegionProps, type ToastVariant, Toggle, ToggleButton, ToggleGroup, Tooltip, type TooltipProps, type UseFormOptions, type UseFormReturn, compose, email, matches, max, maxLength, min, minLength, parseColor, pattern, required, toast, useForm, useModal, useModals, useTheme };
988
+ export { type ActionStatus, type Appearance, Avatar, AvatarGroup, type BaseModalProps, type Breakpoints, Button, ButtonGroup, Calendar, Checkbox, CheckboxGroup, CheckboxItem, type CollectionChildren, type CollectionElement, type Color, ColorArea, ColorField, ColorPicker, type ColorProps, ColorSlider, ColorSwatchPicker, type ColorVariant, ComboBox, type ControlSize, type CustomToastRender, DateField, DatePicker, DateRangePicker, type Dict, type FieldValidator, FileUploader, HoverCard, type HoverCardProps, type ID, IconButton, Input, type InputAppearance, type ItemElement, ListBox, ListBoxItem, ListBoxSection, Loader, type Maybe, Menu, MenuContent, MenuItem, MenuSection, MenuTrigger, Modal, type ModalControls, type ModalDef, type ModalInputProps, type ModalKey, type ModalProps, ModalProvider, type ModalProviderProps, type ModalRegistry, type ModalResult, NumberInput, ListBoxItem as Option, type ParrotColorRegistry, type ParrotModalRegistry, type ParrotVariantRegistry, PasswordInput, PinInput, PinInputGroup, type PinInputGroupProps, type PinInputProps, PinInputSeparator, type PinInputSeparatorProps, PinInputSlot, type PinInputSlotProps, type PinInputType, Popover, PopoverContent, PopoverTrigger, Progress, Radio, RadioCard, RadioGroup, RadioItem, type Radius, RangeCalendar, type ResponsiveProp, ListBoxSection as Section, type SectionElement, Select, Separator, type Size, Slider, Space, Sticker, type StyleProps, Switch, Tab, Table, Tabs, Tag, TagGroup, TagGroupItem, TagInput, Text, Textarea, ThemeProvider, TimeField, Timeline, type ToastAction, type ToastOptions, type ToastPosition, ToastRegion, type ToastRegionProps, type ToastVariant, Toggle, ToggleButton, ToggleGroup, Tooltip, type TooltipProps, type UseFormOptions, type UseFormReturn, type Variant, compose, email, matches, max, maxLength, min, minLength, parseColor, pattern, required, toast, useForm, useModal, useModals, useTheme };
package/dist/index.js CHANGED
@@ -485,8 +485,10 @@ function Field({
485
485
  ref: groupRef,
486
486
  className: cn(
487
487
  "prt-input-control relative inline-flex w-full items-center",
488
- space.classNames
488
+ space.classNames,
489
+ classNames?.control
489
490
  ),
491
+ style: styles?.control,
490
492
  "data-has-error": !!error,
491
493
  "data-appearance": resolvedAppearance,
492
494
  "data-disabled": isDisabled
@@ -933,6 +935,9 @@ function HiChevronRight({ size = "1em", ...props }) {
933
935
  function HiChevronUp({ size = "1em", ...props }) {
934
936
  return /* @__PURE__ */ React13__namespace.createElement("svg", { viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", width: size, height: size, ...props }, /* @__PURE__ */ React13__namespace.createElement("path", { fillRule: "evenodd", d: "M14.707 12.707a1 1 0 01-1.414 0L10 9.414l-3.293 3.293a1 1 0 01-1.414-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 010 1.414z", clipRule: "evenodd" }));
935
937
  }
938
+ function HiEye({ size = "1em", ...props }) {
939
+ return /* @__PURE__ */ React13__namespace.createElement("svg", { viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", width: size, height: size, ...props }, /* @__PURE__ */ React13__namespace.createElement("path", { d: "M10 12a2 2 0 100-4 2 2 0 000 4z" }), /* @__PURE__ */ React13__namespace.createElement("path", { fillRule: "evenodd", d: "M.458 10C1.732 5.943 5.522 3 10 3s8.268 2.943 9.542 7c-1.274 4.057-5.064 7-9.542 7S1.732 14.057.458 10zM14 10a4 4 0 11-8 0 4 4 0 018 0z", clipRule: "evenodd" }));
940
+ }
936
941
  function HiOutlineCalendar({ size = "1em", ...props }) {
937
942
  return /* @__PURE__ */ React13__namespace.createElement("svg", { fill: "none", viewBox: "0 0 24 24", strokeWidth: "2", stroke: "currentColor", "aria-hidden": "true", width: size, height: size, ...props }, /* @__PURE__ */ React13__namespace.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" }));
938
943
  }
@@ -963,6 +968,28 @@ function HiSelector({ size = "1em", ...props }) {
963
968
  function HiX({ size = "1em", ...props }) {
964
969
  return /* @__PURE__ */ React13__namespace.createElement("svg", { viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", width: size, height: size, ...props }, /* @__PURE__ */ React13__namespace.createElement("path", { fillRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z", clipRule: "evenodd" }));
965
970
  }
971
+
972
+ // src/components/input/password-input.tsx
973
+ function PasswordInput({ wrapperRef, ...props }) {
974
+ const [showPassword, setShowPassword] = React13__namespace.default.useState(false);
975
+ return /* @__PURE__ */ React13__namespace.default.createElement(
976
+ Input,
977
+ {
978
+ wrapperRef,
979
+ ...props,
980
+ type: showPassword ? "text" : "password",
981
+ append: /* @__PURE__ */ React13__namespace.default.createElement(
982
+ IconButton,
983
+ {
984
+ onPress: () => setShowPassword((p) => !p),
985
+ size: "sm",
986
+ variant: "light"
987
+ },
988
+ /* @__PURE__ */ React13__namespace.default.createElement(HiEye, { size: 16 })
989
+ )
990
+ }
991
+ );
992
+ }
966
993
  var PATTERNS = {
967
994
  numeric: inputOtp.REGEXP_ONLY_DIGITS,
968
995
  alphanumeric: inputOtp.REGEXP_ONLY_DIGITS_AND_CHARS,
@@ -1996,14 +2023,25 @@ function Select({
1996
2023
  classNames,
1997
2024
  style,
1998
2025
  styles,
2026
+ value,
2027
+ defaultValue,
2028
+ onChange,
1999
2029
  "aria-label": ariaLabel,
2000
2030
  ...racProps
2001
2031
  }) {
2002
2032
  const theme = useTheme();
2003
2033
  const resolvedColor = color ?? theme?.color;
2004
- const resolvedSize = size ?? theme?.size ?? "sm";
2034
+ const resolvedSize = size ?? theme?.size ?? "md";
2005
2035
  const resolvedAppearance = appearance ?? theme?.inputAppearance ?? "outline";
2006
2036
  const isMultiple = racProps.selectionMode === "multiple";
2037
+ const selectionProps = {
2038
+ value,
2039
+ defaultValue,
2040
+ onChange: onChange ? (next) => {
2041
+ if (next && typeof next === "object" && "nativeEvent" in next) return;
2042
+ onChange(next);
2043
+ } : void 0
2044
+ };
2007
2045
  function labelOf(item) {
2008
2046
  if (item == null) return null;
2009
2047
  return item[labelKey];
@@ -2012,6 +2050,7 @@ function Select({
2012
2050
  reactAriaComponents.Select,
2013
2051
  {
2014
2052
  ...racProps,
2053
+ ...selectionProps,
2015
2054
  placeholder,
2016
2055
  isInvalid: !!error,
2017
2056
  "aria-label": ariaLabel ?? (label == null ? placeholder ?? "Select" : void 0),
@@ -4846,6 +4885,7 @@ exports.Modal = Modal;
4846
4885
  exports.ModalProvider = ModalProvider;
4847
4886
  exports.NumberInput = NumberInput;
4848
4887
  exports.Option = ListBoxItem;
4888
+ exports.PasswordInput = PasswordInput;
4849
4889
  exports.PinInput = PinInput;
4850
4890
  exports.PinInputGroup = PinInputGroup;
4851
4891
  exports.PinInputSeparator = PinInputSeparator;