@fattureincloud/fic-design-system 0.4.9 → 0.4.10

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.
Files changed (66) hide show
  1. package/dist/components/form/datepicker/DatePicker.d.ts +5 -0
  2. package/dist/components/form/datepicker/DatePickerImpl.d.ts +25 -0
  3. package/dist/components/{table/components/actions/actionsContainer.d.ts → form/datepicker/StyledDatePicker.d.ts} +1 -1
  4. package/dist/components/form/datepicker/components/CustomButton.d.ts +7 -0
  5. package/dist/components/form/datepicker/components/DatePickerDay.d.ts +3 -0
  6. package/dist/components/form/datepicker/components/DatePickerHeader.d.ts +8 -0
  7. package/dist/components/form/datepicker/components/MonthPicker.d.ts +4 -0
  8. package/dist/components/form/datepicker/components/YearPicker.d.ts +6 -0
  9. package/dist/components/form/datepicker/components/hooks/useDatePickerHeaderShowLogic.d.ts +15 -0
  10. package/dist/components/form/datepicker/components/styled.d.ts +5 -0
  11. package/dist/components/form/datepicker/datePickerPalette.d.ts +33 -0
  12. package/dist/components/form/datepicker/datepicker.stories.d.ts +6 -0
  13. package/dist/components/form/datepicker/hooks/useDatePickerValues.d.ts +13 -0
  14. package/dist/components/form/datepicker/hooks/useFormattedDate.d.ts +12 -0
  15. package/dist/components/form/datepicker/hooks/useYearsList.d.ts +2 -0
  16. package/dist/components/form/datepicker/index.d.ts +5 -0
  17. package/dist/components/form/datepicker/types.d.ts +4 -0
  18. package/dist/components/form/datepicker/utils.d.ts +3 -0
  19. package/dist/components/form/fileUploader/styled.d.ts +2 -0
  20. package/dist/components/form/fileUploader/types.d.ts +2 -2
  21. package/dist/components/table/Table.d.ts +38 -7
  22. package/dist/components/table/components/TableBody.d.ts +2 -1
  23. package/dist/components/table/components/actions/ActionsCell.d.ts +10 -0
  24. package/dist/components/table/components/loadingCell/LoadingCell.d.ts +9 -0
  25. package/dist/components/table/components/tableBody/TableBody.d.ts +13 -0
  26. package/dist/components/table/components/tableBody/TableBodyLoader.d.ts +7 -0
  27. package/dist/components/table/components/tableBody/TableBodyTr.d.ts +7 -0
  28. package/dist/components/table/components/tableBody/styled.d.ts +3 -0
  29. package/dist/components/table/components/tableHeader/SortIndicator.d.ts +6 -0
  30. package/dist/components/table/components/tableHeader/TableHeader.d.ts +10 -0
  31. package/dist/components/table/components/tableParts/TableTd.d.ts +2 -1
  32. package/dist/components/table/components/tableParts/styled.d.ts +16 -1
  33. package/dist/components/table/hooks/useTableHooks.d.ts +2 -2
  34. package/dist/components/table/index.d.ts +3 -2
  35. package/dist/components/table/types.d.ts +1 -0
  36. package/dist/components/table/utils.d.ts +4 -1
  37. package/dist/index.d.ts +3 -2
  38. package/dist/index.esm.js +10 -4
  39. package/dist/index.esm.js.map +1 -1
  40. package/dist/index.js +9 -3
  41. package/dist/index.js.map +1 -1
  42. package/dist/styles/theme.d.ts +2 -0
  43. package/package.json +9 -2
  44. package/CHANGELOG.md +0 -386
  45. package/dist/components/form/fileUploader/hooks/useIcon.d.ts +0 -4
  46. package/dist/components/form/fileUploader/hooks/useTexts.d.ts +0 -3
  47. package/dist/components/table/components/actionLink.d.ts +0 -3
  48. package/dist/components/table/components/actions/actionsPopUp.d.ts +0 -12
  49. package/dist/components/table/components/actions/actionsPopUpButton.d.ts +0 -8
  50. package/dist/components/table/components/actions/actionsPopUpUnderlay.d.ts +0 -3
  51. package/dist/components/table/components/components/headDesktop.d.ts +0 -15
  52. package/dist/components/table/components/components/listMobile.d.ts +0 -15
  53. package/dist/components/table/components/components/rowDesktop.d.ts +0 -18
  54. package/dist/components/table/components/customizationModal/customizationsModal.d.ts +0 -10
  55. package/dist/components/table/components/customizationModal/index.d.ts +0 -2
  56. package/dist/components/table/components/customizationModal/styledWrapper.d.ts +0 -3
  57. package/dist/components/table/components/customizationModal/useDnd.d.ts +0 -8
  58. package/dist/components/table/components/customizationModal/utils.d.ts +0 -6
  59. package/dist/components/table/components/emptySet.d.ts +0 -10
  60. package/dist/components/table/components/linearBackground.d.ts +0 -1
  61. package/dist/components/table/components/loadingContent.d.ts +0 -7
  62. package/dist/components/table/components/sortIcon.d.ts +0 -2
  63. package/dist/components/table/components/styledWrapper.d.ts +0 -3
  64. package/dist/components/table/components/unstyledTable.d.ts +0 -11
  65. package/dist/components/table/typings/main.d.ts +0 -92
  66. package/dist/components/table/utils/configPersistency.d.ts +0 -14
