@fattureincloud/fic-design-system 0.4.9-expenses.1.2 → 0.4.9-expenses.1.5

Sign up to get free protection for your applications and to get access to all the features.
@@ -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} args_0 Initial string value representing a date
7
+ * @param {DateFormats} args_1 Array of allowed formats, the hook will try to parse the initial value using this formats
8
+ * @param {dateFormat} args_2 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: (args_0?: string | null | undefined, args_1?: DateFormats | null | undefined, args_2?: string | undefined) => ReturnType;
12
+ export default useFormattedDate;
@@ -1,5 +1,5 @@
1
1
  import DatePicker, { DatePickerProps } from './DatePicker';
2
2
  import datePickerPalette, { DatePickerPalette } from './datePickerPalette';
3
- import useDatePickerValues from './hooks/useDatePickerValues';
3
+ import useFormattedDate from './hooks/useFormattedDate';
4
4
  import { timeConversionOptions } from './utils';
5
- export { datePickerPalette, DatePickerProps, DatePickerPalette, DatePicker, useDatePickerValues, timeConversionOptions };
5
+ export { datePickerPalette, DatePickerProps, DatePickerPalette, DatePicker, useFormattedDate, timeConversionOptions };
@@ -1 +1,4 @@
1
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[]];
@@ -1 +1,3 @@
1
+ import { DateFormats } from './types';
1
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,23 +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
- hideHeader?: boolean;
8
- EmptyPage?: EmptyTablePageProps['EmptyPage'];
9
- Footer?: JSX.Element;
7
+ onSort?: OnSort<T>;
10
8
  noPagination?: boolean;
11
9
  manualPagination?: ManualPagination;
12
10
  onScroll?: () => void;
11
+ selectableRows?: boolean;
12
+ preSelectAllRows?: boolean;
13
+ onSelectionChange?: OnSelectionChange<T>;
14
+ onRowClick?: (row: Row<T>) => void;
15
+ globalFilter?: string;
16
+ hideHeader?: boolean;
17
+ EmptyPage?: EmptyTablePageProps['EmptyPage'];
18
+ Footer?: JSX.Element;
13
19
  withCheckbox?: boolean;
14
- onSelectionChange?: (rows: Array<Row<T>>) => void;
20
+ isLoading?: boolean;
15
21
  actions?: RowActions<T>;
16
22
  renderActions?: () => JSX.Element;
17
- onSort?: OnSort<T>;
18
- globalFilter?: string;
19
- isLoading?: boolean;
20
- selectableRows?: boolean;
23
+ bodyHeight?: number | string;
24
+ headerHeight?: number | string;
25
+ rowHeight?: number | string;
21
26
  }
22
- declare const Table: <T extends TableData>({ columns, data, EmptyPage, Footer, onSelectionChange, actions, renderActions, sortable, hideHeader, noPagination, manualPagination, onScroll, withCheckbox, onSort, globalFilter: externalGlobalFilter, isLoading, selectableRows, }: 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;
23
51
  export default Table;
@@ -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 { 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;
@@ -1,7 +1,10 @@
1
1
  import { HeaderGroup } from 'react-table';
2
2
  import { TableData } from '../../types';
3
3
  interface Props<T extends TableData> {
4
+ scrollBar: number;
4
5
  headerGroups: HeaderGroup<T>[];
6
+ headerHeight?: number | string;
7
+ selectedRowsIds?: string[];
5
8
  }
6
- declare const TableHeaders: <T extends TableData>({ headerGroups }: Props<T>) => JSX.Element;
7
- export default TableHeaders;
9
+ declare const TableHeader: <T extends TableData>({ headerHeight, headerGroups, scrollBar }: Props<T>) => JSX.Element;
10
+ export default TableHeader;
@@ -4,5 +4,5 @@ interface Props extends React.HTMLAttributes<HTMLTableDataCellElement> {
4
4
  align?: alignType;
5
5
  isLoading?: boolean;
6
6
  }
7
- export declare const TableTd: import("styled-components").StyledComponent<({ children, align, ...rest }: Props) => JSX.Element, import("styled-components").DefaultTheme, Props, never>;
7
+ export declare const TableTd: import("styled-components").StyledComponent<({ children, align, isLoading, ...rest }: Props) => JSX.Element, import("styled-components").DefaultTheme, Props, never>;
8
8
  export default TableTd;
@@ -1,8 +1,17 @@
1
1
  export declare const TableWrapper: import("styled-components").StyledComponent<"table", import("styled-components").DefaultTheme, {}, never>;
2
- export declare const THead: import("styled-components").StyledComponent<"thead", import("styled-components").DefaultTheme, {}, never>;
3
- export declare const TBody: import("styled-components").StyledComponent<"tbody", 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>;
4
10
  export interface TrProps {
5
11
  isHeader?: boolean;
12
+ rowHeight?: number | string;
13
+ headerHeight?: number | string;
6
14
  }
7
15
  export declare const TableTr: import("styled-components").StyledComponent<"tr", import("styled-components").DefaultTheme, TrProps, never>;
8
16
  export declare const TFoot: import("styled-components").StyledComponent<"tfoot", import("styled-components").DefaultTheme, {}, never>;
17
+ export {};
@@ -3,5 +3,5 @@ import useTableValues from './hooks/useTableValues';
3
3
  import Table from './Table';
4
4
  import { TableProps } from './Table';
5
5
  import tablePalette, { TablePalette } from './tablePalette';
6
- import { ManualPagination, OnSort, RowActions, TableData } from './types';
7
- export { Table, TableProps, TableData, tablePalette, useTableValues, TablePalette, RowActions, ManualPagination, OnSort, Row, Column, };
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,7 +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, useDatePickerValues } from './components/form/datepicker';
11
+ import { DatePicker, DatePickerPalette, DatePickerProps, timeConversionOptions, useFormattedDate } from './components/form/datepicker';
12
12
  import { FileRejection, FileUploader, fileUploaderOnDrop, FileUploaderPalette, FileUploaderProps } from './components/form/fileUploader';
13
13
  import { InputHelper, InputHelperPalette, InputHelperProps } from './components/form/inputHelper';
14
14
  import { InputText, InputTextPalette, InputTextProps, UnitDropdownProps } from './components/form/inputText';
@@ -29,7 +29,7 @@ import { Pagination } from './components/pagination';
29
29
  import { Progressbar } from './components/progressbar';
30
30
  import { RadioButton } from './components/radioButton';
31
31
  import { Stepper, StepperPalette, StepperProps } from './components/stepper';
32
- import { Column, ManualPagination, OnSort, Row, 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';
33
33
  import { DropdownTabs, ScrollableTabs, TabsItem } from './components/tabs';
34
34
  import { Tag, TagPalette, TagProps } from './components/tag';
35
35
  import { ThemeProvider } from './components/themeProvider';
@@ -39,4 +39,4 @@ import { Tooltip, TooltipPalette, TooltipProps } from './components/tooltip';
39
39
  import { autocompleteYellow } from './styles/defaultPalette/colors/others';
40
40
  import { Theme } from './styles/theme';
41
41
  import { Palette, paletteColor } from './styles/types';
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, 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, useDatePickerValues, timeConversionOptions, 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, };