@indico-data/design-system 2.49.0 → 2.51.0

package/lib/index.d.ts

@@ -6,8 +6,9 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ContainerProps, RowProps, ColProps } from 'react-grid-system';
 import { IDataTableProps, Direction as Direction$1, TableColumn as TableColumn$1 } from 'react-data-table-component';
 import { CSSObject } from 'styled-components';
-import { Props as Props$7 } from 'react-select';
+import { Props as Props$8 } from 'react-select';
 import { DateRange, OnSelectHandler, Mode, CustomComponents, Matcher, Formatters, MonthChangeEventHandler, DayEventHandler } from 'react-day-picker';
+import { ColumnDef, Row as Row$1 } from '@tanstack/react-table';
 
 declare const registerFontAwesomeIcons: (...icons: IconDefinition[]) => void;
 
@@ -222,28 +223,28 @@ type PermafrostComponent = {
 
 type SemanticColor = 'primary' | 'secondary' | 'warning' | 'error' | 'success' | 'info' | 'pending';
 
-type Props$6 = PermafrostComponent & {
+type Props$7 = PermafrostComponent & {
     ariaLabel?: string;
     size?: IconSizes;
     style?: React$1.CSSProperties;
     fill?: string;
 };
-declare function CircleSpinner(props: Props$6): React$1.ReactElement;
+declare function CircleSpinner(props: Props$7): React$1.ReactElement;
 
-type Props$5 = PermafrostComponent & {
+type Props$6 = PermafrostComponent & {
     width?: string;
 };
-declare function BarSpinner(props: Props$5): React$1.ReactElement;
+declare function BarSpinner(props: Props$6): React$1.ReactElement;
 
-type Props$4 = PermafrostComponent & {
+type Props$5 = PermafrostComponent & {
     color?: string;
     overallSize?: string | number;
     rippleSize?: string | number;
     showRandomMessage?: boolean;
 };
-declare function CirclePulse(props: Props$4): React$1.ReactElement;
+declare function CirclePulse(props: Props$5): React$1.ReactElement;
 
-type Props$3 = PermafrostComponent & {
+type Props$4 = PermafrostComponent & {
     questionMark?: boolean;
     for?: string | null;
     place?: string;
@@ -254,7 +255,7 @@ type Props$3 = PermafrostComponent & {
     children: React$1.ReactNode;
     block?: boolean;
 };
-declare const Tooltip: (props: Props$3) => react_jsx_runtime.JSX.Element;
+declare const Tooltip: (props: Props$4) => react_jsx_runtime.JSX.Element;
 
 declare const Container: ({ ref: _ref, ...rest }: ContainerProps) => react_jsx_runtime.JSX.Element;
 
@@ -390,7 +391,7 @@ interface PasswordInputProps extends LabelProps {
 }
 declare const LabeledPasswordInput: React$1.ForwardRefExoticComponent<Omit<Omit<PasswordInputProps, "ref"> & React$1.RefAttributes<HTMLInputElement> & LabelProps, "ref"> & React$1.RefAttributes<any>>;
 
-interface SelectProps<OptionType extends SelectOption> extends Props$7<OptionType> {
+interface SelectProps<OptionType extends SelectOption> extends Props$8<OptionType> {
     options: OptionType[];
 }
 declare const Select: <OptionType extends SelectOption>({ classNamePrefix, className, components: customComponents, ...props }: SelectProps<OptionType>) => react_jsx_runtime.JSX.Element;
@@ -424,7 +425,7 @@ interface DatePickerProps {
 
 declare const DatePicker: (props: DatePickerProps) => react_jsx_runtime.JSX.Element;
 
-interface Props$2 {
+interface Props$3 {
     mode?: Mode;
     ariaLabel: string;
     disableBeforeDate?: Date;
@@ -442,7 +443,7 @@ interface Props$2 {
     initialMonth?: Date;
     'data-testid'?: string;
 }
-declare const IconTriggerDatePicker: (props: Props$2) => react_jsx_runtime.JSX.Element;
+declare const IconTriggerDatePicker: (props: Props$3) => react_jsx_runtime.JSX.Element;
 
 interface SingleInputDatePickerProps {
     ariaLabel: string;
@@ -480,23 +481,23 @@ interface FormProps {
 }
 declare const Form: ({ children, onSubmit, action, method, target, autocomplete, noValidate, enctype, rel, ...rest }: FormProps) => react_jsx_runtime.JSX.Element;
 
-type Props$1 = {
+type Props$2 = {
     className?: string;
     height?: number | string;
     width?: number | string;
     isCircle?: boolean;
     isFullHeight?: boolean;
 };
-declare const Skeleton: ({ className, height, width, isCircle, isFullHeight, ...rest }: Props$1) => react_jsx_runtime.JSX.Element;
+declare const Skeleton: ({ className, height, width, isCircle, isFullHeight, ...rest }: Props$2) => react_jsx_runtime.JSX.Element;
 
-type Props = {
+type Props$1 = {
     className?: string;
     children: React$1.ReactNode;
     title?: string;
     subtitle?: string;
     hasBoxShadow?: boolean;
 };
-declare const Card: React$1.FC<Props>;
+declare const Card: React$1.FC<Props$1>;
 
 type FloatUIProps = {
     children: [ReactElement, ReactElement];
@@ -549,4 +550,48 @@ interface ModalProps {
 
 declare const Modal: ({ className, children, isOpen, onRequestClose, portalClassName, overlayClassName, appElement, shouldCloseOnOverlayClick, shouldCloseOnEsc, testId, contentElement, overlayElement, position, parentSelector, ...rest }: ModalProps) => react_jsx_runtime.JSX.Element;
 
-export { Badge, BarSpinner, Button, Card, Checkbox, CirclePulse, CircleSpinner, Col, Container, DatePicker, FloatUI, Form, Icon, IconTriggerDatePicker, LabeledInput as Input, Menu, Modal, LabeledPasswordInput as PasswordInput, Pill, Radio as RadioInput, Row, Select as SelectInput, SingleInputDatePicker, Skeleton, Table, LabeledTextarea as Textarea, Toggle as ToggleInput, Tooltip, registerFontAwesomeIcons };
+type WithPaginationProps = {
+    rowsPerPage: number;
+    rowCount: number;
+    onChangePage: (page: number, perPage: number) => void;
+    currentPage: number;
+    totalEntriesText?: string;
+    showPagination: true;
+};
+type WithoutPaginationProps = {
+    rowsPerPage?: number;
+    rowCount?: number;
+    onChangePage?: (page: number, perPage: number) => void;
+    currentPage?: number;
+    totalEntriesText?: string;
+    showPagination?: false;
+};
+type PaginationProps = WithPaginationProps | WithoutPaginationProps;
+type Props<T extends object> = {
+    data: T[];
+    columns: ColumnDef<T & {
+        id: string;
+    }>[];
+    className?: string;
+    actionBarClassName?: string;
+    TableActions?: React.ComponentType<{
+        selectedItems: Row$1<any>[];
+        unselectRows: () => void;
+    }>;
+    error?: {
+        hasError: boolean;
+        errorMessage?: string;
+    };
+    enableRowSelection?: boolean | ((row: Row$1<T>) => boolean);
+    clearFilters?: () => void;
+    hasFilters?: boolean;
+    isLoading?: boolean;
+    defaultPinnedColumns?: string[];
+    onClickRow?: ((row: Row$1<T>) => void) | null;
+} & PaginationProps;
+
+declare function TanstackTable<T extends object>({ columns: defaultColumns, data, className, currentPage, rowCount, rowsPerPage, onChangePage, totalEntriesText, TableActions, error, enableRowSelection, clearFilters, hasFilters, showPagination, isLoading, defaultPinnedColumns, onClickRow, actionBarClassName, }: Props<T & {
+    id: string;
+}>): react_jsx_runtime.JSX.Element;
+
+export { Badge, BarSpinner, Button, Card, Checkbox, CirclePulse, CircleSpinner, Col, Container, DatePicker, FloatUI, Form, Icon, IconTriggerDatePicker, LabeledInput as Input, Menu, Modal, LabeledPasswordInput as PasswordInput, Pill, Radio as RadioInput, Row, Select as SelectInput, SingleInputDatePicker, Skeleton, Table, TanstackTable, LabeledTextarea as Textarea, Toggle as ToggleInput, Tooltip, registerFontAwesomeIcons };