@@ -0,0 +1,5 @@
1
+ import { LabelProps } from '../label';
2
+ import { DatePickerImplProps } from './DatePickerImpl';
3
+ export declare type DatePickerProps = LabelProps & DatePickerImplProps;
4
+ declare const DatePicker: (props: DatePickerProps) => JSX.Element;
5
+ export default DatePicker;
@@ -0,0 +1,25 @@
1
+ import { Dispatch, ReactChild, SetStateAction } from 'react';
2
+ import { ReactDatePickerProps } from 'react-datepicker';
3
+ import { CommonFormTypes } from '../common/types';
4
+ export declare type RenderCustomFooterType = (props: RenderCustomFooterProps) => ReactChild;
5
+ export declare type CustomButtonProps = {
6
+ text: string;
7
+ onClick: (props: RenderCustomFooterProps) => void;
8
+ };
9
+ export interface DatePickerImplProps extends Omit<ReactDatePickerProps, 'onChange'>, CommonFormTypes {
10
+ date: Date | null;
11
+ setDate: Dispatch<SetStateAction<Date | null>>;
12
+ allowMonthView?: boolean;
13
+ allowYearView?: boolean;
14
+ yearsDisplayed?: number;
15
+ hasTodayButton?: boolean;
16
+ customButtons?: CustomButtonProps[];
17
+ renderCustomFooter?: RenderCustomFooterType;
18
+ isPrefilled?: boolean;
19
+ }
20
+ export interface RenderCustomFooterProps extends DatePickerImplProps {
21
+ isOpen: boolean;
22
+ setIsOpen: Dispatch<SetStateAction<boolean>>;
23
+ }
24
+ declare const DatePickerImpl: (props: DatePickerImplProps) => JSX.Element;
25
+ export default DatePickerImpl;
@@ -1 +1 @@
1
- export declare const ActionsContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
1
+ export declare const StyledDatePicker: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
@@ -0,0 +1,7 @@
1
+ interface Props {
2
+ onClick: () => void;
3
+ selected?: boolean;
4
+ text: string;
5
+ }
6
+ declare const CustomButton: ({ onClick, selected, text }: Props) => JSX.Element;
7
+ export default CustomButton;
@@ -0,0 +1,3 @@
1
+ import { ReactDatePickerProps } from 'react-datepicker';
2
+ declare const DatePickerDay: ReactDatePickerProps['renderDayContents'];
3
+ export default DatePickerDay;
@@ -0,0 +1,8 @@
1
+ import { ReactDatePickerCustomHeaderProps } from 'react-datepicker';
2
+ export interface DatePickerHeaderProps extends ReactDatePickerCustomHeaderProps {
3
+ allowMonthView: boolean;
4
+ allowYearView: boolean;
5
+ yearsDisplayed: number;
6
+ }
7
+ declare const DatePickerHeader: (props: DatePickerHeaderProps) => JSX.Element;
8
+ export default DatePickerHeader;
@@ -0,0 +1,4 @@
1
+ import { ReactDatePickerCustomHeaderProps } from 'react-datepicker';
2
+ declare type Props = Pick<ReactDatePickerCustomHeaderProps, 'changeMonth' | 'date'>;
3
+ declare const MonthPicker: ({ changeMonth, date }: Props) => JSX.Element;
4
+ export default MonthPicker;
@@ -0,0 +1,6 @@
1
+ import { ReactDatePickerCustomHeaderProps } from 'react-datepicker';
2
+ interface Props extends Pick<ReactDatePickerCustomHeaderProps, 'date' | 'changeYear'> {
3
+ yearsDisplayed: number;
4
+ }
5
+ declare const YearPicker: ({ date, changeYear, yearsDisplayed }: Props) => JSX.Element;
6
+ export default YearPicker;
@@ -0,0 +1,15 @@
1
+ import { datePickerStatus } from '../../types';
2
+ import { DatePickerHeaderProps } from '../DatePickerHeader';
3
+ interface ReturnType {
4
+ status: datePickerStatus;
5
+ title: string;
6
+ leftArrowOnClick: () => void;
7
+ leftArrowIsDisabled: boolean;
8
+ rightArrowOnClick: () => void;
9
+ rightArrowIsDisabled: boolean;
10
+ onBottomArrowClick: () => void;
11
+ showBottomArrow: boolean;
12
+ showLRArrows: boolean;
13
+ }
14
+ declare const useDatePickerHeaderShowLogic: ({ date, decreaseMonth, increaseMonth, prevMonthButtonDisabled, nextMonthButtonDisabled, nextYearButtonDisabled, prevYearButtonDisabled, decreaseYear, increaseYear, allowYearView, allowMonthView, }: DatePickerHeaderProps) => ReturnType;
15
+ export default useDatePickerHeaderShowLogic;
@@ -0,0 +1,5 @@
1
+ interface DatePickerItemProps {
2
+ isActive: boolean;
3
+ }
4
+ export declare const DatePickerItem: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, DatePickerItemProps, never>;
5
+ export {};
@@ -0,0 +1,33 @@
1
+ import { colorsPalette } from '../../../common/types/colorsPalette';
2
+ import { paletteColor } from '../../../styles/types';
3
+ declare type itemStatus = 'normal' | 'active' | 'normalHover' | 'activeHover';
4
+ declare type DayPalette = {
5
+ borderRadius: string;
6
+ today: {
7
+ [k in itemStatus]: colorsPalette;
8
+ };
9
+ inMonth: {
10
+ [k in itemStatus]: colorsPalette;
11
+ };
12
+ outMonth: {
13
+ [k in Exclude<itemStatus, 'active' | 'activeHover'>]: colorsPalette;
14
+ };
15
+ };
16
+ declare type ItemStatusPalette = {
17
+ [k in itemStatus]: colorsPalette;
18
+ };
19
+ interface ItemPalette extends ItemStatusPalette {
20
+ borderRadius: string;
21
+ }
22
+ interface DaysNamesPalette {
23
+ color: paletteColor;
24
+ }
25
+ export interface DatePickerPalette {
26
+ background: paletteColor;
27
+ weekDaysNames: DaysNamesPalette;
28
+ days: DayPalette;
29
+ item: ItemPalette;
30
+ defaultYearsDisplayed: number;
31
+ }
32
+ declare const datePickerPalette: DatePickerPalette;
33
+ export default datePickerPalette;
@@ -0,0 +1,6 @@
1
+ import { Meta, Story } from '@storybook/react';
2
+ import { DatePickerProps } from './DatePicker';
3
+ export declare const Normal: Story<DatePickerProps>;
4
+ export declare const WithCustomButton: Story<DatePickerProps>;
5
+ declare const DatePickerStories: Meta<DatePickerProps>;
6
+ export default DatePickerStories;
@@ -0,0 +1,13 @@
1
+ import { Dispatch, SetStateAction } from 'react';
2
+ interface ReturnType {
3
+ date: Date | null;
4
+ setDate: Dispatch<SetStateAction<Date | null>>;
5
+ value: string | null;
6
+ setValue: Dispatch<SetStateAction<string | null>>;
7
+ }
8
+ interface Props {
9
+ initialDate?: Date | null;
10
+ initialValue?: string | null;
11
+ }
12
+ declare const useDatePickerValues: ({ initialDate, initialValue }?: Props) => ReturnType;
13
+ export default useDatePickerValues;
@@ -0,0 +1,12 @@
1
+ import { Dispatch, SetStateAction } from 'react';
2
+ import { DateFormats } from '../types';
3
+ declare type ReturnType = [Date | null, Dispatch<SetStateAction<Date | null>>, string | null, string];
4
+ /**
5
+ * Hook to manage a date in string format
6
+ * @param {string|null} initialValue Initial string value representing a date
7
+ * @param {DateFormats} allowedFormats Array of allowed formats, the hook will try to parse the initial value using this formats
8
+ * @param {dateFormat} outputFormat The string value returned by the hook will be formatted with this format
9
+ * @returns {[Date|null, function, string|null, string]} Returns an array with a Date object, the function to update it, a string representation of the date (formatted using the third parameter of the hook) and the currently used format
10
+ */
11
+ declare const useFormattedDate: (initialValue?: string | null | undefined, allowedFormats?: DateFormats | null | undefined, outputFormat?: string | undefined) => ReturnType;
12
+ export default useFormattedDate;
@@ -0,0 +1,2 @@
1
+ declare const useYearsList: (dateYear: number, page: number, yearsCount: number) => number[];
2
+ export default useYearsList;
@@ -0,0 +1,5 @@
1
+ import DatePicker, { DatePickerProps } from './DatePicker';
2
+ import datePickerPalette, { DatePickerPalette } from './datePickerPalette';
3
+ import useFormattedDate from './hooks/useFormattedDate';
4
+ import { timeConversionOptions } from './utils';
5
+ export { datePickerPalette, DatePickerProps, DatePickerPalette, DatePicker, useFormattedDate, timeConversionOptions };
@@ -0,0 +1,4 @@
1
+ export declare type datePickerStatus = 'dayPicker' | 'monthPicker' | 'yearPicker';
2
+ export declare const dateFormatsArray: [string, ...string[]];
3
+ export declare type dateFormat = typeof dateFormatsArray[number];
4
+ export declare type DateFormats = [dateFormat, ...dateFormat[]];
@@ -0,0 +1,3 @@
1
+ import { DateFormats } from './types';
2
+ export declare const timeConversionOptions: Intl.DateTimeFormatOptions;
3
+ export declare const findFormat: (value: string | null | undefined, formats: DateFormats) => string;
@@ -1,7 +1,9 @@
1
+ import { paletteColor } from '../../../styles/types';
1
2
  import { FileUploaderSize, statuses } from './types';
