@6thbridge/hexa 0.0.57 → 0.0.59

package/.turbo/turbo-build.log

@@ -0,0 +1,32 @@
+
+ WARN  Issue while reading "/Users/joachim/.nvm/versions/node/v20.17.0/lib/node_modules/npmrc". EISDIR: illegal operation on a directory, read
+
+> @6thbridge/hexa@0.0.11 build /Users/joachim/Documents/dev/payfusion/payfusion-component-library/packages/6thbridge-hexa
+> tsup src/index.ts --format=esm,cjs --dts --clean --minify --sourcemap && pnpm run build:style
+
+CLI Building entry: src/index.ts
+CLI Using tsconfig: tsconfig.json
+CLI tsup v8.3.5
+CLI Target: es2020
+CLI Cleaning output folder
+ESM Build start
+CJS Build start
+CJS dist/index.js     42.23 KB
+CJS dist/index.js.map 117.76 KB
+CJS ⚡️ Build success in 36ms
+ESM dist/index.mjs     40.07 KB
+ESM dist/index.mjs.map 117.97 KB
+ESM ⚡️ Build success in 36ms
+DTS Build start
+DTS ⚡️ Build success in 2886ms
+DTS dist/index.d.mts 10.41 KB
+DTS dist/index.d.ts  10.41 KB
+ WARN  Issue while reading "/Users/joachim/.nvm/versions/node/v20.17.0/lib/node_modules/npmrc". EISDIR: illegal operation on a directory, read
+
+> @6thbridge/hexa@0.0.11 build:style /Users/joachim/Documents/dev/payfusion/payfusion-component-library/packages/6thbridge-hexa
+> tailwindcss -i ./src/styles/input.css -o ./dist/output.css
+
+
+Rebuilding...
+
+Done in 191ms.

package/.turbo/turbo-lint.log

@@ -1,5 +1,5 @@
  WARN  Issue while reading "/Users/joachim/.nvm/versions/node/v20.17.0/lib/node_modules/npmrc". EISDIR: illegal operation on a directory, read
 
-> @6thbridge/hexa@0.0.57 lint /Users/joachim/Documents/dev/payfusion/ev-payfusion-component-library/packages/6thbridge-hexa
+> @6thbridge/hexa@0.0.59 lint /Users/joachim/Documents/dev/payfusion/payfusion-component-library/packages/6thbridge-hexa
 > eslint . --max-warnings 0
 

package/dist/index.d.mts

@@ -12,6 +12,7 @@ import { OTPInputProps as OTPInputProps$1 } from 'react-otp-input';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import { Drawer as Drawer$1 } from 'vaul';
 import { RowData, Row, Table as Table$1 } from '@tanstack/react-table';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
 import dayjs from 'dayjs';
 import { ClassValue } from 'clsx';
 
