@chekinapp/ui 0.0.117 → 0.0.118
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 +111 -107
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -9
- package/dist/index.d.ts +1 -9
- package/dist/index.js +111 -107
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.d.cts
CHANGED
|
@@ -3835,7 +3835,6 @@ declare function LegacyInfinitySelect({ label, className, placeholder, value, on
|
|
|
3835
3835
|
|
|
3836
3836
|
type AirbnbDatePickerValue = Date | number | null | undefined | '';
|
|
3837
3837
|
type AirbnbDatePickerProps = {
|
|
3838
|
-
variant?: 'default' | 'airbnb';
|
|
3839
3838
|
label: string;
|
|
3840
3839
|
topLabel?: string;
|
|
3841
3840
|
value?: AirbnbDatePickerValue;
|
|
@@ -3862,7 +3861,6 @@ declare const AirbnbDatePicker: React$1.ForwardRefExoticComponent<AirbnbDatePick
|
|
|
3862
3861
|
|
|
3863
3862
|
type AirbnbFieldTriggerProps = {
|
|
3864
3863
|
as?: 'button' | 'div';
|
|
3865
|
-
variant?: 'airbnb' | 'default';
|
|
3866
3864
|
id: string;
|
|
3867
3865
|
label: string;
|
|
3868
3866
|
topLabel?: string;
|
|
@@ -3891,7 +3889,6 @@ type AirbnbFieldTriggerProps = {
|
|
|
3891
3889
|
} & Omit<React$1.HTMLAttributes<HTMLButtonElement | HTMLDivElement>, 'children' | 'className' | 'disabled' | 'id' | 'onClick' | 'onKeyDown'>;
|
|
3892
3890
|
declare const AirbnbFieldTrigger: React$1.ForwardRefExoticComponent<{
|
|
3893
3891
|
as?: "button" | "div";
|
|
3894
|
-
variant?: "airbnb" | "default";
|
|
3895
3892
|
id: string;
|
|
3896
3893
|
label: string;
|
|
3897
3894
|
topLabel?: string;
|
|
@@ -3920,7 +3917,6 @@ declare const AirbnbFieldTrigger: React$1.ForwardRefExoticComponent<{
|
|
|
3920
3917
|
} & Omit<React$1.HTMLAttributes<HTMLDivElement | HTMLButtonElement>, "className" | "id" | "children" | "onKeyDown" | "onClick" | "disabled"> & React$1.RefAttributes<HTMLDivElement | HTMLButtonElement>>;
|
|
3921
3918
|
|
|
3922
3919
|
type AirbnbInputProps = React$1.InputHTMLAttributes<HTMLInputElement> & {
|
|
3923
|
-
variant?: 'airbnb' | 'default';
|
|
3924
3920
|
label?: string;
|
|
3925
3921
|
topLabel?: string;
|
|
3926
3922
|
helperText?: string;
|
|
@@ -3937,7 +3933,6 @@ type AirbnbInputProps = React$1.InputHTMLAttributes<HTMLInputElement> & {
|
|
|
3937
3933
|
renderErrorMessage?: boolean;
|
|
3938
3934
|
};
|
|
3939
3935
|
declare const AirbnbInput: React$1.ForwardRefExoticComponent<React$1.InputHTMLAttributes<HTMLInputElement> & {
|
|
3940
|
-
variant?: "airbnb" | "default";
|
|
3941
3936
|
label?: string;
|
|
3942
3937
|
topLabel?: string;
|
|
3943
3938
|
helperText?: string;
|
|
@@ -3964,7 +3959,6 @@ type AirbnbPhoneFieldValue = {
|
|
|
3964
3959
|
number: string;
|
|
3965
3960
|
};
|
|
3966
3961
|
type AirbnbPhoneFieldProps = {
|
|
3967
|
-
variant?: 'default' | 'airbnb';
|
|
3968
3962
|
label: string;
|
|
3969
3963
|
topLabel?: string;
|
|
3970
3964
|
value?: AirbnbPhoneFieldValue | null;
|
|
@@ -3992,7 +3986,6 @@ type SelectValue = string | number;
|
|
|
3992
3986
|
type SelectRenderTriggerProps<T = undefined, V extends SelectValue = string, L extends string | number | React$1.ReactNode = string> = {
|
|
3993
3987
|
id: string;
|
|
3994
3988
|
open: boolean;
|
|
3995
|
-
variant: 'default' | 'airbnb';
|
|
3996
3989
|
label: string;
|
|
3997
3990
|
topLabel?: string;
|
|
3998
3991
|
helperText: string;
|
|
@@ -4016,7 +4009,6 @@ type AirbnbSelectProps<T = undefined, V extends SelectValue = string, L extends
|
|
|
4016
4009
|
value?: SelectOption<T, V, L> | null;
|
|
4017
4010
|
onChange: (option: SelectOption<T, V, L>) => void;
|
|
4018
4011
|
onBlur?: React$1.FocusEventHandler<HTMLButtonElement>;
|
|
4019
|
-
variant?: 'default' | 'airbnb';
|
|
4020
4012
|
label: string;
|
|
4021
4013
|
topLabel?: string;
|
|
4022
4014
|
placeholder?: string;
|
|
@@ -4036,6 +4028,7 @@ type AirbnbSelectProps<T = undefined, V extends SelectValue = string, L extends
|
|
|
4036
4028
|
mobileTitle?: string;
|
|
4037
4029
|
name?: string;
|
|
4038
4030
|
noOptionsMessage?: () => string | undefined;
|
|
4031
|
+
filterOption?: (option: SelectOption<T, V, L>) => boolean;
|
|
4039
4032
|
};
|
|
4040
4033
|
|
|
4041
4034
|
declare const AirbnbSelect: <T = undefined, V extends SelectValue = string, L extends string | number | ReactNode = string>(props: AirbnbSelectProps<T, V, L> & {
|
|
@@ -4055,7 +4048,6 @@ type AirbnbSearchableSelectProps<T = undefined, V extends AirbnbSearchableSelect
|
|
|
4055
4048
|
loading?: boolean;
|
|
4056
4049
|
hasNextPage?: boolean;
|
|
4057
4050
|
onLoadMore?: () => void;
|
|
4058
|
-
variant?: 'default' | 'airbnb';
|
|
4059
4051
|
label: string;
|
|
4060
4052
|
topLabel?: string;
|
|
4061
4053
|
placeholder?: string;
|
package/dist/index.d.ts
CHANGED
|
@@ -3835,7 +3835,6 @@ declare function LegacyInfinitySelect({ label, className, placeholder, value, on
|
|
|
3835
3835
|
|
|
3836
3836
|
type AirbnbDatePickerValue = Date | number | null | undefined | '';
|
|
3837
3837
|
type AirbnbDatePickerProps = {
|
|
3838
|
-
variant?: 'default' | 'airbnb';
|
|
3839
3838
|
label: string;
|
|
3840
3839
|
topLabel?: string;
|
|
3841
3840
|
value?: AirbnbDatePickerValue;
|
|
@@ -3862,7 +3861,6 @@ declare const AirbnbDatePicker: React$1.ForwardRefExoticComponent<AirbnbDatePick
|
|
|
3862
3861
|
|
|
3863
3862
|
type AirbnbFieldTriggerProps = {
|
|
3864
3863
|
as?: 'button' | 'div';
|
|
3865
|
-
variant?: 'airbnb' | 'default';
|
|
3866
3864
|
id: string;
|
|
3867
3865
|
label: string;
|
|
3868
3866
|
topLabel?: string;
|
|
@@ -3891,7 +3889,6 @@ type AirbnbFieldTriggerProps = {
|
|
|
3891
3889
|
} & Omit<React$1.HTMLAttributes<HTMLButtonElement | HTMLDivElement>, 'children' | 'className' | 'disabled' | 'id' | 'onClick' | 'onKeyDown'>;
|
|
3892
3890
|
declare const AirbnbFieldTrigger: React$1.ForwardRefExoticComponent<{
|
|
3893
3891
|
as?: "button" | "div";
|
|
3894
|
-
variant?: "airbnb" | "default";
|
|
3895
3892
|
id: string;
|
|
3896
3893
|
label: string;
|
|
3897
3894
|
topLabel?: string;
|
|
@@ -3920,7 +3917,6 @@ declare const AirbnbFieldTrigger: React$1.ForwardRefExoticComponent<{
|
|
|
3920
3917
|
} & Omit<React$1.HTMLAttributes<HTMLDivElement | HTMLButtonElement>, "className" | "id" | "children" | "onKeyDown" | "onClick" | "disabled"> & React$1.RefAttributes<HTMLDivElement | HTMLButtonElement>>;
|
|
3921
3918
|
|
|
3922
3919
|
type AirbnbInputProps = React$1.InputHTMLAttributes<HTMLInputElement> & {
|
|
3923
|
-
variant?: 'airbnb' | 'default';
|
|
3924
3920
|
label?: string;
|
|
3925
3921
|
topLabel?: string;
|
|
3926
3922
|
helperText?: string;
|
|
@@ -3937,7 +3933,6 @@ type AirbnbInputProps = React$1.InputHTMLAttributes<HTMLInputElement> & {
|
|
|
3937
3933
|
renderErrorMessage?: boolean;
|
|
3938
3934
|
};
|
|
3939
3935
|
declare const AirbnbInput: React$1.ForwardRefExoticComponent<React$1.InputHTMLAttributes<HTMLInputElement> & {
|
|
3940
|
-
variant?: "airbnb" | "default";
|
|
3941
3936
|
label?: string;
|
|
3942
3937
|
topLabel?: string;
|
|
3943
3938
|
helperText?: string;
|
|
@@ -3964,7 +3959,6 @@ type AirbnbPhoneFieldValue = {
|
|
|
3964
3959
|
number: string;
|
|
3965
3960
|
};
|
|
3966
3961
|
type AirbnbPhoneFieldProps = {
|
|
3967
|
-
variant?: 'default' | 'airbnb';
|
|
3968
3962
|
label: string;
|
|
3969
3963
|
topLabel?: string;
|
|
3970
3964
|
value?: AirbnbPhoneFieldValue | null;
|
|
@@ -3992,7 +3986,6 @@ type SelectValue = string | number;
|
|
|
3992
3986
|
type SelectRenderTriggerProps<T = undefined, V extends SelectValue = string, L extends string | number | React$1.ReactNode = string> = {
|
|
3993
3987
|
id: string;
|
|
3994
3988
|
open: boolean;
|
|
3995
|
-
variant: 'default' | 'airbnb';
|
|
3996
3989
|
label: string;
|
|
3997
3990
|
topLabel?: string;
|
|
3998
3991
|
helperText: string;
|
|
@@ -4016,7 +4009,6 @@ type AirbnbSelectProps<T = undefined, V extends SelectValue = string, L extends
|
|
|
4016
4009
|
value?: SelectOption<T, V, L> | null;
|
|
4017
4010
|
onChange: (option: SelectOption<T, V, L>) => void;
|
|
4018
4011
|
onBlur?: React$1.FocusEventHandler<HTMLButtonElement>;
|
|
4019
|
-
variant?: 'default' | 'airbnb';
|
|
4020
4012
|
label: string;
|
|
4021
4013
|
topLabel?: string;
|
|
4022
4014
|
placeholder?: string;
|
|
@@ -4036,6 +4028,7 @@ type AirbnbSelectProps<T = undefined, V extends SelectValue = string, L extends
|
|
|
4036
4028
|
mobileTitle?: string;
|
|
4037
4029
|
name?: string;
|
|
4038
4030
|
noOptionsMessage?: () => string | undefined;
|
|
4031
|
+
filterOption?: (option: SelectOption<T, V, L>) => boolean;
|
|
4039
4032
|
};
|
|
4040
4033
|
|
|
4041
4034
|
declare const AirbnbSelect: <T = undefined, V extends SelectValue = string, L extends string | number | ReactNode = string>(props: AirbnbSelectProps<T, V, L> & {
|
|
@@ -4055,7 +4048,6 @@ type AirbnbSearchableSelectProps<T = undefined, V extends AirbnbSearchableSelect
|
|
|
4055
4048
|
loading?: boolean;
|
|
4056
4049
|
hasNextPage?: boolean;
|
|
4057
4050
|
onLoadMore?: () => void;
|
|
4058
|
-
variant?: 'default' | 'airbnb';
|
|
4059
4051
|
label: string;
|
|
4060
4052
|
topLabel?: string;
|
|
4061
4053
|
placeholder?: string;
|
package/dist/index.js
CHANGED
|
@@ -14317,7 +14317,14 @@ function InfiniteScrollSelectInternal(props, ref) {
|
|
|
14317
14317
|
if (synthetic) list = [synthetic, ...list];
|
|
14318
14318
|
}
|
|
14319
14319
|
return list;
|
|
14320
|
-
}, [
|
|
14320
|
+
}, [
|
|
14321
|
+
rawOptions,
|
|
14322
|
+
inputValue,
|
|
14323
|
+
filterOption,
|
|
14324
|
+
getFullSearchOption,
|
|
14325
|
+
rest.getValueLabel,
|
|
14326
|
+
props
|
|
14327
|
+
]);
|
|
14321
14328
|
const contextValue = React52.useMemo(
|
|
14322
14329
|
() => ({
|
|
14323
14330
|
canLoadMore,
|
|
@@ -17666,7 +17673,6 @@ import { Fragment as Fragment18, jsx as jsx182, jsxs as jsxs116 } from "react/js
|
|
|
17666
17673
|
var AirbnbFieldTrigger = React72.forwardRef(
|
|
17667
17674
|
({
|
|
17668
17675
|
as = "button",
|
|
17669
|
-
variant = "airbnb",
|
|
17670
17676
|
id,
|
|
17671
17677
|
label,
|
|
17672
17678
|
topLabel,
|
|
@@ -17719,7 +17725,6 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
17719
17725
|
)
|
|
17720
17726
|
] }) : visibleLabelText;
|
|
17721
17727
|
const animatedLabel = forceLabelText ? resolvedLabelText ?? placeholder : isRaised ? resolvedLabelText : label ?? placeholder;
|
|
17722
|
-
const isAirbnbVariant = variant === "airbnb";
|
|
17723
17728
|
const hasInvalidState = Boolean(error);
|
|
17724
17729
|
const errorMessage = typeof error === "string" ? error : void 0;
|
|
17725
17730
|
const isBlocked = Boolean(disabled) || Boolean(loading);
|
|
@@ -17734,11 +17739,11 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
17734
17739
|
)
|
|
17735
17740
|
] }) : void 0;
|
|
17736
17741
|
const sharedClasses = cn(
|
|
17737
|
-
"relative flex w-full items-center border bg-
|
|
17738
|
-
|
|
17739
|
-
|
|
17740
|
-
hasInvalidState ?
|
|
17741
|
-
disabled ? "cursor-not-allowed opacity-50" : loading ? "cursor-progress" :
|
|
17742
|
+
"relative flex w-full items-center border bg-transparent text-left transition-colors focus-visible:outline-none",
|
|
17743
|
+
"rounded-[12px] border-[#8c8c8c] pl-4 pr-4 focus-visible:ring-2 focus-visible:ring-[#222222] focus-visible:ring-offset-2",
|
|
17744
|
+
isRaised ? "min-h-[60px]" : "h-[60px]",
|
|
17745
|
+
hasInvalidState ? "border-[var(--error-message-color)] bg-[#FFF5F3]" : "border-[#8c8c8c]",
|
|
17746
|
+
disabled ? "cursor-not-allowed opacity-50" : loading ? "cursor-progress" : "cursor-pointer",
|
|
17742
17747
|
className
|
|
17743
17748
|
);
|
|
17744
17749
|
const sharedContent = /* @__PURE__ */ jsxs116(Fragment18, { children: [
|
|
@@ -17747,7 +17752,7 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
17747
17752
|
{
|
|
17748
17753
|
className: cn(
|
|
17749
17754
|
"relative min-w-0 flex-1 pr-2",
|
|
17750
|
-
|
|
17755
|
+
isRaised ? "h-[42px]" : "h-[28px]",
|
|
17751
17756
|
contentClassName
|
|
17752
17757
|
),
|
|
17753
17758
|
children: [
|
|
@@ -17758,8 +17763,8 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
17758
17763
|
className: cn(
|
|
17759
17764
|
"absolute left-0 origin-left transition-all duration-200 ease-out",
|
|
17760
17765
|
hasLabelMeta ? "max-w-full" : "pointer-events-none truncate",
|
|
17761
|
-
|
|
17762
|
-
hasInvalidState ? "text-[var(--error-message-color)]" :
|
|
17766
|
+
isRaised ? "top-[-1px] translate-y-0 text-xs leading-5" : "top-1/2 -translate-y-1/2 text-[16px] leading-7",
|
|
17767
|
+
hasInvalidState ? "text-[var(--error-message-color)]" : "text-[#6c6c6c]"
|
|
17763
17768
|
),
|
|
17764
17769
|
children: animatedLabel
|
|
17765
17770
|
}
|
|
@@ -17770,7 +17775,7 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
17770
17775
|
id: valueId,
|
|
17771
17776
|
className: cn(
|
|
17772
17777
|
"absolute left-0 block truncate transition-all duration-200 ease-out",
|
|
17773
|
-
|
|
17778
|
+
"bottom-0 translate-y-0 text-[16px] leading-6 opacity-100",
|
|
17774
17779
|
hasInvalidState ? "text-[var(--error-message-color)]" : "text-[#222222]"
|
|
17775
17780
|
),
|
|
17776
17781
|
children: valueText
|
|
@@ -17783,10 +17788,7 @@ var AirbnbFieldTrigger = React72.forwardRef(
|
|
|
17783
17788
|
"span",
|
|
17784
17789
|
{
|
|
17785
17790
|
"aria-hidden": "true",
|
|
17786
|
-
className:
|
|
17787
|
-
"pointer-events-none absolute top-1/2 -translate-y-1/2",
|
|
17788
|
-
isAirbnbVariant ? "right-5" : "right-4"
|
|
17789
|
-
),
|
|
17791
|
+
className: "pointer-events-none absolute right-5 top-1/2 -translate-y-1/2",
|
|
17790
17792
|
children: resolvedTrailingAdornment
|
|
17791
17793
|
}
|
|
17792
17794
|
)
|
|
@@ -17838,7 +17840,6 @@ import { jsx as jsx183, jsxs as jsxs117 } from "react/jsx-runtime";
|
|
|
17838
17840
|
var DEFAULT_MIN_DATE = new Date(1920, 0, 1);
|
|
17839
17841
|
var AirbnbDatePicker = React73.forwardRef(
|
|
17840
17842
|
({
|
|
17841
|
-
variant = "default",
|
|
17842
17843
|
label,
|
|
17843
17844
|
topLabel,
|
|
17844
17845
|
value,
|
|
@@ -17965,7 +17966,6 @@ var AirbnbDatePicker = React73.forwardRef(
|
|
|
17965
17966
|
{
|
|
17966
17967
|
id: triggerId,
|
|
17967
17968
|
ref: combinedRef,
|
|
17968
|
-
variant,
|
|
17969
17969
|
label,
|
|
17970
17970
|
topLabel,
|
|
17971
17971
|
labelId,
|
|
@@ -18031,7 +18031,6 @@ import { jsx as jsx184, jsxs as jsxs118 } from "react/jsx-runtime";
|
|
|
18031
18031
|
var getInputValue = (value) => value != null ? String(value) : "";
|
|
18032
18032
|
var AirbnbInput = React74.forwardRef(
|
|
18033
18033
|
({
|
|
18034
|
-
variant = "default",
|
|
18035
18034
|
label,
|
|
18036
18035
|
topLabel,
|
|
18037
18036
|
helperText,
|
|
@@ -18127,7 +18126,6 @@ var AirbnbInput = React74.forwardRef(
|
|
|
18127
18126
|
AirbnbFieldTrigger,
|
|
18128
18127
|
{
|
|
18129
18128
|
as: "div",
|
|
18130
|
-
variant,
|
|
18131
18129
|
id: fieldId,
|
|
18132
18130
|
label: accessibleLabel ?? "",
|
|
18133
18131
|
topLabel,
|
|
@@ -18143,14 +18141,11 @@ var AirbnbInput = React74.forwardRef(
|
|
|
18143
18141
|
tooltip,
|
|
18144
18142
|
describedBy: error && renderErrorMessage ? errorId : void 0,
|
|
18145
18143
|
className: cn(
|
|
18146
|
-
|
|
18144
|
+
"px-4 focus-within:ring-2 focus-within:ring-[#1F1F1B] focus-within:ring-offset-2",
|
|
18147
18145
|
disabled ? "cursor-not-allowed" : "cursor-text",
|
|
18148
18146
|
fieldClassName
|
|
18149
18147
|
),
|
|
18150
|
-
contentClassName: cn(
|
|
18151
|
-
variant === "airbnb" ? "h-[42px]" : "h-[48px]",
|
|
18152
|
-
contentClassName
|
|
18153
|
-
),
|
|
18148
|
+
contentClassName: cn("h-[42px]", contentClassName),
|
|
18154
18149
|
trailingAdornment: shouldShowPasswordReveal ? void 0 : trailingAdornment,
|
|
18155
18150
|
forceFloatingLabel: shouldShowLabel,
|
|
18156
18151
|
forceLabelText: hasLabelMeta,
|
|
@@ -18177,7 +18172,7 @@ var AirbnbInput = React74.forwardRef(
|
|
|
18177
18172
|
"aria-labelledby": accessibleLabel && !hasLabelMeta ? labelId : void 0,
|
|
18178
18173
|
className: cn(
|
|
18179
18174
|
"absolute left-0 h-6 w-full border-0 bg-transparent p-0 text-[16px] leading-6 text-[#1F1F1B] outline-none placeholder:text-[#7A8399]",
|
|
18180
|
-
|
|
18175
|
+
"bottom-0",
|
|
18181
18176
|
hasInvalidState ? "text-[var(--status-danger)] placeholder:text-[var(--status-danger)]" : "",
|
|
18182
18177
|
disabled ? "cursor-not-allowed" : loading ? "cursor-progress" : "",
|
|
18183
18178
|
shouldShowPasswordReveal ? "pr-8" : "",
|
|
@@ -18192,10 +18187,7 @@ var AirbnbInput = React74.forwardRef(
|
|
|
18192
18187
|
type: "button",
|
|
18193
18188
|
onClick: togglePasswordReveal,
|
|
18194
18189
|
disabled: isBlocked,
|
|
18195
|
-
className:
|
|
18196
|
-
"absolute right-0 flex h-6 w-6 items-center justify-center border-0 bg-transparent p-0 text-[#7A8399] hover:text-[#1F1F1B] hover:opacity-85 disabled:cursor-not-allowed disabled:opacity-50",
|
|
18197
|
-
variant === "airbnb" ? "bottom-0" : "bottom-[12px]"
|
|
18198
|
-
),
|
|
18190
|
+
className: "absolute bottom-0 right-0 flex h-6 w-6 items-center justify-center border-0 bg-transparent p-0 text-[#7A8399] hover:text-[#1F1F1B] hover:opacity-85 disabled:cursor-not-allowed disabled:opacity-50",
|
|
18199
18191
|
"aria-label": isPasswordRevealed ? t("hide_password") : t("show_password"),
|
|
18200
18192
|
children: /* @__PURE__ */ jsx184(
|
|
18201
18193
|
Eye2,
|
|
@@ -18571,7 +18563,6 @@ var AirbnbSelectTrigger = React75.forwardRef(
|
|
|
18571
18563
|
({
|
|
18572
18564
|
id,
|
|
18573
18565
|
open,
|
|
18574
|
-
variant,
|
|
18575
18566
|
label,
|
|
18576
18567
|
topLabel,
|
|
18577
18568
|
helperText,
|
|
@@ -18597,7 +18588,6 @@ var AirbnbSelectTrigger = React75.forwardRef(
|
|
|
18597
18588
|
{
|
|
18598
18589
|
id,
|
|
18599
18590
|
ref,
|
|
18600
|
-
variant,
|
|
18601
18591
|
"aria-haspopup": "listbox",
|
|
18602
18592
|
"aria-expanded": open,
|
|
18603
18593
|
"aria-controls": listboxId,
|
|
@@ -18989,7 +18979,6 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
18989
18979
|
value,
|
|
18990
18980
|
onChange,
|
|
18991
18981
|
onBlur,
|
|
18992
|
-
variant = "default",
|
|
18993
18982
|
label,
|
|
18994
18983
|
topLabel,
|
|
18995
18984
|
placeholder,
|
|
@@ -19008,11 +18997,13 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
19008
18997
|
doneLabel = "Done",
|
|
19009
18998
|
mobileTitle,
|
|
19010
18999
|
name,
|
|
19011
|
-
noOptionsMessage
|
|
19000
|
+
noOptionsMessage,
|
|
19001
|
+
filterOption
|
|
19012
19002
|
}, ref) {
|
|
19013
19003
|
const { isMatch: isMobile3 } = useScreenResize(DEVICE.mobileXL);
|
|
19014
19004
|
const [isOpen, setIsOpen] = React79.useState(false);
|
|
19015
19005
|
const containerRef = React79.useRef(null);
|
|
19006
|
+
const filteredOptions = filterOption ? options.filter(filterOption) : options;
|
|
19016
19007
|
const hasValue = Boolean(value);
|
|
19017
19008
|
const helperText = placeholder ?? label;
|
|
19018
19009
|
const shouldDescribeHelperText = !hasValue && helperText !== label;
|
|
@@ -19043,7 +19034,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
19043
19034
|
} = useMobileSelectWheel({
|
|
19044
19035
|
isMobile: isMobile3,
|
|
19045
19036
|
isOpen,
|
|
19046
|
-
options,
|
|
19037
|
+
options: filteredOptions,
|
|
19047
19038
|
value,
|
|
19048
19039
|
disabled: isBlocked
|
|
19049
19040
|
});
|
|
@@ -19060,13 +19051,13 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
19060
19051
|
} = useDesktopSelect({
|
|
19061
19052
|
isMobile: isMobile3,
|
|
19062
19053
|
isOpen,
|
|
19063
|
-
options,
|
|
19054
|
+
options: filteredOptions,
|
|
19064
19055
|
value,
|
|
19065
19056
|
disabled: isBlocked,
|
|
19066
19057
|
onChange
|
|
19067
19058
|
});
|
|
19068
19059
|
const combinedRef = useCombinedRef(ref, desktopTriggerRef);
|
|
19069
|
-
const activeMobileIndex = getOptionIndex2(
|
|
19060
|
+
const activeMobileIndex = getOptionIndex2(filteredOptions, pendingValue);
|
|
19070
19061
|
const valueLabel = value ? getValueLabel?.(value) ?? String(value.label) : void 0;
|
|
19071
19062
|
useOutsideClick({
|
|
19072
19063
|
elementRef: containerRef,
|
|
@@ -19083,12 +19074,12 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
19083
19074
|
if (value?.value === void 0 || value.value === null || value.label !== "") {
|
|
19084
19075
|
return;
|
|
19085
19076
|
}
|
|
19086
|
-
const validOption =
|
|
19077
|
+
const validOption = filteredOptions.find((option) => option.value === value.value);
|
|
19087
19078
|
if (validOption) {
|
|
19088
19079
|
onChange(validOption);
|
|
19089
19080
|
}
|
|
19090
19081
|
},
|
|
19091
|
-
[onChange,
|
|
19082
|
+
[onChange, filteredOptions, value]
|
|
19092
19083
|
);
|
|
19093
19084
|
const handleMobileOpenChange = React79.useCallback(
|
|
19094
19085
|
(nextOpen) => {
|
|
@@ -19173,7 +19164,6 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
19173
19164
|
renderTrigger ? renderTrigger({
|
|
19174
19165
|
id: triggerId,
|
|
19175
19166
|
open: isOpen,
|
|
19176
|
-
variant,
|
|
19177
19167
|
label,
|
|
19178
19168
|
topLabel,
|
|
19179
19169
|
helperText,
|
|
@@ -19197,7 +19187,6 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
19197
19187
|
id: triggerId,
|
|
19198
19188
|
ref: combinedRef,
|
|
19199
19189
|
open: isOpen,
|
|
19200
|
-
variant,
|
|
19201
19190
|
label,
|
|
19202
19191
|
topLabel,
|
|
19203
19192
|
helperText,
|
|
@@ -19231,7 +19220,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
19231
19220
|
mobileTitle,
|
|
19232
19221
|
doneLabel,
|
|
19233
19222
|
errorId: describedErrorId,
|
|
19234
|
-
options,
|
|
19223
|
+
options: filteredOptions,
|
|
19235
19224
|
disabled: isBlocked,
|
|
19236
19225
|
menuClassName,
|
|
19237
19226
|
scrollTop: mobileScrollTop,
|
|
@@ -19251,7 +19240,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
|
|
|
19251
19240
|
listboxId,
|
|
19252
19241
|
labelId,
|
|
19253
19242
|
errorId: describedErrorId,
|
|
19254
|
-
options,
|
|
19243
|
+
options: filteredOptions,
|
|
19255
19244
|
value,
|
|
19256
19245
|
highlightedIndex,
|
|
19257
19246
|
onOptionClick: (option) => {
|
|
@@ -19286,7 +19275,6 @@ function formatPhoneCodeOptionLabel2(option) {
|
|
|
19286
19275
|
}
|
|
19287
19276
|
var AirbnbPhoneField = React80.forwardRef(
|
|
19288
19277
|
({
|
|
19289
|
-
variant = "default",
|
|
19290
19278
|
label,
|
|
19291
19279
|
topLabel,
|
|
19292
19280
|
value,
|
|
@@ -19358,7 +19346,6 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
19358
19346
|
AirbnbSelect,
|
|
19359
19347
|
{
|
|
19360
19348
|
ref,
|
|
19361
|
-
variant,
|
|
19362
19349
|
options: codeOptions,
|
|
19363
19350
|
value: selectedCodeOption,
|
|
19364
19351
|
onChange: (option) => onChange({
|
|
@@ -19377,7 +19364,6 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
19377
19364
|
renderTrigger: ({
|
|
19378
19365
|
id,
|
|
19379
19366
|
open,
|
|
19380
|
-
variant: selectVariant,
|
|
19381
19367
|
disabled: triggerDisabled,
|
|
19382
19368
|
loading: triggerLoading,
|
|
19383
19369
|
listboxId,
|
|
@@ -19401,9 +19387,8 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
19401
19387
|
onClick,
|
|
19402
19388
|
onKeyDown,
|
|
19403
19389
|
className: cn(
|
|
19404
|
-
"flex w-full items-center justify-center gap-2 border border-r-0 text-[16px] font-medium leading-6 transition-colors focus-visible:outline-none",
|
|
19405
|
-
|
|
19406
|
-
hasInvalidState ? "border-[var(--status-danger)] bg-[#F2F2F2] text-[var(--status-danger)]" : selectVariant === "airbnb" ? "border-[#8C8C8C] bg-[#F4F4F2] text-[#1F1F1B]" : "border-[#A8A8A4] bg-white text-[#1F1F1B]",
|
|
19390
|
+
"flex h-full min-h-[60px] w-full items-center justify-center gap-2 rounded-l-[16px] rounded-r-none border border-r-0 px-4 text-[16px] font-medium leading-6 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#1F1F1B] focus-visible:ring-offset-2",
|
|
19391
|
+
hasInvalidState ? "border-[var(--status-danger)] bg-[#F2F2F2] text-[var(--status-danger)]" : "border-[#8C8C8C] bg-[#F4F4F2] text-[#1F1F1B]",
|
|
19407
19392
|
triggerDisabled ? "cursor-not-allowed opacity-50" : triggerLoading ? "cursor-progress" : "cursor-pointer"
|
|
19408
19393
|
),
|
|
19409
19394
|
children: [
|
|
@@ -19424,7 +19409,6 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
19424
19409
|
AirbnbInput,
|
|
19425
19410
|
{
|
|
19426
19411
|
id: inputId,
|
|
19427
|
-
variant,
|
|
19428
19412
|
type: "tel",
|
|
19429
19413
|
inputMode: "tel",
|
|
19430
19414
|
label,
|
|
@@ -19439,10 +19423,8 @@ var AirbnbPhoneField = React80.forwardRef(
|
|
|
19439
19423
|
tooltip,
|
|
19440
19424
|
renderErrorMessage: false,
|
|
19441
19425
|
wrapperClassName: "min-w-0 flex-1",
|
|
19442
|
-
fieldClassName:
|
|
19443
|
-
|
|
19444
|
-
),
|
|
19445
|
-
contentClassName: cn(variant === "airbnb" ? "h-[40px] py-2" : "h-[48px]"),
|
|
19426
|
+
fieldClassName: "min-h-[60px] rounded-l-none rounded-r-[16px] border-l-0",
|
|
19427
|
+
contentClassName: "h-[40px] py-2",
|
|
19446
19428
|
inputClassName: "text-[16px] leading-7",
|
|
19447
19429
|
onChange: (event) => onChange({
|
|
19448
19430
|
code: value?.code ?? "",
|
|
@@ -19483,7 +19465,6 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
19483
19465
|
loading,
|
|
19484
19466
|
hasNextPage,
|
|
19485
19467
|
onLoadMore,
|
|
19486
|
-
variant = "default",
|
|
19487
19468
|
label,
|
|
19488
19469
|
topLabel,
|
|
19489
19470
|
placeholder,
|
|
@@ -19667,7 +19648,6 @@ var AirbnbSearchableSelectInternal = ({
|
|
|
19667
19648
|
{
|
|
19668
19649
|
id: `${reactId}-trigger`,
|
|
19669
19650
|
ref: triggerRef,
|
|
19670
|
-
variant,
|
|
19671
19651
|
"aria-haspopup": "listbox",
|
|
19672
19652
|
"aria-expanded": open,
|
|
19673
19653
|
"aria-controls": listboxId,
|
|
@@ -19950,59 +19930,83 @@ import * as React83 from "react";
|
|
|
19950
19930
|
import * as SwitchPrimitives2 from "@radix-ui/react-switch";
|
|
19951
19931
|
import { Check as Check7 } from "lucide-react";
|
|
19952
19932
|
import { Fragment as Fragment19, jsx as jsx194, jsxs as jsxs126 } from "react/jsx-runtime";
|
|
19953
|
-
var AirbnbSwitch = React83.forwardRef(
|
|
19954
|
-
|
|
19955
|
-
|
|
19956
|
-
|
|
19957
|
-
|
|
19958
|
-
|
|
19959
|
-
|
|
19960
|
-
|
|
19961
|
-
|
|
19962
|
-
|
|
19963
|
-
|
|
19964
|
-
|
|
19965
|
-
|
|
19966
|
-
|
|
19967
|
-
|
|
19968
|
-
|
|
19969
|
-
|
|
19970
|
-
|
|
19971
|
-
|
|
19972
|
-
|
|
19973
|
-
|
|
19974
|
-
|
|
19975
|
-
|
|
19976
|
-
|
|
19977
|
-
|
|
19978
|
-
|
|
19979
|
-
className
|
|
19980
|
-
|
|
19981
|
-
|
|
19982
|
-
|
|
19983
|
-
|
|
19984
|
-
|
|
19985
|
-
|
|
19986
|
-
|
|
19987
|
-
|
|
19988
|
-
|
|
19989
|
-
|
|
19990
|
-
|
|
19991
|
-
|
|
19992
|
-
|
|
19933
|
+
var AirbnbSwitch = React83.forwardRef(
|
|
19934
|
+
({
|
|
19935
|
+
className,
|
|
19936
|
+
value,
|
|
19937
|
+
onChange,
|
|
19938
|
+
disabled,
|
|
19939
|
+
loading,
|
|
19940
|
+
readOnly,
|
|
19941
|
+
id,
|
|
19942
|
+
label,
|
|
19943
|
+
error,
|
|
19944
|
+
wrapperClassName,
|
|
19945
|
+
...props
|
|
19946
|
+
}, ref) => {
|
|
19947
|
+
const generatedId = React83.useId();
|
|
19948
|
+
const fieldId = id || generatedId;
|
|
19949
|
+
const switchElement = /* @__PURE__ */ jsx194(
|
|
19950
|
+
SwitchPrimitives2.Root,
|
|
19951
|
+
{
|
|
19952
|
+
ref,
|
|
19953
|
+
className: cn(
|
|
19954
|
+
"group inline-flex h-[24px] w-[36px] shrink-0 cursor-pointer items-center rounded-full border border-solid border-transparent p-[2px] transition-colors duration-200",
|
|
19955
|
+
"focus-visible:outline-none focus-visible:shadow-[var(--chekin-shadow-focus)]",
|
|
19956
|
+
"disabled:cursor-not-allowed disabled:opacity-50 aria-busy:cursor-wait aria-busy:opacity-50",
|
|
19957
|
+
"aria-readonly:cursor-default aria-readonly:opacity-100",
|
|
19958
|
+
"data-[state=checked]:bg-[#222222] data-[state=unchecked]:bg-[#E7E7E4]",
|
|
19959
|
+
className
|
|
19960
|
+
),
|
|
19961
|
+
id: fieldId,
|
|
19962
|
+
disabled,
|
|
19963
|
+
checked: value,
|
|
19964
|
+
value: String(value),
|
|
19965
|
+
onCheckedChange: !disabled && !readOnly ? onChange : void 0,
|
|
19966
|
+
"aria-busy": loading,
|
|
19967
|
+
"aria-readonly": readOnly,
|
|
19968
|
+
...props,
|
|
19969
|
+
children: /* @__PURE__ */ jsx194(
|
|
19970
|
+
SwitchPrimitives2.Thumb,
|
|
19971
|
+
{
|
|
19972
|
+
className: cn(
|
|
19973
|
+
"flex h-[20px] w-[20px] items-center justify-center rounded-full bg-white shadow-[0_1px_3px_rgba(0,0,0,0.22)] transition-transform duration-200",
|
|
19974
|
+
"data-[state=checked]:translate-x-[12px] data-[state=unchecked]:translate-x-0"
|
|
19975
|
+
),
|
|
19976
|
+
children: /* @__PURE__ */ jsx194(
|
|
19977
|
+
Check7,
|
|
19978
|
+
{
|
|
19979
|
+
"aria-hidden": "true",
|
|
19980
|
+
className: "h-3 w-3 text-[#222222] opacity-0 transition-opacity duration-150 group-data-[state=checked]:opacity-100",
|
|
19981
|
+
strokeWidth: 3
|
|
19982
|
+
}
|
|
19983
|
+
)
|
|
19984
|
+
}
|
|
19985
|
+
)
|
|
19986
|
+
}
|
|
19987
|
+
);
|
|
19988
|
+
if (!label && !error) {
|
|
19989
|
+
return switchElement;
|
|
19993
19990
|
}
|
|
19994
|
-
|
|
19995
|
-
|
|
19996
|
-
|
|
19991
|
+
return /* @__PURE__ */ jsxs126(Fragment19, { children: [
|
|
19992
|
+
/* @__PURE__ */ jsxs126("div", { className: cn("flex items-center gap-x-3 gap-y-1.5", wrapperClassName), children: [
|
|
19993
|
+
switchElement,
|
|
19994
|
+
label && /* @__PURE__ */ jsx194(
|
|
19995
|
+
Label,
|
|
19996
|
+
{
|
|
19997
|
+
htmlFor: fieldId,
|
|
19998
|
+
className: cn(
|
|
19999
|
+
"text-base font-medium",
|
|
20000
|
+
readOnly ? "cursor-default" : "cursor-pointer"
|
|
20001
|
+
),
|
|
20002
|
+
children: label
|
|
20003
|
+
}
|
|
20004
|
+
)
|
|
20005
|
+
] }),
|
|
20006
|
+
error && /* @__PURE__ */ jsx194(ErrorMessage, { disabled, children: error })
|
|
20007
|
+
] });
|
|
19997
20008
|
}
|
|
19998
|
-
|
|
19999
|
-
/* @__PURE__ */ jsxs126("div", { className: cn("flex items-center gap-x-3 gap-y-1.5", wrapperClassName), children: [
|
|
20000
|
-
switchElement,
|
|
20001
|
-
label && /* @__PURE__ */ jsx194(Label, { htmlFor: fieldId, className: "cursor-pointer text-base font-medium", children: label })
|
|
20002
|
-
] }),
|
|
20003
|
-
error && /* @__PURE__ */ jsx194(ErrorMessage, { disabled, children: error })
|
|
20004
|
-
] });
|
|
20005
|
-
});
|
|
20009
|
+
);
|
|
20006
20010
|
AirbnbSwitch.displayName = "AirbnbSwitch";
|
|
20007
20011
|
export {
|
|
20008
20012
|
ALERT_BOX_VARIANTS,
|