2
3
  interface ContainerProps {
3
4
  status: statuses;
4
5
  size: FileUploaderSize;
6
+ backgroundColor: paletteColor;
5
7
  }
6
8
  export declare const Container: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, ContainerProps, never>;
7
9
  export declare const OnDraggingOverlay: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, ContainerProps, never>;
@@ -4,14 +4,14 @@ export declare type FileUploaderStatus = typeof uploaderStatusesArray[number];
4
4
  export declare type statuses = FileUploaderStatus | 'dragging';
5
5
  export declare const uploaderSize: readonly ["small", "normal"];
6
6
  export declare type FileUploaderSize = typeof uploaderSize[number];
7
- export declare const typesArray: readonly ["unknown", "pdf", "image", "zip", "archive", "text", "document", "spreadsheet", "presentation", "xml", "csv"];
7
+ export declare const typesArray: readonly ["unknown", "pdf", "image", "zip", "archive", "text", "document", "spreadsheet", "presentation", "xml", "p7m", "csv"];
8
8
  export declare type FileType = typeof typesArray[number];
9
9
  declare type TypeDefinition = {
10
10
  mimeTypes: string[];
11
11
  extensions: string[];
12
12
  };
13
13
  export declare type FileTypesMap = Record<FileType, TypeDefinition>;
