freemium-ui 2.0.0-beta.13 → 2.0.0-beta.14

package/index.d.ts

@@ -6,10 +6,10 @@ import * as Popover$1 from '@radix-ui/react-popover';
 import { PopperContentProps } from '@radix-ui/react-popover';
 import { RadioGroupContextValue, RadioGroupProps as RadioGroupProps$1 } from '@radix-ui/react-radio-group';
 import { CheckboxProps as CheckboxProps$1 } from '@radix-ui/react-checkbox';
-import { UseSelectProps, UseComboboxProps } from 'downshift';
+import { UseSelectProps, UseComboboxProps, UseMultipleSelectionProps } from 'downshift';
 import * as _radix_ui_react_label from '@radix-ui/react-label';
 import { LabelProps } from '@radix-ui/react-label';
-import { DateInput3Props, DateRangeInput3Props } from '@blueprintjs/datetime2';
+import { DateInput3Props, DateRangeInput3Props, TimePrecision } from '@blueprintjs/datetime2';
 import * as styled_components from 'styled-components';
 import { DraggableSyntheticListeners } from '@dnd-kit/core';
 import { CoreOptions } from '@tanstack/react-table';
@@ -130,6 +130,14 @@ interface ButtonDropdownProps<T extends ButtonDropdownItemProps = ButtonDropdown
      * name Accessor of menu
      */
     nameAccessor?: string;
+    /**
+     * name Accessor of menu
+     */
+    id?: string;
+    /**
+     * name Accessor of menu
+     */
+    name?: string;
     disabled?: React.ButtonHTMLAttributes<HTMLButtonElement>['disabled'];
     size?: ButtonProps['size'];
     variant?: ButtonProps['variant'];
@@ -140,12 +148,9 @@ interface ButtonDropdownProps<T extends ButtonDropdownItemProps = ButtonDropdown
 /**
  * ButtonDropdown is a button with a dropdown menu. It is used to select an item from a list of items.
  */
-declare const ButtonDropdown: ({ size, variant, loading, inline, defaultSelectedItem, idAccessor, nameAccessor, onClick, options, side, sideOffset, align, alignOffset, arrowPadding, avoidCollisions, disabled, }: ButtonDropdownProps) => react__default.JSX.Element;
+declare const ButtonDropdown: ({ size, variant, loading, inline, defaultSelectedItem, idAccessor, nameAccessor, onClick, options, side, sideOffset, align, alignOffset, arrowPadding, avoidCollisions, disabled, id, name, }: ButtonDropdownProps) => react__default.JSX.Element;
 
 interface BoxedRadioItemProps {
-    id: string;
-    name: string;
-    hide?: boolean;
     disabled?: boolean;
     [key: string]: any;
 }
