@ikatec/nebula-react 1.0.23 → 1.0.25

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.mts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
2
2
  import * as React$1 from 'react';
3
- import React__default, { ComponentProps, PropsWithChildren, HTMLAttributes, ReactNode } from 'react';
3
+ import React__default, { ComponentProps, PropsWithChildren, HTMLAttributes, ReactNode, DragEvent, ChangeEvent, InputHTMLAttributes, MutableRefObject } from 'react';
4
4
  import { VariantProps } from 'class-variance-authority';
5
5
  import * as PopoverPrimitive from '@radix-ui/react-popover';
6
6
  import * as LabelPrimitive from '@radix-ui/react-label';
@@ -589,26 +589,25 @@ interface InputDatePickerSingleProps extends Omit<InputTextProps, 'onChange' | '
589
589
  value?: string;
590
590
  onChange?: (value?: string, calendarDate?: Date) => void;
591
591
  numberOfMonths?: CalendarProps['numberOfMonths'];
592
- portal?: PopoverContentProps['portal'];
593
592
  placeholder?: string;
594
593
  className?: string;
595
594
  disabledDates?: CalendarProps['disabled'];
596
595
  onClean?: VoidFunction;
596
+ popoverContainer?: HTMLElement | null;
597
597
  }
598
598
  declare const dateIsAvailable: (inputDate?: Date | null, disabledDates?: InputDatePickerSingleProps["disabledDates"]) => boolean;
599
- declare const InputDatePickerSingle: ({ portal, placeholder, className, value, onChange, numberOfMonths, onClean, disabledDates, ...rest }: InputDatePickerSingleProps) => react_jsx_runtime.JSX.Element;
599
+ declare const InputDatePickerSingle: ({ placeholder, className, value, onChange, numberOfMonths, onClean, disabledDates, ...rest }: InputDatePickerSingleProps) => react_jsx_runtime.JSX.Element;
600
600
 
601
601
  interface InputDateTimePickerSingleProps extends Omit<InputTextProps, 'onChange' | 'value'> {
602
602
  value?: string;
603
603
  onChange?: (value?: string, calendarDate?: Date, inputTimeValue?: string) => void;
604
604
  numberOfMonths?: CalendarProps['numberOfMonths'];
605
- portal?: PopoverContentProps['portal'];
606
605
  placeholder?: string;
607
606
  className?: string;
608
607
  disabledDates?: CalendarProps['disabled'];
609
608
  onClean?: VoidFunction;
610
609
  }
611
- declare const InputDateTimePickerSingle: ({ portal, placeholder, className, value, onChange, numberOfMonths, onClean, disabledDates, ...rest }: InputDateTimePickerSingleProps) => react_jsx_runtime.JSX.Element;
610
+ declare const InputDateTimePickerSingle: ({ placeholder, className, value, onChange, numberOfMonths, onClean, disabledDates, ...rest }: InputDateTimePickerSingleProps) => react_jsx_runtime.JSX.Element;
612
611
 