14
- export declare type CustomPaletteParts = Pick<FileUploaderParts, 'text' | 'caption' | 'icon'>;
14
+ export declare type CustomPaletteParts = Pick<FileUploaderParts, 'text' | 'caption' | 'icon' | 'background'>;
15
15
  export declare type CustomPalette = {
16
16
  [key in statuses]?: Partial<CustomPaletteParts>;
17
17
  };
@@ -1,20 +1,51 @@
1
1
  /// <reference types="react" />
2
2
  import { Row, UseTableOptions } from 'react-table';
3
3
  import { EmptyTablePageProps } from './components/EmptyState';
4
- import { ManualPagination, OnSort, RowActions, TableData } from './types';
4
+ import { ManualPagination, OnSelectionChange, OnSort, RowActions, TableData } from './types';
5
5
  export interface TableProps<T extends TableData> extends UseTableOptions<T> {
6
6
  sortable?: boolean;
7
+ onSort?: OnSort<T>;
8
+ noPagination?: boolean;
9
+ manualPagination?: ManualPagination;
10
+ onScroll?: () => void;
11
+ selectableRows?: boolean;
12
+ preSelectAllRows?: boolean;
13
+ onSelectionChange?: OnSelectionChange<T>;
14
+ onRowClick?: (row: Row<T>) => void;
15
+ globalFilter?: string;
7
16
  hideHeader?: boolean;
8
17
  EmptyPage?: EmptyTablePageProps['EmptyPage'];
9
18
  Footer?: JSX.Element;
10
- noPagination?: boolean;
11
- manualPagination?: ManualPagination;
12
19
  withCheckbox?: boolean;
13
- onSelectionChange?: (rows: Array<Row<T>>) => void;
20
+ isLoading?: boolean;
14
21
  actions?: RowActions<T>;
15
22
  renderActions?: () => JSX.Element;
16
- onSort?: OnSort<T>;
17
- globalFilter?: string;
23
+ bodyHeight?: number | string;
24
+ headerHeight?: number | string;
25
+ rowHeight?: number | string;
18
26
  }