@@ -296,6 +297,7 @@ type DrawerPropsType = {
     footer?: React$1.ReactNode;
     hideCloseButton?: boolean;
     contentClassName?: string;
+    drawerContentClassName?: string;
     headerClassName?: string;
     titleClassName?: string;
     descriptionClassName?: string;
@@ -304,7 +306,7 @@ type DrawerPropsType = {
     onOpenAutoFocus?: (e: Event) => void;
     onCloseAutoFocus?: (e: Event) => void;
 };
-declare const Drawer: ({ trigger, children, open, onOpenChange, hideCloseButton, footer, title, description, contentClassName, headerClassName, titleClassName, descriptionClassName, footerClassName, asChild, onOpenAutoFocus, onCloseAutoFocus, }: Omit<DrawerRootType, "value"> & DrawerPropsType) => react_jsx_runtime.JSX.Element;
+declare const Drawer: ({ trigger, children, open, onOpenChange, hideCloseButton, footer, title, description, contentClassName, headerClassName, titleClassName, descriptionClassName, footerClassName, asChild, onOpenAutoFocus, drawerContentClassName, onCloseAutoFocus, }: Omit<DrawerRootType, "value"> & DrawerPropsType) => react_jsx_runtime.JSX.Element;
 
 type LocaleOption = {
     key: string;
@@ -402,6 +404,35 @@ type PaginationProps = {
  */
 declare const Pagination: ({ currentPage, totalPages, onPageChange, itemsPerPage, totalItems, }: PaginationProps) => react_jsx_runtime.JSX.Element;
 
+type SelectOption = {
+    value: string;
+    label: string;
+};
+type Base = {
+    type: "input" | "drop-down" | "date-range" | "multi" | "date" | "radio";
+    key: string;
+    label: string;
+    placeholder?: string;
+};
+type FilterListOption = {
+    type: "input";
+} & Exclude<InputProps, "value" | "onChange">;
+type FilterListDate = {
+    type: "date";
+    date?: string | Date;
+};
+type FilterListInputDropDown = {
+    type: "drop-down" | "multi" | "radio";
+    options: SelectOption[];
+};
+type FilterListItem = Base & (FilterListOption | FilterListInputDropDown | FilterListDate);
+type FilterContentProps = {
+    filters: FilterListItem[];
+    values?: Record<string, any>;
+    setAppliedFilters?: (values: Record<string, any>) => void;
+};
+type FilterListOptions = FilterListItem[];
+
 type TableSearchProps = {
     enabled: boolean;
     debounceRate?: number;
@@ -418,7 +449,18 @@ type TablePaginationProps = {
 } & PaginationProps;
 type TableProps<T extends RowData> = {
     ExtraNode?: ReactNode;
+    /**
+     * @deprecated Use the `filterListOptions` prop instead.
+     *
+     * The `FilterMenu` prop is deprecated in favor of `filterListOptions`, which provides a more flexible and structured way to define filter options for the table.
+     *
+     * To manage the state of applied filters, use the `setAppliedFilters` callback. This function can be used to collect and update the current filter state based on user interactions with the filter list options.
+     *
+     * The `filterListOptions` prop accepts an array of filter configuration objects, allowing you to define available filters, their types, and possible values. This approach enables dynamic filter rendering and better state management compared to the static `FilterMenu` node.
+     */
     FilterMenu?: ReactNode;
+    setAppliedFilters?: () => void;
+    filterListOptions?: FilterListItem[];
     buttonClassName?: string;
     download?: TableDownloadProps;
     id?: string;
@@ -432,7 +474,7 @@ type TableProps<T extends RowData> = {
     search?: TableSearchProps;
     table: Table$1<T>;
 };
-declare const Table: <T extends RowData>({ table, isMobile, onRowClick, id, onRefetch, isRefetching, FilterMenu, ExtraNode, onExport, search, download, isLoading, pagination, }: TableProps<T>) => react_jsx_runtime.JSX.Element;
+declare const Table: <T extends RowData>({ table, isMobile, onRowClick, id, onRefetch, isRefetching, FilterMenu, ExtraNode, onExport, search, download, isLoading, pagination, filterListOptions, setAppliedFilters, }: TableProps<T>) => react_jsx_runtime.JSX.Element;
 
 type PageDataToolbarProps = {
     onRefetch?: () => void;
@@ -442,8 +484,10 @@ type PageDataToolbarProps = {
     onExport?: () => void;
     download?: TableDownloadProps;
     isRefetching?: boolean;
+    setAppliedFilters?: () => void;
+    filterListOptions?: FilterListItem[];
 };
-declare const PageDataToolbar: ({ onRefetch, search, FilterMenu, ExtraNode, onExport, download, isRefetching, }: PageDataToolbarProps) => react_jsx_runtime.JSX.Element;
+declare const PageDataToolbar: ({ onRefetch, search, FilterMenu, ExtraNode, onExport, download, isRefetching, filterListOptions, setAppliedFilters, }: PageDataToolbarProps) => react_jsx_runtime.JSX.Element;
 
 type ResourcePermission = {
     resource: string;
@@ -478,6 +522,29 @@ declare const useHasPermission: (permission: {
 
 declare const HasResourcePermission: ({ permission, children, }: ResourcePermissionProps) => react_jsx_runtime.JSX.Element;
 
+type FilterPopoverProps = FilterContentProps & {
+    isOpen?: boolean;
+    trigger?: ReactNode;
+};
+declare const FilterPopover: ({ filters, setAppliedFilters, isOpen, }: FilterPopoverProps) => react_jsx_runtime.JSX.Element | null;
+
+type CalendarInputProps = {
+    label?: string;
+    helpText?: string | React$1.ReactNode;
+    error?: string;
+    optional?: boolean;
+    onChange: (value: string | null) => void;
+    value?: string;
+};
+declare const CalendarInput: ({ label, optional, onChange, error, helpText, value, }: CalendarInputProps) => react_jsx_runtime.JSX.Element;
+
+declare const RadioGroup: React$1.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
+    className?: string;
+} & React$1.RefAttributes<HTMLDivElement>>;
+declare const RadioGroupItem: React$1.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & {
+    className?: string;
+} & React$1.RefAttributes<HTMLButtonElement>>;
+
 declare const CurrencySymbolMap: Record<string, string>;
 interface FormatCurrencyOptions {
     convertToMajorCurrency?: boolean;
@@ -499,4 +566,4 @@ declare class DateAction {
 
 declare function cn(...inputs: ClassValue[]): string;
 
-export { AmountAction, Banner, Button, CopyableLabel, Country, CurrencySymbolMap, DateAction, DebouncedInput, DevBanner, Dialog, Drawer, DrawerClose, type DrawerPropsType, DrawerRoot, FlagComponent, FormLabel, type FormatCurrencyOptions, HasResourcePermission, Input, Loader, LocaleSelector, OTPInput, PageDataToolbar, Pagination, PasswordInput, PermissionsContext, PermissionsProvider, PhoneInput, Popover, PopoverContent, PopoverRoot, PopoverTrigger, type ResourcePermission, type ResourcePermissionProps, type ResourcePermissions, Select, Sidebar, Status, Table, type TablePaginationProps, Textarea, Tooltip, TooltipContent, TooltipProvider, TooltipRoot, TooltipTrigger, buttonVariants, cn, useHasPermission, usePermissions };
+export { AmountAction, Banner, Button, CalendarInput, CopyableLabel, Country, CurrencySymbolMap, DateAction, DebouncedInput, DevBanner, Dialog, Drawer, DrawerClose, type DrawerPropsType, DrawerRoot, type FilterListItem, type FilterListOptions, FilterPopover, FlagComponent, FormLabel, type FormatCurrencyOptions, HasResourcePermission, Input, Loader, LocaleSelector, OTPInput, PageDataToolbar, Pagination, PasswordInput, PermissionsContext, PermissionsProvider, PhoneInput, Popover, PopoverContent, PopoverRoot, PopoverTrigger, RadioGroup, RadioGroupItem, type ResourcePermission, type ResourcePermissionProps, type ResourcePermissions, Select, Sidebar, Status, Table, type TablePaginationProps, Textarea, Tooltip, TooltipContent, TooltipProvider, TooltipRoot, TooltipTrigger, buttonVariants, cn, useHasPermission, usePermissions };

package/dist/index.d.ts

@@ -12,6 +12,7 @@ import { OTPInputProps as OTPInputProps$1 } from 'react-otp-input';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import { Drawer as Drawer$1 } from 'vaul';
 import { RowData, Row, Table as Table$1 } from '@tanstack/react-table';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
 import dayjs from 'dayjs';
 import { ClassValue } from 'clsx';
 
@@ -296,6 +297,7 @@ type DrawerPropsType = {
     footer?: React$1.ReactNode;
     hideCloseButton?: boolean;
     contentClassName?: string;
+    drawerContentClassName?: string;
     headerClassName?: string;
     titleClassName?: string;
     descriptionClassName?: string;
@@ -304,7 +306,7 @@ type DrawerPropsType = {
     onOpenAutoFocus?: (e: Event) => void;
     onCloseAutoFocus?: (e: Event) => void;
 };
-declare const Drawer: ({ trigger, children, open, onOpenChange, hideCloseButton, footer, title, description, contentClassName, headerClassName, titleClassName, descriptionClassName, footerClassName, asChild, onOpenAutoFocus, onCloseAutoFocus, }: Omit<DrawerRootType, "value"> & DrawerPropsType) => react_jsx_runtime.JSX.Element;
+declare const Drawer: ({ trigger, children, open, onOpenChange, hideCloseButton, footer, title, description, contentClassName, headerClassName, titleClassName, descriptionClassName, footerClassName, asChild, onOpenAutoFocus, drawerContentClassName, onCloseAutoFocus, }: Omit<DrawerRootType, "value"> & DrawerPropsType) => react_jsx_runtime.JSX.Element;
 
 type LocaleOption = {
     key: string;
@@ -402,6 +404,35 @@ type PaginationProps = {
  */
 declare const Pagination: ({ currentPage, totalPages, onPageChange, itemsPerPage, totalItems, }: PaginationProps) => react_jsx_runtime.JSX.Element;
 
+type SelectOption = {
+    value: string;
+    label: string;
+};
+type Base = {
+    type: "input" | "drop-down" | "date-range" | "multi" | "date" | "radio";
+    key: string;
+    label: string;
+    placeholder?: string;
+};
+type FilterListOption = {
+    type: "input";
+} & Exclude<InputProps, "value" | "onChange">;
+type FilterListDate = {
+    type: "date";
+    date?: string | Date;
+};
+type FilterListInputDropDown = {
+    type: "drop-down" | "multi" | "radio";
+    options: SelectOption[];
+};
+type FilterListItem = Base & (FilterListOption | FilterListInputDropDown | FilterListDate);
+type FilterContentProps = {
+    filters: FilterListItem[];
+    values?: Record<string, any>;
+    setAppliedFilters?: (values: Record<string, any>) => void;
+};
+type FilterListOptions = FilterListItem[];
+
 type TableSearchProps = {
     enabled: boolean;
     debounceRate?: number;
@@ -418,7 +449,18 @@ type TablePaginationProps = {
 } & PaginationProps;
 type TableProps<T extends RowData> = {
     ExtraNode?: ReactNode;
+    /**
+     * @deprecated Use the `filterListOptions` prop instead.
+     *
+     * The `FilterMenu` prop is deprecated in favor of `filterListOptions`, which provides a more flexible and structured way to define filter options for the table.
+     *
+     * To manage the state of applied filters, use the `setAppliedFilters` callback. This function can be used to collect and update the current filter state based on user interactions with the filter list options.
+     *
+     * The `filterListOptions` prop accepts an array of filter configuration objects, allowing you to define available filters, their types, and possible values. This approach enables dynamic filter rendering and better state management compared to the static `FilterMenu` node.
+     */
     FilterMenu?: ReactNode;
+    setAppliedFilters?: () => void;
+    filterListOptions?: FilterListItem[];
     buttonClassName?: string;
     download?: TableDownloadProps;
     id?: string;
@@ -432,7 +474,7 @@ type TableProps<T extends RowData> = {
     search?: TableSearchProps;
     table: Table$1<T>;
 };
-declare const Table: <T extends RowData>({ table, isMobile, onRowClick, id, onRefetch, isRefetching, FilterMenu, ExtraNode, onExport, search, download, isLoading, pagination, }: TableProps<T>) => react_jsx_runtime.JSX.Element;
+declare const Table: <T extends RowData>({ table, isMobile, onRowClick, id, onRefetch, isRefetching, FilterMenu, ExtraNode, onExport, search, download, isLoading, pagination, filterListOptions, setAppliedFilters, }: TableProps<T>) => react_jsx_runtime.JSX.Element;
 
 type PageDataToolbarProps = {
     onRefetch?: () => void;
@@ -442,8 +484,10 @@ type PageDataToolbarProps = {
     onExport?: () => void;
     download?: TableDownloadProps;
     isRefetching?: boolean;
+    setAppliedFilters?: () => void;
+    filterListOptions?: FilterListItem[];
 };
-declare const PageDataToolbar: ({ onRefetch, search, FilterMenu, ExtraNode, onExport, download, isRefetching, }: PageDataToolbarProps) => react_jsx_runtime.JSX.Element;
+declare const PageDataToolbar: ({ onRefetch, search, FilterMenu, ExtraNode, onExport, download, isRefetching, filterListOptions, setAppliedFilters, }: PageDataToolbarProps) => react_jsx_runtime.JSX.Element;
 
 type ResourcePermission = {
     resource: string;
@@ -478,6 +522,29 @@ declare const useHasPermission: (permission: {
 
 declare const HasResourcePermission: ({ permission, children, }: ResourcePermissionProps) => react_jsx_runtime.JSX.Element;
 
+type FilterPopoverProps = FilterContentProps & {
+    isOpen?: boolean;
+    trigger?: ReactNode;
+};
+declare const FilterPopover: ({ filters, setAppliedFilters, isOpen, }: FilterPopoverProps) => react_jsx_runtime.JSX.Element | null;
+
+type CalendarInputProps = {
+    label?: string;
+    helpText?: string | React$1.ReactNode;
+    error?: string;
+    optional?: boolean;
+    onChange: (value: string | null) => void;
+    value?: string;
+};
+declare const CalendarInput: ({ label, optional, onChange, error, helpText, value, }: CalendarInputProps) => react_jsx_runtime.JSX.Element;
+
+declare const RadioGroup: React$1.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
+    className?: string;
+} & React$1.RefAttributes<HTMLDivElement>>;
+declare const RadioGroupItem: React$1.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & {
+    className?: string;
+} & React$1.RefAttributes<HTMLButtonElement>>;
+
 declare const CurrencySymbolMap: Record<string, string>;
 interface FormatCurrencyOptions {
     convertToMajorCurrency?: boolean;
@@ -499,4 +566,4 @@ declare class DateAction {
 
 declare function cn(...inputs: ClassValue[]): string;
 
-export { AmountAction, Banner, Button, CopyableLabel, Country, CurrencySymbolMap, DateAction, DebouncedInput, DevBanner, Dialog, Drawer, DrawerClose, type DrawerPropsType, DrawerRoot, FlagComponent, FormLabel, type FormatCurrencyOptions, HasResourcePermission, Input, Loader, LocaleSelector, OTPInput, PageDataToolbar, Pagination, PasswordInput, PermissionsContext, PermissionsProvider, PhoneInput, Popover, PopoverContent, PopoverRoot, PopoverTrigger, type ResourcePermission, type ResourcePermissionProps, type ResourcePermissions, Select, Sidebar, Status, Table, type TablePaginationProps, Textarea, Tooltip, TooltipContent, TooltipProvider, TooltipRoot, TooltipTrigger, buttonVariants, cn, useHasPermission, usePermissions };
+export { AmountAction, Banner, Button, CalendarInput, CopyableLabel, Country, CurrencySymbolMap, DateAction, DebouncedInput, DevBanner, Dialog, Drawer, DrawerClose, type DrawerPropsType, DrawerRoot, type FilterListItem, type FilterListOptions, FilterPopover, FlagComponent, FormLabel, type FormatCurrencyOptions, HasResourcePermission, Input, Loader, LocaleSelector, OTPInput, PageDataToolbar, Pagination, PasswordInput, PermissionsContext, PermissionsProvider, PhoneInput, Popover, PopoverContent, PopoverRoot, PopoverTrigger, RadioGroup, RadioGroupItem, type ResourcePermission, type ResourcePermissionProps, type ResourcePermissions, Select, Sidebar, Status, Table, type TablePaginationProps, Textarea, Tooltip, TooltipContent, TooltipProvider, TooltipRoot, TooltipTrigger, buttonVariants, cn, useHasPermission, usePermissions };