@chekinapp/ui 0.0.32 → 0.0.34
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 +259 -248
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +3 -2
- package/dist/index.d.ts +3 -2
- package/dist/index.js +330 -320
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.cjs
CHANGED
|
@@ -286,6 +286,7 @@ __export(index_exports, {
|
|
|
286
286
|
inputVariants: () => inputVariants,
|
|
287
287
|
isNumeric: () => isNumeric,
|
|
288
288
|
labelVariants: () => labelVariants,
|
|
289
|
+
scrollToTop: () => scrollToTop,
|
|
289
290
|
sectionTagVariants: () => sectionTagVariants,
|
|
290
291
|
switchThumbVariants: () => switchThumbVariants,
|
|
291
292
|
switchVariants: () => switchVariants,
|
|
@@ -1640,20 +1641,19 @@ function ChannelSelector({
|
|
|
1640
1641
|
const newValues = selectedValues.includes(value) ? selectedValues.filter((selectedValue) => selectedValue !== value) : [...selectedValues, value];
|
|
1641
1642
|
onChange(newValues);
|
|
1642
1643
|
};
|
|
1643
|
-
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex gap-
|
|
1644
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex gap-3", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(TooltipProvider, { children: options.map((option) => {
|
|
1644
1645
|
const isSelected = selectedValues.includes(option.value);
|
|
1645
1646
|
const isReadOnly = readOnlyValues.includes(option.value);
|
|
1646
1647
|
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(Tooltip, { children: [
|
|
1647
1648
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
1648
1649
|
Button,
|
|
1649
1650
|
{
|
|
1650
|
-
variant: "
|
|
1651
|
-
size: "icon",
|
|
1651
|
+
variant: "outline",
|
|
1652
1652
|
type: "button",
|
|
1653
1653
|
onClick: () => handleToggle(option.value),
|
|
1654
1654
|
disabled: isReadOnly,
|
|
1655
1655
|
className: cn(
|
|
1656
|
-
"relative h-10 w-10 rounded-lg border-2 bg-white p-0 transition-all",
|
|
1656
|
+
"relative flex h-10 w-10 items-center justify-center rounded-lg border-2 bg-white p-0 transition-all",
|
|
1657
1657
|
isSelected ? "border-chekin-blue bg-chekin-blue/10" : "border-chekin-gray-3 hover:border-chekin-blue/30",
|
|
1658
1658
|
isReadOnly ? "cursor-default opacity-100" : "cursor-pointer"
|
|
1659
1659
|
),
|
|
@@ -1678,11 +1678,11 @@ var BaseCheckbox = React6.forwardRef(({ className, loading, onCheckedChange, dis
|
|
|
1678
1678
|
{
|
|
1679
1679
|
ref,
|
|
1680
1680
|
className: cn(
|
|
1681
|
-
"peer h-5 w-5 shrink-0 rounded-sm border border-solid border-
|
|
1681
|
+
"checkbox__control peer h-5 w-5 shrink-0 rounded-sm border border-solid border-[var(--checkbox-border)] bg-[var(--checkbox-bg)]",
|
|
1682
1682
|
"focus-visible:outline-none focus-visible:shadow-chekin-focus",
|
|
1683
1683
|
"disabled:cursor-not-allowed disabled:opacity-50",
|
|
1684
1684
|
"aria-busy:cursor-wait aria-busy:opacity-50 aria-readonly:cursor-default aria-readonly:opacity-100",
|
|
1685
|
-
"data-[state=checked]:bg-
|
|
1685
|
+
"data-[state=checked]:border-[var(--checkbox-checked-border)] data-[state=checked]:bg-[var(--checkbox-checked-bg)] data-[state=checked]:text-[var(--checkbox-check-color)]",
|
|
1686
1686
|
className
|
|
1687
1687
|
),
|
|
1688
1688
|
...props,
|
|
@@ -1694,7 +1694,7 @@ var BaseCheckbox = React6.forwardRef(({ className, loading, onCheckedChange, dis
|
|
|
1694
1694
|
CheckboxPrimitive.Indicator,
|
|
1695
1695
|
{
|
|
1696
1696
|
className: cn("flex items-center justify-center text-current"),
|
|
1697
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react7.Check, { className: "h-5 w-5" })
|
|
1697
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react7.Check, { className: "checkbox__icon h-5 w-5" })
|
|
1698
1698
|
}
|
|
1699
1699
|
)
|
|
1700
1700
|
}
|
|
@@ -1754,7 +1754,7 @@ var Checkbox = React8.forwardRef(
|
|
|
1754
1754
|
{
|
|
1755
1755
|
htmlFor: checkboxId,
|
|
1756
1756
|
className: cn(
|
|
1757
|
-
"cursor-pointer text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
|
|
1757
|
+
"cursor-pointer text-sm font-medium leading-none text-chekin-navy peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
|
|
1758
1758
|
labelClassName
|
|
1759
1759
|
),
|
|
1760
1760
|
children: label
|
|
@@ -1913,7 +1913,7 @@ var CheckboxGroup = React9.forwardRef(
|
|
|
1913
1913
|
Label,
|
|
1914
1914
|
{
|
|
1915
1915
|
htmlFor: selectAllId,
|
|
1916
|
-
className: "cursor-pointer text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
|
|
1916
|
+
className: "cursor-pointer text-sm font-medium leading-none text-chekin-navy peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
|
|
1917
1917
|
children: selectAllLabel
|
|
1918
1918
|
}
|
|
1919
1919
|
)
|
|
@@ -2346,7 +2346,7 @@ function DataTable({ columns, data }) {
|
|
|
2346
2346
|
}
|
|
2347
2347
|
|
|
2348
2348
|
// src/dialog/Dialog.tsx
|
|
2349
|
-
var
|
|
2349
|
+
var React12 = __toESM(require("react"), 1);
|
|
2350
2350
|
var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
|
|
2351
2351
|
var import_react_visually_hidden = require("@radix-ui/react-visually-hidden");
|
|
2352
2352
|
var import_lucide_react10 = require("lucide-react");
|
|
@@ -2555,18 +2555,28 @@ function useOutsideClick({
|
|
|
2555
2555
|
}
|
|
2556
2556
|
|
|
2557
2557
|
// src/hooks/use-screen-resize.ts
|
|
2558
|
-
var import_react17 = require("react");
|
|
2558
|
+
var import_react17 = __toESM(require("react"), 1);
|
|
2559
2559
|
var eventName = "resize";
|
|
2560
|
-
function
|
|
2561
|
-
|
|
2562
|
-
|
|
2563
|
-
|
|
2564
|
-
|
|
2565
|
-
|
|
2560
|
+
function getMediaQuery(maxWidth, matchString) {
|
|
2561
|
+
if (matchString) {
|
|
2562
|
+
return matchString;
|
|
2563
|
+
}
|
|
2564
|
+
return maxWidth ? `(max-width: ${maxWidth})` : null;
|
|
2565
|
+
}
|
|
2566
|
+
function useScreenResize(maxWidth, matchString) {
|
|
2567
|
+
const [isInitialized, setIsInitialized] = import_react17.default.useState(false);
|
|
2568
|
+
const [isMatch, setIsMatch] = import_react17.default.useState(false);
|
|
2569
|
+
const handleResizeEvent = import_react17.default.useCallback(() => {
|
|
2570
|
+
const mediaQuery = getMediaQuery(maxWidth, matchString);
|
|
2566
2571
|
setIsInitialized(true);
|
|
2567
|
-
|
|
2568
|
-
|
|
2569
|
-
|
|
2572
|
+
if (!mediaQuery) {
|
|
2573
|
+
setIsMatch(false);
|
|
2574
|
+
return;
|
|
2575
|
+
}
|
|
2576
|
+
const media = getWindow().matchMedia(mediaQuery);
|
|
2577
|
+
setIsMatch(media.matches);
|
|
2578
|
+
}, [maxWidth, matchString]);
|
|
2579
|
+
import_react17.default.useEffect(() => {
|
|
2570
2580
|
handleResizeEvent();
|
|
2571
2581
|
getWindow().addEventListener(eventName, handleResizeEvent);
|
|
2572
2582
|
return () => {
|
|
@@ -3118,7 +3128,7 @@ function useIsFormTouched({
|
|
|
3118
3128
|
// src/dialog/Dialog.tsx
|
|
3119
3129
|
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
3120
3130
|
function useIframeTitleFix(titleRef) {
|
|
3121
|
-
|
|
3131
|
+
React12.useEffect(() => {
|
|
3122
3132
|
if (!window.chekinCustomDocument) {
|
|
3123
3133
|
return;
|
|
3124
3134
|
}
|
|
@@ -3147,7 +3157,7 @@ function DialogClose({ ...props }) {
|
|
|
3147
3157
|
}
|
|
3148
3158
|
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";
|
|
3149
3159
|
var scrollableOverlayClasses = "fixed inset-0 z-50 flex flex-col items-center overflow-y-auto overscroll-none pb-[19px] pt-[20px]";
|
|
3150
|
-
var DialogOverlay =
|
|
3160
|
+
var DialogOverlay = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
3151
3161
|
DialogPrimitive.Overlay,
|
|
3152
3162
|
{
|
|
3153
3163
|
ref,
|
|
@@ -3159,7 +3169,7 @@ var DialogOverlay = React11.forwardRef(({ className, ...props }, ref) => /* @__P
|
|
|
3159
3169
|
DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
|
|
3160
3170
|
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";
|
|
3161
3171
|
var dialogCloseButtonClasses = "absolute right-4 top-4 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";
|
|
3162
|
-
var DialogContent =
|
|
3172
|
+
var DialogContent = React12.forwardRef(
|
|
3163
3173
|
({ className, showCloseButton = true, children, container, lockScroll = true, ...props }, ref) => {
|
|
3164
3174
|
const contentElement = /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
3165
3175
|
DialogPrimitive.Content,
|
|
@@ -3207,8 +3217,8 @@ var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_r
|
|
|
3207
3217
|
}
|
|
3208
3218
|
);
|
|
3209
3219
|
DialogFooter.displayName = "DialogFooter";
|
|
3210
|
-
var DialogTitle =
|
|
3211
|
-
const titleRef =
|
|
3220
|
+
var DialogTitle = React12.forwardRef(({ className, ...props }, ref) => {
|
|
3221
|
+
const titleRef = React12.useRef(null);
|
|
3212
3222
|
const combinedRef = useCombinedRef(titleRef, ref);
|
|
3213
3223
|
useIframeTitleFix(titleRef);
|
|
3214
3224
|
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
@@ -3222,7 +3232,7 @@ var DialogTitle = React11.forwardRef(({ className, ...props }, ref) => {
|
|
|
3222
3232
|
);
|
|
3223
3233
|
});
|
|
3224
3234
|
DialogTitle.displayName = DialogPrimitive.Title.displayName;
|
|
3225
|
-
var DialogDescription =
|
|
3235
|
+
var DialogDescription = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
3226
3236
|
DialogPrimitive.Description,
|
|
3227
3237
|
{
|
|
3228
3238
|
ref,
|
|
@@ -3284,9 +3294,9 @@ function ConfirmationDialog({
|
|
|
3284
3294
|
}
|
|
3285
3295
|
|
|
3286
3296
|
// src/default-select-trigger/DefaultSelectTrigger.tsx
|
|
3287
|
-
var
|
|
3297
|
+
var React13 = __toESM(require("react"), 1);
|
|
3288
3298
|
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
3289
|
-
var DefaultSelectTrigger =
|
|
3299
|
+
var DefaultSelectTrigger = React13.forwardRef(
|
|
3290
3300
|
({
|
|
3291
3301
|
className,
|
|
3292
3302
|
disabled,
|
|
@@ -3353,14 +3363,14 @@ function DownloadEntryFormsButton({
|
|
|
3353
3363
|
var import_react31 = require("react");
|
|
3354
3364
|
|
|
3355
3365
|
// src/dropdown-menu/DropdownMenu.tsx
|
|
3356
|
-
var
|
|
3366
|
+
var React14 = __toESM(require("react"), 1);
|
|
3357
3367
|
var RadixMenu = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
|
|
3358
3368
|
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
3359
3369
|
var DropdownMenu = RadixMenu.Root;
|
|
3360
3370
|
var DropdownMenuTrigger = RadixMenu.Trigger;
|
|
3361
3371
|
var DropdownMenuPortal = RadixMenu.Portal;
|
|
3362
3372
|
var DropdownMenuGroup = RadixMenu.Group;
|
|
3363
|
-
var DropdownMenuContent =
|
|
3373
|
+
var DropdownMenuContent = React14.forwardRef(({ className, sideOffset = 6, container, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RadixMenu.Portal, { container: container || getCustomContainer(), children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
3364
3374
|
RadixMenu.Content,
|
|
3365
3375
|
{
|
|
3366
3376
|
ref,
|
|
@@ -3381,9 +3391,9 @@ var itemClasses = [
|
|
|
3381
3391
|
"data-[highlighted]:bg-chekin-surface-pressed data-[highlighted]:text-chekin-blue",
|
|
3382
3392
|
"data-[disabled]:pointer-events-none data-[disabled]:opacity-30"
|
|
3383
3393
|
];
|
|
3384
|
-
var DropdownMenuItem =
|
|
3394
|
+
var DropdownMenuItem = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RadixMenu.Item, { ref, className: cn(itemClasses, className), ...props }));
|
|
3385
3395
|
DropdownMenuItem.displayName = "DropdownMenuItem";
|
|
3386
|
-
var DropdownMenuLabel =
|
|
3396
|
+
var DropdownMenuLabel = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
3387
3397
|
RadixMenu.Label,
|
|
3388
3398
|
{
|
|
3389
3399
|
ref,
|
|
@@ -3395,7 +3405,7 @@ var DropdownMenuLabel = React13.forwardRef(({ className, ...props }, ref) => /*
|
|
|
3395
3405
|
}
|
|
3396
3406
|
));
|
|
3397
3407
|
DropdownMenuLabel.displayName = "DropdownMenuLabel";
|
|
3398
|
-
var DropdownMenuSeparator =
|
|
3408
|
+
var DropdownMenuSeparator = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
3399
3409
|
RadixMenu.Separator,
|
|
3400
3410
|
{
|
|
3401
3411
|
ref,
|
|
@@ -3627,9 +3637,9 @@ function EmptySectionPlaceholder({
|
|
|
3627
3637
|
}
|
|
3628
3638
|
|
|
3629
3639
|
// src/external-link/ExternalLink.tsx
|
|
3630
|
-
var
|
|
3640
|
+
var React15 = __toESM(require("react"), 1);
|
|
3631
3641
|
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
3632
|
-
var ExternalLink =
|
|
3642
|
+
var ExternalLink = React15.forwardRef(
|
|
3633
3643
|
({ className, children, showIcon = true, target = "_blank", rel, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
|
|
3634
3644
|
"a",
|
|
3635
3645
|
{
|
|
@@ -3675,7 +3685,7 @@ var import_react_i18next9 = require("react-i18next");
|
|
|
3675
3685
|
var import_lucide_react14 = require("lucide-react");
|
|
3676
3686
|
|
|
3677
3687
|
// src/switch/Switch.tsx
|
|
3678
|
-
var
|
|
3688
|
+
var React16 = __toESM(require("react"), 1);
|
|
3679
3689
|
var SwitchPrimitives = __toESM(require("@radix-ui/react-switch"), 1);
|
|
3680
3690
|
var import_class_variance_authority7 = require("class-variance-authority");
|
|
3681
3691
|
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
@@ -3717,9 +3727,9 @@ var switchThumbVariants = (0, import_class_variance_authority7.cva)(
|
|
|
3717
3727
|
}
|
|
3718
3728
|
}
|
|
3719
3729
|
);
|
|
3720
|
-
var Switch =
|
|
3730
|
+
var Switch = React16.forwardRef(
|
|
3721
3731
|
({ className, size, readOnly, loading, onChange, value, id, label, error, ...props }, ref) => {
|
|
3722
|
-
const generatedId =
|
|
3732
|
+
const generatedId = React16.useId();
|
|
3723
3733
|
const fieldId = id || generatedId;
|
|
3724
3734
|
const switchElement = /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
3725
3735
|
SwitchPrimitives.Root,
|
|
@@ -4323,7 +4333,7 @@ var FreeTextField = (0, import_react35.forwardRef)(
|
|
|
4323
4333
|
FreeTextField.displayName = "FreeTextField";
|
|
4324
4334
|
|
|
4325
4335
|
// src/framed-icon/FramedIcon.tsx
|
|
4326
|
-
var
|
|
4336
|
+
var React17 = __toESM(require("react"), 1);
|
|
4327
4337
|
var import_class_variance_authority8 = require("class-variance-authority");
|
|
4328
4338
|
var import_jsx_runtime55 = require("react/jsx-runtime");
|
|
4329
4339
|
var framedIconVariants = (0, import_class_variance_authority8.cva)("inline-flex items-center justify-center shrink-0", {
|
|
@@ -4347,7 +4357,7 @@ var framedIconVariants = (0, import_class_variance_authority8.cva)("inline-flex
|
|
|
4347
4357
|
},
|
|
4348
4358
|
defaultVariants: { size: "m", shape: "rounded", tone: "info" }
|
|
4349
4359
|
});
|
|
4350
|
-
var FramedIcon =
|
|
4360
|
+
var FramedIcon = React17.forwardRef(
|
|
4351
4361
|
({ className, size, shape, tone, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
|
|
4352
4362
|
"span",
|
|
4353
4363
|
{
|
|
@@ -4509,7 +4519,7 @@ var IconRegistry = class {
|
|
|
4509
4519
|
var RegistryIcon = Icon;
|
|
4510
4520
|
|
|
4511
4521
|
// src/icon-button/IconButton.tsx
|
|
4512
|
-
var
|
|
4522
|
+
var React18 = __toESM(require("react"), 1);
|
|
4513
4523
|
var import_class_variance_authority9 = require("class-variance-authority");
|
|
4514
4524
|
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
4515
4525
|
var iconButtonVariants = (0, import_class_variance_authority9.cva)(
|
|
@@ -4540,7 +4550,7 @@ var iconButtonVariants = (0, import_class_variance_authority9.cva)(
|
|
|
4540
4550
|
defaultVariants: { size: "m", shape: "rounded", variant: "secondary" }
|
|
4541
4551
|
}
|
|
4542
4552
|
);
|
|
4543
|
-
var IconButton =
|
|
4553
|
+
var IconButton = React18.forwardRef(
|
|
4544
4554
|
({ className, size, shape, variant, label, children, type = "button", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
4545
4555
|
"button",
|
|
4546
4556
|
{
|
|
@@ -4595,9 +4605,9 @@ function Image2({
|
|
|
4595
4605
|
}
|
|
4596
4606
|
|
|
4597
4607
|
// src/input/Input.tsx
|
|
4598
|
-
var
|
|
4608
|
+
var React19 = __toESM(require("react"), 1);
|
|
4599
4609
|
var import_jsx_runtime62 = require("react/jsx-runtime");
|
|
4600
|
-
var Input =
|
|
4610
|
+
var Input = React19.forwardRef(
|
|
4601
4611
|
({ className, type, readOnly, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
4602
4612
|
"input",
|
|
4603
4613
|
{
|
|
@@ -4621,7 +4631,7 @@ var Input = React18.forwardRef(
|
|
|
4621
4631
|
Input.displayName = "Input";
|
|
4622
4632
|
|
|
4623
4633
|
// src/input-otp/InputOTP.tsx
|
|
4624
|
-
var
|
|
4634
|
+
var React20 = __toESM(require("react"), 1);
|
|
4625
4635
|
|
|
4626
4636
|
// src/input-otp/InputOTPContext.ts
|
|
4627
4637
|
var import_react39 = require("react");
|
|
@@ -4904,11 +4914,11 @@ function InputOTP({
|
|
|
4904
4914
|
}
|
|
4905
4915
|
) });
|
|
4906
4916
|
}
|
|
4907
|
-
var InputOTPGroup =
|
|
4917
|
+
var InputOTPGroup = React20.forwardRef(
|
|
4908
4918
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { ref, className: cn("flex items-center", className), ...props })
|
|
4909
4919
|
);
|
|
4910
4920
|
InputOTPGroup.displayName = "InputOTPGroup";
|
|
4911
|
-
var InputOTPSlot =
|
|
4921
|
+
var InputOTPSlot = React20.forwardRef(
|
|
4912
4922
|
({ index, className, ...props }, ref) => {
|
|
4913
4923
|
const {
|
|
4914
4924
|
char,
|
|
@@ -4957,7 +4967,7 @@ var InputOTPSlot = React19.forwardRef(
|
|
|
4957
4967
|
}
|
|
4958
4968
|
);
|
|
4959
4969
|
InputOTPSlot.displayName = "InputOTPSlot";
|
|
4960
|
-
var InputOTPSeparator =
|
|
4970
|
+
var InputOTPSeparator = React20.forwardRef(
|
|
4961
4971
|
(props, ref) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { ref, role: "separator", ...props })
|
|
4962
4972
|
);
|
|
4963
4973
|
InputOTPSeparator.displayName = "InputOTPSeparator";
|
|
@@ -5948,14 +5958,14 @@ var import_react_i18next16 = require("react-i18next");
|
|
|
5948
5958
|
var import_lucide_react24 = require("lucide-react");
|
|
5949
5959
|
|
|
5950
5960
|
// src/select/Select.tsx
|
|
5951
|
-
var
|
|
5961
|
+
var React21 = __toESM(require("react"), 1);
|
|
5952
5962
|
var RadixSelect = __toESM(require("@radix-ui/react-select"), 1);
|
|
5953
5963
|
var import_jsx_runtime76 = require("react/jsx-runtime");
|
|
5954
5964
|
var SelectRoot = RadixSelect.Root;
|
|
5955
5965
|
var SelectValue = RadixSelect.Value;
|
|
5956
5966
|
var SelectGroup = RadixSelect.Group;
|
|
5957
5967
|
var SelectPortal = RadixSelect.Portal;
|
|
5958
|
-
var SelectTrigger =
|
|
5968
|
+
var SelectTrigger = React21.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
|
|
5959
5969
|
RadixSelect.Trigger,
|
|
5960
5970
|
{
|
|
5961
5971
|
ref,
|
|
@@ -5996,7 +6006,7 @@ var SelectTrigger = React20.forwardRef(({ className, children, ...props }, ref)
|
|
|
5996
6006
|
}
|
|
5997
6007
|
));
|
|
5998
6008
|
SelectTrigger.displayName = "SelectTrigger";
|
|
5999
|
-
var SelectContent =
|
|
6009
|
+
var SelectContent = React21.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(RadixSelect.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6000
6010
|
RadixSelect.Content,
|
|
6001
6011
|
{
|
|
6002
6012
|
ref,
|
|
@@ -6015,7 +6025,7 @@ var SelectContent = React20.forwardRef(({ className, children, position = "poppe
|
|
|
6015
6025
|
}
|
|
6016
6026
|
) }));
|
|
6017
6027
|
SelectContent.displayName = "SelectContent";
|
|
6018
|
-
var SelectItem =
|
|
6028
|
+
var SelectItem = React21.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
|
|
6019
6029
|
RadixSelect.Item,
|
|
6020
6030
|
{
|
|
6021
6031
|
ref,
|
|
@@ -6050,7 +6060,7 @@ var SelectItem = React20.forwardRef(({ className, children, ...props }, ref) =>
|
|
|
6050
6060
|
}
|
|
6051
6061
|
));
|
|
6052
6062
|
SelectItem.displayName = "SelectItem";
|
|
6053
|
-
var SelectSeparator =
|
|
6063
|
+
var SelectSeparator = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6054
6064
|
RadixSelect.Separator,
|
|
6055
6065
|
{
|
|
6056
6066
|
ref,
|
|
@@ -6059,7 +6069,7 @@ var SelectSeparator = React20.forwardRef(({ className, ...props }, ref) => /* @_
|
|
|
6059
6069
|
}
|
|
6060
6070
|
));
|
|
6061
6071
|
SelectSeparator.displayName = "SelectSeparator";
|
|
6062
|
-
var SelectLabel =
|
|
6072
|
+
var SelectLabel = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6063
6073
|
RadixSelect.Label,
|
|
6064
6074
|
{
|
|
6065
6075
|
ref,
|
|
@@ -6071,7 +6081,7 @@ var SelectLabel = React20.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
6071
6081
|
}
|
|
6072
6082
|
));
|
|
6073
6083
|
SelectLabel.displayName = "SelectLabel";
|
|
6074
|
-
var Select =
|
|
6084
|
+
var Select = React21.forwardRef(
|
|
6075
6085
|
({
|
|
6076
6086
|
placeholder,
|
|
6077
6087
|
label,
|
|
@@ -6082,9 +6092,9 @@ var Select = React20.forwardRef(
|
|
|
6082
6092
|
children,
|
|
6083
6093
|
...props
|
|
6084
6094
|
}, ref) => {
|
|
6085
|
-
const reactId =
|
|
6095
|
+
const reactId = React21.useId();
|
|
6086
6096
|
const triggerId = props.name ?? reactId;
|
|
6087
|
-
const internalRef =
|
|
6097
|
+
const internalRef = React21.useRef(null);
|
|
6088
6098
|
const combinedRef = useCombinedRef(ref, internalRef);
|
|
6089
6099
|
return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: cn("flex flex-col gap-chekin-1 w-[300px]", containerClassName), children: [
|
|
6090
6100
|
label && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
@@ -6241,7 +6251,7 @@ function Pagination({
|
|
|
6241
6251
|
}
|
|
6242
6252
|
|
|
6243
6253
|
// src/popover/Popover.tsx
|
|
6244
|
-
var
|
|
6254
|
+
var React22 = __toESM(require("react"), 1);
|
|
6245
6255
|
var RadixPopover = __toESM(require("@radix-ui/react-popover"), 1);
|
|
6246
6256
|
var import_jsx_runtime78 = require("react/jsx-runtime");
|
|
6247
6257
|
var Popover = RadixPopover.Root;
|
|
@@ -6249,7 +6259,7 @@ var PopoverTrigger = RadixPopover.Trigger;
|
|
|
6249
6259
|
var PopoverAnchor = RadixPopover.Anchor;
|
|
6250
6260
|
var PopoverPortal = RadixPopover.Portal;
|
|
6251
6261
|
var PopoverClose = RadixPopover.Close;
|
|
6252
|
-
var PopoverContent =
|
|
6262
|
+
var PopoverContent = React22.forwardRef(({ className, sideOffset = 8, align = "start", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(RadixPopover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
|
|
6253
6263
|
RadixPopover.Content,
|
|
6254
6264
|
{
|
|
6255
6265
|
ref,
|
|
@@ -6269,11 +6279,11 @@ PopoverContent.displayName = "PopoverContent";
|
|
|
6269
6279
|
var import_react48 = require("react");
|
|
6270
6280
|
|
|
6271
6281
|
// src/radio-group/RadioGroup.tsx
|
|
6272
|
-
var
|
|
6282
|
+
var React23 = __toESM(require("react"), 1);
|
|
6273
6283
|
var RadioGroupPrimitive = __toESM(require("@radix-ui/react-radio-group"), 1);
|
|
6274
6284
|
var import_lucide_react25 = require("lucide-react");
|
|
6275
6285
|
var import_jsx_runtime79 = require("react/jsx-runtime");
|
|
6276
|
-
var RadioGroup =
|
|
6286
|
+
var RadioGroup = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
6277
6287
|
RadioGroupPrimitive.Root,
|
|
6278
6288
|
{
|
|
6279
6289
|
ref,
|
|
@@ -6282,7 +6292,7 @@ var RadioGroup = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
6282
6292
|
}
|
|
6283
6293
|
));
|
|
6284
6294
|
RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
|
|
6285
|
-
var RadioGroupItem =
|
|
6295
|
+
var RadioGroupItem = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
6286
6296
|
RadioGroupPrimitive.Item,
|
|
6287
6297
|
{
|
|
6288
6298
|
ref,
|
|
@@ -6511,7 +6521,7 @@ function RatingRadioGroup({
|
|
|
6511
6521
|
}
|
|
6512
6522
|
|
|
6513
6523
|
// src/rating-stars/RatingStars.tsx
|
|
6514
|
-
var
|
|
6524
|
+
var React24 = __toESM(require("react"), 1);
|
|
6515
6525
|
var import_lucide_react27 = require("lucide-react");
|
|
6516
6526
|
var import_react_i18next17 = require("react-i18next");
|
|
6517
6527
|
var import_jsx_runtime84 = require("react/jsx-runtime");
|
|
@@ -6531,7 +6541,7 @@ function RatingStars({
|
|
|
6531
6541
|
const { t } = (0, import_react_i18next17.useTranslation)();
|
|
6532
6542
|
const normalizedRating = Math.max(0, Math.min(maxRating, rating));
|
|
6533
6543
|
const stars = Array.from({ length: maxRating }, (_, index) => index + 1);
|
|
6534
|
-
const componentId =
|
|
6544
|
+
const componentId = React24.useId();
|
|
6535
6545
|
const decimal = normalizedRating - Math.floor(normalizedRating);
|
|
6536
6546
|
const partialStarIndex = decimal > 0 ? Math.ceil(normalizedRating) : -1;
|
|
6537
6547
|
const gradientId = `star-gradient-${componentId.replace(/:/g, "")}`;
|
|
@@ -7102,7 +7112,7 @@ function SheetDescription({
|
|
|
7102
7112
|
}
|
|
7103
7113
|
|
|
7104
7114
|
// src/sidebar/Sidebar.tsx
|
|
7105
|
-
var
|
|
7115
|
+
var React25 = __toESM(require("react"), 1);
|
|
7106
7116
|
var import_react_slot4 = require("@radix-ui/react-slot");
|
|
7107
7117
|
var import_class_variance_authority11 = require("class-variance-authority");
|
|
7108
7118
|
var import_lucide_react33 = require("lucide-react");
|
|
@@ -7195,7 +7205,7 @@ var SIDEBAR_COOKIE_NAME_DEFAULT = "sidebar_state";
|
|
|
7195
7205
|
var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
|
|
7196
7206
|
var SIDEBAR_WIDTH_MOBILE = "18rem";
|
|
7197
7207
|
var SIDEBAR_KEYBOARD_SHORTCUT = "b";
|
|
7198
|
-
var SidebarProvider =
|
|
7208
|
+
var SidebarProvider = React25.forwardRef(
|
|
7199
7209
|
({
|
|
7200
7210
|
defaultOpen = true,
|
|
7201
7211
|
open: openProp,
|
|
@@ -7207,10 +7217,10 @@ var SidebarProvider = React24.forwardRef(
|
|
|
7207
7217
|
...props
|
|
7208
7218
|
}, ref) => {
|
|
7209
7219
|
const isMobile = useIsMobile({ breakpoint: 641 });
|
|
7210
|
-
const [openMobile, setOpenMobile] =
|
|
7211
|
-
const [_open, _setOpen] =
|
|
7220
|
+
const [openMobile, setOpenMobile] = React25.useState(false);
|
|
7221
|
+
const [_open, _setOpen] = React25.useState(defaultOpen);
|
|
7212
7222
|
const open = openProp ?? _open;
|
|
7213
|
-
const setOpen =
|
|
7223
|
+
const setOpen = React25.useCallback(
|
|
7214
7224
|
(value) => {
|
|
7215
7225
|
const openState = typeof value === "function" ? value(open) : value;
|
|
7216
7226
|
if (setOpenProp) {
|
|
@@ -7222,10 +7232,10 @@ var SidebarProvider = React24.forwardRef(
|
|
|
7222
7232
|
},
|
|
7223
7233
|
[setOpenProp, open, stateName]
|
|
7224
7234
|
);
|
|
7225
|
-
const toggleSidebar =
|
|
7235
|
+
const toggleSidebar = React25.useCallback(() => {
|
|
7226
7236
|
return isMobile ? setOpenMobile((value) => !value) : setOpen((value) => !value);
|
|
7227
7237
|
}, [isMobile, setOpen]);
|
|
7228
|
-
|
|
7238
|
+
React25.useEffect(() => {
|
|
7229
7239
|
const handleKeyDown = (event) => {
|
|
7230
7240
|
if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
|
|
7231
7241
|
event.preventDefault();
|
|
@@ -7236,7 +7246,7 @@ var SidebarProvider = React24.forwardRef(
|
|
|
7236
7246
|
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
7237
7247
|
}, [toggleSidebar]);
|
|
7238
7248
|
const state = open ? "expanded" : "collapsed";
|
|
7239
|
-
const contextValue =
|
|
7249
|
+
const contextValue = React25.useMemo(
|
|
7240
7250
|
() => ({
|
|
7241
7251
|
state,
|
|
7242
7252
|
open,
|
|
@@ -7261,7 +7271,7 @@ var SidebarProvider = React24.forwardRef(
|
|
|
7261
7271
|
}
|
|
7262
7272
|
);
|
|
7263
7273
|
SidebarProvider.displayName = "SidebarProvider";
|
|
7264
|
-
var Sidebar =
|
|
7274
|
+
var Sidebar = React25.forwardRef(
|
|
7265
7275
|
({
|
|
7266
7276
|
side = "left",
|
|
7267
7277
|
variant = "sidebar",
|
|
@@ -7355,7 +7365,7 @@ var Sidebar = React24.forwardRef(
|
|
|
7355
7365
|
}
|
|
7356
7366
|
);
|
|
7357
7367
|
Sidebar.displayName = "Sidebar";
|
|
7358
|
-
var SidebarTrigger =
|
|
7368
|
+
var SidebarTrigger = React25.forwardRef(({ className, onClick, icon, ...props }, ref) => {
|
|
7359
7369
|
const { toggleSidebar, open, isMobile, openMobile } = useSidebar();
|
|
7360
7370
|
return /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(
|
|
7361
7371
|
Button,
|
|
@@ -7382,7 +7392,7 @@ var SidebarTrigger = React24.forwardRef(({ className, onClick, icon, ...props },
|
|
|
7382
7392
|
);
|
|
7383
7393
|
});
|
|
7384
7394
|
SidebarTrigger.displayName = "SidebarTrigger";
|
|
7385
|
-
var SidebarRail =
|
|
7395
|
+
var SidebarRail = React25.forwardRef(
|
|
7386
7396
|
({ className, ...props }, ref) => {
|
|
7387
7397
|
const { toggleSidebar } = useSidebar();
|
|
7388
7398
|
return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
@@ -7408,7 +7418,7 @@ var SidebarRail = React24.forwardRef(
|
|
|
7408
7418
|
}
|
|
7409
7419
|
);
|
|
7410
7420
|
SidebarRail.displayName = "SidebarRail";
|
|
7411
|
-
var SidebarInset =
|
|
7421
|
+
var SidebarInset = React25.forwardRef(
|
|
7412
7422
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7413
7423
|
"main",
|
|
7414
7424
|
{
|
|
@@ -7423,7 +7433,7 @@ var SidebarInset = React24.forwardRef(
|
|
|
7423
7433
|
)
|
|
7424
7434
|
);
|
|
7425
7435
|
SidebarInset.displayName = "SidebarInset";
|
|
7426
|
-
var SidebarInput =
|
|
7436
|
+
var SidebarInput = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7427
7437
|
Input,
|
|
7428
7438
|
{
|
|
7429
7439
|
ref,
|
|
@@ -7433,7 +7443,7 @@ var SidebarInput = React24.forwardRef(({ className, ...props }, ref) => /* @__PU
|
|
|
7433
7443
|
}
|
|
7434
7444
|
));
|
|
7435
7445
|
SidebarInput.displayName = "SidebarInput";
|
|
7436
|
-
var SidebarHeader =
|
|
7446
|
+
var SidebarHeader = React25.forwardRef(
|
|
7437
7447
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7438
7448
|
"div",
|
|
7439
7449
|
{
|
|
@@ -7445,7 +7455,7 @@ var SidebarHeader = React24.forwardRef(
|
|
|
7445
7455
|
)
|
|
7446
7456
|
);
|
|
7447
7457
|
SidebarHeader.displayName = "SidebarHeader";
|
|
7448
|
-
var SidebarFooter =
|
|
7458
|
+
var SidebarFooter = React25.forwardRef(
|
|
7449
7459
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7450
7460
|
"div",
|
|
7451
7461
|
{
|
|
@@ -7457,7 +7467,7 @@ var SidebarFooter = React24.forwardRef(
|
|
|
7457
7467
|
)
|
|
7458
7468
|
);
|
|
7459
7469
|
SidebarFooter.displayName = "SidebarFooter";
|
|
7460
|
-
var SidebarSeparator =
|
|
7470
|
+
var SidebarSeparator = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7461
7471
|
Separator3,
|
|
7462
7472
|
{
|
|
7463
7473
|
ref,
|
|
@@ -7467,7 +7477,7 @@ var SidebarSeparator = React24.forwardRef(({ className, ...props }, ref) => /* @
|
|
|
7467
7477
|
}
|
|
7468
7478
|
));
|
|
7469
7479
|
SidebarSeparator.displayName = "SidebarSeparator";
|
|
7470
|
-
var SidebarContent =
|
|
7480
|
+
var SidebarContent = React25.forwardRef(
|
|
7471
7481
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7472
7482
|
"div",
|
|
7473
7483
|
{
|
|
@@ -7482,7 +7492,7 @@ var SidebarContent = React24.forwardRef(
|
|
|
7482
7492
|
)
|
|
7483
7493
|
);
|
|
7484
7494
|
SidebarContent.displayName = "SidebarContent";
|
|
7485
|
-
var SidebarGroup =
|
|
7495
|
+
var SidebarGroup = React25.forwardRef(
|
|
7486
7496
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7487
7497
|
"div",
|
|
7488
7498
|
{
|
|
@@ -7494,7 +7504,7 @@ var SidebarGroup = React24.forwardRef(
|
|
|
7494
7504
|
)
|
|
7495
7505
|
);
|
|
7496
7506
|
SidebarGroup.displayName = "SidebarGroup";
|
|
7497
|
-
var SidebarGroupLabel =
|
|
7507
|
+
var SidebarGroupLabel = React25.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
7498
7508
|
const Comp = asChild ? import_react_slot4.Slot : "div";
|
|
7499
7509
|
return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7500
7510
|
Comp,
|
|
@@ -7511,7 +7521,7 @@ var SidebarGroupLabel = React24.forwardRef(({ className, asChild = false, ...pro
|
|
|
7511
7521
|
);
|
|
7512
7522
|
});
|
|
7513
7523
|
SidebarGroupLabel.displayName = "SidebarGroupLabel";
|
|
7514
|
-
var SidebarGroupAction =
|
|
7524
|
+
var SidebarGroupAction = React25.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
7515
7525
|
const Comp = asChild ? import_react_slot4.Slot : "button";
|
|
7516
7526
|
return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7517
7527
|
Comp,
|
|
@@ -7527,7 +7537,7 @@ var SidebarGroupAction = React24.forwardRef(({ className, asChild = false, ...pr
|
|
|
7527
7537
|
);
|
|
7528
7538
|
});
|
|
7529
7539
|
SidebarGroupAction.displayName = "SidebarGroupAction";
|
|
7530
|
-
var SidebarGroupContent =
|
|
7540
|
+
var SidebarGroupContent = React25.forwardRef(
|
|
7531
7541
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7532
7542
|
"div",
|
|
7533
7543
|
{
|
|
@@ -7539,7 +7549,7 @@ var SidebarGroupContent = React24.forwardRef(
|
|
|
7539
7549
|
)
|
|
7540
7550
|
);
|
|
7541
7551
|
SidebarGroupContent.displayName = "SidebarGroupContent";
|
|
7542
|
-
var SidebarMenu =
|
|
7552
|
+
var SidebarMenu = React25.forwardRef(
|
|
7543
7553
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7544
7554
|
"ul",
|
|
7545
7555
|
{
|
|
@@ -7551,7 +7561,7 @@ var SidebarMenu = React24.forwardRef(
|
|
|
7551
7561
|
)
|
|
7552
7562
|
);
|
|
7553
7563
|
SidebarMenu.displayName = "SidebarMenu";
|
|
7554
|
-
var SidebarMenuItem =
|
|
7564
|
+
var SidebarMenuItem = React25.forwardRef(
|
|
7555
7565
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7556
7566
|
"li",
|
|
7557
7567
|
{
|
|
@@ -7583,7 +7593,7 @@ var sidebarMenuButtonVariants = (0, import_class_variance_authority11.cva)(
|
|
|
7583
7593
|
}
|
|
7584
7594
|
}
|
|
7585
7595
|
);
|
|
7586
|
-
var SidebarMenuButton =
|
|
7596
|
+
var SidebarMenuButton = React25.forwardRef(
|
|
7587
7597
|
({
|
|
7588
7598
|
asChild = false,
|
|
7589
7599
|
isActive = false,
|
|
@@ -7629,7 +7639,7 @@ var SidebarMenuButton = React24.forwardRef(
|
|
|
7629
7639
|
}
|
|
7630
7640
|
);
|
|
7631
7641
|
SidebarMenuButton.displayName = "SidebarMenuButton";
|
|
7632
|
-
var SidebarMenuAction =
|
|
7642
|
+
var SidebarMenuAction = React25.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
|
|
7633
7643
|
const Comp = asChild ? import_react_slot4.Slot : "button";
|
|
7634
7644
|
return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7635
7645
|
Comp,
|
|
@@ -7646,7 +7656,7 @@ var SidebarMenuAction = React24.forwardRef(({ className, asChild = false, showOn
|
|
|
7646
7656
|
);
|
|
7647
7657
|
});
|
|
7648
7658
|
SidebarMenuAction.displayName = "SidebarMenuAction";
|
|
7649
|
-
var SidebarMenuBadge =
|
|
7659
|
+
var SidebarMenuBadge = React25.forwardRef(
|
|
7650
7660
|
({ className, ...props }, ref) => {
|
|
7651
7661
|
const { open, isMobile, openMobile } = useSidebar();
|
|
7652
7662
|
const isOpen = isMobile ? openMobile : open;
|
|
@@ -7666,8 +7676,8 @@ var SidebarMenuBadge = React24.forwardRef(
|
|
|
7666
7676
|
}
|
|
7667
7677
|
);
|
|
7668
7678
|
SidebarMenuBadge.displayName = "SidebarMenuBadge";
|
|
7669
|
-
var SidebarMenuSkeleton =
|
|
7670
|
-
const width =
|
|
7679
|
+
var SidebarMenuSkeleton = React25.forwardRef(({ className, showIcon = false, ...props }, ref) => {
|
|
7680
|
+
const width = React25.useMemo(() => `${Math.floor(Math.random() * 40) + 50}%`, []);
|
|
7671
7681
|
return /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(
|
|
7672
7682
|
"div",
|
|
7673
7683
|
{
|
|
@@ -7690,7 +7700,7 @@ var SidebarMenuSkeleton = React24.forwardRef(({ className, showIcon = false, ...
|
|
|
7690
7700
|
);
|
|
7691
7701
|
});
|
|
7692
7702
|
SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
|
|
7693
|
-
var SidebarMenuSub =
|
|
7703
|
+
var SidebarMenuSub = React25.forwardRef(
|
|
7694
7704
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
|
|
7695
7705
|
"ul",
|
|
7696
7706
|
{
|
|
@@ -7705,7 +7715,7 @@ var SidebarMenuSub = React24.forwardRef(
|
|
|
7705
7715
|
)
|
|
7706
7716
|
);
|
|
7707
7717
|
SidebarMenuSub.displayName = "SidebarMenuSub";
|
|
7708
|
-
var SidebarMenuSubItem =
|
|
7718
|
+
var SidebarMenuSubItem = React25.forwardRef(
|
|
7709
7719
|
({ ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("li", { ref, ...props })
|
|
7710
7720
|
);
|
|
7711
7721
|
SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
|
|
@@ -7729,7 +7739,7 @@ var sidebarMenuSubButtonVariants = (0, import_class_variance_authority11.cva)(
|
|
|
7729
7739
|
}
|
|
7730
7740
|
}
|
|
7731
7741
|
);
|
|
7732
|
-
var SidebarMenuSubButton =
|
|
7742
|
+
var SidebarMenuSubButton = React25.forwardRef(
|
|
7733
7743
|
({
|
|
7734
7744
|
asChild = false,
|
|
7735
7745
|
isActive,
|
|
@@ -8151,9 +8161,9 @@ SwitchBlocksInternal.displayName = "SwitchBlocks";
|
|
|
8151
8161
|
var SwitchBlocks = (0, import_react58.memo)(SwitchBlocksInternal);
|
|
8152
8162
|
|
|
8153
8163
|
// src/switch-group/SwitchGroup.tsx
|
|
8154
|
-
var
|
|
8164
|
+
var React27 = __toESM(require("react"), 1);
|
|
8155
8165
|
var import_jsx_runtime104 = require("react/jsx-runtime");
|
|
8156
|
-
var SwitchGroup =
|
|
8166
|
+
var SwitchGroup = React27.forwardRef(
|
|
8157
8167
|
({ options, value = [], onChange, disabled = false, className, error, ...props }, ref) => {
|
|
8158
8168
|
const handleOptionChange = (optionValue, checked) => {
|
|
8159
8169
|
if (!onChange) return;
|
|
@@ -8435,7 +8445,7 @@ function useUpdateToast({ id }) {
|
|
|
8435
8445
|
}
|
|
8436
8446
|
|
|
8437
8447
|
// src/toggle-group/ToggleGroup.tsx
|
|
8438
|
-
var
|
|
8448
|
+
var React28 = __toESM(require("react"), 1);
|
|
8439
8449
|
var ToggleGroupPrimitive = __toESM(require("@radix-ui/react-toggle-group"), 1);
|
|
8440
8450
|
|
|
8441
8451
|
// src/toggle-group/style.ts
|
|
@@ -8469,12 +8479,12 @@ var toggleVariants = (0, import_class_variance_authority13.cva)(
|
|
|
8469
8479
|
|
|
8470
8480
|
// src/toggle-group/ToggleGroup.tsx
|
|
8471
8481
|
var import_jsx_runtime109 = require("react/jsx-runtime");
|
|
8472
|
-
var ToggleGroupContext =
|
|
8482
|
+
var ToggleGroupContext = React28.createContext({
|
|
8473
8483
|
size: "default",
|
|
8474
8484
|
variant: "default",
|
|
8475
8485
|
theme: "default"
|
|
8476
8486
|
});
|
|
8477
|
-
var ToggleGroup =
|
|
8487
|
+
var ToggleGroup = React28.forwardRef(({ className, variant, size, theme, children, ...props }, ref) => {
|
|
8478
8488
|
const isTabVariant = variant === "tab";
|
|
8479
8489
|
return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
|
|
8480
8490
|
ToggleGroupPrimitive.Root,
|
|
@@ -8491,8 +8501,8 @@ var ToggleGroup = React27.forwardRef(({ className, variant, size, theme, childre
|
|
|
8491
8501
|
);
|
|
8492
8502
|
});
|
|
8493
8503
|
ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
|
|
8494
|
-
var ToggleGroupItem =
|
|
8495
|
-
const context =
|
|
8504
|
+
var ToggleGroupItem = React28.forwardRef(({ className, children, variant, size, theme, ...props }, ref) => {
|
|
8505
|
+
const context = React28.useContext(ToggleGroupContext);
|
|
8496
8506
|
const resolvedVariant = context.variant || variant;
|
|
8497
8507
|
const isTabVariant = resolvedVariant === "tab";
|
|
8498
8508
|
return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
|
|
@@ -8627,7 +8637,7 @@ function TogglesInternal({
|
|
|
8627
8637
|
var Toggles = (0, import_react61.forwardRef)(TogglesInternal);
|
|
8628
8638
|
|
|
8629
8639
|
// src/text-field/TextField.tsx
|
|
8630
|
-
var
|
|
8640
|
+
var React29 = __toESM(require("react"), 1);
|
|
8631
8641
|
var LabelPrimitive2 = __toESM(require("@radix-ui/react-label"), 1);
|
|
8632
8642
|
var import_class_variance_authority14 = require("class-variance-authority");
|
|
8633
8643
|
var import_react_i18next21 = require("react-i18next");
|
|
@@ -8721,7 +8731,7 @@ var floatingLabelClasses = [
|
|
|
8721
8731
|
"peer-focus:to-[var(--text-field-bg-filled)]",
|
|
8722
8732
|
"peer-focus:to-50%"
|
|
8723
8733
|
];
|
|
8724
|
-
var TextField =
|
|
8734
|
+
var TextField = React29.forwardRef(
|
|
8725
8735
|
({
|
|
8726
8736
|
className,
|
|
8727
8737
|
wrapperClassName,
|
|
@@ -8740,7 +8750,7 @@ var TextField = React28.forwardRef(
|
|
|
8740
8750
|
}, ref) => {
|
|
8741
8751
|
const { t } = (0, import_react_i18next21.useTranslation)();
|
|
8742
8752
|
const hasError = Boolean(error);
|
|
8743
|
-
const autoId =
|
|
8753
|
+
const autoId = React29.useId();
|
|
8744
8754
|
const inputId = props.id || autoId;
|
|
8745
8755
|
const inputClasses = cn(
|
|
8746
8756
|
inputVariants({ variant, error: hasError, readOnly: Boolean(readOnly) }),
|
|
@@ -8973,11 +8983,11 @@ function WideButton({ className, disabled, ...props }) {
|
|
|
8973
8983
|
}
|
|
8974
8984
|
|
|
8975
8985
|
// src/datepicker/DatePicker.tsx
|
|
8976
|
-
var
|
|
8986
|
+
var React33 = __toESM(require("react"), 1);
|
|
8977
8987
|
var import_lucide_react42 = require("lucide-react");
|
|
8978
8988
|
|
|
8979
8989
|
// src/drawer/Drawer.tsx
|
|
8980
|
-
var
|
|
8990
|
+
var React30 = __toESM(require("react"), 1);
|
|
8981
8991
|
var DialogPrimitive2 = __toESM(require("@radix-ui/react-dialog"), 1);
|
|
8982
8992
|
var import_react_draggable = __toESM(require("react-draggable"), 1);
|
|
8983
8993
|
var import_jsx_runtime119 = require("react/jsx-runtime");
|
|
@@ -8995,7 +9005,7 @@ function DrawerPortal({ ...props }) {
|
|
|
8995
9005
|
function DrawerClose({ ...props }) {
|
|
8996
9006
|
return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(DialogPrimitive2.Close, { "data-slot": "drawer-close", ...props });
|
|
8997
9007
|
}
|
|
8998
|
-
var DrawerOverlay =
|
|
9008
|
+
var DrawerOverlay = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
|
|
8999
9009
|
DialogPrimitive2.Overlay,
|
|
9000
9010
|
{
|
|
9001
9011
|
ref,
|
|
@@ -9009,7 +9019,7 @@ var DrawerOverlay = React29.forwardRef(({ className, ...props }, ref) => /* @__P
|
|
|
9009
9019
|
));
|
|
9010
9020
|
DrawerOverlay.displayName = DialogPrimitive2.Overlay.displayName;
|
|
9011
9021
|
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";
|
|
9012
|
-
var DrawerContent =
|
|
9022
|
+
var DrawerContent = React30.forwardRef(
|
|
9013
9023
|
({
|
|
9014
9024
|
className,
|
|
9015
9025
|
children,
|
|
@@ -9021,19 +9031,19 @@ var DrawerContent = React29.forwardRef(
|
|
|
9021
9031
|
...props
|
|
9022
9032
|
}, ref) => {
|
|
9023
9033
|
const finalContainer = container || getCustomContainer() || void 0;
|
|
9024
|
-
const nodeRef =
|
|
9025
|
-
const [dragOffsetY, setDragOffsetY] =
|
|
9034
|
+
const nodeRef = React30.useRef(null);
|
|
9035
|
+
const [dragOffsetY, setDragOffsetY] = React30.useState(0);
|
|
9026
9036
|
const overlayOpacity = Math.max(
|
|
9027
9037
|
DRAWER_MIN_OVERLAY_OPACITY,
|
|
9028
9038
|
1 - dragOffsetY / (DRAWER_CLOSE_THRESHOLD * 2)
|
|
9029
9039
|
);
|
|
9030
|
-
const handleDrag =
|
|
9040
|
+
const handleDrag = React30.useCallback(
|
|
9031
9041
|
(_event, data) => {
|
|
9032
9042
|
setDragOffsetY(Math.max(0, data.y));
|
|
9033
9043
|
},
|
|
9034
9044
|
[]
|
|
9035
9045
|
);
|
|
9036
|
-
const handleStop =
|
|
9046
|
+
const handleStop = React30.useCallback(
|
|
9037
9047
|
(_event, data) => {
|
|
9038
9048
|
if (data.y > DRAWER_CLOSE_THRESHOLD) {
|
|
9039
9049
|
setDragOffsetY(0);
|
|
@@ -9124,7 +9134,7 @@ var DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_r
|
|
|
9124
9134
|
DrawerHeader.displayName = "DrawerHeader";
|
|
9125
9135
|
var DrawerFooter = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("div", { className: cn("flex flex-col gap-2 p-5", className), ...props });
|
|
9126
9136
|
DrawerFooter.displayName = "DrawerFooter";
|
|
9127
|
-
var DrawerTitle =
|
|
9137
|
+
var DrawerTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
|
|
9128
9138
|
DialogPrimitive2.Title,
|
|
9129
9139
|
{
|
|
9130
9140
|
ref,
|
|
@@ -9134,7 +9144,7 @@ var DrawerTitle = React29.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
9134
9144
|
}
|
|
9135
9145
|
));
|
|
9136
9146
|
DrawerTitle.displayName = DialogPrimitive2.Title.displayName;
|
|
9137
|
-
var DrawerDescription =
|
|
9147
|
+
var DrawerDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
|
|
9138
9148
|
DialogPrimitive2.Description,
|
|
9139
9149
|
{
|
|
9140
9150
|
ref,
|
|
@@ -9146,7 +9156,7 @@ var DrawerDescription = React29.forwardRef(({ className, ...props }, ref) => /*
|
|
|
9146
9156
|
DrawerDescription.displayName = DialogPrimitive2.Description.displayName;
|
|
9147
9157
|
|
|
9148
9158
|
// src/datepicker/useDatePickerWheel.ts
|
|
9149
|
-
var
|
|
9159
|
+
var React31 = __toESM(require("react"), 1);
|
|
9150
9160
|
|
|
9151
9161
|
// src/datepicker/datePicker.utils.ts
|
|
9152
9162
|
var DISPLAY_PAD_LENGTH = 2;
|
|
@@ -9297,21 +9307,21 @@ function useDatePickerWheel({
|
|
|
9297
9307
|
minDate,
|
|
9298
9308
|
maxDate
|
|
9299
9309
|
}) {
|
|
9300
|
-
const years =
|
|
9301
|
-
const [draftDate, setDraftDate] =
|
|
9310
|
+
const years = React31.useMemo(() => getYearRange(minDate, maxDate), [maxDate, minDate]);
|
|
9311
|
+
const [draftDate, setDraftDate] = React31.useState(
|
|
9302
9312
|
() => resolveInitialDate({ value, defaultValue, minDate, maxDate })
|
|
9303
9313
|
);
|
|
9304
9314
|
const draftYear = draftDate.getFullYear();
|
|
9305
9315
|
const draftMonth = draftDate.getMonth();
|
|
9306
|
-
const [monthScrollTop, setMonthScrollTop] =
|
|
9307
|
-
const [dayScrollTop, setDayScrollTop] =
|
|
9308
|
-
const [yearScrollTop, setYearScrollTop] =
|
|
9309
|
-
const monthListRef =
|
|
9310
|
-
const dayListRef =
|
|
9311
|
-
const yearListRef =
|
|
9312
|
-
const settleTimeoutsRef =
|
|
9313
|
-
const animationFramesRef =
|
|
9314
|
-
const columnRefs =
|
|
9316
|
+
const [monthScrollTop, setMonthScrollTop] = React31.useState(0);
|
|
9317
|
+
const [dayScrollTop, setDayScrollTop] = React31.useState(0);
|
|
9318
|
+
const [yearScrollTop, setYearScrollTop] = React31.useState(0);
|
|
9319
|
+
const monthListRef = React31.useRef(null);
|
|
9320
|
+
const dayListRef = React31.useRef(null);
|
|
9321
|
+
const yearListRef = React31.useRef(null);
|
|
9322
|
+
const settleTimeoutsRef = React31.useRef({});
|
|
9323
|
+
const animationFramesRef = React31.useRef({});
|
|
9324
|
+
const columnRefs = React31.useMemo(
|
|
9315
9325
|
() => ({
|
|
9316
9326
|
month: monthListRef,
|
|
9317
9327
|
day: dayListRef,
|
|
@@ -9319,7 +9329,7 @@ function useDatePickerWheel({
|
|
|
9319
9329
|
}),
|
|
9320
9330
|
[]
|
|
9321
9331
|
);
|
|
9322
|
-
const setColumnScrollTop =
|
|
9332
|
+
const setColumnScrollTop = React31.useCallback(
|
|
9323
9333
|
(column, nextScrollTop) => {
|
|
9324
9334
|
if (column === "month") {
|
|
9325
9335
|
setMonthScrollTop(nextScrollTop);
|
|
@@ -9333,19 +9343,19 @@ function useDatePickerWheel({
|
|
|
9333
9343
|
},
|
|
9334
9344
|
[]
|
|
9335
9345
|
);
|
|
9336
|
-
const clearSettleTimeout =
|
|
9346
|
+
const clearSettleTimeout = React31.useCallback((column) => {
|
|
9337
9347
|
const timeoutId = settleTimeoutsRef.current[column];
|
|
9338
9348
|
if (timeoutId === void 0) return;
|
|
9339
9349
|
window.clearTimeout(timeoutId);
|
|
9340
9350
|
delete settleTimeoutsRef.current[column];
|
|
9341
9351
|
}, []);
|
|
9342
|
-
const clearAnimationFrame =
|
|
9352
|
+
const clearAnimationFrame = React31.useCallback((column) => {
|
|
9343
9353
|
const frameId = animationFramesRef.current[column];
|
|
9344
9354
|
if (frameId === void 0) return;
|
|
9345
9355
|
window.cancelAnimationFrame(frameId);
|
|
9346
9356
|
delete animationFramesRef.current[column];
|
|
9347
9357
|
}, []);
|
|
9348
|
-
|
|
9358
|
+
React31.useEffect(
|
|
9349
9359
|
() => () => {
|
|
9350
9360
|
["month", "day", "year"].forEach((column) => {
|
|
9351
9361
|
clearSettleTimeout(column);
|
|
@@ -9354,22 +9364,22 @@ function useDatePickerWheel({
|
|
|
9354
9364
|
},
|
|
9355
9365
|
[clearAnimationFrame, clearSettleTimeout]
|
|
9356
9366
|
);
|
|
9357
|
-
|
|
9367
|
+
React31.useEffect(() => {
|
|
9358
9368
|
if (isOpen) return;
|
|
9359
9369
|
setDraftDate(resolveInitialDate({ value, defaultValue, minDate, maxDate }));
|
|
9360
9370
|
}, [defaultValue, isOpen, maxDate, minDate, value]);
|
|
9361
|
-
const months =
|
|
9371
|
+
const months = React31.useMemo(
|
|
9362
9372
|
() => getAllowedMonths(draftYear, minDate, maxDate),
|
|
9363
9373
|
[draftYear, maxDate, minDate]
|
|
9364
9374
|
);
|
|
9365
|
-
const days =
|
|
9375
|
+
const days = React31.useMemo(
|
|
9366
9376
|
() => getAllowedDays(draftYear, draftMonth, minDate, maxDate),
|
|
9367
9377
|
[draftMonth, draftYear, maxDate, minDate]
|
|
9368
9378
|
);
|
|
9369
9379
|
const monthIndex = months.findIndex((month) => month === draftMonth);
|
|
9370
9380
|
const dayIndex = days.findIndex((day) => day === draftDate.getDate());
|
|
9371
9381
|
const yearIndex = years.findIndex((year) => year === draftYear);
|
|
9372
|
-
const syncScrollPositions =
|
|
9382
|
+
const syncScrollPositions = React31.useCallback(
|
|
9373
9383
|
(nextDate, behavior = "auto") => {
|
|
9374
9384
|
const nextMonths = getAllowedMonths(nextDate.getFullYear(), minDate, maxDate);
|
|
9375
9385
|
const nextMonthIndex = nextMonths.findIndex((month) => month === nextDate.getMonth());
|
|
@@ -9393,7 +9403,7 @@ function useDatePickerWheel({
|
|
|
9393
9403
|
},
|
|
9394
9404
|
[maxDate, minDate, years]
|
|
9395
9405
|
);
|
|
9396
|
-
|
|
9406
|
+
React31.useLayoutEffect(() => {
|
|
9397
9407
|
if (!isOpen) return;
|
|
9398
9408
|
const nextDate = resolveInitialDate({ value, defaultValue, minDate, maxDate });
|
|
9399
9409
|
setDraftDate(nextDate);
|
|
@@ -9404,7 +9414,7 @@ function useDatePickerWheel({
|
|
|
9404
9414
|
window.cancelAnimationFrame(frameId);
|
|
9405
9415
|
};
|
|
9406
9416
|
}, [defaultValue, isOpen, maxDate, minDate, syncScrollPositions, value]);
|
|
9407
|
-
const updateDraftDate =
|
|
9417
|
+
const updateDraftDate = React31.useCallback(
|
|
9408
9418
|
(column, targetIndex, behavior = "smooth") => {
|
|
9409
9419
|
const currentDate = stripTime(draftDate);
|
|
9410
9420
|
const currentYear = currentDate.getFullYear();
|
|
@@ -9449,7 +9459,7 @@ function useDatePickerWheel({
|
|
|
9449
9459
|
},
|
|
9450
9460
|
[days, draftDate, maxDate, minDate, months, syncScrollPositions, years]
|
|
9451
9461
|
);
|
|
9452
|
-
const settleColumnScroll =
|
|
9462
|
+
const settleColumnScroll = React31.useCallback(
|
|
9453
9463
|
(column) => {
|
|
9454
9464
|
const list = columnRefs[column].current;
|
|
9455
9465
|
if (!list) return;
|
|
@@ -9462,7 +9472,7 @@ function useDatePickerWheel({
|
|
|
9462
9472
|
},
|
|
9463
9473
|
[columnRefs, days.length, months.length, updateDraftDate, years.length]
|
|
9464
9474
|
);
|
|
9465
|
-
const scheduleScrollSettle =
|
|
9475
|
+
const scheduleScrollSettle = React31.useCallback(
|
|
9466
9476
|
(column) => {
|
|
9467
9477
|
clearSettleTimeout(column);
|
|
9468
9478
|
settleTimeoutsRef.current[column] = window.setTimeout(() => {
|
|
@@ -9471,7 +9481,7 @@ function useDatePickerWheel({
|
|
|
9471
9481
|
},
|
|
9472
9482
|
[clearSettleTimeout, settleColumnScroll]
|
|
9473
9483
|
);
|
|
9474
|
-
const handleColumnScroll =
|
|
9484
|
+
const handleColumnScroll = React31.useCallback(
|
|
9475
9485
|
(column) => {
|
|
9476
9486
|
const list = columnRefs[column].current;
|
|
9477
9487
|
if (!list) return;
|
|
@@ -9485,13 +9495,13 @@ function useDatePickerWheel({
|
|
|
9485
9495
|
},
|
|
9486
9496
|
[clearAnimationFrame, columnRefs, scheduleScrollSettle, setColumnScrollTop]
|
|
9487
9497
|
);
|
|
9488
|
-
const handleOptionSelect =
|
|
9498
|
+
const handleOptionSelect = React31.useCallback(
|
|
9489
9499
|
(column, targetIndex) => {
|
|
9490
9500
|
updateDraftDate(column, targetIndex, "smooth");
|
|
9491
9501
|
},
|
|
9492
9502
|
[updateDraftDate]
|
|
9493
9503
|
);
|
|
9494
|
-
const focusAdjacentColumn =
|
|
9504
|
+
const focusAdjacentColumn = React31.useCallback(
|
|
9495
9505
|
(column, direction) => {
|
|
9496
9506
|
const order = ["month", "day", "year"];
|
|
9497
9507
|
const currentIndex = order.indexOf(column);
|
|
@@ -9501,7 +9511,7 @@ function useDatePickerWheel({
|
|
|
9501
9511
|
},
|
|
9502
9512
|
[columnRefs]
|
|
9503
9513
|
);
|
|
9504
|
-
const handleColumnKeyDown =
|
|
9514
|
+
const handleColumnKeyDown = React31.useCallback(
|
|
9505
9515
|
(column, event) => {
|
|
9506
9516
|
const currentIndex = column === "month" ? monthIndex : column === "day" ? dayIndex : yearIndex;
|
|
9507
9517
|
const maxIndex = column === "month" ? months.length - 1 : column === "day" ? days.length - 1 : years.length - 1;
|
|
@@ -9805,7 +9815,7 @@ var DEVICE = {
|
|
|
9805
9815
|
};
|
|
9806
9816
|
|
|
9807
9817
|
// src/field-trigger/FieldTrigger.tsx
|
|
9808
|
-
var
|
|
9818
|
+
var React32 = __toESM(require("react"), 1);
|
|
9809
9819
|
var import_lucide_react41 = require("lucide-react");
|
|
9810
9820
|
var import_react_i18next22 = require("react-i18next");
|
|
9811
9821
|
|
|
@@ -9849,7 +9859,7 @@ function FieldErrorMessage({
|
|
|
9849
9859
|
|
|
9850
9860
|
// src/field-trigger/FieldTrigger.tsx
|
|
9851
9861
|
var import_jsx_runtime123 = require("react/jsx-runtime");
|
|
9852
|
-
var FieldTrigger =
|
|
9862
|
+
var FieldTrigger = React32.forwardRef(
|
|
9853
9863
|
({
|
|
9854
9864
|
as = "button",
|
|
9855
9865
|
variant = "airbnb",
|
|
@@ -10016,7 +10026,7 @@ FieldTrigger.displayName = "FieldTrigger";
|
|
|
10016
10026
|
// src/datepicker/DatePicker.tsx
|
|
10017
10027
|
var import_jsx_runtime124 = require("react/jsx-runtime");
|
|
10018
10028
|
var DEFAULT_MIN_DATE = new Date(1920, 0, 1);
|
|
10019
|
-
var DatePicker =
|
|
10029
|
+
var DatePicker = React33.forwardRef(
|
|
10020
10030
|
({
|
|
10021
10031
|
variant = "default",
|
|
10022
10032
|
label,
|
|
@@ -10042,24 +10052,24 @@ var DatePicker = React32.forwardRef(
|
|
|
10042
10052
|
formatValue = formatDateValue
|
|
10043
10053
|
}, ref) => {
|
|
10044
10054
|
const { isMatch: isMobile } = useScreenResize(DEVICE.mobileXL);
|
|
10045
|
-
const [isOpen, setIsOpen] =
|
|
10046
|
-
const triggerId =
|
|
10047
|
-
const pickerId =
|
|
10048
|
-
const labelId =
|
|
10049
|
-
const valueId =
|
|
10050
|
-
const helperTextId =
|
|
10051
|
-
const errorId =
|
|
10052
|
-
const internalRef =
|
|
10055
|
+
const [isOpen, setIsOpen] = React33.useState(false);
|
|
10056
|
+
const triggerId = React33.useId();
|
|
10057
|
+
const pickerId = React33.useId();
|
|
10058
|
+
const labelId = React33.useId();
|
|
10059
|
+
const valueId = React33.useId();
|
|
10060
|
+
const helperTextId = React33.useId();
|
|
10061
|
+
const errorId = React33.useId();
|
|
10062
|
+
const internalRef = React33.useRef(null);
|
|
10053
10063
|
const combinedRef = useCombinedRef(ref, internalRef);
|
|
10054
|
-
const monthLabels =
|
|
10055
|
-
const resolvedMinDate =
|
|
10056
|
-
const resolvedMaxDate =
|
|
10057
|
-
const normalizedValue =
|
|
10058
|
-
const normalizedDefaultValue =
|
|
10064
|
+
const monthLabels = React33.useMemo(() => getMonthLabels(locale), [locale]);
|
|
10065
|
+
const resolvedMinDate = React33.useMemo(() => minDate ?? DEFAULT_MIN_DATE, [minDate]);
|
|
10066
|
+
const resolvedMaxDate = React33.useMemo(() => maxDate ?? /* @__PURE__ */ new Date(), [maxDate]);
|
|
10067
|
+
const normalizedValue = React33.useMemo(() => normalizeDateValue(value), [value]);
|
|
10068
|
+
const normalizedDefaultValue = React33.useMemo(
|
|
10059
10069
|
() => normalizeDateValue(defaultValue),
|
|
10060
10070
|
[defaultValue]
|
|
10061
10071
|
);
|
|
10062
|
-
const resolvedValue =
|
|
10072
|
+
const resolvedValue = React33.useMemo(
|
|
10063
10073
|
() => normalizedValue ? clampDate(normalizedValue, resolvedMinDate, resolvedMaxDate) : null,
|
|
10064
10074
|
[normalizedValue, resolvedMaxDate, resolvedMinDate]
|
|
10065
10075
|
);
|
|
@@ -10090,7 +10100,7 @@ var DatePicker = React32.forwardRef(
|
|
|
10090
10100
|
minDate: resolvedMinDate,
|
|
10091
10101
|
maxDate: resolvedMaxDate
|
|
10092
10102
|
});
|
|
10093
|
-
const handleOpenChange =
|
|
10103
|
+
const handleOpenChange = React33.useCallback(
|
|
10094
10104
|
(nextOpen) => {
|
|
10095
10105
|
if (isBlocked && nextOpen) return;
|
|
10096
10106
|
setIsOpen(nextOpen);
|
|
@@ -10100,7 +10110,7 @@ var DatePicker = React32.forwardRef(
|
|
|
10100
10110
|
},
|
|
10101
10111
|
[isBlocked]
|
|
10102
10112
|
);
|
|
10103
|
-
const handleDone =
|
|
10113
|
+
const handleDone = React33.useCallback(() => {
|
|
10104
10114
|
if (isBlocked) return;
|
|
10105
10115
|
onChange(clampDate(draftDate, resolvedMinDate, resolvedMaxDate));
|
|
10106
10116
|
handleOpenChange(false);
|
|
@@ -10112,11 +10122,11 @@ var DatePicker = React32.forwardRef(
|
|
|
10112
10122
|
resolvedMaxDate,
|
|
10113
10123
|
resolvedMinDate
|
|
10114
10124
|
]);
|
|
10115
|
-
const handleTriggerClick =
|
|
10125
|
+
const handleTriggerClick = React33.useCallback(() => {
|
|
10116
10126
|
if (isBlocked) return;
|
|
10117
10127
|
setIsOpen(true);
|
|
10118
10128
|
}, [isBlocked]);
|
|
10119
|
-
const handleTriggerKeyDown =
|
|
10129
|
+
const handleTriggerKeyDown = React33.useCallback(
|
|
10120
10130
|
(event) => {
|
|
10121
10131
|
if (isBlocked) return;
|
|
10122
10132
|
if (event.key === "ArrowDown" || event.key === "ArrowUp" || event.key === "Enter" || event.key === " ") {
|
|
@@ -10126,7 +10136,7 @@ var DatePicker = React32.forwardRef(
|
|
|
10126
10136
|
},
|
|
10127
10137
|
[isBlocked]
|
|
10128
10138
|
);
|
|
10129
|
-
|
|
10139
|
+
React33.useEffect(() => {
|
|
10130
10140
|
if (isBlocked) {
|
|
10131
10141
|
setIsOpen(false);
|
|
10132
10142
|
}
|
|
@@ -10308,10 +10318,10 @@ function ResponsiveSheet({
|
|
|
10308
10318
|
}
|
|
10309
10319
|
|
|
10310
10320
|
// src/airbnb/input/Input.tsx
|
|
10311
|
-
var
|
|
10321
|
+
var React34 = __toESM(require("react"), 1);
|
|
10312
10322
|
var import_jsx_runtime126 = require("react/jsx-runtime");
|
|
10313
10323
|
var getInputValue = (value) => value != null ? String(value) : "";
|
|
10314
|
-
var AirbnbInput =
|
|
10324
|
+
var AirbnbInput = React34.forwardRef(
|
|
10315
10325
|
({
|
|
10316
10326
|
variant = "default",
|
|
10317
10327
|
label,
|
|
@@ -10340,15 +10350,15 @@ var AirbnbInput = React33.forwardRef(
|
|
|
10340
10350
|
placeholder,
|
|
10341
10351
|
...props
|
|
10342
10352
|
}, ref) => {
|
|
10343
|
-
const generatedId =
|
|
10344
|
-
const inputRef =
|
|
10353
|
+
const generatedId = React34.useId();
|
|
10354
|
+
const inputRef = React34.useRef(null);
|
|
10345
10355
|
const inputId = id ?? generatedId;
|
|
10346
10356
|
const fieldId = `${inputId}-field`;
|
|
10347
10357
|
const labelId = `${inputId}-label`;
|
|
10348
10358
|
const errorId = `${inputId}-error`;
|
|
10349
10359
|
const accessibleLabel = placeholder ?? label;
|
|
10350
|
-
const [isFocused, setIsFocused] =
|
|
10351
|
-
const [currentValue, setCurrentValue] =
|
|
10360
|
+
const [isFocused, setIsFocused] = React34.useState(false);
|
|
10361
|
+
const [currentValue, setCurrentValue] = React34.useState(
|
|
10352
10362
|
() => value != null ? getInputValue(value) : getInputValue(defaultValue)
|
|
10353
10363
|
);
|
|
10354
10364
|
const resolvedValue = value != null ? getInputValue(value) : currentValue;
|
|
@@ -10358,11 +10368,11 @@ var AirbnbInput = React33.forwardRef(
|
|
|
10358
10368
|
const triggerError = error ?? invalid;
|
|
10359
10369
|
const hasLabelMeta = Boolean(optional) || Boolean(tooltip);
|
|
10360
10370
|
const isBlocked = Boolean(disabled) || Boolean(loading);
|
|
10361
|
-
|
|
10371
|
+
React34.useLayoutEffect(() => {
|
|
10362
10372
|
const nextValue = value != null ? getInputValue(value) : getInputValue(inputRef.current?.value);
|
|
10363
10373
|
setCurrentValue((prevValue) => prevValue === nextValue ? prevValue : nextValue);
|
|
10364
10374
|
}, [value]);
|
|
10365
|
-
const setRefs =
|
|
10375
|
+
const setRefs = React34.useCallback(
|
|
10366
10376
|
(node) => {
|
|
10367
10377
|
inputRef.current = node;
|
|
10368
10378
|
if (node && value == null) {
|
|
@@ -10460,11 +10470,11 @@ var AirbnbInput = React33.forwardRef(
|
|
|
10460
10470
|
AirbnbInput.displayName = "Input";
|
|
10461
10471
|
|
|
10462
10472
|
// src/airbnb/phone-field/PhoneField.tsx
|
|
10463
|
-
var
|
|
10473
|
+
var React40 = __toESM(require("react"), 1);
|
|
10464
10474
|
var import_lucide_react44 = require("lucide-react");
|
|
10465
10475
|
|
|
10466
10476
|
// src/airbnb/select/Select.tsx
|
|
10467
|
-
var
|
|
10477
|
+
var React39 = __toESM(require("react"), 1);
|
|
10468
10478
|
|
|
10469
10479
|
// src/airbnb/select/SelectDesktopMenu.tsx
|
|
10470
10480
|
var import_jsx_runtime127 = require("react/jsx-runtime");
|
|
@@ -10809,10 +10819,10 @@ function SelectMobileContent({
|
|
|
10809
10819
|
}
|
|
10810
10820
|
|
|
10811
10821
|
// src/airbnb/select/SelectTrigger.tsx
|
|
10812
|
-
var
|
|
10822
|
+
var React35 = __toESM(require("react"), 1);
|
|
10813
10823
|
var import_lucide_react43 = require("lucide-react");
|
|
10814
10824
|
var import_jsx_runtime131 = require("react/jsx-runtime");
|
|
10815
|
-
var SelectTrigger2 =
|
|
10825
|
+
var SelectTrigger2 = React35.forwardRef(
|
|
10816
10826
|
({
|
|
10817
10827
|
id,
|
|
10818
10828
|
open,
|
|
@@ -10879,7 +10889,7 @@ var SelectTrigger2 = React34.forwardRef(
|
|
|
10879
10889
|
SelectTrigger2.displayName = "SelectTrigger";
|
|
10880
10890
|
|
|
10881
10891
|
// src/airbnb/select/useDesktopSelect.ts
|
|
10882
|
-
var
|
|
10892
|
+
var React36 = __toESM(require("react"), 1);
|
|
10883
10893
|
function useDesktopSelect({
|
|
10884
10894
|
isMobile,
|
|
10885
10895
|
isOpen,
|
|
@@ -10888,12 +10898,12 @@ function useDesktopSelect({
|
|
|
10888
10898
|
disabled,
|
|
10889
10899
|
onChange
|
|
10890
10900
|
}) {
|
|
10891
|
-
const [highlightedIndex, setHighlightedIndex] =
|
|
10892
|
-
const triggerRef =
|
|
10893
|
-
const listRef =
|
|
10894
|
-
const optionRefs =
|
|
10901
|
+
const [highlightedIndex, setHighlightedIndex] = React36.useState(-1);
|
|
10902
|
+
const triggerRef = React36.useRef(null);
|
|
10903
|
+
const listRef = React36.useRef(null);
|
|
10904
|
+
const optionRefs = React36.useRef([]);
|
|
10895
10905
|
const selectedIndex = getOptionIndex(options, value);
|
|
10896
|
-
|
|
10906
|
+
React36.useEffect(() => {
|
|
10897
10907
|
if (!isOpen || isMobile) return;
|
|
10898
10908
|
setHighlightedIndex((currentIndex) => {
|
|
10899
10909
|
if (currentIndex >= 0) {
|
|
@@ -10908,34 +10918,34 @@ function useDesktopSelect({
|
|
|
10908
10918
|
window.cancelAnimationFrame(frameId);
|
|
10909
10919
|
};
|
|
10910
10920
|
}, [isMobile, isOpen, options, selectedIndex]);
|
|
10911
|
-
|
|
10921
|
+
React36.useEffect(() => {
|
|
10912
10922
|
if (!isOpen || isMobile || highlightedIndex < 0) return;
|
|
10913
10923
|
optionRefs.current[highlightedIndex]?.scrollIntoView({
|
|
10914
10924
|
block: "nearest"
|
|
10915
10925
|
});
|
|
10916
10926
|
}, [highlightedIndex, isMobile, isOpen]);
|
|
10917
|
-
|
|
10927
|
+
React36.useEffect(() => {
|
|
10918
10928
|
if (isOpen) return;
|
|
10919
10929
|
setHighlightedIndex(-1);
|
|
10920
10930
|
}, [isOpen]);
|
|
10921
|
-
const focusTrigger =
|
|
10931
|
+
const focusTrigger = React36.useCallback(() => {
|
|
10922
10932
|
triggerRef.current?.focus();
|
|
10923
10933
|
}, []);
|
|
10924
|
-
const handleSelect =
|
|
10934
|
+
const handleSelect = React36.useCallback(
|
|
10925
10935
|
(option) => {
|
|
10926
10936
|
if (option.isDisabled || disabled) return;
|
|
10927
10937
|
onChange(option);
|
|
10928
10938
|
},
|
|
10929
10939
|
[disabled, onChange]
|
|
10930
10940
|
);
|
|
10931
|
-
const openMenu =
|
|
10941
|
+
const openMenu = React36.useCallback(
|
|
10932
10942
|
(targetIndex) => {
|
|
10933
10943
|
const fallbackIndex = selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex(options);
|
|
10934
10944
|
setHighlightedIndex(targetIndex ?? fallbackIndex);
|
|
10935
10945
|
},
|
|
10936
10946
|
[options, selectedIndex]
|
|
10937
10947
|
);
|
|
10938
|
-
const handleTriggerKeyDown =
|
|
10948
|
+
const handleTriggerKeyDown = React36.useCallback(
|
|
10939
10949
|
(event, onOpen) => {
|
|
10940
10950
|
if (disabled) return;
|
|
10941
10951
|
if (event.key === "ArrowDown") {
|
|
@@ -10960,7 +10970,7 @@ function useDesktopSelect({
|
|
|
10960
10970
|
},
|
|
10961
10971
|
[disabled, openMenu, options, selectedIndex]
|
|
10962
10972
|
);
|
|
10963
|
-
const handleMenuKeyDown =
|
|
10973
|
+
const handleMenuKeyDown = React36.useCallback(
|
|
10964
10974
|
(event, onClose) => {
|
|
10965
10975
|
if (event.key === "Escape") {
|
|
10966
10976
|
event.preventDefault();
|
|
@@ -11010,7 +11020,7 @@ function useDesktopSelect({
|
|
|
11010
11020
|
},
|
|
11011
11021
|
[focusTrigger, highlightedIndex, onChange, options]
|
|
11012
11022
|
);
|
|
11013
|
-
const setOptionRef =
|
|
11023
|
+
const setOptionRef = React36.useCallback(
|
|
11014
11024
|
(index, node) => {
|
|
11015
11025
|
optionRefs.current[index] = node;
|
|
11016
11026
|
},
|
|
@@ -11030,23 +11040,23 @@ function useDesktopSelect({
|
|
|
11030
11040
|
}
|
|
11031
11041
|
|
|
11032
11042
|
// src/airbnb/select/useMobileSelectWheel.ts
|
|
11033
|
-
var
|
|
11043
|
+
var React37 = __toESM(require("react"), 1);
|
|
11034
11044
|
function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
11035
|
-
const [pendingValue, setPendingValue] =
|
|
11045
|
+
const [pendingValue, setPendingValue] = React37.useState(
|
|
11036
11046
|
value ?? null
|
|
11037
11047
|
);
|
|
11038
|
-
const [mobileScrollTop, setMobileScrollTop] =
|
|
11039
|
-
const mobileListRef =
|
|
11040
|
-
const scrollSettleTimeoutRef =
|
|
11041
|
-
const scrollAnimationFrameRef =
|
|
11042
|
-
const getTargetIndex =
|
|
11048
|
+
const [mobileScrollTop, setMobileScrollTop] = React37.useState(0);
|
|
11049
|
+
const mobileListRef = React37.useRef(null);
|
|
11050
|
+
const scrollSettleTimeoutRef = React37.useRef(null);
|
|
11051
|
+
const scrollAnimationFrameRef = React37.useRef(null);
|
|
11052
|
+
const getTargetIndex = React37.useCallback(
|
|
11043
11053
|
(targetValue) => {
|
|
11044
11054
|
const selectedIndex = getOptionIndex(options, targetValue);
|
|
11045
11055
|
return selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex(options);
|
|
11046
11056
|
},
|
|
11047
11057
|
[options]
|
|
11048
11058
|
);
|
|
11049
|
-
const syncScrollPosition =
|
|
11059
|
+
const syncScrollPosition = React37.useCallback(
|
|
11050
11060
|
(targetValue, behavior = "instant") => {
|
|
11051
11061
|
const targetIndex = getTargetIndex(targetValue);
|
|
11052
11062
|
if (targetIndex < 0) return;
|
|
@@ -11065,27 +11075,27 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11065
11075
|
},
|
|
11066
11076
|
[getTargetIndex, options]
|
|
11067
11077
|
);
|
|
11068
|
-
const clearScrollSettleTimeout =
|
|
11078
|
+
const clearScrollSettleTimeout = React37.useCallback(() => {
|
|
11069
11079
|
if (scrollSettleTimeoutRef.current === null) return;
|
|
11070
11080
|
window.clearTimeout(scrollSettleTimeoutRef.current);
|
|
11071
11081
|
scrollSettleTimeoutRef.current = null;
|
|
11072
11082
|
}, []);
|
|
11073
|
-
const clearScrollAnimationFrame =
|
|
11083
|
+
const clearScrollAnimationFrame = React37.useCallback(() => {
|
|
11074
11084
|
if (scrollAnimationFrameRef.current === null) return;
|
|
11075
11085
|
window.cancelAnimationFrame(scrollAnimationFrameRef.current);
|
|
11076
11086
|
scrollAnimationFrameRef.current = null;
|
|
11077
11087
|
}, []);
|
|
11078
|
-
|
|
11088
|
+
React37.useEffect(
|
|
11079
11089
|
() => () => {
|
|
11080
11090
|
clearScrollSettleTimeout();
|
|
11081
11091
|
clearScrollAnimationFrame();
|
|
11082
11092
|
},
|
|
11083
11093
|
[clearScrollAnimationFrame, clearScrollSettleTimeout]
|
|
11084
11094
|
);
|
|
11085
|
-
|
|
11095
|
+
React37.useEffect(() => {
|
|
11086
11096
|
setPendingValue(value ?? null);
|
|
11087
11097
|
}, [value]);
|
|
11088
|
-
|
|
11098
|
+
React37.useLayoutEffect(() => {
|
|
11089
11099
|
if (!isMobile || !isOpen) return;
|
|
11090
11100
|
const frameId = window.requestAnimationFrame(() => {
|
|
11091
11101
|
syncScrollPosition(value ?? null, "instant");
|
|
@@ -11094,7 +11104,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11094
11104
|
window.cancelAnimationFrame(frameId);
|
|
11095
11105
|
};
|
|
11096
11106
|
}, [isMobile, isOpen, syncScrollPosition, value]);
|
|
11097
|
-
const settleScroll =
|
|
11107
|
+
const settleScroll = React37.useCallback(() => {
|
|
11098
11108
|
if (!mobileListRef.current) return;
|
|
11099
11109
|
const nextIndex = Math.round(mobileListRef.current.scrollTop / MOBILE_OPTION_HEIGHT);
|
|
11100
11110
|
const nextOption = options[nextIndex];
|
|
@@ -11106,13 +11116,13 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11106
11116
|
}
|
|
11107
11117
|
setPendingValue(nextOption);
|
|
11108
11118
|
}, [options, pendingValue]);
|
|
11109
|
-
const scheduleScrollSettle =
|
|
11119
|
+
const scheduleScrollSettle = React37.useCallback(() => {
|
|
11110
11120
|
clearScrollSettleTimeout();
|
|
11111
11121
|
scrollSettleTimeoutRef.current = window.setTimeout(() => {
|
|
11112
11122
|
settleScroll();
|
|
11113
11123
|
}, MOBILE_SCROLL_SETTLE_DELAY);
|
|
11114
11124
|
}, [clearScrollSettleTimeout, settleScroll]);
|
|
11115
|
-
const handleScroll =
|
|
11125
|
+
const handleScroll = React37.useCallback(() => {
|
|
11116
11126
|
if (!mobileListRef.current) return;
|
|
11117
11127
|
const nextScrollTop = mobileListRef.current.scrollTop;
|
|
11118
11128
|
clearScrollAnimationFrame();
|
|
@@ -11122,7 +11132,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11122
11132
|
});
|
|
11123
11133
|
scheduleScrollSettle();
|
|
11124
11134
|
}, [clearScrollAnimationFrame, scheduleScrollSettle]);
|
|
11125
|
-
const focusOptionByIndex =
|
|
11135
|
+
const focusOptionByIndex = React37.useCallback(
|
|
11126
11136
|
(index, behavior = "instant", updatePendingImmediately = behavior === "instant") => {
|
|
11127
11137
|
if (!mobileListRef.current || index < 0 || index >= options.length) return;
|
|
11128
11138
|
const option = options[index];
|
|
@@ -11140,7 +11150,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11140
11150
|
},
|
|
11141
11151
|
[options, scheduleScrollSettle]
|
|
11142
11152
|
);
|
|
11143
|
-
const handleOptionClick =
|
|
11153
|
+
const handleOptionClick = React37.useCallback(
|
|
11144
11154
|
(option) => {
|
|
11145
11155
|
if (!mobileListRef.current || disabled || option.isDisabled) return;
|
|
11146
11156
|
const optionIndex = getOptionIndex(options, option);
|
|
@@ -11149,7 +11159,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11149
11159
|
},
|
|
11150
11160
|
[disabled, focusOptionByIndex, options]
|
|
11151
11161
|
);
|
|
11152
|
-
const moveByStep =
|
|
11162
|
+
const moveByStep = React37.useCallback(
|
|
11153
11163
|
(step) => {
|
|
11154
11164
|
const currentIndex = getOptionIndex(options, pendingValue);
|
|
11155
11165
|
const fallbackIndex = step === 1 ? getFirstEnabledOptionIndex(options) : getLastEnabledOptionIndex(options);
|
|
@@ -11161,7 +11171,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11161
11171
|
},
|
|
11162
11172
|
[focusOptionByIndex, options, pendingValue]
|
|
11163
11173
|
);
|
|
11164
|
-
const moveToBoundary =
|
|
11174
|
+
const moveToBoundary = React37.useCallback(
|
|
11165
11175
|
(boundary) => {
|
|
11166
11176
|
const targetIndex = boundary === "start" ? getFirstEnabledOptionIndex(options) : getLastEnabledOptionIndex(options);
|
|
11167
11177
|
if (targetIndex >= 0) {
|
|
@@ -11170,7 +11180,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11170
11180
|
},
|
|
11171
11181
|
[focusOptionByIndex, options]
|
|
11172
11182
|
);
|
|
11173
|
-
const syncPendingValue =
|
|
11183
|
+
const syncPendingValue = React37.useCallback(
|
|
11174
11184
|
(nextValue) => {
|
|
11175
11185
|
const normalizedValue = nextValue ?? null;
|
|
11176
11186
|
const matchedIndex = getOptionIndex(options, normalizedValue);
|
|
@@ -11198,9 +11208,9 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
|
|
|
11198
11208
|
}
|
|
11199
11209
|
|
|
11200
11210
|
// src/airbnb/select/useSelectIds.ts
|
|
11201
|
-
var
|
|
11211
|
+
var React38 = __toESM(require("react"), 1);
|
|
11202
11212
|
function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
|
|
11203
|
-
const reactId =
|
|
11213
|
+
const reactId = React38.useId().replace(/:/g, "");
|
|
11204
11214
|
const baseId = name ? `select-${name}` : `select-${reactId}`;
|
|
11205
11215
|
const triggerId = `${baseId}-trigger`;
|
|
11206
11216
|
const labelId = `${baseId}-label`;
|
|
@@ -11210,7 +11220,7 @@ function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
|
|
|
11210
11220
|
const listboxId = `${baseId}-listbox`;
|
|
11211
11221
|
const describedErrorId = error && !hideErrorMessage ? errorId : void 0;
|
|
11212
11222
|
const describedBy = [!hasValue ? helperTextId : null, describedErrorId].filter(Boolean).join(" ") || void 0;
|
|
11213
|
-
const getOptionId2 =
|
|
11223
|
+
const getOptionId2 = React38.useCallback(
|
|
11214
11224
|
(index) => `${baseId}-option-${index}`,
|
|
11215
11225
|
[baseId]
|
|
11216
11226
|
);
|
|
@@ -11229,7 +11239,7 @@ function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
|
|
|
11229
11239
|
|
|
11230
11240
|
// src/airbnb/select/Select.tsx
|
|
11231
11241
|
var import_jsx_runtime132 = require("react/jsx-runtime");
|
|
11232
|
-
var AirbnbSelect =
|
|
11242
|
+
var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
11233
11243
|
options = [],
|
|
11234
11244
|
value,
|
|
11235
11245
|
onChange,
|
|
@@ -11256,8 +11266,8 @@ var AirbnbSelect = React38.forwardRef(function AirbnbSelect2({
|
|
|
11256
11266
|
noOptionsMessage
|
|
11257
11267
|
}, ref) {
|
|
11258
11268
|
const { isMatch: isMobile } = useScreenResize(DEVICE.mobileXL);
|
|
11259
|
-
const [isOpen, setIsOpen] =
|
|
11260
|
-
const containerRef =
|
|
11269
|
+
const [isOpen, setIsOpen] = React39.useState(false);
|
|
11270
|
+
const containerRef = React39.useRef(null);
|
|
11261
11271
|
const hasValue = Boolean(value);
|
|
11262
11272
|
const helperText = placeholder ?? label;
|
|
11263
11273
|
const isBlocked = Boolean(disabled) || Boolean(loading);
|
|
@@ -11315,12 +11325,12 @@ var AirbnbSelect = React38.forwardRef(function AirbnbSelect2({
|
|
|
11315
11325
|
onOutsideClick: () => setIsOpen(false),
|
|
11316
11326
|
isDisabled: !isOpen || isMobile
|
|
11317
11327
|
});
|
|
11318
|
-
|
|
11328
|
+
React39.useEffect(() => {
|
|
11319
11329
|
if (isBlocked) {
|
|
11320
11330
|
setIsOpen(false);
|
|
11321
11331
|
}
|
|
11322
11332
|
}, [isBlocked]);
|
|
11323
|
-
|
|
11333
|
+
React39.useEffect(
|
|
11324
11334
|
function setCorrectOptionIfThereIsOnlyValue() {
|
|
11325
11335
|
if (value?.value === void 0 || value.value === null || value.label !== "") {
|
|
11326
11336
|
return;
|
|
@@ -11332,7 +11342,7 @@ var AirbnbSelect = React38.forwardRef(function AirbnbSelect2({
|
|
|
11332
11342
|
},
|
|
11333
11343
|
[onChange, options, value]
|
|
11334
11344
|
);
|
|
11335
|
-
const handleMobileOpenChange =
|
|
11345
|
+
const handleMobileOpenChange = React39.useCallback(
|
|
11336
11346
|
(nextOpen) => {
|
|
11337
11347
|
if (isBlocked && nextOpen) return;
|
|
11338
11348
|
setIsOpen(nextOpen);
|
|
@@ -11343,7 +11353,7 @@ var AirbnbSelect = React38.forwardRef(function AirbnbSelect2({
|
|
|
11343
11353
|
},
|
|
11344
11354
|
[focusTrigger, isBlocked, syncPendingValue, value]
|
|
11345
11355
|
);
|
|
11346
|
-
const handleMobileDone =
|
|
11356
|
+
const handleMobileDone = React39.useCallback(() => {
|
|
11347
11357
|
if (isBlocked) return;
|
|
11348
11358
|
const finalOption = pendingValue;
|
|
11349
11359
|
if (finalOption && finalOption.value !== value?.value) {
|
|
@@ -11352,7 +11362,7 @@ var AirbnbSelect = React38.forwardRef(function AirbnbSelect2({
|
|
|
11352
11362
|
setIsOpen(false);
|
|
11353
11363
|
focusTrigger();
|
|
11354
11364
|
}, [focusTrigger, isBlocked, onChange, pendingValue, value]);
|
|
11355
|
-
const handleTriggerClick =
|
|
11365
|
+
const handleTriggerClick = React39.useCallback(() => {
|
|
11356
11366
|
if (isBlocked) return;
|
|
11357
11367
|
setIsOpen((prev) => {
|
|
11358
11368
|
const nextOpen = !prev;
|
|
@@ -11521,7 +11531,7 @@ var AirbnbSelect = React38.forwardRef(function AirbnbSelect2({
|
|
|
11521
11531
|
|
|
11522
11532
|
// src/airbnb/phone-field/PhoneField.tsx
|
|
11523
11533
|
var import_jsx_runtime133 = require("react/jsx-runtime");
|
|
11524
|
-
var PhoneField =
|
|
11534
|
+
var PhoneField = React40.forwardRef(
|
|
11525
11535
|
({
|
|
11526
11536
|
variant = "default",
|
|
11527
11537
|
label,
|
|
@@ -11545,8 +11555,8 @@ var PhoneField = React39.forwardRef(
|
|
|
11545
11555
|
mobileTitle,
|
|
11546
11556
|
codePlaceholder = "+00"
|
|
11547
11557
|
}, ref) => {
|
|
11548
|
-
const inputId =
|
|
11549
|
-
const codeOptions =
|
|
11558
|
+
const inputId = React40.useId();
|
|
11559
|
+
const codeOptions = React40.useMemo(
|
|
11550
11560
|
() => options.map((option) => ({
|
|
11551
11561
|
value: option.value,
|
|
11552
11562
|
label: `${option.label} (${option.value})`,
|
|
@@ -11554,7 +11564,7 @@ var PhoneField = React39.forwardRef(
|
|
|
11554
11564
|
})),
|
|
11555
11565
|
[options]
|
|
11556
11566
|
);
|
|
11557
|
-
const selectedCodeOption =
|
|
11567
|
+
const selectedCodeOption = React40.useMemo(
|
|
11558
11568
|
() => codeOptions.find((option) => option.value === value?.code) ?? null,
|
|
11559
11569
|
[codeOptions, value?.code]
|
|
11560
11570
|
);
|
|
@@ -11696,11 +11706,11 @@ var PhoneField = React39.forwardRef(
|
|
|
11696
11706
|
PhoneField.displayName = "PhoneField";
|
|
11697
11707
|
|
|
11698
11708
|
// src/airbnb/search-input/SearchInput.tsx
|
|
11699
|
-
var
|
|
11709
|
+
var React41 = __toESM(require("react"), 1);
|
|
11700
11710
|
var import_react_i18next23 = require("react-i18next");
|
|
11701
11711
|
var import_lucide_react45 = require("lucide-react");
|
|
11702
11712
|
var import_jsx_runtime134 = require("react/jsx-runtime");
|
|
11703
|
-
var AirbnbSearchInput =
|
|
11713
|
+
var AirbnbSearchInput = React41.forwardRef(({ onReset, placeholder, wrapperClassName, ...props }, ref) => {
|
|
11704
11714
|
const { t } = (0, import_react_i18next23.useTranslation)();
|
|
11705
11715
|
const placeholderText = placeholder || t("search_property") + "...";
|
|
11706
11716
|
return /* @__PURE__ */ (0, import_jsx_runtime134.jsxs)("div", { className: cn("input-wrapper relative", wrapperClassName), children: [
|
|
@@ -11738,7 +11748,7 @@ var AirbnbSearchInput = React40.forwardRef(({ onReset, placeholder, wrapperClass
|
|
|
11738
11748
|
AirbnbSearchInput.displayName = "SearchInput";
|
|
11739
11749
|
|
|
11740
11750
|
// src/searchable-select/SearchableSelect.tsx
|
|
11741
|
-
var
|
|
11751
|
+
var React42 = __toESM(require("react"), 1);
|
|
11742
11752
|
var import_lucide_react46 = require("lucide-react");
|
|
11743
11753
|
var import_react_virtual = require("@tanstack/react-virtual");
|
|
11744
11754
|
var import_react63 = require("react");
|
|
@@ -11783,13 +11793,13 @@ var SearchableSelectInternal = ({
|
|
|
11783
11793
|
loadingMessage
|
|
11784
11794
|
}, ref) => {
|
|
11785
11795
|
const { isMatch: isMobile } = useScreenResize(DEVICE.mobileXL);
|
|
11786
|
-
const reactId =
|
|
11787
|
-
const [open, setOpen] =
|
|
11788
|
-
const [internalSearchValue, setInternalSearchValue] =
|
|
11789
|
-
const [highlightedIndex, setHighlightedIndex] =
|
|
11790
|
-
const containerRef =
|
|
11791
|
-
const triggerRef =
|
|
11792
|
-
const inputRef =
|
|
11796
|
+
const reactId = React42.useId();
|
|
11797
|
+
const [open, setOpen] = React42.useState(false);
|
|
11798
|
+
const [internalSearchValue, setInternalSearchValue] = React42.useState("");
|
|
11799
|
+
const [highlightedIndex, setHighlightedIndex] = React42.useState(-1);
|
|
11800
|
+
const containerRef = React42.useRef(null);
|
|
11801
|
+
const triggerRef = React42.useRef(null);
|
|
11802
|
+
const inputRef = React42.useRef(null);
|
|
11793
11803
|
const listboxId = `${reactId}-listbox`;
|
|
11794
11804
|
const labelId = `${reactId}-label`;
|
|
11795
11805
|
const valueId = `${reactId}-value`;
|
|
@@ -11798,13 +11808,13 @@ var SearchableSelectInternal = ({
|
|
|
11798
11808
|
const searchInputId = `${reactId}-search`;
|
|
11799
11809
|
const effectiveSearchValue = searchValue ?? internalSearchValue;
|
|
11800
11810
|
const shouldFilterLocally = !onSearchChange && filterOption !== null;
|
|
11801
|
-
const visibleOptions =
|
|
11811
|
+
const visibleOptions = React42.useMemo(() => {
|
|
11802
11812
|
if (!shouldFilterLocally || !effectiveSearchValue) {
|
|
11803
11813
|
return options;
|
|
11804
11814
|
}
|
|
11805
11815
|
return options.filter((option) => filterOption(option, effectiveSearchValue));
|
|
11806
11816
|
}, [effectiveSearchValue, filterOption, options, shouldFilterLocally]);
|
|
11807
|
-
const selectedIndex =
|
|
11817
|
+
const selectedIndex = React42.useMemo(
|
|
11808
11818
|
() => visibleOptions.findIndex((option) => option.value === value?.value),
|
|
11809
11819
|
[value?.value, visibleOptions]
|
|
11810
11820
|
);
|
|
@@ -11830,7 +11840,7 @@ var SearchableSelectInternal = ({
|
|
|
11830
11840
|
},
|
|
11831
11841
|
[handleOnOpenChange]
|
|
11832
11842
|
);
|
|
11833
|
-
|
|
11843
|
+
React42.useEffect(() => {
|
|
11834
11844
|
if (isBlocked) {
|
|
11835
11845
|
setSelectOpen(false);
|
|
11836
11846
|
return;
|
|
@@ -11843,7 +11853,7 @@ var SearchableSelectInternal = ({
|
|
|
11843
11853
|
window.cancelAnimationFrame(frameId);
|
|
11844
11854
|
};
|
|
11845
11855
|
}, [isBlocked, open, setSelectOpen]);
|
|
11846
|
-
|
|
11856
|
+
React42.useEffect(() => {
|
|
11847
11857
|
if (!open) {
|
|
11848
11858
|
setHighlightedIndex(-1);
|
|
11849
11859
|
return;
|
|
@@ -11938,7 +11948,7 @@ var SearchableSelectInternal = ({
|
|
|
11938
11948
|
onOptionHover: setHighlightedIndex
|
|
11939
11949
|
}
|
|
11940
11950
|
);
|
|
11941
|
-
|
|
11951
|
+
React42.useImperativeHandle(ref, () => triggerRef.current, []);
|
|
11942
11952
|
return /* @__PURE__ */ (0, import_jsx_runtime135.jsxs)(
|
|
11943
11953
|
"div",
|
|
11944
11954
|
{
|
|
@@ -12024,7 +12034,7 @@ var SearchableSelectInternal = ({
|
|
|
12024
12034
|
}
|
|
12025
12035
|
);
|
|
12026
12036
|
};
|
|
12027
|
-
var SearchableSelect =
|
|
12037
|
+
var SearchableSelect = React42.forwardRef(
|
|
12028
12038
|
SearchableSelectInternal
|
|
12029
12039
|
);
|
|
12030
12040
|
function SearchableSelectContent({
|
|
@@ -12051,9 +12061,9 @@ function SearchableSelectContent({
|
|
|
12051
12061
|
onOptionClick,
|
|
12052
12062
|
onOptionHover
|
|
12053
12063
|
}) {
|
|
12054
|
-
const listRef =
|
|
12055
|
-
const lastLoadMoreOptionsLengthRef =
|
|
12056
|
-
const previousHighlightedIndexRef =
|
|
12064
|
+
const listRef = React42.useRef(null);
|
|
12065
|
+
const lastLoadMoreOptionsLengthRef = React42.useRef(null);
|
|
12066
|
+
const previousHighlightedIndexRef = React42.useRef(highlightedIndex);
|
|
12057
12067
|
const rowCount = options.length + (loading && options.length > 0 ? 1 : 0);
|
|
12058
12068
|
const virtualizer = (0, import_react_virtual.useVirtualizer)({
|
|
12059
12069
|
count: rowCount,
|
|
@@ -12064,7 +12074,7 @@ function SearchableSelectContent({
|
|
|
12064
12074
|
const virtualItems = virtualizer.getVirtualItems();
|
|
12065
12075
|
const emptyMessage = noOptionsMessage?.() ?? "No matches found";
|
|
12066
12076
|
const loadingText = loadingMessage?.() ?? "Loading...";
|
|
12067
|
-
|
|
12077
|
+
React42.useEffect(() => {
|
|
12068
12078
|
const lastItem = virtualItems[virtualItems.length - 1];
|
|
12069
12079
|
const shouldLoadMore = !!lastItem && hasNextPage && !loading && lastItem.index >= options.length - LOAD_MORE_THRESHOLD;
|
|
12070
12080
|
if (shouldLoadMore && lastLoadMoreOptionsLengthRef.current !== options.length) {
|
|
@@ -12072,7 +12082,7 @@ function SearchableSelectContent({
|
|
|
12072
12082
|
onLoadMore?.();
|
|
12073
12083
|
}
|
|
12074
12084
|
}, [hasNextPage, loading, onLoadMore, options.length, virtualItems]);
|
|
12075
|
-
|
|
12085
|
+
React42.useEffect(() => {
|
|
12076
12086
|
const hasHighlightedIndexChanged = previousHighlightedIndexRef.current !== highlightedIndex;
|
|
12077
12087
|
previousHighlightedIndexRef.current = highlightedIndex;
|
|
12078
12088
|
if (highlightedIndex >= 0 && hasHighlightedIndexChanged) {
|
|
@@ -12446,6 +12456,7 @@ function getNextEnabledIndex(options, startIndex, step) {
|
|
|
12446
12456
|
inputVariants,
|
|
12447
12457
|
isNumeric,
|
|
12448
12458
|
labelVariants,
|
|
12459
|
+
scrollToTop,
|
|
12449
12460
|
sectionTagVariants,
|
|
12450
12461
|
switchThumbVariants,
|
|
12451
12462
|
switchVariants,
|