@thebasenet/ui 0.1.5 → 0.1.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +1 -1
- package/dist/index.js +224 -101
- package/dist/index.js.map +1 -1
- package/dist/ui/index.d.ts +11 -1
- package/dist/ui/index.js +221 -98
- package/dist/ui/index.js.map +1 -1
- package/package.json +1 -1
package/dist/ui/index.d.ts
CHANGED
|
@@ -79,6 +79,16 @@ declare function Calendar({ className, classNames, showOutsideDays, captionLayou
|
|
|
79
79
|
}): react_jsx_runtime.JSX.Element;
|
|
80
80
|
declare function CalendarDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>): react_jsx_runtime.JSX.Element;
|
|
81
81
|
|
|
82
|
+
interface DateTimePickerProps {
|
|
83
|
+
value?: string;
|
|
84
|
+
onChange?: (value: string) => void;
|
|
85
|
+
className?: string;
|
|
86
|
+
label?: string;
|
|
87
|
+
disabled?: boolean;
|
|
88
|
+
disablePastDates?: boolean;
|
|
89
|
+
}
|
|
90
|
+
declare const DateTimePicker: React.NamedExoticComponent<DateTimePickerProps>;
|
|
91
|
+
|
|
82
92
|
declare function Card({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
|
|
83
93
|
declare function CardHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
|
|
84
94
|
declare function CardTitle({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
|
|
@@ -299,4 +309,4 @@ declare const Body1: React__default.ForwardRefExoticComponent<BodyProps & React_
|
|
|
299
309
|
declare const Body2: React__default.ForwardRefExoticComponent<BodyProps & React__default.RefAttributes<HTMLParagraphElement>>;
|
|
300
310
|
declare const Body3: React__default.ForwardRefExoticComponent<BodyProps & React__default.RefAttributes<HTMLParagraphElement>>;
|
|
301
311
|
|
|
302
|
-
export { Alert, AlertDescription, AlertTitle, Avatar, AvatarFallback, AvatarImage, Badge, Body1, Body2, Body3, type BodyProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Heading1, Heading2, Heading3, Heading4, Heading5, Heading6, type HeadingProps, Input, Label, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PasswordInput, PasswordInput2, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, SearchInput, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Skeleton, Slider, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonGroupVariants, buttonVariants, toggleVariants, useFormField };
|
|
312
|
+
export { Alert, AlertDescription, AlertTitle, Avatar, AvatarFallback, AvatarImage, Badge, Body1, Body2, Body3, type BodyProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, DateTimePicker, type DateTimePickerProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Heading1, Heading2, Heading3, Heading4, Heading5, Heading6, type HeadingProps, Input, Label, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PasswordInput, PasswordInput2, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, SearchInput, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Skeleton, Slider, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonGroupVariants, buttonVariants, toggleVariants, useFormField };
|
package/dist/ui/index.js
CHANGED
|
@@ -4,19 +4,19 @@ import { twMerge } from 'tailwind-merge';
|
|
|
4
4
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
5
5
|
import * as AvatarPrimitive from '@radix-ui/react-avatar';
|
|
6
6
|
import { Slot } from '@radix-ui/react-slot';
|
|
7
|
-
import { EyeIcon, EyeOffIcon, ChevronDown, ChevronUp, Check,
|
|
7
|
+
import { EyeIcon, EyeOffIcon, ChevronDown, ChevronUp, Check, ChevronDownIcon, X, ChevronLeftIcon, ChevronRightIcon, ChevronRight, MoreHorizontal, CheckIcon, XIcon, SearchIcon, ChevronsUpDown, CircleIcon, MoreHorizontalIcon, Search } from 'lucide-react';
|
|
8
8
|
import * as SeparatorPrimitive from '@radix-ui/react-separator';
|
|
9
|
-
import * as
|
|
10
|
-
import
|
|
9
|
+
import * as React2 from 'react';
|
|
10
|
+
import React2__default, { forwardRef, useState } from 'react';
|
|
11
11
|
import { getDefaultClassNames, DayPicker } from 'react-day-picker';
|
|
12
|
+
import * as LabelPrimitive from '@radix-ui/react-label';
|
|
13
|
+
import * as PopoverPrimitive from '@radix-ui/react-popover';
|
|
12
14
|
import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
|
|
13
15
|
import { Command as Command$1 } from 'cmdk';
|
|
14
16
|
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
15
|
-
import * as PopoverPrimitive from '@radix-ui/react-popover';
|
|
16
17
|
import { Drawer as Drawer$1 } from 'vaul';
|
|
17
18
|
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
|
|
18
19
|
import { FormProvider, Controller, useFormContext, useFormState } from 'react-hook-form';
|
|
19
|
-
import * as LabelPrimitive from '@radix-ui/react-label';
|
|
20
20
|
import Link from 'next/link';
|
|
21
21
|
import { motion } from 'framer-motion';
|
|
22
22
|
import * as TooltipPrimitive from '@radix-ui/react-tooltip';
|
|
@@ -501,8 +501,8 @@ function CalendarDayButton({
|
|
|
501
501
|
...props
|
|
502
502
|
}) {
|
|
503
503
|
const defaultClassNames = getDefaultClassNames();
|
|
504
|
-
const ref =
|
|
505
|
-
|
|
504
|
+
const ref = React2.useRef(null);
|
|
505
|
+
React2.useEffect(() => {
|
|
506
506
|
if (modifiers.focused) ref.current?.focus();
|
|
507
507
|
}, [modifiers.focused]);
|
|
508
508
|
return /* @__PURE__ */ jsx(
|
|
@@ -525,6 +525,190 @@ function CalendarDayButton({
|
|
|
525
525
|
}
|
|
526
526
|
);
|
|
527
527
|
}
|
|
528
|
+
function Input({ className, type, ...props }) {
|
|
529
|
+
return /* @__PURE__ */ jsx(
|
|
530
|
+
"input",
|
|
531
|
+
{
|
|
532
|
+
type,
|
|
533
|
+
"data-slot": "input",
|
|
534
|
+
className: cn(
|
|
535
|
+
"file:text-foreground placeholder:text-neutral-200/70 selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-neutral-100/60 flex h-12 w-full min-w-0 rounded-md border-[1px] bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:hidden disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-base cursor-pointer font-golos",
|
|
536
|
+
"focus-visible:border-primary-600",
|
|
537
|
+
"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
538
|
+
className
|
|
539
|
+
),
|
|
540
|
+
...props
|
|
541
|
+
}
|
|
542
|
+
);
|
|
543
|
+
}
|
|
544
|
+
function Label({
|
|
545
|
+
className,
|
|
546
|
+
...props
|
|
547
|
+
}) {
|
|
548
|
+
return /* @__PURE__ */ jsx(
|
|
549
|
+
LabelPrimitive.Root,
|
|
550
|
+
{
|
|
551
|
+
"data-slot": "label",
|
|
552
|
+
className: cn(
|
|
553
|
+
"flex items-center gap-2 text-[14px] leading-none font-normal font-onest text-neutral-400 pl-1 select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
|
|
554
|
+
className
|
|
555
|
+
),
|
|
556
|
+
...props
|
|
557
|
+
}
|
|
558
|
+
);
|
|
559
|
+
}
|
|
560
|
+
function Popover({ ...props }) {
|
|
561
|
+
return /* @__PURE__ */ jsx(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
|
|
562
|
+
}
|
|
563
|
+
function PopoverTrigger({ ...props }) {
|
|
564
|
+
return /* @__PURE__ */ jsx(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
|
|
565
|
+
}
|
|
566
|
+
function PopoverContent({
|
|
567
|
+
className,
|
|
568
|
+
align = "center",
|
|
569
|
+
sideOffset = 4,
|
|
570
|
+
...props
|
|
571
|
+
}) {
|
|
572
|
+
return /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
|
|
573
|
+
PopoverPrimitive.Content,
|
|
574
|
+
{
|
|
575
|
+
"data-slot": "popover-content",
|
|
576
|
+
align,
|
|
577
|
+
sideOffset,
|
|
578
|
+
className: cn(
|
|
579
|
+
"bg-popover text-popover-foreground 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
|
|
580
|
+
className
|
|
581
|
+
),
|
|
582
|
+
...props
|
|
583
|
+
}
|
|
584
|
+
) });
|
|
585
|
+
}
|
|
586
|
+
function PopoverAnchor({ ...props }) {
|
|
587
|
+
return /* @__PURE__ */ jsx(PopoverPrimitive.Anchor, { "data-slot": "popover-anchor", ...props });
|
|
588
|
+
}
|
|
589
|
+
function parseValue(value) {
|
|
590
|
+
if (!value) return { date: void 0, time: "" };
|
|
591
|
+
const [datePart, timePart] = value.split(" ");
|
|
592
|
+
if (!datePart || !timePart)
|
|
593
|
+
return { date: void 0, time: "" };
|
|
594
|
+
const timeNoMs = timePart.split(".")[0];
|
|
595
|
+
const parsedDate = /* @__PURE__ */ new Date(`${datePart}T${timeNoMs}`);
|
|
596
|
+
if (isNaN(parsedDate.getTime()))
|
|
597
|
+
return { date: void 0, time: "" };
|
|
598
|
+
return { date: parsedDate, time: timeNoMs };
|
|
599
|
+
}
|
|
600
|
+
var DateTimePickerInner = ({
|
|
601
|
+
value,
|
|
602
|
+
onChange,
|
|
603
|
+
className,
|
|
604
|
+
label,
|
|
605
|
+
disabled,
|
|
606
|
+
disablePastDates = true
|
|
607
|
+
}) => {
|
|
608
|
+
const [open, setOpen] = React2.useState(false);
|
|
609
|
+
const [date, setDate] = React2.useState(
|
|
610
|
+
() => parseValue(value).date
|
|
611
|
+
);
|
|
612
|
+
const [time, setTime] = React2.useState(() => parseValue(value).time);
|
|
613
|
+
const suppressNotifyRef = React2.useRef(false);
|
|
614
|
+
const lastNotifiedValue = React2.useRef(null);
|
|
615
|
+
const parsed = React2.useMemo(() => parseValue(value), [value]);
|
|
616
|
+
React2.useEffect(() => {
|
|
617
|
+
const incomingDateTimeStr = parsed.date ? parsed.date.getTime() : void 0;
|
|
618
|
+
const currentDateTimeStr = date ? date.getTime() : void 0;
|
|
619
|
+
if (incomingDateTimeStr !== currentDateTimeStr) {
|
|
620
|
+
suppressNotifyRef.current = true;
|
|
621
|
+
setDate(parsed.date);
|
|
622
|
+
}
|
|
623
|
+
if (parsed.time !== time) {
|
|
624
|
+
suppressNotifyRef.current = true;
|
|
625
|
+
setTime(parsed.time);
|
|
626
|
+
}
|
|
627
|
+
}, [parsed.date?.getTime(), parsed.time]);
|
|
628
|
+
const formattedDateLabel = React2.useMemo(
|
|
629
|
+
() => date ? date.toLocaleDateString() : "Select date",
|
|
630
|
+
[date]
|
|
631
|
+
);
|
|
632
|
+
const isDateDisabled = React2.useCallback(
|
|
633
|
+
(d) => {
|
|
634
|
+
if (!disablePastDates) return false;
|
|
635
|
+
const todayStart = /* @__PURE__ */ new Date();
|
|
636
|
+
todayStart.setHours(0, 0, 0, 0);
|
|
637
|
+
return d < todayStart;
|
|
638
|
+
},
|
|
639
|
+
[disablePastDates]
|
|
640
|
+
);
|
|
641
|
+
React2.useEffect(() => {
|
|
642
|
+
if (suppressNotifyRef.current) {
|
|
643
|
+
suppressNotifyRef.current = false;
|
|
644
|
+
return;
|
|
645
|
+
}
|
|
646
|
+
if (!onChange) return;
|
|
647
|
+
if (!date || !time) return;
|
|
648
|
+
const isoString = `${date.toISOString().split("T")[0]} ${time}.000000+00`;
|
|
649
|
+
if (lastNotifiedValue.current === isoString) return;
|
|
650
|
+
lastNotifiedValue.current = isoString;
|
|
651
|
+
onChange(isoString);
|
|
652
|
+
}, [date, time, onChange]);
|
|
653
|
+
const handleDateSelect = React2.useCallback((selectedDate) => {
|
|
654
|
+
setDate(selectedDate);
|
|
655
|
+
setOpen(false);
|
|
656
|
+
}, []);
|
|
657
|
+
const handleTimeChange = React2.useCallback(
|
|
658
|
+
(e) => {
|
|
659
|
+
setTime(e.target.value);
|
|
660
|
+
},
|
|
661
|
+
[]
|
|
662
|
+
);
|
|
663
|
+
return /* @__PURE__ */ jsxs("div", { className: cn("space-y-2", className), children: [
|
|
664
|
+
label && /* @__PURE__ */ jsx(Label, { className: "text-sm font-medium", children: label }),
|
|
665
|
+
/* @__PURE__ */ jsxs("div", { className: "flex gap-2.5", children: [
|
|
666
|
+
/* @__PURE__ */ jsx("div", { className: "flex-1 flex-col gap-3", children: /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
|
|
667
|
+
/* @__PURE__ */ jsx(PopoverTrigger, { className: "w-full", asChild: true, children: /* @__PURE__ */ jsxs(
|
|
668
|
+
Button,
|
|
669
|
+
{
|
|
670
|
+
variant: "outline",
|
|
671
|
+
id: "date-picker",
|
|
672
|
+
className: cn(
|
|
673
|
+
"w-full justify-between font-normal font-onest text-[15px] border-input focus-visible:border-primary-500",
|
|
674
|
+
date ? "text-black" : "text-neutral-300"
|
|
675
|
+
),
|
|
676
|
+
disabled,
|
|
677
|
+
children: [
|
|
678
|
+
formattedDateLabel,
|
|
679
|
+
/* @__PURE__ */ jsx(ChevronDownIcon, { size: 17 })
|
|
680
|
+
]
|
|
681
|
+
}
|
|
682
|
+
) }),
|
|
683
|
+
/* @__PURE__ */ jsx(PopoverContent, { className: "w-auto overflow-hidden p-0", align: "start", children: /* @__PURE__ */ jsx(
|
|
684
|
+
Calendar,
|
|
685
|
+
{
|
|
686
|
+
mode: "single",
|
|
687
|
+
selected: date,
|
|
688
|
+
captionLayout: "dropdown",
|
|
689
|
+
onSelect: handleDateSelect,
|
|
690
|
+
disabled: isDateDisabled
|
|
691
|
+
}
|
|
692
|
+
) })
|
|
693
|
+
] }) }),
|
|
694
|
+
/* @__PURE__ */ jsx("div", { className: "flex flex-col gap-3", children: /* @__PURE__ */ jsx(
|
|
695
|
+
Input,
|
|
696
|
+
{
|
|
697
|
+
type: "time",
|
|
698
|
+
id: "time-picker",
|
|
699
|
+
step: "1",
|
|
700
|
+
value: time,
|
|
701
|
+
onChange: handleTimeChange,
|
|
702
|
+
disabled,
|
|
703
|
+
className: "bg-background appearance-none [&::-webkit-calendar-picker-indicator]:hidden [&::-webkit-calendar-picker-indicator]:appearance-none w-32"
|
|
704
|
+
}
|
|
705
|
+
) })
|
|
706
|
+
] })
|
|
707
|
+
] });
|
|
708
|
+
};
|
|
709
|
+
var DateTimePicker = React2.memo(DateTimePickerInner, (prev, next) => {
|
|
710
|
+
return prev.value === next.value && prev.disabled === next.disabled && prev.disablePastDates === next.disablePastDates && prev.label === next.label && prev.className === next.className && prev.onChange === next.onChange;
|
|
711
|
+
});
|
|
528
712
|
function Card({ className, ...props }) {
|
|
529
713
|
return /* @__PURE__ */ jsx(
|
|
530
714
|
"div",
|
|
@@ -823,35 +1007,6 @@ function CommandShortcut({
|
|
|
823
1007
|
}
|
|
824
1008
|
);
|
|
825
1009
|
}
|
|
826
|
-
function Popover({ ...props }) {
|
|
827
|
-
return /* @__PURE__ */ jsx(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
|
|
828
|
-
}
|
|
829
|
-
function PopoverTrigger({ ...props }) {
|
|
830
|
-
return /* @__PURE__ */ jsx(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
|
|
831
|
-
}
|
|
832
|
-
function PopoverContent({
|
|
833
|
-
className,
|
|
834
|
-
align = "center",
|
|
835
|
-
sideOffset = 4,
|
|
836
|
-
...props
|
|
837
|
-
}) {
|
|
838
|
-
return /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
|
|
839
|
-
PopoverPrimitive.Content,
|
|
840
|
-
{
|
|
841
|
-
"data-slot": "popover-content",
|
|
842
|
-
align,
|
|
843
|
-
sideOffset,
|
|
844
|
-
className: cn(
|
|
845
|
-
"bg-popover text-popover-foreground 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
|
|
846
|
-
className
|
|
847
|
-
),
|
|
848
|
-
...props
|
|
849
|
-
}
|
|
850
|
-
) });
|
|
851
|
-
}
|
|
852
|
-
function PopoverAnchor({ ...props }) {
|
|
853
|
-
return /* @__PURE__ */ jsx(PopoverPrimitive.Anchor, { "data-slot": "popover-anchor", ...props });
|
|
854
|
-
}
|
|
855
1010
|
function Combobox({
|
|
856
1011
|
options,
|
|
857
1012
|
value,
|
|
@@ -862,7 +1017,7 @@ function Combobox({
|
|
|
862
1017
|
disabled = false,
|
|
863
1018
|
className
|
|
864
1019
|
}) {
|
|
865
|
-
const [open, setOpen] =
|
|
1020
|
+
const [open, setOpen] = React2.useState(false);
|
|
866
1021
|
const selectedOption = options.find((option) => option.value === value);
|
|
867
1022
|
return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
|
|
868
1023
|
/* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
|
|
@@ -1151,24 +1306,8 @@ function DropdownMenuSubContent({ className, ...props }) {
|
|
|
1151
1306
|
}
|
|
1152
1307
|
);
|
|
1153
1308
|
}
|
|
1154
|
-
function Label2({
|
|
1155
|
-
className,
|
|
1156
|
-
...props
|
|
1157
|
-
}) {
|
|
1158
|
-
return /* @__PURE__ */ jsx(
|
|
1159
|
-
LabelPrimitive.Root,
|
|
1160
|
-
{
|
|
1161
|
-
"data-slot": "label",
|
|
1162
|
-
className: cn(
|
|
1163
|
-
"flex items-center gap-2 text-[14px] leading-none font-normal font-onest text-neutral-400 pl-1 select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
|
|
1164
|
-
className
|
|
1165
|
-
),
|
|
1166
|
-
...props
|
|
1167
|
-
}
|
|
1168
|
-
);
|
|
1169
|
-
}
|
|
1170
1309
|
var Form = FormProvider;
|
|
1171
|
-
var FormFieldContext =
|
|
1310
|
+
var FormFieldContext = React2.createContext(
|
|
1172
1311
|
{}
|
|
1173
1312
|
);
|
|
1174
1313
|
var FormField = ({
|
|
@@ -1177,8 +1316,8 @@ var FormField = ({
|
|
|
1177
1316
|
return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
|
|
1178
1317
|
};
|
|
1179
1318
|
var useFormField = () => {
|
|
1180
|
-
const fieldContext =
|
|
1181
|
-
const itemContext =
|
|
1319
|
+
const fieldContext = React2.useContext(FormFieldContext);
|
|
1320
|
+
const itemContext = React2.useContext(FormItemContext);
|
|
1182
1321
|
const { getFieldState } = useFormContext();
|
|
1183
1322
|
const formState = useFormState({ name: fieldContext.name });
|
|
1184
1323
|
const fieldState = getFieldState(fieldContext.name, formState);
|
|
@@ -1195,11 +1334,11 @@ var useFormField = () => {
|
|
|
1195
1334
|
...fieldState
|
|
1196
1335
|
};
|
|
1197
1336
|
};
|
|
1198
|
-
var FormItemContext =
|
|
1337
|
+
var FormItemContext = React2.createContext(
|
|
1199
1338
|
{}
|
|
1200
1339
|
);
|
|
1201
1340
|
function FormItem({ className, ...props }) {
|
|
1202
|
-
const id =
|
|
1341
|
+
const id = React2.useId();
|
|
1203
1342
|
return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx(
|
|
1204
1343
|
"div",
|
|
1205
1344
|
{
|
|
@@ -1215,7 +1354,7 @@ function FormLabel({
|
|
|
1215
1354
|
}) {
|
|
1216
1355
|
const { error, formItemId } = useFormField();
|
|
1217
1356
|
return /* @__PURE__ */ jsx(
|
|
1218
|
-
|
|
1357
|
+
Label,
|
|
1219
1358
|
{
|
|
1220
1359
|
"data-slot": "form-label",
|
|
1221
1360
|
"data-error": !!error,
|
|
@@ -1267,22 +1406,6 @@ function FormMessage({ className, ...props }) {
|
|
|
1267
1406
|
}
|
|
1268
1407
|
);
|
|
1269
1408
|
}
|
|
1270
|
-
function Input({ className, type, ...props }) {
|
|
1271
|
-
return /* @__PURE__ */ jsx(
|
|
1272
|
-
"input",
|
|
1273
|
-
{
|
|
1274
|
-
type,
|
|
1275
|
-
"data-slot": "input",
|
|
1276
|
-
className: cn(
|
|
1277
|
-
"file:text-foreground placeholder:text-neutral-200/70 selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-neutral-100/60 flex h-12 w-full min-w-0 rounded-md border-[1px] bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:hidden disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-base cursor-pointer font-golos",
|
|
1278
|
-
"focus-visible:border-primary-600",
|
|
1279
|
-
"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
1280
|
-
className
|
|
1281
|
-
),
|
|
1282
|
-
...props
|
|
1283
|
-
}
|
|
1284
|
-
);
|
|
1285
|
-
}
|
|
1286
1409
|
function Pagination({ className, ...props }) {
|
|
1287
1410
|
return /* @__PURE__ */ jsx(
|
|
1288
1411
|
"nav",
|
|
@@ -1560,7 +1683,7 @@ function TooltipContent({
|
|
|
1560
1683
|
}
|
|
1561
1684
|
) });
|
|
1562
1685
|
}
|
|
1563
|
-
var Progress =
|
|
1686
|
+
var Progress = React2.forwardRef(
|
|
1564
1687
|
({ className, value = 0, withTooltip = false, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1565
1688
|
"div",
|
|
1566
1689
|
{
|
|
@@ -1669,7 +1792,7 @@ function SearchInput({
|
|
|
1669
1792
|
var Select = SelectPrimitive.Root;
|
|
1670
1793
|
var SelectGroup = SelectPrimitive.Group;
|
|
1671
1794
|
var SelectValue = SelectPrimitive.Value;
|
|
1672
|
-
var SelectTrigger =
|
|
1795
|
+
var SelectTrigger = React2.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
1673
1796
|
SelectPrimitive.Trigger,
|
|
1674
1797
|
{
|
|
1675
1798
|
ref,
|
|
@@ -1685,7 +1808,7 @@ var SelectTrigger = React10.forwardRef(({ className, children, ...props }, ref)
|
|
|
1685
1808
|
}
|
|
1686
1809
|
));
|
|
1687
1810
|
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
|
|
1688
|
-
var SelectScrollUpButton =
|
|
1811
|
+
var SelectScrollUpButton = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1689
1812
|
SelectPrimitive.ScrollUpButton,
|
|
1690
1813
|
{
|
|
1691
1814
|
ref,
|
|
@@ -1695,7 +1818,7 @@ var SelectScrollUpButton = React10.forwardRef(({ className, ...props }, ref) =>
|
|
|
1695
1818
|
}
|
|
1696
1819
|
));
|
|
1697
1820
|
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
1698
|
-
var SelectScrollDownButton =
|
|
1821
|
+
var SelectScrollDownButton = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1699
1822
|
SelectPrimitive.ScrollDownButton,
|
|
1700
1823
|
{
|
|
1701
1824
|
ref,
|
|
@@ -1705,7 +1828,7 @@ var SelectScrollDownButton = React10.forwardRef(({ className, ...props }, ref) =
|
|
|
1705
1828
|
}
|
|
1706
1829
|
));
|
|
1707
1830
|
SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
|
|
1708
|
-
var SelectContent =
|
|
1831
|
+
var SelectContent = React2.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
|
|
1709
1832
|
SelectPrimitive.Content,
|
|
1710
1833
|
{
|
|
1711
1834
|
ref,
|
|
@@ -1730,9 +1853,9 @@ var SelectContent = React10.forwardRef(({ className, children, position = "poppe
|
|
|
1730
1853
|
}
|
|
1731
1854
|
) }));
|
|
1732
1855
|
SelectContent.displayName = SelectPrimitive.Content.displayName;
|
|
1733
|
-
var SelectLabel =
|
|
1856
|
+
var SelectLabel = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Label, { ref, className: cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className), ...props }));
|
|
1734
1857
|
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
|
1735
|
-
var SelectItem =
|
|
1858
|
+
var SelectItem = React2.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
1736
1859
|
SelectPrimitive.Item,
|
|
1737
1860
|
{
|
|
1738
1861
|
ref,
|
|
@@ -1748,7 +1871,7 @@ var SelectItem = React10.forwardRef(({ className, children, ...props }, ref) =>
|
|
|
1748
1871
|
}
|
|
1749
1872
|
));
|
|
1750
1873
|
SelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
1751
|
-
var SelectSeparator =
|
|
1874
|
+
var SelectSeparator = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Separator, { ref, className: cn("-mx-1 my-1 h-px bg-muted", className), ...props }));
|
|
1752
1875
|
SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
|
|
1753
1876
|
function Sheet({ ...props }) {
|
|
1754
1877
|
return /* @__PURE__ */ jsx(DialogPrimitive.Root, { "data-slot": "sheet", ...props });
|
|
@@ -1829,7 +1952,7 @@ function Skeleton({ className, ...props }) {
|
|
|
1829
1952
|
}
|
|
1830
1953
|
);
|
|
1831
1954
|
}
|
|
1832
|
-
var Slider =
|
|
1955
|
+
var Slider = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
1833
1956
|
SliderPrimitive.Root,
|
|
1834
1957
|
{
|
|
1835
1958
|
ref,
|
|
@@ -1858,7 +1981,7 @@ var Toaster = ({ ...props }) => {
|
|
|
1858
1981
|
}
|
|
1859
1982
|
);
|
|
1860
1983
|
};
|
|
1861
|
-
var Switch =
|
|
1984
|
+
var Switch = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1862
1985
|
SwitchPrimitives.Root,
|
|
1863
1986
|
{
|
|
1864
1987
|
className: cn(
|
|
@@ -1907,7 +2030,7 @@ function TabsTrigger({ className, ...props }) {
|
|
|
1907
2030
|
function TabsContent({ className, ...props }) {
|
|
1908
2031
|
return /* @__PURE__ */ jsx(TabsPrimitive.Content, { "data-slot": "tabs-content", className: cn("flex-1 outline-none", className), ...props });
|
|
1909
2032
|
}
|
|
1910
|
-
var Textarea =
|
|
2033
|
+
var Textarea = React2.forwardRef(({ className, ...props }, ref) => {
|
|
1911
2034
|
return /* @__PURE__ */ jsx(
|
|
1912
2035
|
"textarea",
|
|
1913
2036
|
{
|
|
@@ -1956,7 +2079,7 @@ function Toggle({
|
|
|
1956
2079
|
}
|
|
1957
2080
|
);
|
|
1958
2081
|
}
|
|
1959
|
-
var ToggleGroupContext =
|
|
2082
|
+
var ToggleGroupContext = React2.createContext({
|
|
1960
2083
|
size: "default",
|
|
1961
2084
|
variant: "default",
|
|
1962
2085
|
spacing: 0
|
|
@@ -1993,7 +2116,7 @@ function ToggleGroupItem({
|
|
|
1993
2116
|
size,
|
|
1994
2117
|
...props
|
|
1995
2118
|
}) {
|
|
1996
|
-
const context =
|
|
2119
|
+
const context = React2.useContext(ToggleGroupContext);
|
|
1997
2120
|
return /* @__PURE__ */ jsx(
|
|
1998
2121
|
ToggleGroupPrimitive.Item,
|
|
1999
2122
|
{
|
|
@@ -2015,43 +2138,43 @@ function ToggleGroupItem({
|
|
|
2015
2138
|
}
|
|
2016
2139
|
);
|
|
2017
2140
|
}
|
|
2018
|
-
var Heading1 =
|
|
2141
|
+
var Heading1 = React2__default.forwardRef(
|
|
2019
2142
|
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("h1", { className: cn("text-3xl font-[700] font-onest text-black dark:text-white", className), ref, ...props, children })
|
|
2020
2143
|
);
|
|
2021
2144
|
Heading1.displayName = "Heading1";
|
|
2022
|
-
var Heading2 =
|
|
2145
|
+
var Heading2 = React2__default.forwardRef(
|
|
2023
2146
|
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("h2", { className: cn("text-[26px] font-[600] font-onest text-black dark:text-neutral-100", className), ref, ...props, children })
|
|
2024
2147
|
);
|
|
2025
2148
|
Heading2.displayName = "Heading2";
|
|
2026
|
-
var Heading3 =
|
|
2149
|
+
var Heading3 = React2__default.forwardRef(
|
|
2027
2150
|
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("h3", { className: cn("text-2xl font-semibold font-onest text-neutral-900 dark:text-neutral-200", className), ref, ...props, children })
|
|
2028
2151
|
);
|
|
2029
2152
|
Heading3.displayName = "Heading3";
|
|
2030
|
-
var Heading4 =
|
|
2153
|
+
var Heading4 = React2__default.forwardRef(
|
|
2031
2154
|
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("h4", { className: cn("text-[22px] font-semibold text-neutral-800 dark:text-neutral-200", className), ref, ...props, children })
|
|
2032
2155
|
);
|
|
2033
2156
|
Heading4.displayName = "Heading4";
|
|
2034
|
-
var Heading5 =
|
|
2157
|
+
var Heading5 = React2__default.forwardRef(
|
|
2035
2158
|
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("h5", { className: cn("text-lg font-semibold text-black dark:text-neutral-300", className), ref, ...props, children })
|
|
2036
2159
|
);
|
|
2037
2160
|
Heading5.displayName = "Heading5";
|
|
2038
|
-
var Heading6 =
|
|
2161
|
+
var Heading6 = React2__default.forwardRef(
|
|
2039
2162
|
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("h6", { className: cn("text-base font-[500] text-black dark:text-neutral-300", className), ref, ...props, children })
|
|
2040
2163
|
);
|
|
2041
2164
|
Heading6.displayName = "Heading6";
|
|
2042
|
-
var Body1 =
|
|
2165
|
+
var Body1 = React2__default.forwardRef(
|
|
2043
2166
|
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("p", { className: cn("text-[18px] text-neutral-700 dark:text-neutral-400 font-golos", className), ref, ...props, children })
|
|
2044
2167
|
);
|
|
2045
2168
|
Body1.displayName = "Body1";
|
|
2046
|
-
var Body2 =
|
|
2169
|
+
var Body2 = React2__default.forwardRef(
|
|
2047
2170
|
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("p", { className: cn("text-base text-neutral-700 dark:text-neutral-400 font-golos", className), ref, ...props, children })
|
|
2048
2171
|
);
|
|
2049
2172
|
Body2.displayName = "Body2";
|
|
2050
|
-
var Body3 =
|
|
2173
|
+
var Body3 = React2__default.forwardRef(
|
|
2051
2174
|
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("p", { className: cn("text-sm lg:leading-[22px] text-neutral-600 dark:text-neutral-400 font-golos", className), ref, ...props, children })
|
|
2052
2175
|
);
|
|
2053
2176
|
Body3.displayName = "Body3";
|
|
2054
2177
|
|
|
2055
|
-
export { Alert, AlertDescription, AlertTitle, Avatar, AvatarFallback, AvatarImage, Badge, Body1, Body2, Body3, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Heading1, Heading2, Heading3, Heading4, Heading5, Heading6, Input,
|
|
2178
|
+
export { Alert, AlertDescription, AlertTitle, Avatar, AvatarFallback, AvatarImage, Badge, Body1, Body2, Body3, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, DateTimePicker, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Heading1, Heading2, Heading3, Heading4, Heading5, Heading6, Input, Label, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PasswordInput, PasswordInput2, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup2 as RadioGroup, RadioGroupItem, SearchInput, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Skeleton, Slider, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonGroupVariants, buttonVariants, toggleVariants, useFormField };
|
|
2056
2179
|
//# sourceMappingURL=index.js.map
|
|
2057
2180
|
//# sourceMappingURL=index.js.map
|