@ecohouse/ui 0.1.18 → 0.1.19
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.cjs +931 -173
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +51 -2
- package/dist/index.d.ts +51 -2
- package/dist/index.js +931 -175
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/Range/Range.stories.tsx +128 -0
- package/src/components/Range/Range.test.ts +78 -0
- package/src/components/Range/Range.tsx +755 -0
- package/src/components/Range/Range.types.ts +35 -0
- package/src/components/Range/Range.utils.ts +56 -0
- package/src/components/Range/index.ts +2 -0
- package/src/components/index.ts +3 -0
- package/src/icons/CottageCard/CottageCardIcons.tsx +8 -1
- package/src/icons/CottageCard/CottageCardIcons.web.tsx +8 -1
- package/src/index.ts +10 -1
- package/src/primitives/FavoritesButton/FavoritesButton.stories.tsx +60 -0
- package/src/primitives/FavoritesButton/FavoritesButton.tsx +120 -0
- package/src/primitives/FavoritesButton/index.ts +2 -0
- package/src/primitives/index.ts +2 -0
package/dist/index.d.cts
CHANGED
|
@@ -20,6 +20,20 @@ interface MenuItemProps extends Omit<PressableProps, "onPress" | "disabled" | "s
|
|
|
20
20
|
}
|
|
21
21
|
declare const MenuItem: react.ForwardRefExoticComponent<MenuItemProps & react.RefAttributes<View>>;
|
|
22
22
|
|
|
23
|
+
interface FavoritesButtonProps extends Omit<PressableProps, "onPress" | "disabled" | "style" | "children" | "hitSlop"> {
|
|
24
|
+
/** Controlled favorite state. */
|
|
25
|
+
value?: boolean;
|
|
26
|
+
/** Initial state when the button is uncontrolled. */
|
|
27
|
+
defaultValue?: boolean;
|
|
28
|
+
/** Called with the next favorite state when pressed. */
|
|
29
|
+
onValueChange?: (value: boolean) => void;
|
|
30
|
+
disabled?: boolean;
|
|
31
|
+
style?: StyleProp<ViewStyle>;
|
|
32
|
+
className?: string;
|
|
33
|
+
hitSlop?: PressableProps["hitSlop"];
|
|
34
|
+
}
|
|
35
|
+
declare const FavoritesButton: react.ForwardRefExoticComponent<FavoritesButtonProps & react.RefAttributes<react_native.View>>;
|
|
36
|
+
|
|
23
37
|
type BrandLogoVariant = "white" | "brand";
|
|
24
38
|
interface BrandLogoProps {
|
|
25
39
|
/** White for dark surfaces, or the Cortel brand color for light surfaces. */
|
|
@@ -132,7 +146,7 @@ declare function ChevronLeftIcon({ size, color, strokeWidth }: IconProps): react
|
|
|
132
146
|
|
|
133
147
|
declare function ClockIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
|
|
134
148
|
|
|
135
|
-
declare function SaveHeartIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
|
|
149
|
+
declare function SaveHeartIcon({ size, color, strokeWidth, fillOpacity, }: IconProps): react.JSX.Element;
|
|
136
150
|
declare function RatingStarIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
|
|
137
151
|
declare function CardLocationIcon({ size, color, strokeWidth, secondaryColor, }: IconProps): react.JSX.Element;
|
|
138
152
|
declare function GuestsIcon({ size, color, fillOpacity }: IconProps): react.JSX.Element;
|
|
@@ -641,6 +655,41 @@ interface CommentCardProps extends Omit<ViewProps, "style" | "children"> {
|
|
|
641
655
|
}
|
|
642
656
|
declare const CommentCard: react.ForwardRefExoticComponent<CommentCardProps & react.RefAttributes<View>>;
|
|
643
657
|
|
|
658
|
+
interface RangeValue {
|
|
659
|
+
from?: number;
|
|
660
|
+
to?: number;
|
|
661
|
+
}
|
|
662
|
+
interface RangeProps extends Omit<ViewProps, "style" | "children"> {
|
|
663
|
+
/** Lowest value represented by the track. */
|
|
664
|
+
min?: number;
|
|
665
|
+
/** Highest value represented by the track. */
|
|
666
|
+
max?: number;
|
|
667
|
+
/** Snapping increment for handle drag, track click, and accessibility actions. */
|
|
668
|
+
step?: number;
|
|
669
|
+
value?: RangeValue;
|
|
670
|
+
defaultValue?: RangeValue;
|
|
671
|
+
onValueChange?: (value: RangeValue) => void;
|
|
672
|
+
/** Localized empty-state text for the lower-bound input. Defaults to Armenian. */
|
|
673
|
+
fromPlaceholder?: string;
|
|
674
|
+
/** Localized empty-state text for the upper-bound input. Defaults to Armenian. */
|
|
675
|
+
toPlaceholder?: string;
|
|
676
|
+
/** Currency text rendered after both inputs. */
|
|
677
|
+
currency?: string;
|
|
678
|
+
/** Localized accessible name for the lower handle and input. Defaults to `fromPlaceholder`. */
|
|
679
|
+
fromAccessibilityLabel?: string;
|
|
680
|
+
/** Localized accessible name for the upper handle and input. Defaults to `toPlaceholder`. */
|
|
681
|
+
toAccessibilityLabel?: string;
|
|
682
|
+
disabled?: boolean;
|
|
683
|
+
/** Locale-aware display formatter. Keep this paired with `parseValue` when it adds separators. */
|
|
684
|
+
formatValue?: (value: number) => string;
|
|
685
|
+
/** Parses localized input text back to a numeric value. */
|
|
686
|
+
parseValue?: (value: string) => number | undefined;
|
|
687
|
+
style?: StyleProp<ViewStyle>;
|
|
688
|
+
className?: string;
|
|
689
|
+
}
|
|
690
|
+
|
|
691
|
+
declare const Range: react.ForwardRefExoticComponent<RangeProps & react.RefAttributes<View>>;
|
|
692
|
+
|
|
644
693
|
declare const grey: {
|
|
645
694
|
readonly "0": "#767676";
|
|
646
695
|
readonly "0.5": "#6E6E6E";
|
|
@@ -929,4 +978,4 @@ declare const textareaTypography: {
|
|
|
929
978
|
};
|
|
930
979
|
};
|
|
931
980
|
|
|
932
|
-
export { AreaExpandIcon, ArrowRightIcon, Avatar, type AvatarMenuItem, type AvatarProps, BRAND_LOGO_COLORS, BRAND_LOGO_DEFAULT_HEIGHT, BRAND_LOGO_DEFAULT_WIDTH, Badge, type BadgeProps, type BadgeVariant, BagIcon, BathroomsIcon, BedroomsIcon, BellIcon, BrandLogo, type BrandLogoProps, type BrandLogoVariant, BuildingIcon, Button, type ButtonProps, type ButtonSize, type ButtonVariant, CalendarIcon, CalendarOutlineIcon, CameraIcon, CardLocationIcon, CheckBadgeIcon, CheckIcon, CheckSuccessIcon, Checkbox, type CheckboxProps, type CheckboxVariant, ChevronDownIcon, ChevronLeftIcon, ClockFilledIcon, ClockIcon, CommentCard, type CommentCardProps, CopyIcon, Counter, type CounterProps, DatePicker, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DateRange, FacebookIcon, FiltersIcon, GlobeIcon, type GreyStep, GuestsIcon, HeartIcon, HelpCircleIcon, HomeIcon, Icon, type IconByNameProps, type IconComponent, type IconGroup, type IconName, type IconProps, Input, type InputIcon, type InputProps, type InputSize, InstagramIcon, KeyIcon, type LanguageOption, LanguageSwitcher, type LanguageSwitcherProps, LayoutGridIcon, LinkedInIcon, ListViewIcon, LocationPinIcon, LogOutIcon, MailIcon, MapViewIcon, MenuIcon, type MenuIconProps, MenuItem, type MenuItemProps, MinusIcon, NavigateIcon, PhoneIcon, PlusIcon, QrCodeIcon, RatingInput, type RatingInputProps, RatingStarIcon, SaveHeartIcon, SearchIcon, SegmentedToggle, type SegmentedToggleOption, type SegmentedToggleProps, Select, type SelectIcon, type SelectMultipleProps, type SelectOption, type SelectProps, type SelectSingleProps, SettingsIcon, ShareIcon, ShowIcon, SidebarIcon, SortIcon, StarFilledIcon, StarIcon, type StarIconProps, StatCard, type StatCardProps, Textarea, type TextareaProps, Toggle, type ToggleProps, TooltipArrowIcon, UserIcon, UsersAltIcon, VideoIcon, WhatsAppIcon, avatarTypography, badgeTypography, buttonTypography, colors, commentCardTypography, counterTypography, datePickerTypography, defaultLanguageOptions, fonts, getIconsByGroup, grey, iconGroupNames, iconGroups, iconNames, icons, inputTypography, languageSwitcherTypography, ratingTypography, segmentedToggleTypography, selectTypography, statCardTypography, textareaTypography };
|
|
981
|
+
export { AreaExpandIcon, ArrowRightIcon, Avatar, type AvatarMenuItem, type AvatarProps, BRAND_LOGO_COLORS, BRAND_LOGO_DEFAULT_HEIGHT, BRAND_LOGO_DEFAULT_WIDTH, Badge, type BadgeProps, type BadgeVariant, BagIcon, BathroomsIcon, BedroomsIcon, BellIcon, BrandLogo, type BrandLogoProps, type BrandLogoVariant, BuildingIcon, Button, type ButtonProps, type ButtonSize, type ButtonVariant, CalendarIcon, CalendarOutlineIcon, CameraIcon, CardLocationIcon, CheckBadgeIcon, CheckIcon, CheckSuccessIcon, Checkbox, type CheckboxProps, type CheckboxVariant, ChevronDownIcon, ChevronLeftIcon, ClockFilledIcon, ClockIcon, CommentCard, type CommentCardProps, CopyIcon, Counter, type CounterProps, DatePicker, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DateRange, FacebookIcon, FavoritesButton, type FavoritesButtonProps, FiltersIcon, GlobeIcon, type GreyStep, GuestsIcon, HeartIcon, HelpCircleIcon, HomeIcon, Icon, type IconByNameProps, type IconComponent, type IconGroup, type IconName, type IconProps, Input, type InputIcon, type InputProps, type InputSize, InstagramIcon, KeyIcon, type LanguageOption, LanguageSwitcher, type LanguageSwitcherProps, LayoutGridIcon, LinkedInIcon, ListViewIcon, LocationPinIcon, LogOutIcon, MailIcon, MapViewIcon, MenuIcon, type MenuIconProps, MenuItem, type MenuItemProps, MinusIcon, NavigateIcon, PhoneIcon, PlusIcon, QrCodeIcon, Range, type RangeProps, type RangeValue, RatingInput, type RatingInputProps, RatingStarIcon, SaveHeartIcon, SearchIcon, SegmentedToggle, type SegmentedToggleOption, type SegmentedToggleProps, Select, type SelectIcon, type SelectMultipleProps, type SelectOption, type SelectProps, type SelectSingleProps, SettingsIcon, ShareIcon, ShowIcon, SidebarIcon, SortIcon, StarFilledIcon, StarIcon, type StarIconProps, StatCard, type StatCardProps, Textarea, type TextareaProps, Toggle, type ToggleProps, TooltipArrowIcon, UserIcon, UsersAltIcon, VideoIcon, WhatsAppIcon, avatarTypography, badgeTypography, buttonTypography, colors, commentCardTypography, counterTypography, datePickerTypography, defaultLanguageOptions, fonts, getIconsByGroup, grey, iconGroupNames, iconGroups, iconNames, icons, inputTypography, languageSwitcherTypography, ratingTypography, segmentedToggleTypography, selectTypography, statCardTypography, textareaTypography };
|
package/dist/index.d.ts
CHANGED
|
@@ -20,6 +20,20 @@ interface MenuItemProps extends Omit<PressableProps, "onPress" | "disabled" | "s
|
|
|
20
20
|
}
|
|
21
21
|
declare const MenuItem: react.ForwardRefExoticComponent<MenuItemProps & react.RefAttributes<View>>;
|
|
22
22
|
|
|
23
|
+
interface FavoritesButtonProps extends Omit<PressableProps, "onPress" | "disabled" | "style" | "children" | "hitSlop"> {
|
|
24
|
+
/** Controlled favorite state. */
|
|
25
|
+
value?: boolean;
|
|
26
|
+
/** Initial state when the button is uncontrolled. */
|
|
27
|
+
defaultValue?: boolean;
|
|
28
|
+
/** Called with the next favorite state when pressed. */
|
|
29
|
+
onValueChange?: (value: boolean) => void;
|
|
30
|
+
disabled?: boolean;
|
|
31
|
+
style?: StyleProp<ViewStyle>;
|
|
32
|
+
className?: string;
|
|
33
|
+
hitSlop?: PressableProps["hitSlop"];
|
|
34
|
+
}
|
|
35
|
+
declare const FavoritesButton: react.ForwardRefExoticComponent<FavoritesButtonProps & react.RefAttributes<react_native.View>>;
|
|
36
|
+
|
|
23
37
|
type BrandLogoVariant = "white" | "brand";
|
|
24
38
|
interface BrandLogoProps {
|
|
25
39
|
/** White for dark surfaces, or the Cortel brand color for light surfaces. */
|
|
@@ -132,7 +146,7 @@ declare function ChevronLeftIcon({ size, color, strokeWidth }: IconProps): react
|
|
|
132
146
|
|
|
133
147
|
declare function ClockIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
|
|
134
148
|
|
|
135
|
-
declare function SaveHeartIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
|
|
149
|
+
declare function SaveHeartIcon({ size, color, strokeWidth, fillOpacity, }: IconProps): react.JSX.Element;
|
|
136
150
|
declare function RatingStarIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
|
|
137
151
|
declare function CardLocationIcon({ size, color, strokeWidth, secondaryColor, }: IconProps): react.JSX.Element;
|
|
138
152
|
declare function GuestsIcon({ size, color, fillOpacity }: IconProps): react.JSX.Element;
|
|
@@ -641,6 +655,41 @@ interface CommentCardProps extends Omit<ViewProps, "style" | "children"> {
|
|
|
641
655
|
}
|
|
642
656
|
declare const CommentCard: react.ForwardRefExoticComponent<CommentCardProps & react.RefAttributes<View>>;
|
|
643
657
|
|
|
658
|
+
interface RangeValue {
|
|
659
|
+
from?: number;
|
|
660
|
+
to?: number;
|
|
661
|
+
}
|
|
662
|
+
interface RangeProps extends Omit<ViewProps, "style" | "children"> {
|
|
663
|
+
/** Lowest value represented by the track. */
|
|
664
|
+
min?: number;
|
|
665
|
+
/** Highest value represented by the track. */
|
|
666
|
+
max?: number;
|
|
667
|
+
/** Snapping increment for handle drag, track click, and accessibility actions. */
|
|
668
|
+
step?: number;
|
|
669
|
+
value?: RangeValue;
|
|
670
|
+
defaultValue?: RangeValue;
|
|
671
|
+
onValueChange?: (value: RangeValue) => void;
|
|
672
|
+
/** Localized empty-state text for the lower-bound input. Defaults to Armenian. */
|
|
673
|
+
fromPlaceholder?: string;
|
|
674
|
+
/** Localized empty-state text for the upper-bound input. Defaults to Armenian. */
|
|
675
|
+
toPlaceholder?: string;
|
|
676
|
+
/** Currency text rendered after both inputs. */
|
|
677
|
+
currency?: string;
|
|
678
|
+
/** Localized accessible name for the lower handle and input. Defaults to `fromPlaceholder`. */
|
|
679
|
+
fromAccessibilityLabel?: string;
|
|
680
|
+
/** Localized accessible name for the upper handle and input. Defaults to `toPlaceholder`. */
|
|
681
|
+
toAccessibilityLabel?: string;
|
|
682
|
+
disabled?: boolean;
|
|
683
|
+
/** Locale-aware display formatter. Keep this paired with `parseValue` when it adds separators. */
|
|
684
|
+
formatValue?: (value: number) => string;
|
|
685
|
+
/** Parses localized input text back to a numeric value. */
|
|
686
|
+
parseValue?: (value: string) => number | undefined;
|
|
687
|
+
style?: StyleProp<ViewStyle>;
|
|
688
|
+
className?: string;
|
|
689
|
+
}
|
|
690
|
+
|
|
691
|
+
declare const Range: react.ForwardRefExoticComponent<RangeProps & react.RefAttributes<View>>;
|
|
692
|
+
|
|
644
693
|
declare const grey: {
|
|
645
694
|
readonly "0": "#767676";
|
|
646
695
|
readonly "0.5": "#6E6E6E";
|
|
@@ -929,4 +978,4 @@ declare const textareaTypography: {
|
|
|
929
978
|
};
|
|
930
979
|
};
|
|
931
980
|
|
|
932
|
-
export { AreaExpandIcon, ArrowRightIcon, Avatar, type AvatarMenuItem, type AvatarProps, BRAND_LOGO_COLORS, BRAND_LOGO_DEFAULT_HEIGHT, BRAND_LOGO_DEFAULT_WIDTH, Badge, type BadgeProps, type BadgeVariant, BagIcon, BathroomsIcon, BedroomsIcon, BellIcon, BrandLogo, type BrandLogoProps, type BrandLogoVariant, BuildingIcon, Button, type ButtonProps, type ButtonSize, type ButtonVariant, CalendarIcon, CalendarOutlineIcon, CameraIcon, CardLocationIcon, CheckBadgeIcon, CheckIcon, CheckSuccessIcon, Checkbox, type CheckboxProps, type CheckboxVariant, ChevronDownIcon, ChevronLeftIcon, ClockFilledIcon, ClockIcon, CommentCard, type CommentCardProps, CopyIcon, Counter, type CounterProps, DatePicker, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DateRange, FacebookIcon, FiltersIcon, GlobeIcon, type GreyStep, GuestsIcon, HeartIcon, HelpCircleIcon, HomeIcon, Icon, type IconByNameProps, type IconComponent, type IconGroup, type IconName, type IconProps, Input, type InputIcon, type InputProps, type InputSize, InstagramIcon, KeyIcon, type LanguageOption, LanguageSwitcher, type LanguageSwitcherProps, LayoutGridIcon, LinkedInIcon, ListViewIcon, LocationPinIcon, LogOutIcon, MailIcon, MapViewIcon, MenuIcon, type MenuIconProps, MenuItem, type MenuItemProps, MinusIcon, NavigateIcon, PhoneIcon, PlusIcon, QrCodeIcon, RatingInput, type RatingInputProps, RatingStarIcon, SaveHeartIcon, SearchIcon, SegmentedToggle, type SegmentedToggleOption, type SegmentedToggleProps, Select, type SelectIcon, type SelectMultipleProps, type SelectOption, type SelectProps, type SelectSingleProps, SettingsIcon, ShareIcon, ShowIcon, SidebarIcon, SortIcon, StarFilledIcon, StarIcon, type StarIconProps, StatCard, type StatCardProps, Textarea, type TextareaProps, Toggle, type ToggleProps, TooltipArrowIcon, UserIcon, UsersAltIcon, VideoIcon, WhatsAppIcon, avatarTypography, badgeTypography, buttonTypography, colors, commentCardTypography, counterTypography, datePickerTypography, defaultLanguageOptions, fonts, getIconsByGroup, grey, iconGroupNames, iconGroups, iconNames, icons, inputTypography, languageSwitcherTypography, ratingTypography, segmentedToggleTypography, selectTypography, statCardTypography, textareaTypography };
|
|
981
|
+
export { AreaExpandIcon, ArrowRightIcon, Avatar, type AvatarMenuItem, type AvatarProps, BRAND_LOGO_COLORS, BRAND_LOGO_DEFAULT_HEIGHT, BRAND_LOGO_DEFAULT_WIDTH, Badge, type BadgeProps, type BadgeVariant, BagIcon, BathroomsIcon, BedroomsIcon, BellIcon, BrandLogo, type BrandLogoProps, type BrandLogoVariant, BuildingIcon, Button, type ButtonProps, type ButtonSize, type ButtonVariant, CalendarIcon, CalendarOutlineIcon, CameraIcon, CardLocationIcon, CheckBadgeIcon, CheckIcon, CheckSuccessIcon, Checkbox, type CheckboxProps, type CheckboxVariant, ChevronDownIcon, ChevronLeftIcon, ClockFilledIcon, ClockIcon, CommentCard, type CommentCardProps, CopyIcon, Counter, type CounterProps, DatePicker, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DateRange, FacebookIcon, FavoritesButton, type FavoritesButtonProps, FiltersIcon, GlobeIcon, type GreyStep, GuestsIcon, HeartIcon, HelpCircleIcon, HomeIcon, Icon, type IconByNameProps, type IconComponent, type IconGroup, type IconName, type IconProps, Input, type InputIcon, type InputProps, type InputSize, InstagramIcon, KeyIcon, type LanguageOption, LanguageSwitcher, type LanguageSwitcherProps, LayoutGridIcon, LinkedInIcon, ListViewIcon, LocationPinIcon, LogOutIcon, MailIcon, MapViewIcon, MenuIcon, type MenuIconProps, MenuItem, type MenuItemProps, MinusIcon, NavigateIcon, PhoneIcon, PlusIcon, QrCodeIcon, Range, type RangeProps, type RangeValue, RatingInput, type RatingInputProps, RatingStarIcon, SaveHeartIcon, SearchIcon, SegmentedToggle, type SegmentedToggleOption, type SegmentedToggleProps, Select, type SelectIcon, type SelectMultipleProps, type SelectOption, type SelectProps, type SelectSingleProps, SettingsIcon, ShareIcon, ShowIcon, SidebarIcon, SortIcon, StarFilledIcon, StarIcon, type StarIconProps, StatCard, type StatCardProps, Textarea, type TextareaProps, Toggle, type ToggleProps, TooltipArrowIcon, UserIcon, UsersAltIcon, VideoIcon, WhatsAppIcon, avatarTypography, badgeTypography, buttonTypography, colors, commentCardTypography, counterTypography, datePickerTypography, defaultLanguageOptions, fonts, getIconsByGroup, grey, iconGroupNames, iconGroups, iconNames, icons, inputTypography, languageSwitcherTypography, ratingTypography, segmentedToggleTypography, selectTypography, statCardTypography, textareaTypography };
|