@chekinapp/ui 0.0.52 → 0.0.53
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 +310 -233
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +3 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.js +331 -255
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -318,6 +318,7 @@ __export(index_exports, {
|
|
|
318
318
|
useDebouncedFunction: () => useDebouncedFunction,
|
|
319
319
|
useEvent: () => useEvent,
|
|
320
320
|
useHover: () => useHover,
|
|
321
|
+
useIframeFocusTrapFallback: () => useIframeFocusTrapFallback,
|
|
321
322
|
useIsFormTouched: () => useIsFormTouched,
|
|
322
323
|
useIsMobile: () => useIsMobile,
|
|
323
324
|
useIsMounted: () => useIsMounted,
|
|
@@ -2372,7 +2373,7 @@ function DataTable({ columns, data }) {
|
|
|
2372
2373
|
}
|
|
2373
2374
|
|
|
2374
2375
|
// src/dialog/Dialog.tsx
|
|
2375
|
-
var
|
|
2376
|
+
var React13 = __toESM(require("react"), 1);
|
|
2376
2377
|
var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
|
|
2377
2378
|
var import_react_visually_hidden = require("@radix-ui/react-visually-hidden");
|
|
2378
2379
|
var import_lucide_react10 = require("lucide-react");
|
|
@@ -3000,6 +3001,77 @@ function useKeyDown(key, cb, options) {
|
|
|
3000
3001
|
}, [handleKeyDown, enabled]);
|
|
3001
3002
|
}
|
|
3002
3003
|
|
|
3004
|
+
// src/hooks/use-iframe-focus-trap-fallback.ts
|
|
3005
|
+
var React12 = __toESM(require("react"), 1);
|
|
3006
|
+
var IFRAME_FOCUSABLE_SELECTOR = [
|
|
3007
|
+
"a[href]",
|
|
3008
|
+
"area[href]",
|
|
3009
|
+
'input:not([disabled]):not([type="hidden"])',
|
|
3010
|
+
"select:not([disabled])",
|
|
3011
|
+
"textarea:not([disabled])",
|
|
3012
|
+
"button:not([disabled])",
|
|
3013
|
+
"iframe",
|
|
3014
|
+
"object",
|
|
3015
|
+
"embed",
|
|
3016
|
+
'[contenteditable="true"]',
|
|
3017
|
+
'[tabindex]:not([tabindex="-1"])'
|
|
3018
|
+
].join(",");
|
|
3019
|
+
function getFocusableElements(container) {
|
|
3020
|
+
const ownerDocument = container.ownerDocument;
|
|
3021
|
+
const HTMLElementConstructor = ownerDocument.defaultView?.HTMLElement ?? HTMLElement;
|
|
3022
|
+
return Array.from(
|
|
3023
|
+
container.querySelectorAll(IFRAME_FOCUSABLE_SELECTOR)
|
|
3024
|
+
).filter((element) => {
|
|
3025
|
+
if (!(element instanceof HTMLElementConstructor)) {
|
|
3026
|
+
return false;
|
|
3027
|
+
}
|
|
3028
|
+
if (element.tabIndex < 0 || element.hidden || element.getAttribute("aria-hidden")) {
|
|
3029
|
+
return false;
|
|
3030
|
+
}
|
|
3031
|
+
return element.getClientRects().length > 0 || element === ownerDocument.activeElement;
|
|
3032
|
+
});
|
|
3033
|
+
}
|
|
3034
|
+
function useIframeFocusTrapFallback(contentRef, onKeyDown) {
|
|
3035
|
+
return React12.useCallback(
|
|
3036
|
+
(event) => {
|
|
3037
|
+
onKeyDown?.(event);
|
|
3038
|
+
if (event.defaultPrevented || event.key !== "Tab") {
|
|
3039
|
+
return;
|
|
3040
|
+
}
|
|
3041
|
+
const contentNode = contentRef.current;
|
|
3042
|
+
if (!contentNode || !window.chekinCustomDocument || contentNode.ownerDocument !== window.chekinCustomDocument) {
|
|
3043
|
+
return;
|
|
3044
|
+
}
|
|
3045
|
+
const focusableElements = getFocusableElements(contentNode);
|
|
3046
|
+
if (!focusableElements.length) {
|
|
3047
|
+
event.preventDefault();
|
|
3048
|
+
contentNode.focus();
|
|
3049
|
+
return;
|
|
3050
|
+
}
|
|
3051
|
+
const firstFocusableElement = focusableElements[0];
|
|
3052
|
+
const lastFocusableElement = focusableElements[focusableElements.length - 1];
|
|
3053
|
+
const activeElement = contentNode.ownerDocument.activeElement;
|
|
3054
|
+
if (focusableElements.length === 1) {
|
|
3055
|
+
event.preventDefault();
|
|
3056
|
+
firstFocusableElement.focus();
|
|
3057
|
+
return;
|
|
3058
|
+
}
|
|
3059
|
+
if (event.shiftKey) {
|
|
3060
|
+
if (activeElement === firstFocusableElement || activeElement === contentNode) {
|
|
3061
|
+
event.preventDefault();
|
|
3062
|
+
lastFocusableElement.focus();
|
|
3063
|
+
}
|
|
3064
|
+
return;
|
|
3065
|
+
}
|
|
3066
|
+
if (activeElement === lastFocusableElement) {
|
|
3067
|
+
event.preventDefault();
|
|
3068
|
+
firstFocusableElement.focus();
|
|
3069
|
+
}
|
|
3070
|
+
},
|
|
3071
|
+
[contentRef, onKeyDown]
|
|
3072
|
+
);
|
|
3073
|
+
}
|
|
3074
|
+
|
|
3003
3075
|
// src/hooks/use-reset-after-request-status.ts
|
|
3004
3076
|
var import_react27 = require("react");
|
|
3005
3077
|
var ResetStatusTimeoutMs = 2e3;
|
|
@@ -3090,7 +3162,7 @@ function useIsFormTouched({
|
|
|
3090
3162
|
// src/dialog/Dialog.tsx
|
|
3091
3163
|
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
3092
3164
|
function useIframeTitleFix(titleRef) {
|
|
3093
|
-
|
|
3165
|
+
React13.useEffect(() => {
|
|
3094
3166
|
if (!window.chekinCustomDocument) {
|
|
3095
3167
|
return;
|
|
3096
3168
|
}
|
|
@@ -3119,7 +3191,7 @@ function DialogClose({ ...props }) {
|
|
|
3119
3191
|
}
|
|
3120
3192
|
var dialogOverlayClasses = "fixed inset-0 z-50 bg-[var(--dialog-overlay-bg)] data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0";
|
|
3121
3193
|
var scrollableOverlayClasses = "fixed inset-0 z-50 flex flex-col items-center overflow-y-auto overscroll-none pb-[19px] pt-[20px]";
|
|
3122
|
-
var DialogOverlay =
|
|
3194
|
+
var DialogOverlay = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
3123
3195
|
DialogPrimitive.Overlay,
|
|
3124
3196
|
{
|
|
3125
3197
|
ref,
|
|
@@ -3131,7 +3203,7 @@ var DialogOverlay = React12.forwardRef(({ className, ...props }, ref) => /* @__P
|
|
|
3131
3203
|
DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
|
|
3132
3204
|
var dialogContentClasses = "relative z-50 my-auto w-full max-w-[calc(100%-2rem)] rounded-[var(--dialog-content-radius)] border border-[var(--dialog-content-border)] bg-[var(--dialog-content-bg)] p-6 text-[var(--dialog-content-text)] shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 sm:max-w-2xl";
|
|
3133
3205
|
var dialogCloseButtonClasses = "absolute right-4 top-4 flex size-6 items-center justify-center rounded-[var(--dialog-close-radius)] opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:shadow-chekin-focus disabled:pointer-events-none [&_svg:not([class*=size-])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0";
|
|
3134
|
-
var DialogContent =
|
|
3206
|
+
var DialogContent = React13.forwardRef(
|
|
3135
3207
|
({
|
|
3136
3208
|
className,
|
|
3137
3209
|
showCloseButton = true,
|
|
@@ -3141,13 +3213,17 @@ var DialogContent = React12.forwardRef(
|
|
|
3141
3213
|
overlayClassName,
|
|
3142
3214
|
...props
|
|
3143
3215
|
}, ref) => {
|
|
3216
|
+
const contentRef = React13.useRef(null);
|
|
3217
|
+
const combinedRef = useCombinedRef(contentRef, ref);
|
|
3218
|
+
const handleKeyDown = useIframeFocusTrapFallback(contentRef, props.onKeyDown);
|
|
3144
3219
|
const contentElement = /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
3145
3220
|
DialogPrimitive.Content,
|
|
3146
3221
|
{
|
|
3147
|
-
ref,
|
|
3222
|
+
ref: combinedRef,
|
|
3148
3223
|
"data-slot": "dialog-content",
|
|
3149
3224
|
className: cn(dialogContentClasses, className),
|
|
3150
3225
|
...props,
|
|
3226
|
+
onKeyDown: handleKeyDown,
|
|
3151
3227
|
children: [
|
|
3152
3228
|
children,
|
|
3153
3229
|
showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
@@ -3207,8 +3283,8 @@ var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_r
|
|
|
3207
3283
|
}
|
|
3208
3284
|
);
|
|
3209
3285
|
DialogFooter.displayName = "DialogFooter";
|
|
3210
|
-
var DialogTitle =
|
|
3211
|
-
const titleRef =
|
|
3286
|
+
var DialogTitle = React13.forwardRef(({ className, ...props }, ref) => {
|
|
3287
|
+
const titleRef = React13.useRef(null);
|
|
3212
3288
|
const combinedRef = useCombinedRef(titleRef, ref);
|
|
3213
3289
|
useIframeTitleFix(titleRef);
|
|
3214
3290
|
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
@@ -3222,7 +3298,7 @@ var DialogTitle = React12.forwardRef(({ className, ...props }, ref) => {
|
|
|
3222
3298
|
);
|
|
3223
3299
|
});
|
|
3224
3300
|
DialogTitle.displayName = DialogPrimitive.Title.displayName;
|
|
3225
|
-
var DialogDescription =
|
|
3301
|
+
var DialogDescription = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
3226
3302
|
DialogPrimitive.Description,
|
|
3227
3303
|
{
|
|
3228
3304
|
ref,
|
|
@@ -3284,9 +3360,9 @@ function ConfirmationDialog({
|
|
|
3284
3360
|
}
|
|
3285
3361
|
|
|
3286
3362
|
// src/default-select-trigger/DefaultSelectTrigger.tsx
|
|
3287
|
-
var
|
|
3363
|
+
var React14 = __toESM(require("react"), 1);
|
|
3288
3364
|
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
3289
|
-
var DefaultSelectTrigger =
|
|
3365
|
+
var DefaultSelectTrigger = React14.forwardRef(
|
|
3290
3366
|
({
|
|
3291
3367
|
className,
|
|
3292
3368
|
disabled,
|
|
@@ -3359,7 +3435,7 @@ function DownloadEntryFormsButton({
|
|
|
3359
3435
|
var import_react33 = require("react");
|
|
3360
3436
|
|
|
3361
3437
|
// src/dropdown-menu/DropdownMenu.tsx
|
|
3362
|
-
var
|
|
3438
|
+
var React15 = __toESM(require("react"), 1);
|
|
3363
3439
|
var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
|
|
3364
3440
|
var import_lucide_react12 = require("lucide-react");
|
|
3365
3441
|
|
|
@@ -3411,7 +3487,7 @@ function DropdownMenuRadioGroup({
|
|
|
3411
3487
|
}) {
|
|
3412
3488
|
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(DropdownMenuPrimitive.RadioGroup, { "data-slot": "dropdown-menu-radio-group", ...props });
|
|
3413
3489
|
}
|
|
3414
|
-
var DropdownMenuSubTrigger =
|
|
3490
|
+
var DropdownMenuSubTrigger = React15.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
3415
3491
|
DropdownMenuPrimitive.SubTrigger,
|
|
3416
3492
|
{
|
|
3417
3493
|
ref,
|
|
@@ -3433,7 +3509,7 @@ var DropdownMenuSubTrigger = React14.forwardRef(({ className, inset, children, .
|
|
|
3433
3509
|
}
|
|
3434
3510
|
));
|
|
3435
3511
|
DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
|
|
3436
|
-
var DropdownMenuSubContent =
|
|
3512
|
+
var DropdownMenuSubContent = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3437
3513
|
DropdownMenuPrimitive.SubContent,
|
|
3438
3514
|
{
|
|
3439
3515
|
ref,
|
|
@@ -3451,7 +3527,7 @@ var DropdownMenuSubContent = React14.forwardRef(({ className, ...props }, ref) =
|
|
|
3451
3527
|
}
|
|
3452
3528
|
));
|
|
3453
3529
|
DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
|
|
3454
|
-
var DropdownMenuContent =
|
|
3530
|
+
var DropdownMenuContent = React15.forwardRef(({ className, sideOffset = 4, container, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(DropdownMenuPrimitive.Portal, { container: container || getCustomContainer(), children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3455
3531
|
DropdownMenuPrimitive.Content,
|
|
3456
3532
|
{
|
|
3457
3533
|
ref,
|
|
@@ -3473,7 +3549,7 @@ var DropdownMenuContent = React14.forwardRef(({ className, sideOffset = 4, conta
|
|
|
3473
3549
|
}
|
|
3474
3550
|
) }));
|
|
3475
3551
|
DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
|
|
3476
|
-
var DropdownMenuItem =
|
|
3552
|
+
var DropdownMenuItem = React15.forwardRef(({ className, children, inset, active, leftSlot, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
3477
3553
|
DropdownMenuPrimitive.Item,
|
|
3478
3554
|
{
|
|
3479
3555
|
ref,
|
|
@@ -3498,7 +3574,7 @@ var DropdownMenuItem = React14.forwardRef(({ className, children, inset, active,
|
|
|
3498
3574
|
}
|
|
3499
3575
|
));
|
|
3500
3576
|
DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
|
|
3501
|
-
var DropdownMenuCheckboxItem =
|
|
3577
|
+
var DropdownMenuCheckboxItem = React15.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
3502
3578
|
DropdownMenuPrimitive.CheckboxItem,
|
|
3503
3579
|
{
|
|
3504
3580
|
ref,
|
|
@@ -3518,7 +3594,7 @@ var DropdownMenuCheckboxItem = React14.forwardRef(({ className, children, checke
|
|
|
3518
3594
|
}
|
|
3519
3595
|
));
|
|
3520
3596
|
DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
|
|
3521
|
-
var DropdownMenuRadioItem =
|
|
3597
|
+
var DropdownMenuRadioItem = React15.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
3522
3598
|
DropdownMenuPrimitive.RadioItem,
|
|
3523
3599
|
{
|
|
3524
3600
|
ref,
|
|
@@ -3537,7 +3613,7 @@ var DropdownMenuRadioItem = React14.forwardRef(({ className, children, ...props
|
|
|
3537
3613
|
}
|
|
3538
3614
|
));
|
|
3539
3615
|
DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
|
|
3540
|
-
var DropdownMenuLabel =
|
|
3616
|
+
var DropdownMenuLabel = React15.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3541
3617
|
DropdownMenuPrimitive.Label,
|
|
3542
3618
|
{
|
|
3543
3619
|
ref,
|
|
@@ -3550,7 +3626,7 @@ var DropdownMenuLabel = React14.forwardRef(({ className, inset, ...props }, ref)
|
|
|
3550
3626
|
}
|
|
3551
3627
|
));
|
|
3552
3628
|
DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
|
|
3553
|
-
var DropdownMenuSeparator =
|
|
3629
|
+
var DropdownMenuSeparator = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3554
3630
|
DropdownMenuPrimitive.Separator,
|
|
3555
3631
|
{
|
|
3556
3632
|
ref,
|
|
@@ -3939,9 +4015,9 @@ function EmptySectionPlaceholder({
|
|
|
3939
4015
|
}
|
|
3940
4016
|
|
|
3941
4017
|
// src/external-link/ExternalLink.tsx
|
|
3942
|
-
var
|
|
4018
|
+
var React16 = __toESM(require("react"), 1);
|
|
3943
4019
|
var import_jsx_runtime49 = require("react/jsx-runtime");
|
|
3944
|
-
var ExternalLink =
|
|
4020
|
+
var ExternalLink = React16.forwardRef(
|
|
3945
4021
|
({ className, children, showIcon = true, target = "_blank", rel, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
|
|
3946
4022
|
"a",
|
|
3947
4023
|
{
|
|
@@ -3987,7 +4063,7 @@ var import_react_i18next10 = require("react-i18next");
|
|
|
3987
4063
|
var import_lucide_react15 = require("lucide-react");
|
|
3988
4064
|
|
|
3989
4065
|
// src/switch/Switch.tsx
|
|
3990
|
-
var
|
|
4066
|
+
var React17 = __toESM(require("react"), 1);
|
|
3991
4067
|
var SwitchPrimitives = __toESM(require("@radix-ui/react-switch"), 1);
|
|
3992
4068
|
var import_class_variance_authority7 = require("class-variance-authority");
|
|
3993
4069
|
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
@@ -4029,9 +4105,9 @@ var switchThumbVariants = (0, import_class_variance_authority7.cva)(
|
|
|
4029
4105
|
}
|
|
4030
4106
|
}
|
|
4031
4107
|
);
|
|
4032
|
-
var Switch =
|
|
4108
|
+
var Switch = React17.forwardRef(
|
|
4033
4109
|
({ className, size, readOnly, loading, onChange, value, id, label, error, ...props }, ref) => {
|
|
4034
|
-
const generatedId =
|
|
4110
|
+
const generatedId = React17.useId();
|
|
4035
4111
|
const fieldId = id || generatedId;
|
|
4036
4112
|
const switchElement = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
4037
4113
|
SwitchPrimitives.Root,
|
|
@@ -4677,7 +4753,7 @@ var FreeTextField = (0, import_react37.forwardRef)(
|
|
|
4677
4753
|
FreeTextField.displayName = "FreeTextField";
|
|
4678
4754
|
|
|
4679
4755
|
// src/framed-icon/FramedIcon.tsx
|
|
4680
|
-
var
|
|
4756
|
+
var React18 = __toESM(require("react"), 1);
|
|
4681
4757
|
var import_class_variance_authority8 = require("class-variance-authority");
|
|
4682
4758
|
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
4683
4759
|
var framedIconVariants = (0, import_class_variance_authority8.cva)("inline-flex items-center justify-center shrink-0", {
|
|
@@ -4701,7 +4777,7 @@ var framedIconVariants = (0, import_class_variance_authority8.cva)("inline-flex
|
|
|
4701
4777
|
},
|
|
4702
4778
|
defaultVariants: { size: "m", shape: "rounded", tone: "info" }
|
|
4703
4779
|
});
|
|
4704
|
-
var FramedIcon =
|
|
4780
|
+
var FramedIcon = React18.forwardRef(
|
|
4705
4781
|
({ className, size, shape, tone, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
4706
4782
|
"span",
|
|
4707
4783
|
{
|
|
@@ -4863,7 +4939,7 @@ var IconRegistry = class {
|
|
|
4863
4939
|
var RegistryIcon = Icon;
|
|
4864
4940
|
|
|
4865
4941
|
// src/icon-button/IconButton.tsx
|
|
4866
|
-
var
|
|
4942
|
+
var React19 = __toESM(require("react"), 1);
|
|
4867
4943
|
var import_class_variance_authority9 = require("class-variance-authority");
|
|
4868
4944
|
var import_jsx_runtime63 = require("react/jsx-runtime");
|
|
4869
4945
|
var iconButtonVariants = (0, import_class_variance_authority9.cva)(
|
|
@@ -4894,7 +4970,7 @@ var iconButtonVariants = (0, import_class_variance_authority9.cva)(
|
|
|
4894
4970
|
defaultVariants: { size: "m", shape: "rounded", variant: "secondary" }
|
|
4895
4971
|
}
|
|
4896
4972
|
);
|
|
4897
|
-
var IconButton =
|
|
4973
|
+
var IconButton = React19.forwardRef(
|
|
4898
4974
|
({ className, size, shape, variant, label, children, type = "button", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
|
|
4899
4975
|
"button",
|
|
4900
4976
|
{
|
|
@@ -4949,9 +5025,9 @@ function Image2({
|
|
|
4949
5025
|
}
|
|
4950
5026
|
|
|
4951
5027
|
// src/input/Input.tsx
|
|
4952
|
-
var
|
|
5028
|
+
var React20 = __toESM(require("react"), 1);
|
|
4953
5029
|
var import_jsx_runtime66 = require("react/jsx-runtime");
|
|
4954
|
-
var Input =
|
|
5030
|
+
var Input = React20.forwardRef(
|
|
4955
5031
|
({ className, type, readOnly, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
4956
5032
|
"input",
|
|
4957
5033
|
{
|
|
@@ -4975,7 +5051,7 @@ var Input = React19.forwardRef(
|
|
|
4975
5051
|
Input.displayName = "Input";
|
|
4976
5052
|
|
|
4977
5053
|
// src/input-otp/InputOTP.tsx
|
|
4978
|
-
var
|
|
5054
|
+
var React21 = __toESM(require("react"), 1);
|
|
4979
5055
|
|
|
4980
5056
|
// src/input-otp/InputOTPContext.ts
|
|
4981
5057
|
var import_react41 = require("react");
|
|
@@ -5258,11 +5334,11 @@ function InputOTP({
|
|
|
5258
5334
|
}
|
|
5259
5335
|
) });
|
|
5260
5336
|
}
|
|
5261
|
-
var InputOTPGroup =
|
|
5337
|
+
var InputOTPGroup = React21.forwardRef(
|
|
5262
5338
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { ref, className: cn("flex items-center", className), ...props })
|
|
5263
5339
|
);
|
|
5264
5340
|
InputOTPGroup.displayName = "InputOTPGroup";
|
|
5265
|
-
var InputOTPSlot =
|
|
5341
|
+
var InputOTPSlot = React21.forwardRef(
|
|
5266
5342
|
({ index, className, ...props }, ref) => {
|
|
5267
5343
|
const {
|
|
5268
5344
|
char,
|
|
@@ -5311,7 +5387,7 @@ var InputOTPSlot = React20.forwardRef(
|
|
|
5311
5387
|
}
|
|
5312
5388
|
);
|
|
5313
5389
|
InputOTPSlot.displayName = "InputOTPSlot";
|
|
5314
|
-
var InputOTPSeparator =
|
|
5390
|
+
var InputOTPSeparator = React21.forwardRef(
|
|
5315
5391
|
(props, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { ref, role: "separator", ...props })
|
|
5316
5392
|
);
|
|
5317
5393
|
InputOTPSeparator.displayName = "InputOTPSeparator";
|
|
@@ -6429,7 +6505,7 @@ var import_lucide_react26 = require("lucide-react");
|
|
|
6429
6505
|
var import_react50 = require("react");
|
|
6430
6506
|
|
|
6431
6507
|
// src/select/components.tsx
|
|
6432
|
-
var
|
|
6508
|
+
var React23 = __toESM(require("react"), 1);
|
|
6433
6509
|
var SelectPrimitive = __toESM(require("@radix-ui/react-select"), 1);
|
|
6434
6510
|
var import_lucide_react24 = require("lucide-react");
|
|
6435
6511
|
var import_jsx_runtime79 = require("react/jsx-runtime");
|
|
@@ -6441,7 +6517,7 @@ var selectSizeClassNames = {
|
|
|
6441
6517
|
sm: "text-sm",
|
|
6442
6518
|
md: "text-base"
|
|
6443
6519
|
};
|
|
6444
|
-
var SelectTrigger =
|
|
6520
|
+
var SelectTrigger = React23.forwardRef(({ className, children, size = "sm", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(
|
|
6445
6521
|
SelectPrimitive.Trigger,
|
|
6446
6522
|
{
|
|
6447
6523
|
ref,
|
|
@@ -6468,7 +6544,7 @@ var SelectTrigger = React22.forwardRef(({ className, children, size = "sm", ...p
|
|
|
6468
6544
|
}
|
|
6469
6545
|
));
|
|
6470
6546
|
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
|
|
6471
|
-
var SelectScrollUpButton =
|
|
6547
|
+
var SelectScrollUpButton = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
6472
6548
|
SelectPrimitive.ScrollUpButton,
|
|
6473
6549
|
{
|
|
6474
6550
|
ref,
|
|
@@ -6478,7 +6554,7 @@ var SelectScrollUpButton = React22.forwardRef(({ className, ...props }, ref) =>
|
|
|
6478
6554
|
}
|
|
6479
6555
|
));
|
|
6480
6556
|
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
6481
|
-
var SelectScrollDownButton =
|
|
6557
|
+
var SelectScrollDownButton = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
6482
6558
|
SelectPrimitive.ScrollDownButton,
|
|
6483
6559
|
{
|
|
6484
6560
|
ref,
|
|
@@ -6488,7 +6564,7 @@ var SelectScrollDownButton = React22.forwardRef(({ className, ...props }, ref) =
|
|
|
6488
6564
|
}
|
|
6489
6565
|
));
|
|
6490
6566
|
SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
|
|
6491
|
-
var SelectContent =
|
|
6567
|
+
var SelectContent = React23.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(
|
|
6492
6568
|
SelectPrimitive.Content,
|
|
6493
6569
|
{
|
|
6494
6570
|
ref,
|
|
@@ -6522,7 +6598,7 @@ var SelectContent = React22.forwardRef(({ className, children, position = "poppe
|
|
|
6522
6598
|
}
|
|
6523
6599
|
) }));
|
|
6524
6600
|
SelectContent.displayName = SelectPrimitive.Content.displayName;
|
|
6525
|
-
var SelectLabel =
|
|
6601
|
+
var SelectLabel = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
6526
6602
|
SelectPrimitive.Label,
|
|
6527
6603
|
{
|
|
6528
6604
|
ref,
|
|
@@ -6534,7 +6610,7 @@ var SelectLabel = React22.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
6534
6610
|
}
|
|
6535
6611
|
));
|
|
6536
6612
|
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
|
6537
|
-
var SelectItem =
|
|
6613
|
+
var SelectItem = React23.forwardRef(({ className, children, size = "sm", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(
|
|
6538
6614
|
SelectPrimitive.Item,
|
|
6539
6615
|
{
|
|
6540
6616
|
ref,
|
|
@@ -6554,7 +6630,7 @@ var SelectItem = React22.forwardRef(({ className, children, size = "sm", ...prop
|
|
|
6554
6630
|
}
|
|
6555
6631
|
));
|
|
6556
6632
|
SelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
6557
|
-
var SelectSeparator =
|
|
6633
|
+
var SelectSeparator = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
6558
6634
|
SelectPrimitive.Separator,
|
|
6559
6635
|
{
|
|
6560
6636
|
ref,
|
|
@@ -6964,7 +7040,7 @@ function Pagination({
|
|
|
6964
7040
|
}
|
|
6965
7041
|
|
|
6966
7042
|
// src/popover/Popover.tsx
|
|
6967
|
-
var
|
|
7043
|
+
var React24 = __toESM(require("react"), 1);
|
|
6968
7044
|
var RadixPopover = __toESM(require("@radix-ui/react-popover"), 1);
|
|
6969
7045
|
var import_jsx_runtime84 = require("react/jsx-runtime");
|
|
6970
7046
|
var Popover = RadixPopover.Root;
|
|
@@ -6972,7 +7048,7 @@ var PopoverTrigger = RadixPopover.Trigger;
|
|
|
6972
7048
|
var PopoverAnchor = RadixPopover.Anchor;
|
|
6973
7049
|
var PopoverPortal = RadixPopover.Portal;
|
|
6974
7050
|
var PopoverClose = RadixPopover.Close;
|
|
6975
|
-
var PopoverContent =
|
|
7051
|
+
var PopoverContent = React24.forwardRef(({ className, sideOffset = 4, align = "center", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(RadixPopover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
|
|
6976
7052
|
RadixPopover.Content,
|
|
6977
7053
|
{
|
|
6978
7054
|
ref,
|
|
@@ -7062,11 +7138,11 @@ function PopoverWithTooltip({
|
|
|
7062
7138
|
var import_react54 = require("react");
|
|
7063
7139
|
|
|
7064
7140
|
// src/radio-group/RadioGroup.tsx
|
|
7065
|
-
var
|
|
7141
|
+
var React25 = __toESM(require("react"), 1);
|
|
7066
7142
|
var RadioGroupPrimitive = __toESM(require("@radix-ui/react-radio-group"), 1);
|
|
7067
7143
|
var import_lucide_react27 = require("lucide-react");
|
|
7068
7144
|
var import_jsx_runtime86 = require("react/jsx-runtime");
|
|
7069
|
-
var RadioGroup2 =
|
|
7145
|
+
var RadioGroup2 = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
|
|
7070
7146
|
RadioGroupPrimitive.Root,
|
|
7071
7147
|
{
|
|
7072
7148
|
ref,
|
|
@@ -7075,7 +7151,7 @@ var RadioGroup2 = React24.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
7075
7151
|
}
|
|
7076
7152
|
));
|
|
7077
7153
|
RadioGroup2.displayName = RadioGroupPrimitive.Root.displayName;
|
|
7078
|
-
var RadioGroupItem =
|
|
7154
|
+
var RadioGroupItem = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
|
|
7079
7155
|
RadioGroupPrimitive.Item,
|
|
7080
7156
|
{
|
|
7081
7157
|
ref,
|
|
@@ -7296,7 +7372,7 @@ function RatingRadioGroup({
|
|
|
7296
7372
|
}
|
|
7297
7373
|
|
|
7298
7374
|
// src/rating-stars/RatingStars.tsx
|
|
7299
|
-
var
|
|
7375
|
+
var React26 = __toESM(require("react"), 1);
|
|
7300
7376
|
var import_lucide_react29 = require("lucide-react");
|
|
7301
7377
|
var import_react_i18next17 = require("react-i18next");
|
|
7302
7378
|
var import_jsx_runtime91 = require("react/jsx-runtime");
|
|
@@ -7316,7 +7392,7 @@ function RatingStars({
|
|
|
7316
7392
|
const { t } = (0, import_react_i18next17.useTranslation)();
|
|
7317
7393
|
const normalizedRating = Math.max(0, Math.min(maxRating, rating));
|
|
7318
7394
|
const stars = Array.from({ length: maxRating }, (_, index) => index + 1);
|
|
7319
|
-
const componentId =
|
|
7395
|
+
const componentId = React26.useId();
|
|
7320
7396
|
const decimal = normalizedRating - Math.floor(normalizedRating);
|
|
7321
7397
|
const partialStarIndex = decimal > 0 ? Math.ceil(normalizedRating) : -1;
|
|
7322
7398
|
const gradientId = `star-gradient-${componentId.replace(/:/g, "")}`;
|
|
@@ -7911,7 +7987,7 @@ function SheetDescription({
|
|
|
7911
7987
|
}
|
|
7912
7988
|
|
|
7913
7989
|
// src/sidebar/Sidebar.tsx
|
|
7914
|
-
var
|
|
7990
|
+
var React27 = __toESM(require("react"), 1);
|
|
7915
7991
|
var import_react_slot4 = require("@radix-ui/react-slot");
|
|
7916
7992
|
var import_class_variance_authority11 = require("class-variance-authority");
|
|
7917
7993
|
var import_lucide_react35 = require("lucide-react");
|
|
@@ -8004,7 +8080,7 @@ var SIDEBAR_COOKIE_NAME_DEFAULT = "sidebar_state";
|
|
|
8004
8080
|
var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
|
|
8005
8081
|
var SIDEBAR_WIDTH_MOBILE = "18rem";
|
|
8006
8082
|
var SIDEBAR_KEYBOARD_SHORTCUT = "b";
|
|
8007
|
-
var SidebarProvider =
|
|
8083
|
+
var SidebarProvider = React27.forwardRef(
|
|
8008
8084
|
({
|
|
8009
8085
|
defaultOpen = true,
|
|
8010
8086
|
open: openProp,
|
|
@@ -8016,10 +8092,10 @@ var SidebarProvider = React26.forwardRef(
|
|
|
8016
8092
|
...props
|
|
8017
8093
|
}, ref) => {
|
|
8018
8094
|
const isMobile = useIsMobile({ breakpoint: 641 });
|
|
8019
|
-
const [openMobile, setOpenMobile] =
|
|
8020
|
-
const [_open, _setOpen] =
|
|
8095
|
+
const [openMobile, setOpenMobile] = React27.useState(false);
|
|
8096
|
+
const [_open, _setOpen] = React27.useState(defaultOpen);
|
|
8021
8097
|
const open = openProp ?? _open;
|
|
8022
|
-
const setOpen =
|
|
8098
|
+
const setOpen = React27.useCallback(
|
|
8023
8099
|
(value) => {
|
|
8024
8100
|
const openState = typeof value === "function" ? value(open) : value;
|
|
8025
8101
|
if (setOpenProp) {
|
|
@@ -8031,10 +8107,10 @@ var SidebarProvider = React26.forwardRef(
|
|
|
8031
8107
|
},
|
|
8032
8108
|
[setOpenProp, open, stateName]
|
|
8033
8109
|
);
|
|
8034
|
-
const toggleSidebar =
|
|
8110
|
+
const toggleSidebar = React27.useCallback(() => {
|
|
8035
8111
|
return isMobile ? setOpenMobile((value) => !value) : setOpen((value) => !value);
|
|
8036
8112
|
}, [isMobile, setOpen]);
|
|
8037
|
-
|
|
8113
|
+
React27.useEffect(() => {
|
|
8038
8114
|
const handleKeyDown = (event) => {
|
|
8039
8115
|
if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
|
|
8040
8116
|
event.preventDefault();
|
|
@@ -8045,7 +8121,7 @@ var SidebarProvider = React26.forwardRef(
|
|
|
8045
8121
|
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
8046
8122
|
}, [toggleSidebar]);
|
|
8047
8123
|
const state = open ? "expanded" : "collapsed";
|
|
8048
|
-
const contextValue =
|
|
8124
|
+
const contextValue = React27.useMemo(
|
|
8049
8125
|
() => ({
|
|
8050
8126
|
state,
|
|
8051
8127
|
open,
|
|
@@ -8070,7 +8146,7 @@ var SidebarProvider = React26.forwardRef(
|
|
|
8070
8146
|
}
|
|
8071
8147
|
);
|
|
8072
8148
|
SidebarProvider.displayName = "SidebarProvider";
|
|
8073
|
-
var Sidebar =
|
|
8149
|
+
var Sidebar = React27.forwardRef(
|
|
8074
8150
|
({
|
|
8075
8151
|
side = "left",
|
|
8076
8152
|
variant = "sidebar",
|
|
@@ -8164,7 +8240,7 @@ var Sidebar = React26.forwardRef(
|
|
|
8164
8240
|
}
|
|
8165
8241
|
);
|
|
8166
8242
|
Sidebar.displayName = "Sidebar";
|
|
8167
|
-
var SidebarTrigger =
|
|
8243
|
+
var SidebarTrigger = React27.forwardRef(({ className, onClick, icon, ...props }, ref) => {
|
|
8168
8244
|
const { toggleSidebar, open, isMobile, openMobile } = useSidebar();
|
|
8169
8245
|
return /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(
|
|
8170
8246
|
Button,
|
|
@@ -8191,7 +8267,7 @@ var SidebarTrigger = React26.forwardRef(({ className, onClick, icon, ...props },
|
|
|
8191
8267
|
);
|
|
8192
8268
|
});
|
|
8193
8269
|
SidebarTrigger.displayName = "SidebarTrigger";
|
|
8194
|
-
var SidebarRail =
|
|
8270
|
+
var SidebarRail = React27.forwardRef(
|
|
8195
8271
|
({ className, ...props }, ref) => {
|
|
8196
8272
|
const { toggleSidebar } = useSidebar();
|
|
8197
8273
|
return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
@@ -8217,7 +8293,7 @@ var SidebarRail = React26.forwardRef(
|
|
|
8217
8293
|
}
|
|
8218
8294
|
);
|
|
8219
8295
|
SidebarRail.displayName = "SidebarRail";
|
|
8220
|
-
var SidebarInset =
|
|
8296
|
+
var SidebarInset = React27.forwardRef(
|
|
8221
8297
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8222
8298
|
"main",
|
|
8223
8299
|
{
|
|
@@ -8232,7 +8308,7 @@ var SidebarInset = React26.forwardRef(
|
|
|
8232
8308
|
)
|
|
8233
8309
|
);
|
|
8234
8310
|
SidebarInset.displayName = "SidebarInset";
|
|
8235
|
-
var SidebarInput =
|
|
8311
|
+
var SidebarInput = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8236
8312
|
Input,
|
|
8237
8313
|
{
|
|
8238
8314
|
ref,
|
|
@@ -8242,7 +8318,7 @@ var SidebarInput = React26.forwardRef(({ className, ...props }, ref) => /* @__PU
|
|
|
8242
8318
|
}
|
|
8243
8319
|
));
|
|
8244
8320
|
SidebarInput.displayName = "SidebarInput";
|
|
8245
|
-
var SidebarHeader =
|
|
8321
|
+
var SidebarHeader = React27.forwardRef(
|
|
8246
8322
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8247
8323
|
"div",
|
|
8248
8324
|
{
|
|
@@ -8254,7 +8330,7 @@ var SidebarHeader = React26.forwardRef(
|
|
|
8254
8330
|
)
|
|
8255
8331
|
);
|
|
8256
8332
|
SidebarHeader.displayName = "SidebarHeader";
|
|
8257
|
-
var SidebarFooter =
|
|
8333
|
+
var SidebarFooter = React27.forwardRef(
|
|
8258
8334
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8259
8335
|
"div",
|
|
8260
8336
|
{
|
|
@@ -8266,7 +8342,7 @@ var SidebarFooter = React26.forwardRef(
|
|
|
8266
8342
|
)
|
|
8267
8343
|
);
|
|
8268
8344
|
SidebarFooter.displayName = "SidebarFooter";
|
|
8269
|
-
var SidebarSeparator =
|
|
8345
|
+
var SidebarSeparator = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8270
8346
|
Separator3,
|
|
8271
8347
|
{
|
|
8272
8348
|
ref,
|
|
@@ -8276,7 +8352,7 @@ var SidebarSeparator = React26.forwardRef(({ className, ...props }, ref) => /* @
|
|
|
8276
8352
|
}
|
|
8277
8353
|
));
|
|
8278
8354
|
SidebarSeparator.displayName = "SidebarSeparator";
|
|
8279
|
-
var SidebarContent =
|
|
8355
|
+
var SidebarContent = React27.forwardRef(
|
|
8280
8356
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8281
8357
|
"div",
|
|
8282
8358
|
{
|
|
@@ -8291,7 +8367,7 @@ var SidebarContent = React26.forwardRef(
|
|
|
8291
8367
|
)
|
|
8292
8368
|
);
|
|
8293
8369
|
SidebarContent.displayName = "SidebarContent";
|
|
8294
|
-
var SidebarGroup =
|
|
8370
|
+
var SidebarGroup = React27.forwardRef(
|
|
8295
8371
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8296
8372
|
"div",
|
|
8297
8373
|
{
|
|
@@ -8303,7 +8379,7 @@ var SidebarGroup = React26.forwardRef(
|
|
|
8303
8379
|
)
|
|
8304
8380
|
);
|
|
8305
8381
|
SidebarGroup.displayName = "SidebarGroup";
|
|
8306
|
-
var SidebarGroupLabel =
|
|
8382
|
+
var SidebarGroupLabel = React27.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
8307
8383
|
const Comp = asChild ? import_react_slot4.Slot : "div";
|
|
8308
8384
|
return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8309
8385
|
Comp,
|
|
@@ -8320,7 +8396,7 @@ var SidebarGroupLabel = React26.forwardRef(({ className, asChild = false, ...pro
|
|
|
8320
8396
|
);
|
|
8321
8397
|
});
|
|
8322
8398
|
SidebarGroupLabel.displayName = "SidebarGroupLabel";
|
|
8323
|
-
var SidebarGroupAction =
|
|
8399
|
+
var SidebarGroupAction = React27.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
8324
8400
|
const Comp = asChild ? import_react_slot4.Slot : "button";
|
|
8325
8401
|
return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8326
8402
|
Comp,
|
|
@@ -8336,7 +8412,7 @@ var SidebarGroupAction = React26.forwardRef(({ className, asChild = false, ...pr
|
|
|
8336
8412
|
);
|
|
8337
8413
|
});
|
|
8338
8414
|
SidebarGroupAction.displayName = "SidebarGroupAction";
|
|
8339
|
-
var SidebarGroupContent =
|
|
8415
|
+
var SidebarGroupContent = React27.forwardRef(
|
|
8340
8416
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8341
8417
|
"div",
|
|
8342
8418
|
{
|
|
@@ -8348,7 +8424,7 @@ var SidebarGroupContent = React26.forwardRef(
|
|
|
8348
8424
|
)
|
|
8349
8425
|
);
|
|
8350
8426
|
SidebarGroupContent.displayName = "SidebarGroupContent";
|
|
8351
|
-
var SidebarMenu =
|
|
8427
|
+
var SidebarMenu = React27.forwardRef(
|
|
8352
8428
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8353
8429
|
"ul",
|
|
8354
8430
|
{
|
|
@@ -8360,7 +8436,7 @@ var SidebarMenu = React26.forwardRef(
|
|
|
8360
8436
|
)
|
|
8361
8437
|
);
|
|
8362
8438
|
SidebarMenu.displayName = "SidebarMenu";
|
|
8363
|
-
var SidebarMenuItem =
|
|
8439
|
+
var SidebarMenuItem = React27.forwardRef(
|
|
8364
8440
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8365
8441
|
"li",
|
|
8366
8442
|
{
|
|
@@ -8392,7 +8468,7 @@ var sidebarMenuButtonVariants = (0, import_class_variance_authority11.cva)(
|
|
|
8392
8468
|
}
|
|
8393
8469
|
}
|
|
8394
8470
|
);
|
|
8395
|
-
var SidebarMenuButton =
|
|
8471
|
+
var SidebarMenuButton = React27.forwardRef(
|
|
8396
8472
|
({
|
|
8397
8473
|
asChild = false,
|
|
8398
8474
|
isActive = false,
|
|
@@ -8438,7 +8514,7 @@ var SidebarMenuButton = React26.forwardRef(
|
|
|
8438
8514
|
}
|
|
8439
8515
|
);
|
|
8440
8516
|
SidebarMenuButton.displayName = "SidebarMenuButton";
|
|
8441
|
-
var SidebarMenuAction =
|
|
8517
|
+
var SidebarMenuAction = React27.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
|
|
8442
8518
|
const Comp = asChild ? import_react_slot4.Slot : "button";
|
|
8443
8519
|
return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8444
8520
|
Comp,
|
|
@@ -8455,7 +8531,7 @@ var SidebarMenuAction = React26.forwardRef(({ className, asChild = false, showOn
|
|
|
8455
8531
|
);
|
|
8456
8532
|
});
|
|
8457
8533
|
SidebarMenuAction.displayName = "SidebarMenuAction";
|
|
8458
|
-
var SidebarMenuBadge =
|
|
8534
|
+
var SidebarMenuBadge = React27.forwardRef(
|
|
8459
8535
|
({ className, ...props }, ref) => {
|
|
8460
8536
|
const { open, isMobile, openMobile } = useSidebar();
|
|
8461
8537
|
const isOpen = isMobile ? openMobile : open;
|
|
@@ -8475,8 +8551,8 @@ var SidebarMenuBadge = React26.forwardRef(
|
|
|
8475
8551
|
}
|
|
8476
8552
|
);
|
|
8477
8553
|
SidebarMenuBadge.displayName = "SidebarMenuBadge";
|
|
8478
|
-
var SidebarMenuSkeleton =
|
|
8479
|
-
const width =
|
|
8554
|
+
var SidebarMenuSkeleton = React27.forwardRef(({ className, showIcon = false, ...props }, ref) => {
|
|
8555
|
+
const width = React27.useMemo(() => `${Math.floor(Math.random() * 40) + 50}%`, []);
|
|
8480
8556
|
return /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(
|
|
8481
8557
|
"div",
|
|
8482
8558
|
{
|
|
@@ -8499,7 +8575,7 @@ var SidebarMenuSkeleton = React26.forwardRef(({ className, showIcon = false, ...
|
|
|
8499
8575
|
);
|
|
8500
8576
|
});
|
|
8501
8577
|
SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
|
|
8502
|
-
var SidebarMenuSub =
|
|
8578
|
+
var SidebarMenuSub = React27.forwardRef(
|
|
8503
8579
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
|
|
8504
8580
|
"ul",
|
|
8505
8581
|
{
|
|
@@ -8514,7 +8590,7 @@ var SidebarMenuSub = React26.forwardRef(
|
|
|
8514
8590
|
)
|
|
8515
8591
|
);
|
|
8516
8592
|
SidebarMenuSub.displayName = "SidebarMenuSub";
|
|
8517
|
-
var SidebarMenuSubItem =
|
|
8593
|
+
var SidebarMenuSubItem = React27.forwardRef(
|
|
8518
8594
|
({ ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("li", { ref, ...props })
|
|
8519
8595
|
);
|
|
8520
8596
|
SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
|
|
@@ -8538,7 +8614,7 @@ var sidebarMenuSubButtonVariants = (0, import_class_variance_authority11.cva)(
|
|
|
8538
8614
|
}
|
|
8539
8615
|
}
|
|
8540
8616
|
);
|
|
8541
|
-
var SidebarMenuSubButton =
|
|
8617
|
+
var SidebarMenuSubButton = React27.forwardRef(
|
|
8542
8618
|
({
|
|
8543
8619
|
asChild = false,
|
|
8544
8620
|
isActive,
|
|
@@ -8857,9 +8933,9 @@ SwitchBlocksInternal.displayName = "SwitchBlocks";
|
|
|
8857
8933
|
var SwitchBlocks = (0, import_react63.memo)(SwitchBlocksInternal);
|
|
8858
8934
|
|
|
8859
8935
|
// src/switch-group/SwitchGroup.tsx
|
|
8860
|
-
var
|
|
8936
|
+
var React28 = __toESM(require("react"), 1);
|
|
8861
8937
|
var import_jsx_runtime110 = require("react/jsx-runtime");
|
|
8862
|
-
var SwitchGroup =
|
|
8938
|
+
var SwitchGroup = React28.forwardRef(
|
|
8863
8939
|
({ options, value = [], onChange, disabled = false, className, error, ...props }, ref) => {
|
|
8864
8940
|
const handleOptionChange = (optionValue, checked) => {
|
|
8865
8941
|
if (!onChange) return;
|
|
@@ -9149,7 +9225,7 @@ function useUpdateToast({ id }) {
|
|
|
9149
9225
|
}
|
|
9150
9226
|
|
|
9151
9227
|
// src/toggle-group/ToggleGroup.tsx
|
|
9152
|
-
var
|
|
9228
|
+
var React29 = __toESM(require("react"), 1);
|
|
9153
9229
|
var ToggleGroupPrimitive = __toESM(require("@radix-ui/react-toggle-group"), 1);
|
|
9154
9230
|
|
|
9155
9231
|
// src/toggle-group/style.ts
|
|
@@ -9183,12 +9259,12 @@ var toggleVariants = (0, import_class_variance_authority13.cva)(
|
|
|
9183
9259
|
|
|
9184
9260
|
// src/toggle-group/ToggleGroup.tsx
|
|
9185
9261
|
var import_jsx_runtime115 = require("react/jsx-runtime");
|
|
9186
|
-
var ToggleGroupContext =
|
|
9262
|
+
var ToggleGroupContext = React29.createContext({
|
|
9187
9263
|
size: "default",
|
|
9188
9264
|
variant: "default",
|
|
9189
9265
|
theme: "default"
|
|
9190
9266
|
});
|
|
9191
|
-
var ToggleGroup =
|
|
9267
|
+
var ToggleGroup = React29.forwardRef(({ className, variant, size, theme, children, ...props }, ref) => {
|
|
9192
9268
|
const isTabVariant = variant === "tab";
|
|
9193
9269
|
return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
|
|
9194
9270
|
ToggleGroupPrimitive.Root,
|
|
@@ -9205,8 +9281,8 @@ var ToggleGroup = React28.forwardRef(({ className, variant, size, theme, childre
|
|
|
9205
9281
|
);
|
|
9206
9282
|
});
|
|
9207
9283
|
ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
|
|
9208
|
-
var ToggleGroupItem =
|
|
9209
|
-
const context =
|
|
9284
|
+
var ToggleGroupItem = React29.forwardRef(({ className, children, variant, size, theme, ...props }, ref) => {
|
|
9285
|
+
const context = React29.useContext(ToggleGroupContext);
|
|
9210
9286
|
const resolvedVariant = context.variant || variant;
|
|
9211
9287
|
const isTabVariant = resolvedVariant === "tab";
|
|
9212
9288
|
return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
|
|
@@ -9354,7 +9430,7 @@ function TogglesInternal({
|
|
|
9354
9430
|
var Toggles = (0, import_react66.forwardRef)(TogglesInternal);
|
|
9355
9431
|
|
|
9356
9432
|
// src/text-field/TextField.tsx
|
|
9357
|
-
var
|
|
9433
|
+
var React30 = __toESM(require("react"), 1);
|
|
9358
9434
|
var LabelPrimitive2 = __toESM(require("@radix-ui/react-label"), 1);
|
|
9359
9435
|
var import_class_variance_authority14 = require("class-variance-authority");
|
|
9360
9436
|
var import_react_i18next22 = require("react-i18next");
|
|
@@ -9470,7 +9546,7 @@ var floatingLabelClasses = [
|
|
|
9470
9546
|
"peer-focus:to-[var(--text-field-bg-filled)]",
|
|
9471
9547
|
"peer-focus:to-50%"
|
|
9472
9548
|
];
|
|
9473
|
-
var TextField =
|
|
9549
|
+
var TextField = React30.forwardRef(
|
|
9474
9550
|
({
|
|
9475
9551
|
className,
|
|
9476
9552
|
wrapperClassName,
|
|
@@ -9489,7 +9565,7 @@ var TextField = React29.forwardRef(
|
|
|
9489
9565
|
}, ref) => {
|
|
9490
9566
|
const { t } = (0, import_react_i18next22.useTranslation)();
|
|
9491
9567
|
const hasError = Boolean(error);
|
|
9492
|
-
const autoId =
|
|
9568
|
+
const autoId = React30.useId();
|
|
9493
9569
|
const inputId = props.id || autoId;
|
|
9494
9570
|
const inputClasses = cn(
|
|
9495
9571
|
inputVariants({ variant, error: hasError, readOnly: Boolean(readOnly) }),
|
|
@@ -9750,11 +9826,11 @@ function WideButton({ className, disabled, ...props }) {
|
|
|
9750
9826
|
}
|
|
9751
9827
|
|
|
9752
9828
|
// src/datepicker/DatePicker.tsx
|
|
9753
|
-
var
|
|
9829
|
+
var React34 = __toESM(require("react"), 1);
|
|
9754
9830
|
var import_lucide_react44 = require("lucide-react");
|
|
9755
9831
|
|
|
9756
9832
|
// src/drawer/Drawer.tsx
|
|
9757
|
-
var
|
|
9833
|
+
var React31 = __toESM(require("react"), 1);
|
|
9758
9834
|
var DialogPrimitive2 = __toESM(require("@radix-ui/react-dialog"), 1);
|
|
9759
9835
|
var import_react_draggable = __toESM(require("react-draggable"), 1);
|
|
9760
9836
|
var import_jsx_runtime125 = require("react/jsx-runtime");
|
|
@@ -9772,7 +9848,7 @@ function DrawerPortal({ ...props }) {
|
|
|
9772
9848
|
function DrawerClose({ ...props }) {
|
|
9773
9849
|
return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(DialogPrimitive2.Close, { "data-slot": "drawer-close", ...props });
|
|
9774
9850
|
}
|
|
9775
|
-
var DrawerOverlay =
|
|
9851
|
+
var DrawerOverlay = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
|
|
9776
9852
|
DialogPrimitive2.Overlay,
|
|
9777
9853
|
{
|
|
9778
9854
|
ref,
|
|
@@ -9786,7 +9862,7 @@ var DrawerOverlay = React30.forwardRef(({ className, ...props }, ref) => /* @__P
|
|
|
9786
9862
|
));
|
|
9787
9863
|
DrawerOverlay.displayName = DialogPrimitive2.Overlay.displayName;
|
|
9788
9864
|
var DrawerOverlayClasses = "fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=closed]:animate-out data-[state=closed]:fade-out-0";
|
|
9789
|
-
var DrawerContent =
|
|
9865
|
+
var DrawerContent = React31.forwardRef(
|
|
9790
9866
|
({
|
|
9791
9867
|
className,
|
|
9792
9868
|
children,
|
|
@@ -9798,19 +9874,19 @@ var DrawerContent = React30.forwardRef(
|
|
|
9798
9874
|
...props
|
|
9799
9875
|
}, ref) => {
|
|
9800
9876
|
const finalContainer = container || getCustomContainer() || void 0;
|
|
9801
|
-
const nodeRef =
|
|
9802
|
-
const [dragOffsetY, setDragOffsetY] =
|
|
9877
|
+
const nodeRef = React31.useRef(null);
|
|
9878
|
+
const [dragOffsetY, setDragOffsetY] = React31.useState(0);
|
|
9803
9879
|
const overlayOpacity = Math.max(
|
|
9804
9880
|
DRAWER_MIN_OVERLAY_OPACITY,
|
|
9805
9881
|
1 - dragOffsetY / (DRAWER_CLOSE_THRESHOLD * 2)
|
|
9806
9882
|
);
|
|
9807
|
-
const handleDrag =
|
|
9883
|
+
const handleDrag = React31.useCallback(
|
|
9808
9884
|
(_event, data) => {
|
|
9809
9885
|
setDragOffsetY(Math.max(0, data.y));
|
|
9810
9886
|
},
|
|
9811
9887
|
[]
|
|
9812
9888
|
);
|
|
9813
|
-
const handleStop =
|
|
9889
|
+
const handleStop = React31.useCallback(
|
|
9814
9890
|
(_event, data) => {
|
|
9815
9891
|
if (data.y > DRAWER_CLOSE_THRESHOLD) {
|
|
9816
9892
|
setDragOffsetY(0);
|
|
@@ -9901,7 +9977,7 @@ var DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_r
|
|
|
9901
9977
|
DrawerHeader.displayName = "DrawerHeader";
|
|
9902
9978
|
var DrawerFooter = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime125.jsx)("div", { className: cn("flex flex-col gap-2 p-5", className), ...props });
|
|
9903
9979
|
DrawerFooter.displayName = "DrawerFooter";
|
|
9904
|
-
var DrawerTitle =
|
|
9980
|
+
var DrawerTitle = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
|
|
9905
9981
|
DialogPrimitive2.Title,
|
|
9906
9982
|
{
|
|
9907
9983
|
ref,
|
|
@@ -9911,7 +9987,7 @@ var DrawerTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
9911
9987
|
}
|
|
9912
9988
|
));
|
|
9913
9989
|
DrawerTitle.displayName = DialogPrimitive2.Title.displayName;
|
|
9914
|
-
var DrawerDescription =
|
|
9990
|
+
var DrawerDescription = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
|
|
9915
9991
|
DialogPrimitive2.Description,
|
|
9916
9992
|
{
|
|
9917
9993
|
ref,
|
|
@@ -9923,7 +9999,7 @@ var DrawerDescription = React30.forwardRef(({ className, ...props }, ref) => /*
|
|
|
9923
9999
|
DrawerDescription.displayName = DialogPrimitive2.Description.displayName;
|
|
9924
10000
|
|
|
9925
10001
|
// src/datepicker/useDatePickerWheel.ts
|
|
9926
|
-
var
|
|
10002
|
+
var React32 = __toESM(require("react"), 1);
|
|
9927
10003
|
|
|
9928
10004
|
// src/datepicker/datePicker.utils.ts
|
|
9929
10005
|
var DISPLAY_PAD_LENGTH = 2;
|
|
@@ -10074,21 +10150,21 @@ function useDatePickerWheel({
|
|
|
10074
10150
|
minDate,
|
|
10075
10151
|
maxDate
|
|
10076
10152
|
}) {
|
|
10077
|
-
const years =
|
|
10078
|
-
const [draftDate, setDraftDate] =
|
|
10153
|
+
const years = React32.useMemo(() => getYearRange(minDate, maxDate), [maxDate, minDate]);
|
|
10154
|
+
const [draftDate, setDraftDate] = React32.useState(
|
|
10079
10155
|
() => resolveInitialDate({ value, defaultValue, minDate, maxDate })
|
|
10080
10156
|
);
|
|
10081
10157
|
const draftYear = draftDate.getFullYear();
|
|
10082
10158
|
const draftMonth = draftDate.getMonth();
|
|
10083
|
-
const [monthScrollTop, setMonthScrollTop] =
|
|
10084
|
-
const [dayScrollTop, setDayScrollTop] =
|
|
10085
|
-
const [yearScrollTop, setYearScrollTop] =
|
|
10086
|
-
const monthListRef =
|
|
10087
|
-
const dayListRef =
|
|
10088
|
-
const yearListRef =
|
|
10089
|
-
const settleTimeoutsRef =
|
|
10090
|
-
const animationFramesRef =
|
|
10091
|
-
const columnRefs =
|
|
10159
|
+
const [monthScrollTop, setMonthScrollTop] = React32.useState(0);
|
|
10160
|
+
const [dayScrollTop, setDayScrollTop] = React32.useState(0);
|
|
10161
|
+
const [yearScrollTop, setYearScrollTop] = React32.useState(0);
|
|
10162
|
+
const monthListRef = React32.useRef(null);
|
|
10163
|
+
const dayListRef = React32.useRef(null);
|
|
10164
|
+
const yearListRef = React32.useRef(null);
|
|
10165
|
+
const settleTimeoutsRef = React32.useRef({});
|
|
10166
|
+
const animationFramesRef = React32.useRef({});
|
|
10167
|
+
const columnRefs = React32.useMemo(
|
|
10092
10168
|
() => ({
|
|
10093
10169
|
month: monthListRef,
|
|
10094
10170
|
day: dayListRef,
|
|
@@ -10096,7 +10172,7 @@ function useDatePickerWheel({
|
|
|
10096
10172
|
}),
|
|
10097
10173
|
[]
|
|
10098
10174
|
);
|
|
10099
|
-
const setColumnScrollTop =
|
|
10175
|
+
const setColumnScrollTop = React32.useCallback(
|
|
10100
10176
|
(column, nextScrollTop) => {
|
|
10101
10177
|
if (column === "month") {
|
|
10102
10178
|
setMonthScrollTop(nextScrollTop);
|
|
@@ -10110,19 +10186,19 @@ function useDatePickerWheel({
|
|
|
10110
10186
|
},
|
|
10111
10187
|
[]
|
|
10112
10188
|
);
|
|
10113
|
-
const clearSettleTimeout =
|
|
10189
|
+
const clearSettleTimeout = React32.useCallback((column) => {
|
|
10114
10190
|
const timeoutId = settleTimeoutsRef.current[column];
|
|
10115
10191
|
if (timeoutId === void 0) return;
|
|
10116
10192
|
window.clearTimeout(timeoutId);
|
|
10117
10193
|
delete settleTimeoutsRef.current[column];
|
|
10118
10194
|
}, []);
|
|
10119
|
-
const clearAnimationFrame =
|
|
10195
|
+
const clearAnimationFrame = React32.useCallback((column) => {
|
|
10120
10196
|
const frameId = animationFramesRef.current[column];
|
|
10121
10197
|
if (frameId === void 0) return;
|
|
10122
10198
|
window.cancelAnimationFrame(frameId);
|
|
10123
10199
|
delete animationFramesRef.current[column];
|
|
10124
10200
|
}, []);
|
|
10125
|
-
|
|
10201
|
+
React32.useEffect(
|
|
10126
10202
|
() => () => {
|
|
10127
10203
|
["month", "day", "year"].forEach((column) => {
|
|
10128
10204
|
clearSettleTimeout(column);
|
|
@@ -10131,22 +10207,22 @@ function useDatePickerWheel({
|
|
|
10131
10207
|
},
|
|
10132
10208
|
[clearAnimationFrame, clearSettleTimeout]
|
|
10133
10209
|
);
|
|
10134
|
-
|
|
10210
|
+
React32.useEffect(() => {
|
|
10135
10211
|
if (isOpen) return;
|
|
10136
10212
|
setDraftDate(resolveInitialDate({ value, defaultValue, minDate, maxDate }));
|
|
10137
10213
|
}, [defaultValue, isOpen, maxDate, minDate, value]);
|
|
10138
|
-
const months =
|
|
10214
|
+
const months = React32.useMemo(
|
|
10139
10215
|
() => getAllowedMonths(draftYear, minDate, maxDate),
|
|
10140
10216
|
[draftYear, maxDate, minDate]
|
|
10141
10217
|
);
|
|
10142
|
-
const days =
|
|
10218
|
+
const days = React32.useMemo(
|
|
10143
10219
|
() => getAllowedDays(draftYear, draftMonth, minDate, maxDate),
|
|
10144
10220
|
[draftMonth, draftYear, maxDate, minDate]
|
|
10145
10221
|
);
|
|
10146
10222
|
const monthIndex = months.findIndex((month) => month === draftMonth);
|
|
10147
10223
|
const dayIndex = days.findIndex((day) => day === draftDate.getDate());
|
|
10148
10224
|
const yearIndex = years.findIndex((year) => year === draftYear);
|
|
10149
|
-
const syncScrollPositions =
|
|
10225
|
+
const syncScrollPositions = React32.useCallback(
|
|
10150
10226
|
(nextDate, behavior = "auto") => {
|
|
10151
10227
|
const nextMonths = getAllowedMonths(nextDate.getFullYear(), minDate, maxDate);
|
|
10152
10228
|
const nextMonthIndex = nextMonths.findIndex((month) => month === nextDate.getMonth());
|
|
@@ -10170,7 +10246,7 @@ function useDatePickerWheel({
|
|
|
10170
10246
|
},
|
|
10171
10247
|
[maxDate, minDate, years]
|
|
10172
10248
|
);
|
|
10173
|
-
|
|
10249
|
+
React32.useLayoutEffect(() => {
|
|
10174
10250
|
if (!isOpen) return;
|
|
10175
10251
|
const nextDate = resolveInitialDate({ value, defaultValue, minDate, maxDate });
|
|
10176
10252
|
setDraftDate(nextDate);
|
|
@@ -10181,7 +10257,7 @@ function useDatePickerWheel({
|
|
|
10181
10257
|
window.cancelAnimationFrame(frameId);
|
|
10182
10258
|
};
|
|
10183
10259
|
}, [defaultValue, isOpen, maxDate, minDate, syncScrollPositions, value]);
|
|
10184
|
-
const updateDraftDate =
|
|
10260
|
+
const updateDraftDate = React32.useCallback(
|
|
10185
10261
|
(column, targetIndex, behavior = "smooth") => {
|
|
10186
10262
|
const currentDate = stripTime(draftDate);
|
|
10187
10263
|
const currentYear = currentDate.getFullYear();
|
|
@@ -10226,7 +10302,7 @@ function useDatePickerWheel({
|
|
|
10226
10302
|
},
|
|
10227
10303
|
[days, draftDate, maxDate, minDate, months, syncScrollPositions, years]
|
|
10228
10304
|
);
|
|
10229
|
-
const settleColumnScroll =
|
|
10305
|
+
const settleColumnScroll = React32.useCallback(
|
|
10230
10306
|
(column) => {
|
|
10231
10307
|
const list = columnRefs[column].current;
|
|
10232
10308
|
if (!list) return;
|
|
@@ -10239,7 +10315,7 @@ function useDatePickerWheel({
|
|
|
10239
10315
|
},
|
|
10240
10316
|
[columnRefs, days.length, months.length, updateDraftDate, years.length]
|
|
10241
10317
|
);
|
|
10242
|
-
const scheduleScrollSettle =
|
|
10318
|
+
const scheduleScrollSettle = React32.useCallback(
|
|
10243
10319
|
(column) => {
|
|
10244
10320
|
clearSettleTimeout(column);
|
|
10245
10321
|
settleTimeoutsRef.current[column] = window.setTimeout(() => {
|
|
@@ -10248,7 +10324,7 @@ function useDatePickerWheel({
|
|
|
10248
10324
|
},
|
|
10249
10325
|
[clearSettleTimeout, settleColumnScroll]
|
|
10250
10326
|
);
|
|
10251
|
-
const handleColumnScroll =
|
|
10327
|
+
const handleColumnScroll = React32.useCallback(
|
|
10252
10328
|
(column) => {
|
|
10253
10329
|
const list = columnRefs[column].current;
|
|
10254
10330
|
if (!list) return;
|
|
@@ -10262,13 +10338,13 @@ function useDatePickerWheel({
|
|
|
10262
10338
|
},
|
|
10263
10339
|
[clearAnimationFrame, columnRefs, scheduleScrollSettle, setColumnScrollTop]
|
|
10264
10340
|
);
|
|
10265
|
-
const handleOptionSelect =
|
|
10341
|
+
const handleOptionSelect = React32.useCallback(
|
|
10266
10342
|
(column, targetIndex) => {
|
|
10267
10343
|
updateDraftDate(column, targetIndex, "smooth");
|
|
10268
10344
|
},
|
|
10269
10345
|
[updateDraftDate]
|
|
10270
10346
|
);
|
|
10271
|
-
const focusAdjacentColumn =
|
|
10347
|
+
const focusAdjacentColumn = React32.useCallback(
|
|
10272
10348
|
(column, direction) => {
|
|
10273
10349
|
const order = ["month", "day", "year"];
|
|
10274
10350
|
const currentIndex = order.indexOf(column);
|
|
@@ -10278,7 +10354,7 @@ function useDatePickerWheel({
|
|
|
10278
10354
|
},
|
|
10279
10355
|
[columnRefs]
|
|
10280
10356
|
);
|
|
10281
|
-
const handleColumnKeyDown =
|
|
10357
|
+
const handleColumnKeyDown = React32.useCallback(
|
|
10282
10358
|
(column, event) => {
|
|
10283
10359
|
const currentIndex = column === "month" ? monthIndex : column === "day" ? dayIndex : yearIndex;
|
|
10284
10360
|
const maxIndex = column === "month" ? months.length - 1 : column === "day" ? days.length - 1 : years.length - 1;
|
|
@@ -10582,7 +10658,7 @@ var DEVICE = {
|
|
|
10582
10658
|
};
|
|
10583
10659
|
|
|
10584
10660
|
// src/field-trigger/FieldTrigger.tsx
|
|
10585
|
-
var
|
|
10661
|
+
var React33 = __toESM(require("react"), 1);
|
|
10586
10662
|
var import_lucide_react43 = require("lucide-react");
|
|
10587
10663
|
var import_react_i18next23 = require("react-i18next");
|
|
10588
10664
|
|
|
@@ -10626,7 +10702,7 @@ function FieldErrorMessage({
|
|
|
10626
10702
|
|
|
10627
10703
|
// src/field-trigger/FieldTrigger.tsx
|
|
10628
10704
|
var import_jsx_runtime129 = require("react/jsx-runtime");
|
|
10629
|
-
var FieldTrigger =
|
|
10705
|
+
var FieldTrigger = React33.forwardRef(
|
|
10630
10706
|
({
|
|
10631
10707
|
as = "button",
|
|
10632
10708
|
variant = "airbnb",
|
|
@@ -10799,7 +10875,7 @@ FieldTrigger.displayName = "FieldTrigger";
|
|
|
10799
10875
|
// src/datepicker/DatePicker.tsx
|
|
10800
10876
|
var import_jsx_runtime130 = require("react/jsx-runtime");
|
|
10801
10877
|
var DEFAULT_MIN_DATE = new Date(1920, 0, 1);
|
|
10802
|
-
var DatePicker =
|
|
10878
|
+
var DatePicker = React34.forwardRef(
|
|
10803
10879
|
({
|
|
10804
10880
|
variant = "default",
|
|
10805
10881
|
label,
|
|
@@ -10825,24 +10901,24 @@ var DatePicker = React33.forwardRef(
|
|
|
10825
10901
|
formatValue = formatDateValue
|
|
10826
10902
|
}, ref) => {
|
|
10827
10903
|
const { isMatch: isMobile } = useScreenResize(DEVICE.mobileXL);
|
|
10828
|
-
const [isOpen, setIsOpen] =
|
|
10829
|
-
const triggerId =
|
|
10830
|
-
const pickerId =
|
|
10831
|
-
const labelId =
|
|
10832
|
-
const valueId =
|
|
10833
|
-
const helperTextId =
|
|
10834
|
-
const errorId =
|
|
10835
|
-
const internalRef =
|
|
10904
|
+
const [isOpen, setIsOpen] = React34.useState(false);
|
|
10905
|
+
const triggerId = React34.useId();
|
|
10906
|
+
const pickerId = React34.useId();
|
|
10907
|
+
const labelId = React34.useId();
|
|
10908
|
+
const valueId = React34.useId();
|
|
10909
|
+
const helperTextId = React34.useId();
|
|
10910
|
+
const errorId = React34.useId();
|
|
10911
|
+
const internalRef = React34.useRef(null);
|
|
10836
10912
|
const combinedRef = useCombinedRef(ref, internalRef);
|
|
10837
|
-
const monthLabels =
|
|
10838
|
-
const resolvedMinDate =
|
|
10839
|
-
const resolvedMaxDate =
|
|
10840
|
-
const normalizedValue =
|
|
10841
|
-
const normalizedDefaultValue =
|
|
10913
|
+
const monthLabels = React34.useMemo(() => getMonthLabels(locale), [locale]);
|
|
10914
|
+
const resolvedMinDate = React34.useMemo(() => minDate ?? DEFAULT_MIN_DATE, [minDate]);
|
|
10915
|
+
const resolvedMaxDate = React34.useMemo(() => maxDate ?? /* @__PURE__ */ new Date(), [maxDate]);
|
|
10916
|
+
const normalizedValue = React34.useMemo(() => normalizeDateValue(value), [value]);
|
|
10917
|
+
const normalizedDefaultValue = React34.useMemo(
|
|
10842
10918
|
() => normalizeDateValue(defaultValue),
|
|
10843
10919
|
[defaultValue]
|
|
10844
10920
|
);
|
|
10845
|
-
const resolvedValue =
|
|
10921
|
+
const resolvedValue = React34.useMemo(
|
|
10846
10922
|
() => normalizedValue ? clampDate(normalizedValue, resolvedMinDate, resolvedMaxDate) : null,
|
|
10847
10923
|
[normalizedValue, resolvedMaxDate, resolvedMinDate]
|
|
10848
10924
|
);
|
|
@@ -10873,7 +10949,7 @@ var DatePicker = React33.forwardRef(
|
|
|
10873
10949
|
minDate: resolvedMinDate,
|
|
10874
10950
|
maxDate: resolvedMaxDate
|
|
10875
10951
|
});
|
|
10876
|
-
const handleOpenChange =
|
|
10952
|
+
const handleOpenChange = React34.useCallback(
|
|
10877
10953
|
(nextOpen) => {
|
|
10878
10954
|
if (isBlocked && nextOpen) return;
|
|
10879
10955
|
setIsOpen(nextOpen);
|
|
@@ -10883,7 +10959,7 @@ var DatePicker = React33.forwardRef(
|
|
|
10883
10959
|
},
|
|
10884
10960
|
[isBlocked]
|
|
10885
10961
|
);
|
|
10886
|
-
const handleDone =
|
|
10962
|
+
const handleDone = React34.useCallback(() => {
|
|
10887
10963
|
if (isBlocked) return;
|
|
10888
10964
|
onChange(clampDate(draftDate, resolvedMinDate, resolvedMaxDate));
|
|
10889
10965
|
handleOpenChange(false);
|
|
@@ -10895,11 +10971,11 @@ var DatePicker = React33.forwardRef(
|
|
|
10895
10971
|
resolvedMaxDate,
|
|
10896
10972
|
resolvedMinDate
|
|
10897
10973
|
]);
|
|
10898
|
-
const handleTriggerClick =
|
|
10974
|
+
const handleTriggerClick = React34.useCallback(() => {
|
|
10899
10975
|
if (isBlocked) return;
|
|
10900
10976
|
setIsOpen(true);
|
|
10901
10977
|
}, [isBlocked]);
|
|
10902
|
-
const handleTriggerKeyDown =
|
|
10978
|
+
const handleTriggerKeyDown = React34.useCallback(
|
|
10903
10979
|
(event) => {
|
|
10904
10980
|
if (isBlocked) return;
|
|
10905
10981
|
if (event.key === "ArrowDown" || event.key === "ArrowUp" || event.key === "Enter" || event.key === " ") {
|
|
@@ -10909,7 +10985,7 @@ var DatePicker = React33.forwardRef(
|
|
|
10909
10985
|
},
|
|
10910
10986
|
[isBlocked]
|
|
10911
10987
|
);
|
|
10912
|
-
|
|
10988
|
+
React34.useEffect(() => {
|
|
10913
10989
|
if (isBlocked) {
|
|
10914
10990
|
setIsOpen(false);
|
|
10915
10991
|
}
|
|
@@ -11091,10 +11167,10 @@ function ResponsiveSheet({
|
|
|
11091
11167
|
}
|
|
11092
11168
|
|
|
11093
11169
|
// src/airbnb/input/Input.tsx
|
|
11094
|
-
var
|
|
11170
|
+
var React35 = __toESM(require("react"), 1);
|
|
11095
11171
|
var import_jsx_runtime132 = require("react/jsx-runtime");
|
|
11096
11172
|
var getInputValue = (value) => value != null ? String(value) : "";
|
|
11097
|
-
var AirbnbInput =
|
|
11173
|
+
var AirbnbInput = React35.forwardRef(
|
|
11098
11174
|
({
|
|
11099
11175
|
variant = "default",
|
|
11100
11176
|
label,
|
|
@@ -11123,15 +11199,15 @@ var AirbnbInput = React34.forwardRef(
|
|
|
11123
11199
|
placeholder,
|
|
11124
11200
|
...props
|
|
11125
11201
|
}, ref) => {
|
|
11126
|
-
const generatedId =
|
|
11127
|
-
const inputRef =
|
|
11202
|
+
const generatedId = React35.useId();
|
|
11203
|
+
const inputRef = React35.useRef(null);
|
|
11128
11204
|
const inputId = id ?? generatedId;
|
|
11129
11205
|
const fieldId = `${inputId}-field`;
|
|
11130
11206
|
const labelId = `${inputId}-label`;
|
|
11131
11207
|
const errorId = `${inputId}-error`;
|
|
11132
11208
|
const accessibleLabel = placeholder ?? label;
|
|
11133
|
-
const [isFocused, setIsFocused] =
|
|
11134
|
-
const [currentValue, setCurrentValue] =
|
|
11209
|
+
const [isFocused, setIsFocused] = React35.useState(false);
|
|
11210
|
+
const [currentValue, setCurrentValue] = React35.useState(
|
|
11135
11211
|
() => value != null ? getInputValue(value) : getInputValue(defaultValue)
|
|
11136
11212
|
);
|
|
11137
11213
|
const resolvedValue = value != null ? getInputValue(value) : currentValue;
|
|
@@ -11141,11 +11217,11 @@ var AirbnbInput = React34.forwardRef(
|
|
|
11141
11217
|
const triggerError = error ?? invalid;
|
|
11142
11218
|
const hasLabelMeta = Boolean(optional) || Boolean(tooltip);
|
|
11143
11219
|
const isBlocked = Boolean(disabled) || Boolean(loading);
|
|
11144
|
-
|
|
11220
|
+
React35.useLayoutEffect(() => {
|
|
11145
11221
|
const nextValue = value != null ? getInputValue(value) : getInputValue(inputRef.current?.value);
|
|
11146
11222
|
setCurrentValue((prevValue) => prevValue === nextValue ? prevValue : nextValue);
|
|
11147
11223
|
}, [value]);
|
|
11148
|
-
const setRefs =
|
|
11224
|
+
const setRefs = React35.useCallback(
|
|
11149
11225
|
(node) => {
|
|
11150
11226
|
inputRef.current = node;
|
|
11151
11227
|
if (node && value == null) {
|
|
@@ -11243,11 +11319,11 @@ var AirbnbInput = React34.forwardRef(
|
|
|
11243
11319
|
AirbnbInput.displayName = "Input";
|
|
11244
11320
|
|
|
11245
11321
|
// src/airbnb/phone-field/PhoneField.tsx
|
|
11246
|
-
var
|
|
11322
|
+
var React41 = __toESM(require("react"), 1);
|
|
11247
11323
|
var import_lucide_react46 = require("lucide-react");
|
|
11248
11324
|
|
|
11249
11325
|
// src/airbnb/select/Select.tsx
|
|
11250
|
-
var
|
|
11326
|
+
var React40 = __toESM(require("react"), 1);
|
|
11251
11327
|
|
|
11252
11328
|
// src/airbnb/select/SelectDesktopMenu.tsx
|
|
11253
11329
|
var import_jsx_runtime133 = require("react/jsx-runtime");
|
|
@@ -11592,10 +11668,10 @@ function SelectMobileContent({
|
|
|
11592
11668
|
}
|
|
11593
11669
|
|
|
11594
11670
|
// src/airbnb/select/SelectTrigger.tsx
|
|
11595
|
-
var
|
|
11671
|
+
var React36 = __toESM(require("react"), 1);
|
|
11596
11672
|
var import_lucide_react45 = require("lucide-react");
|
|
11597
11673
|
var import_jsx_runtime137 = require("react/jsx-runtime");
|
|
11598
|
-
var SelectTrigger2 =
|
|
11674
|
+
var SelectTrigger2 = React36.forwardRef(
|
|
11599
11675
|
({
|
|
11600
11676
|
id,
|
|
11601
11677
|
open,
|
|
@@ -11662,7 +11738,7 @@ var SelectTrigger2 = React35.forwardRef(
|
|
|
11662
11738
|
SelectTrigger2.displayName = "SelectTrigger";
|
|
11663
11739
|
|
|
11664
11740
|
// src/airbnb/select/useDesktopSelect.ts
|
|
11665
|
-
var
|
|
11741
|
+
var React37 = __toESM(require("react"), 1);
|
|
11666
11742
|
function useDesktopSelect({
|
|
11667
11743
|
isMobile,
|
|
11668
11744
|
isOpen,
|
|
@@ -11671,12 +11747,12 @@ function useDesktopSelect({
|
|
|
11671
11747
|
disabled,
|
|
11672
11748
|
onChange
|
|
11673
11749
|
}) {
|
|
11674
|
-
const [highlightedIndex, setHighlightedIndex] =
|
|
11675
|
-
const triggerRef =
|
|
11676
|
-
const listRef =
|
|
11677
|
-
const optionRefs =
|
|
11750
|
+
const [highlightedIndex, setHighlightedIndex] = React37.useState(-1);
|
|
11751
|
+
const triggerRef = React37.useRef(null);
|
|
11752
|
+
const listRef = React37.useRef(null);
|
|
11753
|
+
const optionRefs = React37.useRef([]);
|
|
11678
11754
|
const selectedIndex = getOptionIndex(options, value);
|
|
11679
|
-
|
|
11755
|
+
React37.useEffect(() => {
|
|
11680
11756
|
if (!isOpen || isMobile) return;
|
|
11681
11757
|
setHighlightedIndex((currentIndex) => {
|
|
11682
11758
|
if (currentIndex >= 0) {
|
|
@@ -11691,34 +11767,34 @@ function useDesktopSelect({
|
|
|
11691
11767
|
window.cancelAnimationFrame(frameId);
|
|
11692
11768
|
};
|
|
11693
11769
|
}, [isMobile, isOpen, options, selectedIndex]);
|
|
11694
|
-
|
|
11770
|
+
React37.useEffect(() => {
|
|
11695
11771
|
if (!isOpen || isMobile || highlightedIndex < 0) return;
|
|
11696
11772
|
optionRefs.current[highlightedIndex]?.scrollIntoView({
|
|
11697
11773
|
block: "nearest"
|
|
11698
11774
|
});
|
|
11699
11775
|
}, [highlightedIndex, isMobile, isOpen]);
|
|
11700
|
-
|
|
11776
|
+
React37.useEffect(() => {
|
|
11701
11777
|
if (isOpen) return;
|
|
11702
11778
|
setHighlightedIndex(-1);
|
|
11703
11779
|
}, [isOpen]);
|
|
11704
|
-
const focusTrigger =
|
|
11780
|
+
const focusTrigger = React37.useCallback(() => {
|
|
11705
11781
|
triggerRef.current?.focus();
|
|
11706
11782
|
}, []);
|
|
11707
|
-
const handleSelect =
|
|
11783
|
+
const handleSelect = React37.useCallback(
|
|
11708
11784
|
(option) => {
|
|
11709
11785
|
if (option.isDisabled || disabled) return;
|
|
11710
11786
|
onChange(option);
|
|
11711
11787
|
},
|
|
11712
11788
|
[disabled, onChange]
|
|
11713
11789
|
);
|
|
11714
|
-
const openMenu =
|
|
11790
|
+
const openMenu = React37.useCallback(
|
|
11715
11791
|
(targetIndex) => {
|
|
11716
11792
|
const fallbackIndex = selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex(options);
|
|
11717
11793
|
setHighlightedIndex(targetIndex ?? fallbackIndex);
|
|
11718
11794
|
},
|
|
11719
11795
|
[options, selectedIndex]
|
|
11720
11796
|
);
|
|
11721
|
-
const handleTriggerKeyDown =
|
|
11797
|
+
const handleTriggerKeyDown = React37.useCallback(
|
|
11722
11798
|
(event, onOpen) => {
|
|
11723
11799
|
if (disabled) return;
|
|
11724
11800
|
if (event.key === "ArrowDown") {
|
|
@@ -11743,7 +11819,7 @@ function useDesktopSelect({
|
|
|
11743
11819
|
},
|
|
11744
11820
|
[disabled, openMenu, options, selectedIndex]
|
|
11745
11821
|
);
|
|
11746
|
-
const handleMenuKeyDown =
|
|
11822
|
+
const handleMenuKeyDown = React37.useCallback(
|
|
11747
11823
|
(event, onClose) => {
|
|
11748
11824
|
if (event.key === "Escape") {
|
|
11749
11825
|
event.preventDefault();
|
|
@@ -11793,7 +11869,7 @@ function useDesktopSelect({
|
|
|
11793
11869
|
},
|
|
11794
11870
|
[focusTrigger, highlightedIndex, onChange, options]
|
|
11795
11871
|
);
|
|
11796
|
-
const setOptionRef =
|
|
11872
|
+
const setOptionRef = React37.useCallback(
|
|
11797
11873
|
(index, node) => {
|
|
11798
11874
|
optionRefs.current[index] = node;
|
|
11799
11875
|
},
|
|
@@ -11813,23 +11889,23 @@ function useDesktopSelect({
|
|
|
11813
11889
|
}
|
|
11814
11890
|
|
|
11815
11891
|
// src/airbnb/select/useMobileSelectWheel.ts
|
|
11816
|
-
var
|
|
11892
|
+
var React38 = __toESM(require("react"), 1);
|
|
11817
11893
|
function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
11818
|
-
const [pendingValue, setPendingValue] =
|
|
11894
|
+
const [pendingValue, setPendingValue] = React38.useState(
|
|
11819
11895
|
value ?? null
|
|
11820
11896
|
);
|
|
11821
|
-
const [mobileScrollTop, setMobileScrollTop] =
|
|
11822
|
-
const mobileListRef =
|
|
11823
|
-
const scrollSettleTimeoutRef =
|
|
11824
|
-
const scrollAnimationFrameRef =
|
|
11825
|
-
const getTargetIndex =
|
|
11897
|
+
const [mobileScrollTop, setMobileScrollTop] = React38.useState(0);
|
|
11898
|
+
const mobileListRef = React38.useRef(null);
|
|
11899
|
+
const scrollSettleTimeoutRef = React38.useRef(null);
|
|
11900
|
+
const scrollAnimationFrameRef = React38.useRef(null);
|
|
11901
|
+
const getTargetIndex = React38.useCallback(
|
|
11826
11902
|
(targetValue) => {
|
|
11827
11903
|
const selectedIndex = getOptionIndex(options, targetValue);
|
|
11828
11904
|
return selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex(options);
|
|
11829
11905
|
},
|
|
11830
11906
|
[options]
|
|
11831
11907
|
);
|
|
11832
|
-
const syncScrollPosition =
|
|
11908
|
+
const syncScrollPosition = React38.useCallback(
|
|
11833
11909
|
(targetValue, behavior = "instant") => {
|
|
11834
11910
|
const targetIndex = getTargetIndex(targetValue);
|
|
11835
11911
|
if (targetIndex < 0) return;
|
|
@@ -11848,27 +11924,27 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11848
11924
|
},
|
|
11849
11925
|
[getTargetIndex, options]
|
|
11850
11926
|
);
|
|
11851
|
-
const clearScrollSettleTimeout =
|
|
11927
|
+
const clearScrollSettleTimeout = React38.useCallback(() => {
|
|
11852
11928
|
if (scrollSettleTimeoutRef.current === null) return;
|
|
11853
11929
|
window.clearTimeout(scrollSettleTimeoutRef.current);
|
|
11854
11930
|
scrollSettleTimeoutRef.current = null;
|
|
11855
11931
|
}, []);
|
|
11856
|
-
const clearScrollAnimationFrame =
|
|
11932
|
+
const clearScrollAnimationFrame = React38.useCallback(() => {
|
|
11857
11933
|
if (scrollAnimationFrameRef.current === null) return;
|
|
11858
11934
|
window.cancelAnimationFrame(scrollAnimationFrameRef.current);
|
|
11859
11935
|
scrollAnimationFrameRef.current = null;
|
|
11860
11936
|
}, []);
|
|
11861
|
-
|
|
11937
|
+
React38.useEffect(
|
|
11862
11938
|
() => () => {
|
|
11863
11939
|
clearScrollSettleTimeout();
|
|
11864
11940
|
clearScrollAnimationFrame();
|
|
11865
11941
|
},
|
|
11866
11942
|
[clearScrollAnimationFrame, clearScrollSettleTimeout]
|
|
11867
11943
|
);
|
|
11868
|
-
|
|
11944
|
+
React38.useEffect(() => {
|
|
11869
11945
|
setPendingValue(value ?? null);
|
|
11870
11946
|
}, [value]);
|
|
11871
|
-
|
|
11947
|
+
React38.useLayoutEffect(() => {
|
|
11872
11948
|
if (!isMobile || !isOpen) return;
|
|
11873
11949
|
const frameId = window.requestAnimationFrame(() => {
|
|
11874
11950
|
syncScrollPosition(value ?? null, "instant");
|
|
@@ -11877,7 +11953,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11877
11953
|
window.cancelAnimationFrame(frameId);
|
|
11878
11954
|
};
|
|
11879
11955
|
}, [isMobile, isOpen, syncScrollPosition, value]);
|
|
11880
|
-
const settleScroll =
|
|
11956
|
+
const settleScroll = React38.useCallback(() => {
|
|
11881
11957
|
if (!mobileListRef.current) return;
|
|
11882
11958
|
const nextIndex = Math.round(mobileListRef.current.scrollTop / MOBILE_OPTION_HEIGHT);
|
|
11883
11959
|
const nextOption = options[nextIndex];
|
|
@@ -11889,13 +11965,13 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11889
11965
|
}
|
|
11890
11966
|
setPendingValue(nextOption);
|
|
11891
11967
|
}, [options, pendingValue]);
|
|
11892
|
-
const scheduleScrollSettle =
|
|
11968
|
+
const scheduleScrollSettle = React38.useCallback(() => {
|
|
11893
11969
|
clearScrollSettleTimeout();
|
|
11894
11970
|
scrollSettleTimeoutRef.current = window.setTimeout(() => {
|
|
11895
11971
|
settleScroll();
|
|
11896
11972
|
}, MOBILE_SCROLL_SETTLE_DELAY);
|
|
11897
11973
|
}, [clearScrollSettleTimeout, settleScroll]);
|
|
11898
|
-
const handleScroll =
|
|
11974
|
+
const handleScroll = React38.useCallback(() => {
|
|
11899
11975
|
if (!mobileListRef.current) return;
|
|
11900
11976
|
const nextScrollTop = mobileListRef.current.scrollTop;
|
|
11901
11977
|
clearScrollAnimationFrame();
|
|
@@ -11905,7 +11981,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11905
11981
|
});
|
|
11906
11982
|
scheduleScrollSettle();
|
|
11907
11983
|
}, [clearScrollAnimationFrame, scheduleScrollSettle]);
|
|
11908
|
-
const focusOptionByIndex =
|
|
11984
|
+
const focusOptionByIndex = React38.useCallback(
|
|
11909
11985
|
(index, behavior = "instant", updatePendingImmediately = behavior === "instant") => {
|
|
11910
11986
|
if (!mobileListRef.current || index < 0 || index >= options.length) return;
|
|
11911
11987
|
const option = options[index];
|
|
@@ -11923,7 +11999,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11923
11999
|
},
|
|
11924
12000
|
[options, scheduleScrollSettle]
|
|
11925
12001
|
);
|
|
11926
|
-
const handleOptionClick =
|
|
12002
|
+
const handleOptionClick = React38.useCallback(
|
|
11927
12003
|
(option) => {
|
|
11928
12004
|
if (!mobileListRef.current || disabled || option.isDisabled) return;
|
|
11929
12005
|
const optionIndex = getOptionIndex(options, option);
|
|
@@ -11932,7 +12008,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11932
12008
|
},
|
|
11933
12009
|
[disabled, focusOptionByIndex, options]
|
|
11934
12010
|
);
|
|
11935
|
-
const moveByStep =
|
|
12011
|
+
const moveByStep = React38.useCallback(
|
|
11936
12012
|
(step) => {
|
|
11937
12013
|
const currentIndex = getOptionIndex(options, pendingValue);
|
|
11938
12014
|
const fallbackIndex = step === 1 ? getFirstEnabledOptionIndex(options) : getLastEnabledOptionIndex(options);
|
|
@@ -11944,7 +12020,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11944
12020
|
},
|
|
11945
12021
|
[focusOptionByIndex, options, pendingValue]
|
|
11946
12022
|
);
|
|
11947
|
-
const moveToBoundary =
|
|
12023
|
+
const moveToBoundary = React38.useCallback(
|
|
11948
12024
|
(boundary) => {
|
|
11949
12025
|
const targetIndex = boundary === "start" ? getFirstEnabledOptionIndex(options) : getLastEnabledOptionIndex(options);
|
|
11950
12026
|
if (targetIndex >= 0) {
|
|
@@ -11953,7 +12029,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11953
12029
|
},
|
|
11954
12030
|
[focusOptionByIndex, options]
|
|
11955
12031
|
);
|
|
11956
|
-
const syncPendingValue =
|
|
12032
|
+
const syncPendingValue = React38.useCallback(
|
|
11957
12033
|
(nextValue) => {
|
|
11958
12034
|
const normalizedValue = nextValue ?? null;
|
|
11959
12035
|
const matchedIndex = getOptionIndex(options, normalizedValue);
|
|
@@ -11981,9 +12057,9 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11981
12057
|
}
|
|
11982
12058
|
|
|
11983
12059
|
// src/airbnb/select/useSelectIds.ts
|
|
11984
|
-
var
|
|
12060
|
+
var React39 = __toESM(require("react"), 1);
|
|
11985
12061
|
function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
|
|
11986
|
-
const reactId =
|
|
12062
|
+
const reactId = React39.useId().replace(/:/g, "");
|
|
11987
12063
|
const baseId = name ? `select-${name}` : `select-${reactId}`;
|
|
11988
12064
|
const triggerId = `${baseId}-trigger`;
|
|
11989
12065
|
const labelId = `${baseId}-label`;
|
|
@@ -11993,7 +12069,7 @@ function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
|
|
|
11993
12069
|
const listboxId = `${baseId}-listbox`;
|
|
11994
12070
|
const describedErrorId = error && !hideErrorMessage ? errorId : void 0;
|
|
11995
12071
|
const describedBy = [!hasValue ? helperTextId : null, describedErrorId].filter(Boolean).join(" ") || void 0;
|
|
11996
|
-
const getOptionId2 =
|
|
12072
|
+
const getOptionId2 = React39.useCallback(
|
|
11997
12073
|
(index) => `${baseId}-option-${index}`,
|
|
11998
12074
|
[baseId]
|
|
11999
12075
|
);
|
|
@@ -12012,7 +12088,7 @@ function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
|
|
|
12012
12088
|
|
|
12013
12089
|
// src/airbnb/select/Select.tsx
|
|
12014
12090
|
var import_jsx_runtime138 = require("react/jsx-runtime");
|
|
12015
|
-
var AirbnbSelect =
|
|
12091
|
+
var AirbnbSelect = React40.forwardRef(function AirbnbSelect2({
|
|
12016
12092
|
options = [],
|
|
12017
12093
|
value,
|
|
12018
12094
|
onChange,
|
|
@@ -12039,8 +12115,8 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
|
12039
12115
|
noOptionsMessage
|
|
12040
12116
|
}, ref) {
|
|
12041
12117
|
const { isMatch: isMobile } = useScreenResize(DEVICE.mobileXL);
|
|
12042
|
-
const [isOpen, setIsOpen] =
|
|
12043
|
-
const containerRef =
|
|
12118
|
+
const [isOpen, setIsOpen] = React40.useState(false);
|
|
12119
|
+
const containerRef = React40.useRef(null);
|
|
12044
12120
|
const hasValue = Boolean(value);
|
|
12045
12121
|
const helperText = placeholder ?? label;
|
|
12046
12122
|
const isBlocked = Boolean(disabled) || Boolean(loading);
|
|
@@ -12098,12 +12174,12 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
|
12098
12174
|
onOutsideClick: () => setIsOpen(false),
|
|
12099
12175
|
isDisabled: !isOpen || isMobile
|
|
12100
12176
|
});
|
|
12101
|
-
|
|
12177
|
+
React40.useEffect(() => {
|
|
12102
12178
|
if (isBlocked) {
|
|
12103
12179
|
setIsOpen(false);
|
|
12104
12180
|
}
|
|
12105
12181
|
}, [isBlocked]);
|
|
12106
|
-
|
|
12182
|
+
React40.useEffect(
|
|
12107
12183
|
function setCorrectOptionIfThereIsOnlyValue() {
|
|
12108
12184
|
if (value?.value === void 0 || value.value === null || value.label !== "") {
|
|
12109
12185
|
return;
|
|
@@ -12115,7 +12191,7 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
|
12115
12191
|
},
|
|
12116
12192
|
[onChange, options, value]
|
|
12117
12193
|
);
|
|
12118
|
-
const handleMobileOpenChange =
|
|
12194
|
+
const handleMobileOpenChange = React40.useCallback(
|
|
12119
12195
|
(nextOpen) => {
|
|
12120
12196
|
if (isBlocked && nextOpen) return;
|
|
12121
12197
|
setIsOpen(nextOpen);
|
|
@@ -12126,7 +12202,7 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
|
12126
12202
|
},
|
|
12127
12203
|
[focusTrigger, isBlocked, syncPendingValue, value]
|
|
12128
12204
|
);
|
|
12129
|
-
const handleMobileDone =
|
|
12205
|
+
const handleMobileDone = React40.useCallback(() => {
|
|
12130
12206
|
if (isBlocked) return;
|
|
12131
12207
|
const finalOption = pendingValue;
|
|
12132
12208
|
if (finalOption && finalOption.value !== value?.value) {
|
|
@@ -12135,7 +12211,7 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
|
12135
12211
|
setIsOpen(false);
|
|
12136
12212
|
focusTrigger();
|
|
12137
12213
|
}, [focusTrigger, isBlocked, onChange, pendingValue, value]);
|
|
12138
|
-
const handleTriggerClick =
|
|
12214
|
+
const handleTriggerClick = React40.useCallback(() => {
|
|
12139
12215
|
if (isBlocked) return;
|
|
12140
12216
|
setIsOpen((prev) => {
|
|
12141
12217
|
const nextOpen = !prev;
|
|
@@ -12309,7 +12385,7 @@ function formatPhoneCodeOptionLabel(option) {
|
|
|
12309
12385
|
const value = String(option.value);
|
|
12310
12386
|
return label.includes(value) ? label : `${label} (${value})`;
|
|
12311
12387
|
}
|
|
12312
|
-
var PhoneField =
|
|
12388
|
+
var PhoneField = React41.forwardRef(
|
|
12313
12389
|
({
|
|
12314
12390
|
variant = "default",
|
|
12315
12391
|
label,
|
|
@@ -12333,8 +12409,8 @@ var PhoneField = React40.forwardRef(
|
|
|
12333
12409
|
mobileTitle,
|
|
12334
12410
|
codePlaceholder = "+00"
|
|
12335
12411
|
}, ref) => {
|
|
12336
|
-
const inputId =
|
|
12337
|
-
const codeOptions =
|
|
12412
|
+
const inputId = React41.useId();
|
|
12413
|
+
const codeOptions = React41.useMemo(
|
|
12338
12414
|
() => options.map((option) => ({
|
|
12339
12415
|
value: option.value,
|
|
12340
12416
|
label: formatPhoneCodeOptionLabel(option),
|
|
@@ -12342,7 +12418,7 @@ var PhoneField = React40.forwardRef(
|
|
|
12342
12418
|
})),
|
|
12343
12419
|
[options]
|
|
12344
12420
|
);
|
|
12345
|
-
const selectedCodeOption =
|
|
12421
|
+
const selectedCodeOption = React41.useMemo(
|
|
12346
12422
|
() => codeOptions.find((option) => option.value === value?.code) ?? null,
|
|
12347
12423
|
[codeOptions, value?.code]
|
|
12348
12424
|
);
|
|
@@ -12484,11 +12560,11 @@ var PhoneField = React40.forwardRef(
|
|
|
12484
12560
|
PhoneField.displayName = "PhoneField";
|
|
12485
12561
|
|
|
12486
12562
|
// src/airbnb/search-input/SearchInput.tsx
|
|
12487
|
-
var
|
|
12563
|
+
var React42 = __toESM(require("react"), 1);
|
|
12488
12564
|
var import_react_i18next24 = require("react-i18next");
|
|
12489
12565
|
var import_lucide_react47 = require("lucide-react");
|
|
12490
12566
|
var import_jsx_runtime140 = require("react/jsx-runtime");
|
|
12491
|
-
var AirbnbSearchInput =
|
|
12567
|
+
var AirbnbSearchInput = React42.forwardRef(({ onReset, placeholder, wrapperClassName, ...props }, ref) => {
|
|
12492
12568
|
const { t } = (0, import_react_i18next24.useTranslation)();
|
|
12493
12569
|
const placeholderText = placeholder || t("search_property") + "...";
|
|
12494
12570
|
return /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)("div", { className: cn("input-wrapper relative", wrapperClassName), children: [
|
|
@@ -12526,7 +12602,7 @@ var AirbnbSearchInput = React41.forwardRef(({ onReset, placeholder, wrapperClass
|
|
|
12526
12602
|
AirbnbSearchInput.displayName = "SearchInput";
|
|
12527
12603
|
|
|
12528
12604
|
// src/searchable-select/SearchableSelect.tsx
|
|
12529
|
-
var
|
|
12605
|
+
var React43 = __toESM(require("react"), 1);
|
|
12530
12606
|
var import_lucide_react48 = require("lucide-react");
|
|
12531
12607
|
var import_react_virtual2 = require("@tanstack/react-virtual");
|
|
12532
12608
|
var import_react68 = require("react");
|
|
@@ -12571,13 +12647,13 @@ var SearchableSelectInternal = ({
|
|
|
12571
12647
|
loadingMessage
|
|
12572
12648
|
}, ref) => {
|
|
12573
12649
|
const { isMatch: isMobile } = useScreenResize(DEVICE.mobileXL);
|
|
12574
|
-
const reactId =
|
|
12575
|
-
const [open, setOpen] =
|
|
12576
|
-
const [internalSearchValue, setInternalSearchValue] =
|
|
12577
|
-
const [highlightedIndex, setHighlightedIndex] =
|
|
12578
|
-
const containerRef =
|
|
12579
|
-
const triggerRef =
|
|
12580
|
-
const inputRef =
|
|
12650
|
+
const reactId = React43.useId();
|
|
12651
|
+
const [open, setOpen] = React43.useState(false);
|
|
12652
|
+
const [internalSearchValue, setInternalSearchValue] = React43.useState("");
|
|
12653
|
+
const [highlightedIndex, setHighlightedIndex] = React43.useState(-1);
|
|
12654
|
+
const containerRef = React43.useRef(null);
|
|
12655
|
+
const triggerRef = React43.useRef(null);
|
|
12656
|
+
const inputRef = React43.useRef(null);
|
|
12581
12657
|
const listboxId = `${reactId}-listbox`;
|
|
12582
12658
|
const labelId = `${reactId}-label`;
|
|
12583
12659
|
const valueId = `${reactId}-value`;
|
|
@@ -12586,13 +12662,13 @@ var SearchableSelectInternal = ({
|
|
|
12586
12662
|
const searchInputId = `${reactId}-search`;
|
|
12587
12663
|
const effectiveSearchValue = searchValue ?? internalSearchValue;
|
|
12588
12664
|
const shouldFilterLocally = !onSearchChange && filterOption !== null;
|
|
12589
|
-
const visibleOptions =
|
|
12665
|
+
const visibleOptions = React43.useMemo(() => {
|
|
12590
12666
|
if (!shouldFilterLocally || !effectiveSearchValue) {
|
|
12591
12667
|
return options;
|
|
12592
12668
|
}
|
|
12593
12669
|
return options.filter((option) => filterOption(option, effectiveSearchValue));
|
|
12594
12670
|
}, [effectiveSearchValue, filterOption, options, shouldFilterLocally]);
|
|
12595
|
-
const selectedIndex =
|
|
12671
|
+
const selectedIndex = React43.useMemo(
|
|
12596
12672
|
() => visibleOptions.findIndex((option) => option.value === value?.value),
|
|
12597
12673
|
[value?.value, visibleOptions]
|
|
12598
12674
|
);
|
|
@@ -12618,7 +12694,7 @@ var SearchableSelectInternal = ({
|
|
|
12618
12694
|
},
|
|
12619
12695
|
[handleOnOpenChange]
|
|
12620
12696
|
);
|
|
12621
|
-
|
|
12697
|
+
React43.useEffect(() => {
|
|
12622
12698
|
if (isBlocked) {
|
|
12623
12699
|
setSelectOpen(false);
|
|
12624
12700
|
return;
|
|
@@ -12631,7 +12707,7 @@ var SearchableSelectInternal = ({
|
|
|
12631
12707
|
window.cancelAnimationFrame(frameId);
|
|
12632
12708
|
};
|
|
12633
12709
|
}, [isBlocked, open, setSelectOpen]);
|
|
12634
|
-
|
|
12710
|
+
React43.useEffect(() => {
|
|
12635
12711
|
if (!open) {
|
|
12636
12712
|
setHighlightedIndex(-1);
|
|
12637
12713
|
return;
|
|
@@ -12726,7 +12802,7 @@ var SearchableSelectInternal = ({
|
|
|
12726
12802
|
onOptionHover: setHighlightedIndex
|
|
12727
12803
|
}
|
|
12728
12804
|
);
|
|
12729
|
-
|
|
12805
|
+
React43.useImperativeHandle(ref, () => triggerRef.current, []);
|
|
12730
12806
|
return /* @__PURE__ */ (0, import_jsx_runtime141.jsxs)("div", { ref: containerRef, className: cn("relative w-full max-w-[425px]", className), children: [
|
|
12731
12807
|
name && /* @__PURE__ */ (0, import_jsx_runtime141.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
|
|
12732
12808
|
/* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
|
|
@@ -12805,7 +12881,7 @@ var SearchableSelectInternal = ({
|
|
|
12805
12881
|
) : null
|
|
12806
12882
|
] });
|
|
12807
12883
|
};
|
|
12808
|
-
var SearchableSelect =
|
|
12884
|
+
var SearchableSelect = React43.forwardRef(
|
|
12809
12885
|
SearchableSelectInternal
|
|
12810
12886
|
);
|
|
12811
12887
|
function SearchableSelectContent({
|
|
@@ -12832,9 +12908,9 @@ function SearchableSelectContent({
|
|
|
12832
12908
|
onOptionClick,
|
|
12833
12909
|
onOptionHover
|
|
12834
12910
|
}) {
|
|
12835
|
-
const listRef =
|
|
12836
|
-
const lastLoadMoreOptionsLengthRef =
|
|
12837
|
-
const previousHighlightedIndexRef =
|
|
12911
|
+
const listRef = React43.useRef(null);
|
|
12912
|
+
const lastLoadMoreOptionsLengthRef = React43.useRef(null);
|
|
12913
|
+
const previousHighlightedIndexRef = React43.useRef(highlightedIndex);
|
|
12838
12914
|
const rowCount = options.length + (loading && options.length > 0 ? 1 : 0);
|
|
12839
12915
|
const virtualizer = (0, import_react_virtual2.useVirtualizer)({
|
|
12840
12916
|
count: rowCount,
|
|
@@ -12845,7 +12921,7 @@ function SearchableSelectContent({
|
|
|
12845
12921
|
const virtualItems = virtualizer.getVirtualItems();
|
|
12846
12922
|
const emptyMessage = noOptionsMessage?.() ?? "No matches found";
|
|
12847
12923
|
const loadingText = loadingMessage?.() ?? "Loading...";
|
|
12848
|
-
|
|
12924
|
+
React43.useEffect(() => {
|
|
12849
12925
|
const lastItem = virtualItems[virtualItems.length - 1];
|
|
12850
12926
|
const shouldLoadMore = !!lastItem && hasNextPage && !loading && lastItem.index >= options.length - LOAD_MORE_THRESHOLD;
|
|
12851
12927
|
if (shouldLoadMore && lastLoadMoreOptionsLengthRef.current !== options.length) {
|
|
@@ -12853,7 +12929,7 @@ function SearchableSelectContent({
|
|
|
12853
12929
|
onLoadMore?.();
|
|
12854
12930
|
}
|
|
12855
12931
|
}, [hasNextPage, loading, onLoadMore, options.length, virtualItems]);
|
|
12856
|
-
|
|
12932
|
+
React43.useEffect(() => {
|
|
12857
12933
|
const hasHighlightedIndexChanged = previousHighlightedIndexRef.current !== highlightedIndex;
|
|
12858
12934
|
previousHighlightedIndexRef.current = highlightedIndex;
|
|
12859
12935
|
if (highlightedIndex >= 0 && hasHighlightedIndexChanged) {
|
|
@@ -13259,6 +13335,7 @@ function getNextEnabledIndex(options, startIndex, step) {
|
|
|
13259
13335
|
useDebouncedFunction,
|
|
13260
13336
|
useEvent,
|
|
13261
13337
|
useHover,
|
|
13338
|
+
useIframeFocusTrapFallback,
|
|
13262
13339
|
useIsFormTouched,
|
|
13263
13340
|
useIsMobile,
|
|
13264
13341
|
useIsMounted,
|