@@ -158,6 +163,10 @@ type BoxedRadioProps<T extends BoxedRadioItemProps = BoxedRadioItemProps> = {
      * Select options
      */
     disabled?: boolean;
+    /**
+     * Select options
+     */
+    readOnly?: boolean;
     /**
      * Id accessor of radio button
      */
@@ -175,13 +184,17 @@ type BoxedRadioProps<T extends BoxedRadioItemProps = BoxedRadioItemProps> = {
      */
     onChange?: RadioGroupContextValue['onValueChange'];
     /**
-     * Name accesssor of radio button
+     * The description of the content
      */
-    nameAccessor?: string;
+    label?: string;
     /**
      * The description of the content
      */
-    label?: string;
+    getTextContent: (item: T, type: 'name' | 'description') => string;
+    /**
+     * The description of the content
+     */
+    renderOption?: (item: T) => React.ReactNode | string | null;
     /**
      * class Name of Radio button
      */
@@ -195,7 +208,7 @@ type BoxedRadioProps<T extends BoxedRadioItemProps = BoxedRadioItemProps> = {
 /**
  * BoxedRadio displays a group of options with radio buttons and enables selection of one option from the list.
  */
-declare const BoxedRadio: ({ options, defaultValue, idAccessor, nameAccessor, onChange, disabled, className, id, label, value, }: BoxedRadioProps) => react__default.JSX.Element;
+declare const BoxedRadio: <T extends BoxedRadioItemProps>({ options, defaultValue, idAccessor, onChange, disabled, getTextContent, className, id, readOnly, renderOption, label, value, }: BoxedRadioProps<T>) => react__default.JSX.Element;
 
 interface CheckboxProps extends CheckboxProps$1 {
     /**
@@ -333,9 +346,6 @@ declare const Drawer: ({ isOpen, children, hideDismissIcon, customClass, size, i
 
 type DropdownTypes = 'button' | 'input';
 type DefaultDropdownItem = {
-    id: string | number;
-    name?: string;
-    disabled?: boolean;
     [key: string]: any;
 };
 interface DropdownProps<T extends DefaultDropdownItem = DefaultDropdownItem> {
@@ -354,11 +364,11 @@ interface DropdownProps<T extends DefaultDropdownItem = DefaultDropdownItem> {
     /**
      * Function to be called when the selected item changes
      */
-    onChange?: (item?: T | null) => void;
+    onChange?: (item: T | null) => void;
     /**
      * Fuction to give the string representation of the item
      */
-    itemToString: (item: T | null, type?: 'list-item' | 'display') => string;
+    itemToString: (item: T, type?: 'list-item' | 'display' | 'downshift') => string;
     /**
      * Fuction to give the string representation of the item
      */
@@ -371,6 +381,10 @@ interface DropdownProps<T extends DefaultDropdownItem = DefaultDropdownItem> {
      * Is the dropdown read only
      */
     readOnly?: boolean;
+    /**
+     * Is the dropdown read only
+     */
+    showTick?: boolean;
     /**
      * Whether disabled select
      */
@@ -602,7 +616,7 @@ type MenuProps<T extends MenuItemProps = MenuItemProps> = {
  * Menu is a container for Menu Item components.
  * Menu item is a component to define each row of a menu components. It takes in prefix, suffix and default slot to place content either at beginning or end or middle of the row respectively.
  */
-declare const Menu: (props: MenuProps) => react__default.JSX.Element;
+declare const Menu: <T extends MenuItemProps>(props: MenuProps<T>) => react__default.JSX.Element;
 
 type ModalAlignType = 'top' | 'center' | 'bottom';
 type ModalPositionType = 'left' | 'center' | 'right';
@@ -651,8 +665,10 @@ interface ModalProps {
  */
 declare const Modal: ({ isOpen, children, align, customClass, fullWidth, customModalContentStyles, onDismiss, position, size, }: ModalProps) => react__default.JSX.Element;
 
-type DefaultMultiSelectDropdownItem = {};
-interface MultiSelectDropdownProps<T extends DefaultMultiSelectDropdownItem> {
+type DefaultMultiSelectDropdownItem = {
+    [key: string]: any;
+};
+interface MultiSelectDropdownProps<T extends DefaultMultiSelectDropdownItem = DefaultMultiSelectDropdownItem> {
     /**
      *  dropdown item content
      */
@@ -662,14 +678,18 @@ interface MultiSelectDropdownProps<T extends DefaultMultiSelectDropdownItem> {
      */
     itemIdentifier?: string;
     /**
-     * default selected item of dropdown
+     * selected item of dropdown
      */
-    defaultSelectedItem?: T | null;
+    selectedItem?: T[];
     /**
      * Called when select an option or input value change
      */
-    onChange?: (item?: T | null) => void;
-    itemToString: (item: T | null) => string;
+    onChange?: (item: T[]) => void;
+    itemToString?: (item: T, type?: 'list-item' | 'display' | 'downshift') => string;
+    /**
+     * Fuction to give the string representation of the item
+     */
+    itemComponent?: (item: T) => React.ReactNode | string;
     /**
      * Is the dropdown readonly
      */
@@ -712,11 +732,13 @@ interface MultiSelectDropdownProps<T extends DefaultMultiSelectDropdownItem> {
      * Is menu loading?
      */
     isMenuLoading?: boolean;
+    inputValue?: string | null;
     handleInputChange?: (inputValue: string) => void;
     onCustomValueAdd?: (item: {
         inputValue: string;
         customValues: boolean;
     }) => void;
+    removeSelectedItem?: (item: T, index: number) => void;
     /**
      * Is this custom value
      */
@@ -730,14 +752,23 @@ interface MultiSelectDropdownProps<T extends DefaultMultiSelectDropdownItem> {
      */
     label?: string;
     placeholder?: string;
-    useSelectProps?: UseSelectProps<T>;
+    useMultipleSelectionProps?: UseMultipleSelectionProps<T>;
     useComboboxProps?: UseComboboxProps<T>;
+    InputProps?: React.InputHTMLAttributes<HTMLInputElement>;
+    onBackSpace?: () => void;
+    maxAllowedLength?: number;
+    isDynamicMenu?: boolean;
+    minAllowedLength?: number;
+    locale?: {
+        createText: string;
+        deleteText: string;
+    };
 }
 
 /**
  * MultiSelectDropdown displays a list or drop-down box that enables selection of an option or multiple options from an available list of values.
  */
-declare const MultiSelectDropdown: <T extends DefaultMultiSelectDropdownItem>({ itemIdentifier, label, id, items, onChange, placeholder, readOnly, disabled, isRequired, itemToString, name, filterKey, width, useSelectProps, emptyItemsText, getCustomMessage, onCustomValueAdd, customValues, hideClear, defaultSelectedItem, handleInputChange, isErrored, isMenuLoading, errorText, }: MultiSelectDropdownProps<T>) => react__default.JSX.Element;
+declare const MultiSelectDropdown: <T extends DefaultMultiSelectDropdownItem>({ itemIdentifier, label, id, items, onChange, placeholder, readOnly, disabled, isRequired, itemToString, name, filterKey, width, useComboboxProps, useMultipleSelectionProps, emptyItemsText, getCustomMessage, onCustomValueAdd, customValues, inputValue: iV, hideClear, removeSelectedItem: rSelectedItem, selectedItem, handleInputChange, isErrored, isMenuLoading, errorText, InputProps, itemComponent, isDynamicMenu, locale, maxAllowedLength, minAllowedLength, onBackSpace, }: MultiSelectDropdownProps<T>) => react__default.JSX.Element;
 
 type DefaultProps = {
     /**
@@ -782,6 +813,13 @@ type DateTimePickerProps = DefaultProps & Partial<DateInput3Props> & {
 type DateTimeRangePickerProps = DefaultProps & Partial<DateRangeInput3Props> & {
     displayFormat?: string;
 };
+type TimePickerProps = DefaultProps & {
+    displayFormat?: string;
+    value?: string;
+    onChange?: (dateString: string | null) => void;
+    useAmPm?: boolean;
+    precision?: TimePrecision;
+};
 
 /**
  * Datepicker displays an input box with a calendar that enables selecting a date or date range. The values preselected in the input box and calendar are based on the fw-datepicker attribute values.
@@ -807,6 +845,11 @@ declare const DateRangePicker: (props: DateRangePickerProps) => react__default.J
  */
 declare const DateTimeRangePicker: (props: DateTimeRangePickerProps) => react__default.JSX.Element;
 
+/**
+ * TimePicker displays an input box with a calendar that enables selecting a date or date range. The values preselected in the input box and calendar are based on the fw-datepicker attribute values.
+ */
+declare const TimePicker: (props: TimePickerProps) => react__default.JSX.Element;
+
 type Origin = {
     vertical?: 'top' | 'center' | 'bottom';
     horizontal?: 'left' | 'center' | 'right';
@@ -1297,13 +1340,64 @@ type ReorderProps<T extends ReorderItemType = ReorderItemType> = {
 declare const Reorder: <T extends ReorderItemType = ReorderItemType>(props: ReorderProps<T>) => react__default.JSX.Element;
 
 type RowData = unknown | object | any[];
+interface FuiTableColumnType<T extends RowData> {
+    id: string;
+    Header: string;
+    accessorFn: (row: T) => React.ReactNode | string | null;
+    disableSortBy?: boolean;
+}
 interface TableProps<T extends RowData> {
     /**
      * How large should the button be?
      */
     data: CoreOptions<T>['data'];
-    columns: CoreOptions<T>['columns'];
+    columns: FuiTableColumnType<T>[];
     showFooter?: boolean;
+    count?: number;
+    pageSize?: number;
+    pageIndex?: number;
+    columnOrder?: string[];
+    hiddenColumns?: string[];
+    selectedRowIds?: Record<string, boolean>;
+    disableSelectMenuOptionIds?: string[];
+    hideSelectMenuOptionIds?: string[];
+    selectMenuOptions?: any[];
+    selectMenuOptionsHandler?: (option: any) => void;
+    setPageIndex?: (pageIndex: number) => void | React.Dispatch<React.SetStateAction<number>>;
+    setSelectedRowIds?: (selectedRowIds: Record<string, boolean>) => void | React.Dispatch<React.SetStateAction<Record<string, boolean>>>;
+    onRowClick?: (row: any, column: any) => void;
+    onNextPageClick?: () => void;
+    onPreviousPageClick?: () => void;
+    rowPropGetter?: (row: any) => any;
+    cellPropGetter?: (cell: any) => any;
+    rowMenuOptions?: (rowData?: any) => any[];
+    onSelectAllRows?: (checked: boolean) => void;
+    onRowSelect?: (row: any, checked: boolean) => void;
+    onMenuOptionSelect?: (optionId: string, row: any) => void;
+    tableOptions?: any;
+    enableNextPage?: boolean;
+    enablePreviousPage?: boolean;
+    isLoading?: boolean;
+    isFetching?: boolean;
+    hideActions?: boolean;
+    hideFilters?: boolean;
+    hideTableOnEmpty?: boolean;
+    disableSelectMenuOptions?: boolean;
+    disableRowSelect?: boolean;
+    hideTopPagination?: boolean;
+    showTableOnLoading?: boolean;
+    indeterminateCount?: boolean;
+    hideSelectAllInTable?: boolean;
+    hideBottomPagination?: boolean;
+    hideLoaderOnTopPagination?: boolean;
+    dataKey?: string;
+    loaderStyles?: React.CSSProperties;
+    infoComponent?: React.ReactElement;
+    actionComponent?: React.ReactElement;
+    filterComponent?: React.ReactElement;
+    headerComponent?: React.ReactElement;
+    emptyComponent?: React.ReactElement;
+    loadingComponent?: React.ReactElement;
 }
 
 /**
@@ -2486,7 +2580,7 @@ interface TagProps {
     /**
      * Function to be called when the tag is closed
      */
-    onClose?: () => void;
+    onClose?: React.MouseEventHandler<HTMLButtonElement>;
     /**
      * Children of the tag
      */
@@ -2494,7 +2588,7 @@ interface TagProps {
     /**
      * Props for the icon
      */
-    iconProps?: React.HTMLAttributes<HTMLButtonElement>;
+    iconProps?: React.ButtonHTMLAttributes<HTMLButtonElement>;
 }
 
 /**
@@ -2649,7 +2743,7 @@ interface ToastType {
     /**
      * How large should the button be?
      */
-    text?: string;
+    text?: string | React.ReactNode;
     /**
      * How large should the button be?
      */
@@ -5943,4 +6037,4 @@ declare const slideRightAndFade: () => styled_components.RuleSet<object>;
 declare const slideDownAndFade: () => styled_components.RuleSet<object>;
 declare const slideLeftAndFade: () => styled_components.RuleSet<object>;
 
-export { Alert, type AlertProps, type BaseProps, BoxedRadio, type BoxedRadioItemProps, type BoxedRadioProps, Button, ButtonDropdown, type ButtonDropdownItemProps, type ButtonDropdownProps, type ButtonProps, type ButtonSizeKey, type ButtonVariant, CardActions, CardContent, CardDescription, CardText, CardTitle, Checkbox, type CheckboxProps, ChevronUp, Confirmation, type ConfirmationProps, Cross as CrossIcon, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, DateTimePicker, type DateTimePickerProps, DateTimeRangePicker, type DateTimeRangePickerProps, type DefaultDropdownItem, type DefaultMultiSelectDropdownItem, type DefaultProps, Drawer, type DrawerPlacement, type DrawerProps, type DrawerSizeType, Dropdown, type DropdownProps, type DropdownTypes, ErrorText, Fade, type FadeProps, type FreemiumUiTheme, FreshLink, type FreshworksPalette, type FuiContextType, IconButton, Input, InputLabel, type InputProps, type LevelType, Loader, type LoaderPropTypes, type LoaderSizes, type LoaderSpeeds, Menu, type MenuItemProps, type MenuProps, Modal, type ModalAlignType, type ModalCssType, type ModalPositionType, type ModalProps, type ModalSizeType, MultiSelectDropdown, type MultiSelectDropdownProps, type Origin, Popover, PopoverClose, type PopoverProps, Radio, RadioGroup, type RadioGroupProps, type RadioItemProps, type RadioProps, Reorder, type ReorderItemType, type ReorderProps, RequiredIndicator, type RowData, Slide, SlideFade, type SlideFadeProps, type SlidePlacement, type SlideProps, StyledLabel, Table, type TableProps, Tabs, TabsContent, type TabsItemProps, TabsList, type TabsProps, TabsRoot, TabsTrigger, Tag, type TagProps, TextArea, type TextAreaProps, ThemeProvider, type ThemeProviderType, TickIcon, type ToastContextType, type ToastItemProps, ToastProvider, type ToastType, type ToastTypes, type ToastWithID, Toggle, type ToggleProps, type ToggleSizes, Tooltip, type TooltipAlign, type TooltipPosition, type TooltipProps, type TooltipSide, Transition, type TransitionProps, type TransitionStyleState, type TransitionStyles, TriggerButtonWrapper, Typography, type TypographyProps, type TypographyVariantType, type TypographyWeightType, type UpdateToastsFunction, Warning, basicHide, basicShow, contentHide, contentShow, slideDownAndFade, slideLeftAndFade, slideRightAndFade, slideUpAndFade, useToasts };
+export { Alert, type AlertProps, type BaseProps, BoxedRadio, type BoxedRadioItemProps, type BoxedRadioProps, Button, ButtonDropdown, type ButtonDropdownItemProps, type ButtonDropdownProps, type ButtonProps, type ButtonSizeKey, type ButtonVariant, CardActions, CardContent, CardDescription, CardText, CardTitle, Checkbox, type CheckboxProps, ChevronUp, Confirmation, type ConfirmationProps, Cross as CrossIcon, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, DateTimePicker, type DateTimePickerProps, DateTimeRangePicker, type DateTimeRangePickerProps, type DefaultDropdownItem, type DefaultMultiSelectDropdownItem, type DefaultProps, Drawer, type DrawerPlacement, type DrawerProps, type DrawerSizeType, Dropdown, type DropdownProps, type DropdownTypes, ErrorText, Fade, type FadeProps, type FreemiumUiTheme, FreshLink, type FreshworksPalette, type FuiContextType, IconButton, Input, InputLabel, type InputProps, type LevelType, Loader, type LoaderPropTypes, type LoaderSizes, type LoaderSpeeds, Menu, type MenuItemProps, type MenuProps, Modal, type ModalAlignType, type ModalCssType, type ModalPositionType, type ModalProps, type ModalSizeType, MultiSelectDropdown, type MultiSelectDropdownProps, type Origin, Popover, PopoverClose, type PopoverProps, Radio, RadioGroup, type RadioGroupProps, type RadioItemProps, type RadioProps, Reorder, type ReorderItemType, type ReorderProps, RequiredIndicator, type RowData, Slide, SlideFade, type SlideFadeProps, type SlidePlacement, type SlideProps, StyledLabel, Table, type TableProps, Tabs, TabsContent, type TabsItemProps, TabsList, type TabsProps, TabsRoot, TabsTrigger, Tag, type TagProps, TextArea, type TextAreaProps, ThemeProvider, type ThemeProviderType, TickIcon, TimePicker, type TimePickerProps, type ToastContextType, type ToastItemProps, ToastProvider, type ToastType, type ToastTypes, type ToastWithID, Toggle, type ToggleProps, type ToggleSizes, Tooltip, type TooltipAlign, type TooltipPosition, type TooltipProps, type TooltipSide, Transition, type TransitionProps, type TransitionStyleState, type TransitionStyles, TriggerButtonWrapper, Typography, type TypographyProps, type TypographyVariantType, type TypographyWeightType, type UpdateToastsFunction, Warning, basicHide, basicShow, contentHide, contentShow, slideDownAndFade, slideLeftAndFade, slideRightAndFade, slideUpAndFade, useToasts };