19
- declare const Table: <T extends TableData>({ columns, data, EmptyPage, Footer, onSelectionChange, actions, renderActions, sortable, hideHeader, noPagination, manualPagination, withCheckbox, onSort, globalFilter: externalGlobalFilter, }: TableProps<T>) => JSX.Element;
27
+ /**
28
+ * Component Props:
29
+ * @param {boolean} sortable Makes all columns sortable, sort can be disabled for a single column inside columns definition
30
+ * @param {function} onSort Callback called on column sort change
31
+ * @param {boolean} noPagination Hide table paginator and disabled pagination
32
+ * @param {object} manualPagination If you want to manage the pagination by yourself
33
+ * @param {function} onScroll If pagination is disabled, this callback is called when user scroll to the bottom of the table
34
+ * @param {boolean} selectableRows Allow to select rows
35
+ * @param {boolean} preSelectAllRows Pre-select all rows
36
+ * @param {function} onSelectionChange Callback called when rows selection changes
37
+ * @param {function} onRowClick Callback called on row click
38
+ * @param {string} globalFilter Filter all columns by value
39
+ * @param {boolean} hideHeader Hide the table header
40
+ * @param {object} EmptyPage Configuration to show a custom component when table has no rows
41
+ * @param {JSX.Element} Footer Custom footer component
42
+ * @param {boolean} withCheckbox Show a column with checkboxes on left side of the table
43
+ * @param {boolean} isLoading Apply loading style to all cells
44
+ * @param {object} actions Configuration to render actions column
45
+ * @param {function} renderActions Used to customize actions column
46
+ * @param {number|string} bodyHeight Set tbody height, default 300px (if number is provided is considered as measure in pixels)
47
+ * @param {number|string} headerHeight Set thead and th height, default 40px (if number is provided is considered as measure in pixels)
48
+ * @param {number|string} rowHeight Set row height, default 40px (if number is provided is considered as measure in pixels)
49
+ */
50
+ declare const Table: <T extends TableData>({ actions, bodyHeight, columns, data, EmptyPage, Footer, globalFilter: externalGlobalFilter, headerHeight, hideHeader, isLoading, manualPagination, noPagination, onRowClick, onScroll, onSelectionChange, onSort, preSelectAllRows, renderActions, rowHeight, selectableRows, sortable, withCheckbox, }: TableProps<T>) => JSX.Element;
20
51
  export default Table;
@@ -4,8 +4,9 @@ interface Props<T extends TableData> {
4
4
  rows: Row<T>[];
5
5
  prepareRow: UseTableInstanceProps<T>['prepareRow'];
6
6
  selectedRowsIds: string[];
7
+ isLoading: boolean;
7
8
  }
