@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.
- package/dist/components/form/datepicker/hooks/useFormattedDate.d.ts +12 -0
- package/dist/components/form/datepicker/index.d.ts +2 -2
- package/dist/components/form/datepicker/types.d.ts +3 -0
- package/dist/components/form/datepicker/utils.d.ts +2 -0
- package/dist/components/form/fileUploader/styled.d.ts +2 -0
- package/dist/components/form/fileUploader/types.d.ts +2 -2
- package/dist/components/table/Table.d.ts +38 -10
- package/dist/components/table/components/tableBody/TableBody.d.ts +13 -0
- package/dist/components/table/components/tableBody/TableBodyTr.d.ts +7 -0
- package/dist/components/table/components/tableHeader/TableHeader.d.ts +5 -2
- package/dist/components/table/components/tableParts/TableTd.d.ts +1 -1
- package/dist/components/table/components/tableParts/styled.d.ts +11 -2
- package/dist/components/table/index.d.ts +2 -2
- package/dist/components/table/types.d.ts +1 -0
- package/dist/components/table/utils.d.ts +4 -1
- package/dist/index.d.ts +3 -3
- package/dist/index.esm.js +4 -4
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +3 -3
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
@@ -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
|
3
|
+
import useFormattedDate from './hooks/useFormattedDate';
|
4
4
|
import { timeConversionOptions } from './utils';
|
5
|
-
export { datePickerPalette, DatePickerProps, DatePickerPalette, DatePicker,
|
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,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
|
-
|
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
|
-
|
20
|
+
isLoading?: boolean;
|
15
21
|
actions?: RowActions<T>;
|
16
22
|
renderActions?: () => JSX.Element;
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
selectableRows?: boolean;
|
23
|
+
bodyHeight?: number | string;
|
24
|
+
headerHeight?: number | string;
|
25
|
+
rowHeight?: number | string;
|
21
26
|
}
|
22
|
-
|
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
|
7
|
-
export default
|
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
|
-
|
3
|
-
|
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/
|
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,
|
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,
|
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, };
|