613
612
  type InputTimeProps = Omit<React.ComponentProps<typeof InputText>, 'onChange'> & {
614
613
  onChange?: (value: string) => void;
@@ -641,6 +640,30 @@ declare enum FileUploadError {
641
640
  MAXIMUM_FILE_SIZE_EXCEEDED = "MAXIMUM_FILE_SIZE_EXCEEDED",
642
641
  INVALID_FORMAT = "INVALID_FORMAT"
643
642
  }
643
+ type FileUploadState = {
644
+ files: FileWithPreview[];
645
+ isDragging: boolean;
646
+ errors: {
647
+ file?: File | FileMetadata;
648
+ error: FileUploadError;
649
+ }[];
650
+ };
651
+ type FileUploadActions = {
652
+ addFiles: (files: FileList | File[]) => void;
653
+ removeFile: (id: string) => void;
654
+ clearFiles: () => void;
655
+ clearErrors: () => void;
656
+ handleDragEnter: (e: DragEvent<HTMLElement>) => void;
657
+ handleDragLeave: (e: DragEvent<HTMLElement>) => void;
658
+ handleDragOver: (e: DragEvent<HTMLElement>) => void;
659
+ handleDrop: (e: DragEvent<HTMLElement>) => void;
660
+ handleFileChange: (e: ChangeEvent<HTMLInputElement>) => void;
661
+ openFileDialog: () => void;
662
+ getInputProps: (props?: InputHTMLAttributes<HTMLInputElement>) => InputHTMLAttributes<HTMLInputElement> & {
663
+ ref: React__default.Ref<HTMLInputElement>;
664
+ };
665
+ };
666
+ declare const useFileUpload: (options?: FileUploadOptions) => [FileUploadState, FileUploadActions];
644
667
  declare const formatBytes: (bytes: number, decimals?: number) => string;
645
668
 
646
669
  interface FileUploadProps extends Omit<FileUploadOptions, 'maxSize'> {
@@ -744,4 +767,9 @@ declare const NebulaI18nProvider: ({ children, customI18nStorageKey, }: NebulaI1
744
767
  */
745
768
  declare const useNebulaI18n: () => NebulaI18nContextType;
746
769
 
747
- export { Accordion, AccordionContent, AccordionDescription, AccordionItem, type AccordionProps, AccordionTitle, AccordionTrigger, ActionBar, ActionBarButton, ActionBarClose, ActionBarContent, ActionBarDivider, ActionBarPortal, ActionBarTrigger, Alert, AlertButton, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AlertTitle, StyledAsync as Async, StyledAsyncCreatable as AsyncCreatable, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonProps, Calendar, type CalendarProps, Caption, type CaptionProps, Checkbox, type CheckboxProps, StyledCreatable as Creatable, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, type FileMetadata, FileUpload, FileUploadError, type FileUploadOptions, type FileWithPreview, Heading, type HeadingProps, InputDatePickerSingle, type InputDatePickerSingleProps, InputDateTimePickerSingle, type InputDateTimePickerSingleProps, InputPhone, InputText, type InputTextProps, InputTime, type InputTimeProps, Label, Link, type LinkProps, NebulaI18nProvider, type NebulaI18nProviderProps, Pagination, type PaginationProps, Paragraph, type ParagraphProps, Popover, PopoverContent, type PopoverContentProps, PopoverTrigger, StyledSelect as Select, type CreateStyledSelectProps as SelectProps, Separator, type SeparatorProps, Skeleton, type SkeletonProps, Space, SpaceDirectionEnum, type SpaceProps, SpaceSizeEnum, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, type TagProps, TextArea, type TextAreaProps, Toaster, Tooltip, type TooltipProps, alertVariants, badgeSizeEnum, badgeVariantEnum, buttonSizeEnum, buttonVariantEnum, buttonVariantsConfig, dateIsAvailable, formatBytes, getNebulaLanguage, localeByi18nKey, messages, separatorVariants, setNebulaLanguage, tagVariantsEnum, tailwind, toast, useNebulaI18n };
770
+ type PossibleRefs<T extends HTMLElement> = MutableRefObject<T | undefined | null> | MutableRefObject<T | undefined | null>[];
771
+ declare function useClickOutside<T extends HTMLElement>(refs: PossibleRefs<T>, onClickOutside: VoidFunction): void;
772
+
773
+ declare function useKeyPress(key: string, callback: VoidFunction): void;
774
+
775
+ export { Accordion, AccordionContent, AccordionDescription, AccordionItem, type AccordionProps, AccordionTitle, AccordionTrigger, ActionBar, ActionBarButton, ActionBarClose, ActionBarContent, ActionBarDivider, ActionBarPortal, ActionBarTrigger, Alert, AlertButton, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AlertTitle, StyledAsync as Async, StyledAsyncCreatable as AsyncCreatable, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonProps, Calendar, type CalendarProps, Caption, type CaptionProps, Checkbox, type CheckboxProps, StyledCreatable as Creatable, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, type FileMetadata, FileUpload, type FileUploadActions, FileUploadError, type FileUploadOptions, type FileUploadState, type FileWithPreview, Heading, type HeadingProps, InputDatePickerSingle, type InputDatePickerSingleProps, InputDateTimePickerSingle, type InputDateTimePickerSingleProps, InputPhone, InputText, type InputTextProps, InputTime, type InputTimeProps, Label, Link, type LinkProps, NebulaI18nProvider, type NebulaI18nProviderProps, Pagination, type PaginationProps, Paragraph, type ParagraphProps, Popover, PopoverContent, type PopoverContentProps, PopoverTrigger, StyledSelect as Select, type CreateStyledSelectProps as SelectProps, Separator, type SeparatorProps, Skeleton, type SkeletonProps, Space, SpaceDirectionEnum, type SpaceProps, SpaceSizeEnum, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, type TagProps, TextArea, type TextAreaProps, Toaster, Tooltip, type TooltipProps, alertVariants, badgeSizeEnum, badgeVariantEnum, buttonSizeEnum, buttonVariantEnum, buttonVariantsConfig, dateIsAvailable, formatBytes, getNebulaLanguage, localeByi18nKey, messages, separatorVariants, setNebulaLanguage, tagVariantsEnum, tailwind, toast, useClickOutside, useFileUpload, useKeyPress, useNebulaI18n };
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
2
2
  import * as React$1 from 'react';
3
- import React__default, { ComponentProps, PropsWithChildren, HTMLAttributes, ReactNode } from 'react';
3
+ import React__default, { ComponentProps, PropsWithChildren, HTMLAttributes, ReactNode, DragEvent, ChangeEvent, InputHTMLAttributes, MutableRefObject } from 'react';
4
4
  import { VariantProps } from 'class-variance-authority';
5
5
  import * as PopoverPrimitive from '@radix-ui/react-popover';
6
6
  import * as LabelPrimitive from '@radix-ui/react-label';
@@ -589,26 +589,25 @@ interface InputDatePickerSingleProps extends Omit<InputTextProps, 'onChange' | '
589
589
  value?: string;
590
590
  onChange?: (value?: string, calendarDate?: Date) => void;
591
591
  numberOfMonths?: CalendarProps['numberOfMonths'];
592
- portal?: PopoverContentProps['portal'];
593
592
  placeholder?: string;
594
593
  className?: string;
595
594
  disabledDates?: CalendarProps['disabled'];
596
595
  onClean?: VoidFunction;
596
+ popoverContainer?: HTMLElement | null;
597
597
  }
598
598
  declare const dateIsAvailable: (inputDate?: Date | null, disabledDates?: InputDatePickerSingleProps["disabledDates"]) => boolean;
599
- declare const InputDatePickerSingle: ({ portal, placeholder, className, value, onChange, numberOfMonths, onClean, disabledDates, ...rest }: InputDatePickerSingleProps) => react_jsx_runtime.JSX.Element;
599
+ declare const InputDatePickerSingle: ({ placeholder, className, value, onChange, numberOfMonths, onClean, disabledDates, ...rest }: InputDatePickerSingleProps) => react_jsx_runtime.JSX.Element;
600
600
 
601
601
  interface InputDateTimePickerSingleProps extends Omit<InputTextProps, 'onChange' | 'value'> {
602
602
  value?: string;
603
603
  onChange?: (value?: string, calendarDate?: Date, inputTimeValue?: string) => void;
604
604
  numberOfMonths?: CalendarProps['numberOfMonths'];
605
- portal?: PopoverContentProps['portal'];
606
605
  placeholder?: string;
607
606
  className?: string;
608
607
  disabledDates?: CalendarProps['disabled'];
609
608
  onClean?: VoidFunction;
610
609
  }
611
- declare const InputDateTimePickerSingle: ({ portal, placeholder, className, value, onChange, numberOfMonths, onClean, disabledDates, ...rest }: InputDateTimePickerSingleProps) => react_jsx_runtime.JSX.Element;
610
+ declare const InputDateTimePickerSingle: ({ placeholder, className, value, onChange, numberOfMonths, onClean, disabledDates, ...rest }: InputDateTimePickerSingleProps) => react_jsx_runtime.JSX.Element;
612
611
 
613
612
  type InputTimeProps = Omit<React.ComponentProps<typeof InputText>, 'onChange'> & {
614
613
  onChange?: (value: string) => void;
@@ -641,6 +640,30 @@ declare enum FileUploadError {
641
640
  MAXIMUM_FILE_SIZE_EXCEEDED = "MAXIMUM_FILE_SIZE_EXCEEDED",
642
641
  INVALID_FORMAT = "INVALID_FORMAT"
643
642
  }
643
+ type FileUploadState = {
644
+ files: FileWithPreview[];
645
+ isDragging: boolean;
646
+ errors: {
647
+ file?: File | FileMetadata;
648
+ error: FileUploadError;
649
+ }[];
650
+ };
651
+ type FileUploadActions = {
652
+ addFiles: (files: FileList | File[]) => void;
653
+ removeFile: (id: string) => void;
654
+ clearFiles: () => void;
655
+ clearErrors: () => void;
656
+ handleDragEnter: (e: DragEvent<HTMLElement>) => void;
657
+ handleDragLeave: (e: DragEvent<HTMLElement>) => void;
658
+ handleDragOver: (e: DragEvent<HTMLElement>) => void;
659
+ handleDrop: (e: DragEvent<HTMLElement>) => void;
660
+ handleFileChange: (e: ChangeEvent<HTMLInputElement>) => void;
661
+ openFileDialog: () => void;
662
+ getInputProps: (props?: InputHTMLAttributes<HTMLInputElement>) => InputHTMLAttributes<HTMLInputElement> & {
663
+ ref: React__default.Ref<HTMLInputElement>;
664
+ };
665
+ };
666
+ declare const useFileUpload: (options?: FileUploadOptions) => [FileUploadState, FileUploadActions];
644
667
  declare const formatBytes: (bytes: number, decimals?: number) => string;
645
668
 
646
669
  interface FileUploadProps extends Omit<FileUploadOptions, 'maxSize'> {
@@ -744,4 +767,9 @@ declare const NebulaI18nProvider: ({ children, customI18nStorageKey, }: NebulaI1
744
767
  */
745
768
  declare const useNebulaI18n: () => NebulaI18nContextType;
746
769
 
747
- export { Accordion, AccordionContent, AccordionDescription, AccordionItem, type AccordionProps, AccordionTitle, AccordionTrigger, ActionBar, ActionBarButton, ActionBarClose, ActionBarContent, ActionBarDivider, ActionBarPortal, ActionBarTrigger, Alert, AlertButton, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AlertTitle, StyledAsync as Async, StyledAsyncCreatable as AsyncCreatable, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonProps, Calendar, type CalendarProps, Caption, type CaptionProps, Checkbox, type CheckboxProps, StyledCreatable as Creatable, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, type FileMetadata, FileUpload, FileUploadError, type FileUploadOptions, type FileWithPreview, Heading, type HeadingProps, InputDatePickerSingle, type InputDatePickerSingleProps, InputDateTimePickerSingle, type InputDateTimePickerSingleProps, InputPhone, InputText, type InputTextProps, InputTime, type InputTimeProps, Label, Link, type LinkProps, NebulaI18nProvider, type NebulaI18nProviderProps, Pagination, type PaginationProps, Paragraph, type ParagraphProps, Popover, PopoverContent, type PopoverContentProps, PopoverTrigger, StyledSelect as Select, type CreateStyledSelectProps as SelectProps, Separator, type SeparatorProps, Skeleton, type SkeletonProps, Space, SpaceDirectionEnum, type SpaceProps, SpaceSizeEnum, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, type TagProps, TextArea, type TextAreaProps, Toaster, Tooltip, type TooltipProps, alertVariants, badgeSizeEnum, badgeVariantEnum, buttonSizeEnum, buttonVariantEnum, buttonVariantsConfig, dateIsAvailable, formatBytes, getNebulaLanguage, localeByi18nKey, messages, separatorVariants, setNebulaLanguage, tagVariantsEnum, tailwind, toast, useNebulaI18n };
770
+ type PossibleRefs<T extends HTMLElement> = MutableRefObject<T | undefined | null> | MutableRefObject<T | undefined | null>[];
771
+ declare function useClickOutside<T extends HTMLElement>(refs: PossibleRefs<T>, onClickOutside: VoidFunction): void;
772
+
773
+ declare function useKeyPress(key: string, callback: VoidFunction): void;
774
+
775
+ export { Accordion, AccordionContent, AccordionDescription, AccordionItem, type AccordionProps, AccordionTitle, AccordionTrigger, ActionBar, ActionBarButton, ActionBarClose, ActionBarContent, ActionBarDivider, ActionBarPortal, ActionBarTrigger, Alert, AlertButton, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AlertTitle, StyledAsync as Async, StyledAsyncCreatable as AsyncCreatable, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonProps, Calendar, type CalendarProps, Caption, type CaptionProps, Checkbox, type CheckboxProps, StyledCreatable as Creatable, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, type FileMetadata, FileUpload, type FileUploadActions, FileUploadError, type FileUploadOptions, type FileUploadState, type FileWithPreview, Heading, type HeadingProps, InputDatePickerSingle, type InputDatePickerSingleProps, InputDateTimePickerSingle, type InputDateTimePickerSingleProps, InputPhone, InputText, type InputTextProps, InputTime, type InputTimeProps, Label, Link, type LinkProps, NebulaI18nProvider, type NebulaI18nProviderProps, Pagination, type PaginationProps, Paragraph, type ParagraphProps, Popover, PopoverContent, type PopoverContentProps, PopoverTrigger, StyledSelect as Select, type CreateStyledSelectProps as SelectProps, Separator, type SeparatorProps, Skeleton, type SkeletonProps, Space, SpaceDirectionEnum, type SpaceProps, SpaceSizeEnum, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, type TagProps, TextArea, type TextAreaProps, Toaster, Tooltip, type TooltipProps, alertVariants, badgeSizeEnum, badgeVariantEnum, buttonSizeEnum, buttonVariantEnum, buttonVariantsConfig, dateIsAvailable, formatBytes, getNebulaLanguage, localeByi18nKey, messages, separatorVariants, setNebulaLanguage, tagVariantsEnum, tailwind, toast, useClickOutside, useFileUpload, useKeyPress, useNebulaI18n };
package/dist/index.js CHANGED
@@ -3906,13 +3906,44 @@ var Calendar = ({
3906
3906
  }
3907
3907
  );
3908
3908
  };
3909
-
3910
- // src/utils/valid-date-format.ts
3911
- function dateFormatIsValid(dateStr, locale) {
3912
- const regexBR = /^(?:(?:31\/(0[13578]|1[02]))\/(?:\d{4})|(?:29|30)\/(0[13-9]|1[0-2])\/(?:\d{4})|29\/02\/(?:\d\d(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)|(?:0[1-9]|1\d|2[0-8])\/(0[1-9]|1[0-2])\/(?:\d{4}))$/;
3913
- const regexUS = /^(?:(?:(0[13578]|1[02])\/31)\/(?:\d{4})|(?:(0[13-9]|1[0-2])\/(29|30))\/(?:\d{4})|(?:02\/29)\/(?:\d\d(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)|(?:(0[1-9]|1[0-2])\/(0[1-9]|1\d|2[0-8]))\/(?:\d{4}))$/;
3914
- const regex = locale === "en-US" ? regexUS : regexBR;
3915
- return regex.test(dateStr);
3909
+ function useClickOutside(refs, onClickOutside) {
3910
+ React8.useEffect(() => {
3911
+ const refArray = Array.isArray(refs) ? refs : [refs];
3912
+ function handleClick(event) {
3913
+ const isInside = refArray.some(
3914
+ (ref) => ref?.current && ref?.current.contains(event.target)
3915
+ );
3916
+ if (!isInside) {
3917
+ onClickOutside();
3918
+ }
3919
+ }
3920
+ function handlePressEsc(event) {
3921
+ if (event.key === "Esc") {
3922
+ onClickOutside();
3923
+ }
3924
+ }
3925
+ document.addEventListener("mousedown", handleClick);
3926
+ document.addEventListener("touchstart", handleClick);
3927
+ document.addEventListener("keypress", handlePressEsc);
3928
+ return () => {
3929
+ document.removeEventListener("mousedown", handleClick);
3930
+ document.removeEventListener("touchstart", handleClick);
3931
+ document.removeEventListener("keypress", handlePressEsc);
3932
+ };
3933
+ }, [refs, onClickOutside]);
3934
+ }
3935
+ function useKeyPress(key, callback) {
3936
+ React8.useEffect(() => {
3937
+ function handleKeyDown(event) {
3938
+ if (event.key === key) {
3939
+ callback();
3940
+ }
3941
+ }
3942
+ window.addEventListener("keydown", handleKeyDown);
3943
+ return () => {
3944
+ window.removeEventListener("keydown", handleKeyDown);
3945
+ };
3946
+ }, [key, callback]);
3916
3947
  }
3917
3948
  var formatDateToSubmit = (dateStr, timeFallback = "23:59") => {
3918
3949
  try {
@@ -3933,6 +3964,14 @@ var formatDateToSubmit = (dateStr, timeFallback = "23:59") => {
3933
3964
  return void 0;
3934
3965
  }
3935
3966
  };
3967
+
3968
+ // src/utils/valid-date-format.ts
3969
+ function dateFormatIsValid(dateStr, locale) {
3970
+ const regexBR = /^(?:(?:31\/(0[13578]|1[02]))\/(?:\d{4})|(?:29|30)\/(0[13-9]|1[0-2])\/(?:\d{4})|29\/02\/(?:\d\d(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)|(?:0[1-9]|1\d|2[0-8])\/(0[1-9]|1[0-2])\/(?:\d{4}))$/;
3971
+ const regexUS = /^(?:(?:(0[13578]|1[02])\/31)\/(?:\d{4})|(?:(0[13-9]|1[0-2])\/(29|30))\/(?:\d{4})|(?:02\/29)\/(?:\d\d(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)|(?:(0[1-9]|1[0-2])\/(0[1-9]|1\d|2[0-8]))\/(?:\d{4}))$/;
3972
+ const regex = locale === "en-US" ? regexUS : regexBR;
3973
+ return regex.test(dateStr);
3974
+ }
3936
3975
  var dateIsAvailable = (inputDate, disabledDates) => {
3937
3976
  if (!disabledDates || !inputDate) return true;
3938
3977
  const dateIsDisabled = (d, matcher) => {
@@ -3980,7 +4019,6 @@ var dateIsAvailable = (inputDate, disabledDates) => {
3980
4019
  return !dateIsDisabled(inputDate, disabledDates);
3981
4020
  };
3982
4021
  var InputDatePickerSingle = ({
3983
- portal,
3984
4022
  placeholder,
3985
4023
  className,
3986
4024
  value,
@@ -4058,58 +4096,57 @@ var InputDatePickerSingle = ({
4058
4096
  replacement: { _: /\d/ }
4059
4097
  };
4060
4098
  const inputRef = mask.useMask(maskOptions);
4061
- return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open: popoverIsOpen, onOpenChange: setPopoverIsOpen, children: [
4062
- /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { className, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
4063
- "div",
4099
+ const conteinerRef = React8.useRef(null);
4100
+ const calendarRef = React8.useRef(null);
4101
+ useClickOutside([conteinerRef, calendarRef], () => {
4102
+ setPopoverIsOpen(false);
4103
+ });
4104
+ useKeyPress("Escape", () => {
4105
+ setPopoverIsOpen(false);
4106
+ });
4107
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "nebula-ds w-full", ref: conteinerRef, children: [
4108
+ /* @__PURE__ */ jsxRuntime.jsx(
4109
+ InputText,
4064
4110
  {
4065
- onClick: (e) => e.preventDefault(),
4066
- onFocus: (e) => e.preventDefault(),
4067
- children: /* @__PURE__ */ jsxRuntime.jsx(
4068
- InputText,
4111
+ ref: inputRef,
4112
+ placeholder,
4113
+ value,
4114
+ className,
4115
+ onChange: (e) => handleInnerInputChange(e.target.value),
4116
+ onKeyDown: handleKeyDown,
4117
+ icon: /* @__PURE__ */ jsxRuntime.jsx(
4118
+ lucideReact.CalendarIcon,
4069
4119
  {
4070
- ref: inputRef,
4071
- placeholder,
4072
- value,
4073
- className,
4074
- onChange: (e) => handleInnerInputChange(e.target.value),
4075
- onKeyDown: handleKeyDown,
4076
- icon: /* @__PURE__ */ jsxRuntime.jsx(
4077
- lucideReact.CalendarIcon,
4078
- {
4079
- tabIndex: 0,
4080
- role: "button",
4081
- onClick: () => setPopoverIsOpen((s) => !s),
4082
- onKeyUp: (e) => {
4083
- if (e.key === "Enter") {
4084
- setPopoverIsOpen((s) => !s);
4085
- }
4086
- },
4087
- className: "nebula-ds cursor-pointer"
4088
- }
4089
- ),
4090
- iconPlacement: "end",
4120
+ tabIndex: 0,
4121
+ role: "button",
4122
+ onClick: () => setPopoverIsOpen((s) => !s),
4091
4123
  onKeyUp: (e) => {
4092
- if (e.key === "ArrowDown") {
4093
- setPopoverIsOpen(true);
4124
+ if (e.key === "Enter") {
4125
+ setPopoverIsOpen((s) => !s);
4094
4126
  }
4095
4127
  },
4096
- maxLength: 10,
4097
- onClean: onClean ? () => {
4098
- onClean();
4099
- handleClearValue();
4100
- } : void 0,
4101
- ...rest
4128
+ className: "nebula-ds cursor-pointer"
4102
4129
  }
4103
- )
4130
+ ),
4131
+ iconPlacement: "end",
4132
+ onKeyUp: (e) => {
4133
+ if (e.key === "ArrowDown") {
4134
+ setPopoverIsOpen(true);
4135
+ }
4136
+ },
4137
+ maxLength: 10,
4138
+ onClean: onClean ? () => {
4139
+ onClean();
4140
+ handleClearValue();
4141
+ } : void 0,
4142
+ ...rest
4104
4143
  }
4105
- ) }),
4106
- /* @__PURE__ */ jsxRuntime.jsx(
4107
- PopoverContent,
4144
+ ),
4145
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nebula-ds relative", children: popoverIsOpen && /* @__PURE__ */ jsxRuntime.jsx(
4146
+ "div",
4108
4147
  {
4109
- portal,
4110
- side: "bottom",
4111
- className: "nebula-ds p-0 border-none bg-transparent shadow-none",
4112
- align: "start",
4148
+ className: "nebula-ds absolute top-full left-0-0 z-40 pb-2 pt-1",
4149
+ ref: calendarRef,
4113
4150
  children: /* @__PURE__ */ jsxRuntime.jsx(
4114
4151
  Calendar,
4115
4152
  {
@@ -4125,7 +4162,7 @@ var InputDatePickerSingle = ({
4125
4162
  }
4126
4163
  )
4127
4164
  }
4128
- )
4165
+ ) })
4129
4166
  ] });
4130
4167
  };
4131
4168
  var InputTime = React8.forwardRef(
@@ -4196,7 +4233,6 @@ var InputTime = React8.forwardRef(
4196
4233
  InputTime.displayName = "InputTime";
4197
4234
  var DATA_TIME_SEPARATOR = " - ";
4198
4235
  var InputDateTimePickerSingle = ({
4199
- portal,
4200
4236
  placeholder,
4201
4237
  className,
4202
4238
  value,
@@ -4323,57 +4359,56 @@ var InputDateTimePickerSingle = ({
4323
4359
  replacement: { _: /\d/ }
4324
4360
  };
4325
4361
  const inputRef = mask.useMask(maskOptions);
4326
- return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open: popoverIsOpen, onOpenChange: setPopoverIsOpen, children: [
4327
- /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { className, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
4328
- "div",
4362
+ const conteinerRef = React8.useRef(null);
4363
+ const calendarRef = React8.useRef(null);
4364
+ useClickOutside([conteinerRef, calendarRef], () => {
4365
+ setPopoverIsOpen(false);
4366
+ });
4367
+ useKeyPress("Escape", () => {
4368
+ setPopoverIsOpen(false);
4369
+ });
4370
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "nebula-ds w-full", ref: conteinerRef, children: [
4371
+ /* @__PURE__ */ jsxRuntime.jsx(
4372
+ InputText,
4329
4373
  {
4330
- onClick: (e) => e.preventDefault(),
4331
- onFocus: (e) => e.preventDefault(),
4332
- children: /* @__PURE__ */ jsxRuntime.jsx(
4333
- InputText,
4374
+ ref: inputRef,
4375
+ placeholder,
4376
+ value,
4377
+ className,
4378
+ onChange: (e) => handleInnerInputChange(e.target.value),
4379
+ onKeyDown: handleKeyDown,
4380
+ icon: /* @__PURE__ */ jsxRuntime.jsx(
4381
+ lucideReact.CalendarIcon,
4334
4382
  {
4335
- ref: inputRef,
4336
- placeholder,
4337
- value,
4338
- className,
4339
- onChange: (e) => handleInnerInputChange(e.target.value),
4340
- onKeyDown: handleKeyDown,
4341
- icon: /* @__PURE__ */ jsxRuntime.jsx(
4342
- lucideReact.CalendarIcon,
4343
- {
4344
- tabIndex: 0,
4345
- role: "button",
4346
- onClick: () => setPopoverIsOpen((s) => !s),
4347
- onKeyUp: (e) => {
4348
- if (e.key === "Enter") {
4349
- setPopoverIsOpen((s) => !s);
4350
- }
4351
- },
4352
- className: "nebula-ds cursor-pointer"
4353
- }
4354
- ),
4355
- iconPlacement: "end",
4383
+ tabIndex: 0,
4384
+ role: "button",
4385
+ onClick: () => setPopoverIsOpen((s) => !s),
4356
4386
  onKeyUp: (e) => {
4357
- if (e.key === "ArrowDown") {
4358
- setPopoverIsOpen(true);
4387
+ if (e.key === "Enter") {
4388
+ setPopoverIsOpen((s) => !s);
4359
4389
  }
4360
4390
  },
4361
- onClean: onClean ? () => {
4362
- onClean();
4363
- handleClearValue();
4364
- } : void 0,
4365
- ...rest
4391
+ className: "nebula-ds cursor-pointer"
4366
4392
  }
4367
- )
4393
+ ),
4394
+ iconPlacement: "end",
4395
+ onKeyUp: (e) => {
4396
+ if (e.key === "ArrowDown") {
4397
+ setPopoverIsOpen(true);
4398
+ }
4399
+ },
4400
+ onClean: onClean ? () => {
4401
+ onClean();
4402
+ handleClearValue();
4403
+ } : void 0,
4404
+ ...rest
4368
4405
  }
4369
- ) }),
4370
- /* @__PURE__ */ jsxRuntime.jsx(
4371
- PopoverContent,
4406
+ ),
4407
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nebula-ds relative", children: popoverIsOpen && /* @__PURE__ */ jsxRuntime.jsx(
4408
+ "div",
4372
4409
  {
4373
- portal,
4374
- side: "bottom",
4375
- className: "nebula-ds p-0 border-none bg-transparent shadow-none",
4376
- align: "start",
4410
+ className: "nebula-ds absolute top-full left-0-0 z-40 pb-2 pt-1",
4411
+ ref: calendarRef,
4377
4412
  children: /* @__PURE__ */ jsxRuntime.jsx(
4378
4413
  Calendar,
4379
4414
  {
@@ -4405,7 +4440,7 @@ var InputDateTimePickerSingle = ({
4405
4440
  }
4406
4441
  )
4407
4442
  }
4408
- )
4443
+ ) })
4409
4444
  ] });
4410
4445
  };
4411
4446
  var FileUploadError = /* @__PURE__ */ ((FileUploadError2) => {
@@ -5065,4 +5100,7 @@ exports.setNebulaLanguage = setNebulaLanguage;
5065
5100
  exports.tagVariantsEnum = tagVariantsEnum;
5066
5101
  exports.tailwind = tailwind;
5067
5102
  exports.toast = toast;
5103
+ exports.useClickOutside = useClickOutside;
5104
+ exports.useFileUpload = useFileUpload;
5105
+ exports.useKeyPress = useKeyPress;
5068
5106
  exports.useNebulaI18n = useNebulaI18n;
package/dist/index.mjs CHANGED
@@ -3866,13 +3866,44 @@ var Calendar = ({
3866
3866
  }
3867
3867
  );
3868
3868
  };
3869
-
3870
- // src/utils/valid-date-format.ts
3871
- function dateFormatIsValid(dateStr, locale) {
3872
- const regexBR = /^(?:(?:31\/(0[13578]|1[02]))\/(?:\d{4})|(?:29|30)\/(0[13-9]|1[0-2])\/(?:\d{4})|29\/02\/(?:\d\d(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)|(?:0[1-9]|1\d|2[0-8])\/(0[1-9]|1[0-2])\/(?:\d{4}))$/;
3873
- const regexUS = /^(?:(?:(0[13578]|1[02])\/31)\/(?:\d{4})|(?:(0[13-9]|1[0-2])\/(29|30))\/(?:\d{4})|(?:02\/29)\/(?:\d\d(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)|(?:(0[1-9]|1[0-2])\/(0[1-9]|1\d|2[0-8]))\/(?:\d{4}))$/;
3874
- const regex = locale === "en-US" ? regexUS : regexBR;
3875
- return regex.test(dateStr);
3869
+ function useClickOutside(refs, onClickOutside) {
3870
+ useEffect(() => {
3871
+ const refArray = Array.isArray(refs) ? refs : [refs];
3872
+ function handleClick(event) {
3873
+ const isInside = refArray.some(
3874
+ (ref) => ref?.current && ref?.current.contains(event.target)
3875
+ );
3876
+ if (!isInside) {
3877
+ onClickOutside();
3878
+ }
3879
+ }
3880
+ function handlePressEsc(event) {
3881
+ if (event.key === "Esc") {
3882
+ onClickOutside();
3883
+ }
3884
+ }
3885
+ document.addEventListener("mousedown", handleClick);
3886
+ document.addEventListener("touchstart", handleClick);
3887
+ document.addEventListener("keypress", handlePressEsc);
3888
+ return () => {
3889
+ document.removeEventListener("mousedown", handleClick);
3890
+ document.removeEventListener("touchstart", handleClick);
3891
+ document.removeEventListener("keypress", handlePressEsc);
3892
+ };
3893
+ }, [refs, onClickOutside]);
3894
+ }
3895
+ function useKeyPress(key, callback) {
3896
+ useEffect(() => {
3897
+ function handleKeyDown(event) {
3898
+ if (event.key === key) {
3899
+ callback();
3900
+ }
3901
+ }
3902
+ window.addEventListener("keydown", handleKeyDown);
3903
+ return () => {
3904
+ window.removeEventListener("keydown", handleKeyDown);
3905
+ };
3906
+ }, [key, callback]);
3876
3907
  }
3877
3908
  var formatDateToSubmit = (dateStr, timeFallback = "23:59") => {
3878
3909
  try {
@@ -3893,6 +3924,14 @@ var formatDateToSubmit = (dateStr, timeFallback = "23:59") => {
3893
3924
  return void 0;
3894
3925
  }
3895
3926
  };
3927
+
3928
+ // src/utils/valid-date-format.ts
3929
+ function dateFormatIsValid(dateStr, locale) {
3930
+ const regexBR = /^(?:(?:31\/(0[13578]|1[02]))\/(?:\d{4})|(?:29|30)\/(0[13-9]|1[0-2])\/(?:\d{4})|29\/02\/(?:\d\d(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)|(?:0[1-9]|1\d|2[0-8])\/(0[1-9]|1[0-2])\/(?:\d{4}))$/;
3931
+ const regexUS = /^(?:(?:(0[13578]|1[02])\/31)\/(?:\d{4})|(?:(0[13-9]|1[0-2])\/(29|30))\/(?:\d{4})|(?:02\/29)\/(?:\d\d(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)|(?:(0[1-9]|1[0-2])\/(0[1-9]|1\d|2[0-8]))\/(?:\d{4}))$/;
3932
+ const regex = locale === "en-US" ? regexUS : regexBR;
3933
+ return regex.test(dateStr);
3934
+ }
3896
3935
  var dateIsAvailable = (inputDate, disabledDates) => {
3897
3936
  if (!disabledDates || !inputDate) return true;
3898
3937
  const dateIsDisabled = (d, matcher) => {
@@ -3940,7 +3979,6 @@ var dateIsAvailable = (inputDate, disabledDates) => {
3940
3979
  return !dateIsDisabled(inputDate, disabledDates);
3941
3980
  };
3942
3981
  var InputDatePickerSingle = ({
3943
- portal,
3944
3982
  placeholder,
3945
3983
  className,
3946
3984
  value,
@@ -4018,58 +4056,57 @@ var InputDatePickerSingle = ({
4018
4056
  replacement: { _: /\d/ }
4019
4057
  };
4020
4058
  const inputRef = useMask(maskOptions);
4021
- return /* @__PURE__ */ jsxs(Popover, { open: popoverIsOpen, onOpenChange: setPopoverIsOpen, children: [
4022
- /* @__PURE__ */ jsx(PopoverTrigger, { className, asChild: true, children: /* @__PURE__ */ jsx(
4023
- "div",
4059
+ const conteinerRef = useRef(null);
4060
+ const calendarRef = useRef(null);
4061
+ useClickOutside([conteinerRef, calendarRef], () => {
4062
+ setPopoverIsOpen(false);
4063
+ });
4064
+ useKeyPress("Escape", () => {
4065
+ setPopoverIsOpen(false);
4066
+ });
4067
+ return /* @__PURE__ */ jsxs("div", { className: "nebula-ds w-full", ref: conteinerRef, children: [
4068
+ /* @__PURE__ */ jsx(
4069
+ InputText,
4024
4070
  {
4025
- onClick: (e) => e.preventDefault(),
4026
- onFocus: (e) => e.preventDefault(),
4027
- children: /* @__PURE__ */ jsx(
4028
- InputText,
4071
+ ref: inputRef,
4072
+ placeholder,
4073
+ value,
4074
+ className,
4075
+ onChange: (e) => handleInnerInputChange(e.target.value),
4076
+ onKeyDown: handleKeyDown,
4077
+ icon: /* @__PURE__ */ jsx(
4078
+ CalendarIcon,
4029
4079
  {
4030
- ref: inputRef,
4031
- placeholder,
4032
- value,
4033
- className,
4034
- onChange: (e) => handleInnerInputChange(e.target.value),
4035
- onKeyDown: handleKeyDown,
4036
- icon: /* @__PURE__ */ jsx(
4037
- CalendarIcon,
4038
- {
4039
- tabIndex: 0,
4040
- role: "button",
4041
- onClick: () => setPopoverIsOpen((s) => !s),
4042
- onKeyUp: (e) => {
4043
- if (e.key === "Enter") {
4044
- setPopoverIsOpen((s) => !s);
4045
- }
4046
- },
4047
- className: "nebula-ds cursor-pointer"
4048
- }
4049
- ),
4050
- iconPlacement: "end",
4080
+ tabIndex: 0,
4081
+ role: "button",
4082
+ onClick: () => setPopoverIsOpen((s) => !s),
4051
4083
  onKeyUp: (e) => {
4052
- if (e.key === "ArrowDown") {
4053
- setPopoverIsOpen(true);
4084
+ if (e.key === "Enter") {
4085
+ setPopoverIsOpen((s) => !s);
4054
4086
  }
4055
4087
  },
4056
- maxLength: 10,
4057
- onClean: onClean ? () => {
4058
- onClean();
4059
- handleClearValue();
4060
- } : void 0,
4061
- ...rest
4088
+ className: "nebula-ds cursor-pointer"
4062
4089
  }
4063
- )
4090
+ ),
4091
+ iconPlacement: "end",
4092
+ onKeyUp: (e) => {
4093
+ if (e.key === "ArrowDown") {
4094
+ setPopoverIsOpen(true);
4095
+ }
4096
+ },
4097
+ maxLength: 10,
4098
+ onClean: onClean ? () => {
4099
+ onClean();
4100
+ handleClearValue();
4101
+ } : void 0,
4102
+ ...rest
4064
4103
  }
4065
- ) }),
4066
- /* @__PURE__ */ jsx(
4067
- PopoverContent,
4104
+ ),
4105
+ /* @__PURE__ */ jsx("div", { className: "nebula-ds relative", children: popoverIsOpen && /* @__PURE__ */ jsx(
4106
+ "div",
4068
4107
  {
4069
- portal,
4070
- side: "bottom",
4071
- className: "nebula-ds p-0 border-none bg-transparent shadow-none",
4072
- align: "start",
4108
+ className: "nebula-ds absolute top-full left-0-0 z-40 pb-2 pt-1",
4109
+ ref: calendarRef,
4073
4110
  children: /* @__PURE__ */ jsx(
4074
4111
  Calendar,
4075
4112
  {
@@ -4085,7 +4122,7 @@ var InputDatePickerSingle = ({
4085
4122
  }
4086
4123
  )
4087
4124
  }
4088
- )
4125
+ ) })
4089
4126
  ] });
4090
4127
  };
4091
4128
  var InputTime = forwardRef(
@@ -4156,7 +4193,6 @@ var InputTime = forwardRef(
4156
4193
  InputTime.displayName = "InputTime";
4157
4194
  var DATA_TIME_SEPARATOR = " - ";
4158
4195
  var InputDateTimePickerSingle = ({
4159
- portal,
4160
4196
  placeholder,
4161
4197
  className,
4162
4198
  value,
@@ -4283,57 +4319,56 @@ var InputDateTimePickerSingle = ({
4283
4319
  replacement: { _: /\d/ }
4284
4320
  };
4285
4321
  const inputRef = useMask(maskOptions);
4286
- return /* @__PURE__ */ jsxs(Popover, { open: popoverIsOpen, onOpenChange: setPopoverIsOpen, children: [
4287
- /* @__PURE__ */ jsx(PopoverTrigger, { className, asChild: true, children: /* @__PURE__ */ jsx(
4288
- "div",
4322
+ const conteinerRef = useRef(null);
4323
+ const calendarRef = useRef(null);
4324
+ useClickOutside([conteinerRef, calendarRef], () => {
4325
+ setPopoverIsOpen(false);
4326
+ });
4327
+ useKeyPress("Escape", () => {
4328
+ setPopoverIsOpen(false);
4329
+ });
4330
+ return /* @__PURE__ */ jsxs("div", { className: "nebula-ds w-full", ref: conteinerRef, children: [
4331
+ /* @__PURE__ */ jsx(
4332
+ InputText,
4289
4333
  {
4290
- onClick: (e) => e.preventDefault(),
4291
- onFocus: (e) => e.preventDefault(),
4292
- children: /* @__PURE__ */ jsx(
4293
- InputText,
4334
+ ref: inputRef,
4335
+ placeholder,
4336
+ value,
4337
+ className,
4338
+ onChange: (e) => handleInnerInputChange(e.target.value),
4339
+ onKeyDown: handleKeyDown,
4340
+ icon: /* @__PURE__ */ jsx(
4341
+ CalendarIcon,
4294
4342
  {
4295
- ref: inputRef,
4296
- placeholder,
4297
- value,
4298
- className,
4299
- onChange: (e) => handleInnerInputChange(e.target.value),
4300
- onKeyDown: handleKeyDown,
4301
- icon: /* @__PURE__ */ jsx(
4302
- CalendarIcon,
4303
- {
4304
- tabIndex: 0,
4305
- role: "button",
4306
- onClick: () => setPopoverIsOpen((s) => !s),
4307
- onKeyUp: (e) => {
4308
- if (e.key === "Enter") {
4309
- setPopoverIsOpen((s) => !s);
4310
- }
4311
- },
4312
- className: "nebula-ds cursor-pointer"
4313
- }
4314
- ),
4315
- iconPlacement: "end",
4343
+ tabIndex: 0,
4344
+ role: "button",
4345
+ onClick: () => setPopoverIsOpen((s) => !s),
4316
4346
  onKeyUp: (e) => {
4317
- if (e.key === "ArrowDown") {
4318
- setPopoverIsOpen(true);
4347
+ if (e.key === "Enter") {
4348
+ setPopoverIsOpen((s) => !s);
4319
4349
  }
4320
4350
  },
4321
- onClean: onClean ? () => {
4322
- onClean();
4323
- handleClearValue();
4324
- } : void 0,
4325
- ...rest
4351
+ className: "nebula-ds cursor-pointer"
4326
4352
  }
4327
- )
4353
+ ),
4354
+ iconPlacement: "end",
4355
+ onKeyUp: (e) => {
4356
+ if (e.key === "ArrowDown") {
4357
+ setPopoverIsOpen(true);
4358
+ }
4359
+ },
4360
+ onClean: onClean ? () => {
4361
+ onClean();
4362
+ handleClearValue();
4363
+ } : void 0,
4364
+ ...rest
4328
4365
  }
4329
- ) }),
4330
- /* @__PURE__ */ jsx(
4331
- PopoverContent,
4366
+ ),
4367
+ /* @__PURE__ */ jsx("div", { className: "nebula-ds relative", children: popoverIsOpen && /* @__PURE__ */ jsx(
4368
+ "div",
4332
4369
  {
4333
- portal,
4334
- side: "bottom",
4335
- className: "nebula-ds p-0 border-none bg-transparent shadow-none",
4336
- align: "start",
4370
+ className: "nebula-ds absolute top-full left-0-0 z-40 pb-2 pt-1",
4371
+ ref: calendarRef,
4337
4372
  children: /* @__PURE__ */ jsx(
4338
4373
  Calendar,
4339
4374
  {
@@ -4365,7 +4400,7 @@ var InputDateTimePickerSingle = ({
4365
4400
  }
4366
4401
  )
4367
4402
  }
4368
- )
4403
+ ) })
4369
4404
  ] });
4370
4405
  };
4371
4406
  var FileUploadError = /* @__PURE__ */ ((FileUploadError2) => {
@@ -4894,4 +4929,4 @@ var tailwind = {
4894
4929
  // plugin: () => require("tailwindcss")("node_modules/@nebulareact/dist/tailwind.config.js"),
4895
4930
  };
4896
4931
 
4897
- export { Accordion, AccordionContent, AccordionDescription, AccordionItem, AccordionTitle, AccordionTrigger, ActionBar, ActionBarButton, ActionBarClose, ActionBarContent, ActionBarDivider, ActionBarPortal, ActionBarTrigger, Alert, AlertButton, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, AlertTitle, StyledAsync as Async, StyledAsyncCreatable as AsyncCreatable, Badge, Box, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Calendar, Caption, Checkbox, StyledCreatable as Creatable, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FileUpload, FileUploadError, Heading, InputDatePickerSingle, InputDateTimePickerSingle, InputPhone, InputText, InputTime, Label, Link, NebulaI18nProvider, Pagination, Paragraph, Popover, PopoverContent, PopoverTrigger, StyledSelect as Select, Separator2 as Separator, Skeleton, Space, SpaceDirectionEnum, SpaceSizeEnum, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, TextArea, Toaster, Tooltip, alertVariants, badgeSizeEnum, badgeVariantEnum, buttonSizeEnum, buttonVariantEnum, buttonVariantsConfig, dateIsAvailable, formatBytes, getNebulaLanguage, localeByi18nKey, messages16 as messages, separatorVariants, setNebulaLanguage, tagVariantsEnum, tailwind, toast, useNebulaI18n };
4932
+ export { Accordion, AccordionContent, AccordionDescription, AccordionItem, AccordionTitle, AccordionTrigger, ActionBar, ActionBarButton, ActionBarClose, ActionBarContent, ActionBarDivider, ActionBarPortal, ActionBarTrigger, Alert, AlertButton, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, AlertTitle, StyledAsync as Async, StyledAsyncCreatable as AsyncCreatable, Badge, Box, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Calendar, Caption, Checkbox, StyledCreatable as Creatable, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FileUpload, FileUploadError, Heading, InputDatePickerSingle, InputDateTimePickerSingle, InputPhone, InputText, InputTime, Label, Link, NebulaI18nProvider, Pagination, Paragraph, Popover, PopoverContent, PopoverTrigger, StyledSelect as Select, Separator2 as Separator, Skeleton, Space, SpaceDirectionEnum, SpaceSizeEnum, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, TextArea, Toaster, Tooltip, alertVariants, badgeSizeEnum, badgeVariantEnum, buttonSizeEnum, buttonVariantEnum, buttonVariantsConfig, dateIsAvailable, formatBytes, getNebulaLanguage, localeByi18nKey, messages16 as messages, separatorVariants, setNebulaLanguage, tagVariantsEnum, tailwind, toast, useClickOutside, useFileUpload, useKeyPress, useNebulaI18n };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ikatec/nebula-react",
3
- "version": "1.0.23",
3
+ "version": "1.0.25",
4
4
  "description": "React components",
5
5
  "publishConfig": {
6
6
  "access": "public"