8
- declare const TableBody: <T extends TableData>({ rows, prepareRow, selectedRowsIds }: Props<T>) => JSX.Element;
9
+ declare const TableBody: <T extends TableData>({ isLoading, rows, prepareRow, selectedRowsIds }: Props<T>) => JSX.Element;
9
10
  export interface TableBodyTrProps {
10
11
  isSelected?: boolean;
11
12
  isDisabled?: boolean;
@@ -0,0 +1,10 @@
1
+ /// <reference types="react" />
2
+ import { Row } from 'react-table';
3
+ import { RowActions, TableData } from '../../types';
4
+ interface Props<T extends TableData> {
5
+ row: Row<T>;
6
+ actions?: RowActions<T>;
7
+ renderActions?: () => JSX.Element;
8
+ }
9
+ declare const ActionsCell: <T extends TableData>({ row, actions, renderActions }: Props<T>) => JSX.Element;
10
+ export default ActionsCell;
@@ -0,0 +1,9 @@
1
+ import { Key } from 'react';
2
+ import { ColumnInstance } from 'react-table';
3
+ import { TableData } from '../../types';
4
+ interface LoadingCellProps<T extends TableData> {
5
+ column: ColumnInstance<T>;
6
+ key: Key;
7
+ }
8
+ declare const LoadingCell: <T extends TableData>({ column, key }: LoadingCellProps<T>) => JSX.Element;
9
+ export default LoadingCell;
@@ -0,0 +1,13 @@
1
+ import { Row, UseTableInstanceProps } from 'react-table';
2
+ import { TableData } from '../../types';
3
+ interface Props<T extends TableData> {
4
+ rows: Row<T>[];
5
+ prepareRow: UseTableInstanceProps<T>['prepareRow'];
6
+ selectedRowsIds: string[];
7
+ isLoading: boolean;
8
+ onRowClick?: (row: Row<T>) => void;
9
+ rowHeight?: number | string;
10
+ selectableRows?: boolean;
11
+ }
12
+ declare const TableBody: <T extends TableData>({ isLoading, onRowClick, prepareRow, rowHeight, rows, selectableRows, selectedRowsIds, }: Props<T>) => JSX.Element;
13
+ export default TableBody;
@@ -0,0 +1,7 @@
1
+ import { ColumnInstance } from 'react-table';
2
+ import { TableData } from '../../types';
3
+ interface Props<T extends TableData> {
4
+ allColumns: ColumnInstance<T>[];
5
+ }
6
+ declare const TableBodyLoader: <T extends TableData>({ allColumns }: Props<T>) => JSX.Element;
7
+ export default TableBodyLoader;
@@ -0,0 +1,7 @@
1
+ import { TableBodyTrStyles } from '../../utils';
2
+ export interface TableBodyTrProps {
3
+ isSelected?: boolean;
4
+ isDisabled?: boolean;
5
+ }
6
+ declare const TableBodyTr: import("styled-components").StyledComponent<"tr", import("styled-components").DefaultTheme, import("../tableParts/styled").TrProps & TableBodyTrStyles & TableBodyTrProps, keyof TableBodyTrStyles>;
7
+ export default TableBodyTr;
@@ -0,0 +1,3 @@
1
+ import { TableBodyTrStyles } from '../../utils';
2
+ import { TableBodyTrProps } from '../TableBody';
3
+ export declare const TableBodyTr: import("styled-components").StyledComponent<"tr", import("styled-components").DefaultTheme, import("../tableParts/styled").TrProps & TableBodyTrStyles & TableBodyTrProps, keyof TableBodyTrStyles>;
@@ -0,0 +1,6 @@
1
+ interface Props {
2
+ isSorted: boolean;
3
+ isSortedDesc?: boolean;
4
+ }
5
+ declare const SortIndicator: ({ isSorted, isSortedDesc }: Props) => JSX.Element;
6
+ export default SortIndicator;
@@ -0,0 +1,10 @@
1
+ import { HeaderGroup } from 'react-table';
2
+ import { TableData } from '../../types';
3
+ interface Props<T extends TableData> {
4
+ scrollBar: number;
5
+ headerGroups: HeaderGroup<T>[];
6
+ headerHeight?: number | string;
7
+ selectedRowsIds?: string[];
8
+ }
9
+ declare const TableHeader: <T extends TableData>({ headerHeight, headerGroups, scrollBar }: Props<T>) => JSX.Element;
10
+ export default TableHeader;
@@ -2,6 +2,7 @@ import React from 'react';
2
2
  declare type alignType = 'left' | 'center' | 'right';
3
3
  interface Props extends React.HTMLAttributes<HTMLTableDataCellElement> {
4
4
  align?: alignType;
5
+ isLoading?: boolean;
5
6
  }
6
- export declare const TableTd: import("styled-components").StyledComponent<({ children, align, ...rest }: Props) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
7
+ export declare const TableTd: import("styled-components").StyledComponent<({ children, align, isLoading, ...rest }: Props) => JSX.Element, import("styled-components").DefaultTheme, Props, never>;
7
8
  export default TableTd;
@@ -1,2 +1,17 @@
1
1
  export declare const TableWrapper: import("styled-components").StyledComponent<"table", import("styled-components").DefaultTheme, {}, never>;
2
- export declare const TableTr: import("styled-components").StyledComponent<"tr", import("styled-components").DefaultTheme, {}, never>;
2
+ interface THeadProps {
3
+ scrollBar: number;
4
+ }
5
+ export declare const THead: import("styled-components").StyledComponent<"thead", import("styled-components").DefaultTheme, THeadProps, never>;
6
+ interface TableBodyProps {
7
+ bodyHeight?: number | string;
8
+ }
9
+ export declare const TBody: import("styled-components").StyledComponent<"tbody", import("styled-components").DefaultTheme, TableBodyProps, never>;
10
+ export interface TrProps {
11
+ isHeader?: boolean;
12
+ rowHeight?: number | string;
13
+ headerHeight?: number | string;
14
+ }
15
+ export declare const TableTr: import("styled-components").StyledComponent<"tr", import("styled-components").DefaultTheme, TrProps, never>;
16
+ export declare const TFoot: import("styled-components").StyledComponent<"tfoot", import("styled-components").DefaultTheme, {}, never>;
17
+ export {};
@@ -1,6 +1,6 @@
1
1
  import { PluginHook } from 'react-table';
2
2
  import { TableProps } from '../Table';
3
3
  import { TableData } from '../types';
4
- declare type Props<T extends TableData> = Pick<TableProps<T>, 'actions' | 'withCheckbox' | 'renderActions'>;
5
- declare const useTableHooks: <T extends TableData>({ actions, renderActions, withCheckbox }: Props<T>) => PluginHook<T>[];
4
+ declare type Props<T extends TableData> = Pick<TableProps<T>, 'actions' | 'withCheckbox' | 'renderActions' | 'selectableRows'>;
5
+ declare const useTableHooks: <T extends TableData>({ actions, renderActions, withCheckbox, selectableRows, }: Props<T>) => PluginHook<T>[];
6
6
  export default useTableHooks;
@@ -1,6 +1,7 @@
1
+ import { Column, Row } from 'react-table';
1
2
  import useTableValues from './hooks/useTableValues';
2
3
  import Table from './Table';
3
4
  import { TableProps } from './Table';
4
5
  import tablePalette, { TablePalette } from './tablePalette';
5
- import { ManualPagination, OnSort, RowActions, TableData } from './types';
6
- export { Table, TableProps, TableData, tablePalette, useTableValues, TablePalette, RowActions, ManualPagination, OnSort, };
6
+ import { ManualPagination, OnSelectionChange, OnSort, RowActions, TableData } from './types';
7
+ export { Table, TableProps, TableData, tablePalette, useTableValues, TablePalette, RowActions, ManualPagination, OnSelectionChange, OnSort, Row, Column, };
@@ -24,4 +24,5 @@ interface ManualPaginationConfig {
24
24
  }
25
25
  export declare type ManualPagination = ManualPaginationConfig | undefined;
26
26
  export declare type OnSort<T extends TableData> = (sortBy: Array<SortingRule<T>>) => void;
27
+ export declare type OnSelectionChange<T extends TableData> = (rows: Row<T>[], addedRows: Row<T>[], removedRows: Row<T>[]) => void;
27
28
  export {};
@@ -1,6 +1,7 @@
1
+ import { Row, TableData } from 'index';
1
2
  import { DefaultTheme } from 'styled-components';
2
3
  import { paletteColor } from '../../styles/types';
3
- import { TableBodyTrProps } from './components/TableBody';
4
+ import { TableBodyTrProps } from './components/tableBody/TableBodyTr';
4
5
  interface GetTableBodyTrStylesParams extends TableBodyTrProps {
5
6
  theme: DefaultTheme;
6
7
  }
@@ -11,4 +12,6 @@ export interface TableBodyTrStyles {
11
12
  hoverBackground: paletteColor;
12
13
  }
13
14
  export declare const getTableBodyTrStyles: ({ theme, isDisabled, isSelected, }: GetTableBodyTrStylesParams) => TableBodyTrStyles;
15
+ export declare const isNumber: (n: number | string | undefined) => boolean;
16
+ export declare const getIdsFromRows: <T extends TableData>(rows: Row<T>[] | undefined) => string[];
14
17
  export {};
package/dist/index.d.ts CHANGED
@@ -8,6 +8,7 @@ import { Drawer } from './components/drawer';
8
8
  import { closeDropdownType, Dropdown, DropdownItemProps, DropdownPalette, renderContentType } from './components/dropdown';
9
9
  import { WithBadge } from './components/floatingBadge';
10
10
  import { Checkbox, CheckboxPalette, CheckboxProps, checkboxStatus, useCheckboxValue } from './components/form/checkbox';
11
+ import { DatePicker, DatePickerPalette, DatePickerProps, timeConversionOptions, useFormattedDate } from './components/form/datepicker';
11
12
  import { FileRejection, FileUploader, fileUploaderOnDrop, FileUploaderPalette, FileUploaderProps } from './components/form/fileUploader';
12
13
  import { InputHelper, InputHelperPalette, InputHelperProps } from './components/form/inputHelper';
13
14
  import { InputText, InputTextPalette, InputTextProps, UnitDropdownProps } from './components/form/inputText';
@@ -28,7 +29,7 @@ import { Pagination } from './components/pagination';
28
29
  import { Progressbar } from './components/progressbar';
29
30
  import { RadioButton } from './components/radioButton';
30
31
  import { Stepper, StepperPalette, StepperProps } from './components/stepper';
31
- import { ManualPagination, OnSort, RowActions, Table, TableData, TablePalette, TableProps, useTableValues } from './components/table';
32
+ import { Column, ManualPagination, OnSelectionChange, OnSort, Row, RowActions, Table, TableData, TablePalette, TableProps, useTableValues } from './components/table';
32
33
  import { DropdownTabs, ScrollableTabs, TabsItem } from './components/tabs';
33
34
  import { Tag, TagPalette, TagProps } from './components/tag';
34
35
  import { ThemeProvider } from './components/themeProvider';
@@ -38,4 +39,4 @@ import { Tooltip, TooltipPalette, TooltipProps } from './components/tooltip';
38
39
  import { autocompleteYellow } from './styles/defaultPalette/colors/others';
39
40
  import { Theme } from './styles/theme';
40
41
  import { Palette, paletteColor } from './styles/types';
41
- export { autocompleteYellow, paletteColor, Avatar, Banner, BannerProps, Button, ButtonProps, IconButton, IconButtonProps, Icon, IconProps, IconPalette, IconBackground, IconBackgroundPalette, Table, TableProps, TableData, useTableValues, TablePalette, RowActions, ManualPagination, OnSort, Checkbox, useCheckboxValue, CheckboxProps, CheckboxPalette, checkboxStatus, Select, CreatableSelect, AsyncSelect, AsyncCreatableSelect, SelectProps, AsyncSelectProps, AsyncCreatableSelectProps, useSelectSimpleValue, isSimpleValue, simpleValue, CreatableSelectProps, useSelectValue, useSelectMultiValues, SelectPalette, SelectComponentsType, OptionType, PageEmptySet, Modal, ModalBody, ModalSearchable, Tooltip, TooltipProps, TooltipPalette, Accordion, Progressbar, Drawer, Chip, RadioButton, RadioButtonGroup, InlineMessage, Badge, BadgeProps, Dropdown, DropdownItemProps, DropdownPalette, closeDropdownType, renderContentType, DropdownTabs, ScrollableTabs, SidebarItem, sidebarItemHeight, SidebarItemPalette, SidebarItemProps, CustomSidebarItemProps, TabsItem, Stepper, StepperProps, StepperPalette, Tip, ShortcutTip, ThemeProvider, Theme, Palette, GroupedList, ItemType, GroupType, WithBadge, Pagination, Toast, ToastProps, ConfirmationModal, MicroTag, MicroTagProps, MicroTagPalette, Tag, TagProps, TagPalette, InputText, InputTextProps, InputTextPalette, UnitDropdownProps, InputHelper, InputHelperProps, InputHelperPalette, TextArea, TextAreaProps, TextAreaPalette, FileUploader, FileUploaderProps, FileUploaderPalette, FileRejection, fileUploaderOnDrop, };
42
+ export { autocompleteYellow, paletteColor, Avatar, Banner, BannerProps, Button, ButtonProps, IconButton, IconButtonProps, Icon, IconProps, IconPalette, IconBackground, IconBackgroundPalette, Table, TableProps, TableData, useTableValues, Row, Column, TablePalette, RowActions, ManualPagination, OnSelectionChange, OnSort, Checkbox, useCheckboxValue, CheckboxProps, CheckboxPalette, checkboxStatus, Select, CreatableSelect, AsyncSelect, AsyncCreatableSelect, SelectProps, AsyncSelectProps, AsyncCreatableSelectProps, useSelectSimpleValue, isSimpleValue, simpleValue, CreatableSelectProps, useSelectValue, useSelectMultiValues, SelectPalette, SelectComponentsType, OptionType, PageEmptySet, Modal, ModalBody, ModalSearchable, Tooltip, TooltipProps, TooltipPalette, Accordion, Progressbar, Drawer, Chip, RadioButton, RadioButtonGroup, InlineMessage, Badge, BadgeProps, Dropdown, DropdownItemProps, DropdownPalette, closeDropdownType, renderContentType, DropdownTabs, ScrollableTabs, SidebarItem, sidebarItemHeight, SidebarItemPalette, SidebarItemProps, CustomSidebarItemProps, TabsItem, Stepper, StepperProps, StepperPalette, Tip, ShortcutTip, ThemeProvider, Theme, Palette, GroupedList, ItemType, GroupType, WithBadge, Pagination, Toast, ToastProps, ConfirmationModal, MicroTag, MicroTagProps, MicroTagPalette, Tag, TagProps, TagPalette, InputText, InputTextProps, InputTextPalette, UnitDropdownProps, DatePickerProps, DatePickerPalette, DatePicker, useFormattedDate, timeConversionOptions, InputHelper, InputHelperProps, InputHelperPalette, TextArea, TextAreaProps, TextAreaPalette, FileUploader, FileUploaderProps, FileUploaderPalette, FileRejection, fileUploaderOnDrop, };