@fattureincloud/fic-design-system 0.4.6 → 0.4.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (59) hide show
  1. package/CHANGELOG.md +24 -1
  2. package/dist/components/form/checkbox/index.d.ts +2 -1
  3. package/dist/components/form/fileUploader/FileUploader.d.ts +14 -0
  4. package/dist/components/form/fileUploader/components/FileUploaderContent.d.ts +12 -0
  5. package/dist/components/form/fileUploader/fileUploader.stories.d.ts +5 -0
  6. package/dist/components/form/fileUploader/fileUploaderPalette.d.ts +18 -0
  7. package/dist/components/form/fileUploader/hooks/useCustomPalette.d.ts +3 -0
  8. package/dist/components/form/fileUploader/hooks/useIcon.d.ts +4 -0
  9. package/dist/components/form/fileUploader/hooks/useTexts.d.ts +3 -0
  10. package/dist/components/form/fileUploader/index.d.ts +4 -0
  11. package/dist/components/form/fileUploader/styled.d.ts +14 -0
  12. package/dist/components/form/fileUploader/types.d.ts +18 -0
  13. package/dist/components/form/fileUploader/utils.d.ts +2 -0
  14. package/dist/components/form/inputText/types.d.ts +1 -1
  15. package/dist/components/table/Table.d.ts +20 -0
  16. package/dist/components/table/components/ActionsCell.d.ts +10 -0
  17. package/dist/components/table/components/EmptyState.d.ts +7 -0
  18. package/dist/components/table/components/Pagination.d.ts +7 -0
  19. package/dist/components/table/components/SelectedRowsCount.d.ts +6 -0
  20. package/dist/components/table/components/SortIndicator.d.ts +6 -0
  21. package/dist/components/table/components/TableBody.d.ts +13 -0
  22. package/dist/components/table/components/TableFoot.d.ts +2 -0
  23. package/dist/components/table/components/TableHeader.d.ts +7 -0
  24. package/dist/components/table/components/actions/DropdownActions.d.ts +9 -0
  25. package/dist/components/table/components/actions/PrimaryAction.d.ts +11 -0
  26. package/dist/components/table/components/checkboxes/Cell.d.ts +4 -0
  27. package/dist/components/table/components/checkboxes/Header.d.ts +4 -0
  28. package/dist/components/table/components/checkboxes/useHeaderCheckboxProps.d.ts +12 -0
  29. package/dist/components/table/components/pagination/PageButton.d.ts +10 -0
  30. package/dist/components/table/components/pagination/PaginationButtons.d.ts +9 -0
  31. package/dist/components/table/components/pagination/utils.d.ts +14 -0
  32. package/dist/components/table/components/tableParts/TableTd.d.ts +7 -0
  33. package/dist/components/table/components/tableParts/TableTh.d.ts +4 -0
  34. package/dist/components/table/components/tableParts/styled.d.ts +2 -0
  35. package/dist/components/table/hooks/useCheckboxesComponents.d.ts +4 -0
  36. package/dist/components/table/hooks/useTableHooks.d.ts +6 -0
  37. package/dist/components/table/hooks/useTableValues.d.ts +14 -0
  38. package/dist/components/table/index.d.ts +6 -2
  39. package/dist/components/table/stories/columns.d.ts +3 -0
  40. package/dist/components/table/stories/components/CustomPerson.d.ts +6 -0
  41. package/dist/components/table/stories/components/Role.d.ts +7 -0
  42. package/dist/components/table/stories/components/types.d.ts +14 -0
  43. package/dist/components/table/stories/data.d.ts +2 -0
  44. package/dist/components/table/table.stories.d.ts +5 -8
  45. package/dist/components/table/tablePalette.d.ts +33 -0
  46. package/dist/components/table/types.d.ts +27 -0
  47. package/dist/components/table/utils.d.ts +14 -0
  48. package/dist/index.d.ts +4 -3
  49. package/dist/index.esm.js +15 -2
  50. package/dist/index.esm.js.map +1 -1
  51. package/dist/index.js +14 -1
  52. package/dist/index.js.map +1 -1
  53. package/dist/styles/theme.d.ts +4 -0
  54. package/package.json +13 -13
  55. package/dist/components/form/inputText/components/UnitDropdownTrigger.d.ts +0 -5
  56. package/dist/components/table/components/pagination.d.ts +0 -2
  57. package/dist/components/table/table.d.ts +0 -2
  58. package/dist/package.json +0 -98
  59. package/dist/styles/elevations.d.ts +0 -7
package/CHANGELOG.md CHANGED
@@ -1,5 +1,28 @@
1
1
  # Changelog
2
2
 
3
+ ## v0.4.9 - 23/02/2022
4
+
5
+ ### 🐛 Bug Fix
6
+
7
+ - Fix FontAwesome version
8
+
9
+ ## v0.4.8 - 23/02/2022
10
+
11
+ ### 🐛 Bug Fix
12
+
13
+ - Downgrade FontAwesome to v5 due to browser compatibility issues
14
+
15
+ ## v0.4.7 - 22/02/2022
16
+
17
+ ### 🚀 Added
18
+
19
+ - Add new FileUploader component
20
+ - Add new Table component
21
+
22
+ ### 🐛 Bug Fix
23
+
24
+ - Fix appearance of multiline (long) Select Options
25
+
3
26
  ## v0.4.6 - 15/02/2022
4
27
 
5
28
  ### 🚀 Added
@@ -23,7 +46,7 @@
23
46
 
24
47
  ## v0.4.5 - 08/02/2022
25
48
 
26
- - Update FontAwesome to v6.0.0
49
+ - Update FontAwesome to v6.0.0 (Downgraded to v5 in v0.4.8)
27
50
 
28
51
  ## v0.4.4 - 25/01/2022
29
52
 
@@ -1,4 +1,5 @@
1
1
  import Checkbox, { CheckboxProps } from './Checkbox';
2
2
  import checkboxPalette, { CheckboxPalette } from './checkboxPalette';
3
3
  import useCheckboxValue from './hooks/useCheckboxValue';
4
- export { Checkbox, useCheckboxValue, CheckboxProps, checkboxPalette, CheckboxPalette };
4
+ import { checkboxStatus } from './types';
5
+ export { Checkbox, useCheckboxValue, CheckboxProps, checkboxPalette, CheckboxPalette, checkboxStatus };
@@ -0,0 +1,14 @@
1
+ import { FileRejection } from 'react-dropzone';
2
+ import { CustomPalette, FileType, FileUploaderSize, FileUploaderStatus } from './types';
3
+ export declare type fileUploaderOnDrop = (acceptedFiles: File[], rejectedFiles: FileRejection[]) => void;
4
+ export interface FileUploaderProps {
5
+ allowedTypes: FileType[];
6
+ className?: string;
7
+ multiple?: boolean;
8
+ onDrop: fileUploaderOnDrop;
9
+ size?: FileUploaderSize;
10
+ status?: FileUploaderStatus;
11
+ customPalette?: CustomPalette;
12
+ }
13
+ declare const FileUploader: ({ allowedTypes, customPalette, className, multiple, onDrop, size, status, }: FileUploaderProps) => JSX.Element;
14
+ export default FileUploader;
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import { IconProps } from '../../../icon';
3
+ import { FileUploaderSize, statuses } from '../types';
4
+ interface Props {
5
+ icon: IconProps | null;
6
+ status: statuses;
7
+ text?: React.ReactChild | null;
8
+ caption?: React.ReactChild | null;
9
+ size: FileUploaderSize;
10
+ }
11
+ declare const FileUploaderContent: ({ icon, status, text, caption, size }: Props) => JSX.Element;
12
+ export default FileUploaderContent;
@@ -0,0 +1,5 @@
1
+ import { Meta, Story } from '@storybook/react';
2
+ import { FileUploaderProps } from './FileUploader';
3
+ export declare const WithKnobs: Story<FileUploaderProps>;
4
+ declare const FileUploaderStories: Meta<FileUploaderProps>;
5
+ export default FileUploaderStories;
@@ -0,0 +1,18 @@
1
+ /// <reference types="react" />
2
+ import { paletteColor } from '../../../styles/types';
3
+ import { IconProps } from '../../icon';
4
+ import { statuses } from './types';
5
+ export declare type FileUploaderParts = {
6
+ background: paletteColor;
7
+ borderColor: paletteColor;
8
+ color: paletteColor;
9
+ secondaryColor: paletteColor;
10
+ text: React.ReactChild | null;
11
+ caption: React.ReactChild | null;
12
+ icon: IconProps | null;
13
+ };
14
+ export declare type FileUploaderPalette = {
15
+ [key in statuses]: FileUploaderParts;
16
+ };
17
+ declare const fileUploaderPalette: FileUploaderPalette;
18
+ export default fileUploaderPalette;
@@ -0,0 +1,3 @@
1
+ import { CustomPalette, CustomPaletteParts, statuses } from '../types';
2
+ declare const useCustomPalette: (status: statuses, customPalette?: CustomPalette | undefined) => CustomPaletteParts;
3
+ export default useCustomPalette;
@@ -0,0 +1,4 @@
1
+ import { IconProps } from '../../../icon';
2
+ import { statuses } from '../types';
3
+ declare const useIcon: (status: statuses, icon?: IconProps | null | undefined) => IconProps | null;
4
+ export default useIcon;
@@ -0,0 +1,3 @@
1
+ import { statuses } from '../types';
2
+ declare const useTexts: (status: statuses, customTexts?: any) => any;
3
+ export default useTexts;
@@ -0,0 +1,4 @@
1
+ import { FileRejection } from 'react-dropzone';
2
+ import FileUploader, { fileUploaderOnDrop, FileUploaderProps } from './FileUploader';
3
+ import fileUploaderPalette, { FileUploaderPalette } from './fileUploaderPalette';
4
+ export { FileUploader, FileUploaderProps, fileUploaderPalette, FileUploaderPalette, FileRejection, fileUploaderOnDrop };
@@ -0,0 +1,14 @@
1
+ import { FileUploaderSize, statuses } from './types';
2
+ interface ContainerProps {
3
+ status: statuses;
4
+ size: FileUploaderSize;
5
+ }
6
+ export declare const Container: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, ContainerProps, never>;
7
+ export declare const OnDraggingOverlay: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, ContainerProps, never>;
8
+ export declare const MainText: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
9
+ status: statuses;
10
+ }, never>;
11
+ export declare const CaptionText: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
12
+ status: statuses;
13
+ }, never>;
14
+ export {};
@@ -0,0 +1,18 @@
1
+ import { FileUploaderParts } from './fileUploaderPalette';
2
+ export declare const uploaderStatusesArray: readonly ["default", "uploading", "success", "error", "disabled"];
3
+ export declare type FileUploaderStatus = typeof uploaderStatusesArray[number];
4
+ export declare type statuses = FileUploaderStatus | 'dragging';
5
+ export declare const uploaderSize: readonly ["small", "normal"];
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"];
8
+ export declare type FileType = typeof typesArray[number];
9
+ declare type TypeDefinition = {
10
+ mimeTypes: string[];
11
+ extensions: string[];
12
+ };
13
+ export declare type FileTypesMap = Record<FileType, TypeDefinition>;
14
+ export declare type CustomPaletteParts = Pick<FileUploaderParts, 'text' | 'caption' | 'icon'>;
15
+ export declare type CustomPalette = {
16
+ [key in statuses]?: Partial<CustomPaletteParts>;
17
+ };
18
+ export {};
@@ -0,0 +1,2 @@
1
+ import { FileTypesMap } from './types';
2
+ export declare const fileTypesMap: FileTypesMap;
@@ -2,7 +2,7 @@ import { Dispatch, InputHTMLAttributes, ReactText, SetStateAction } from 'react'
2
2
  import { IconProps } from '../../icon';
3
3
  import { CommonFormTypes } from '../common/types';
4
4
  import { UnitDropdownProps } from './components/UnitDropdown';
5
- export declare const inputTypesArray: string[];
5
+ export declare const inputTypesArray: readonly ["password", "text", "number"];
6
6
  export declare type inputTypes = typeof inputTypesArray[number];
7
7
  export interface InputElementProps extends CommonFormTypes, Pick<InputHTMLAttributes<HTMLInputElement>, 'autoFocus' | 'name' | 'onChange' | 'onBlur' | 'onFocus' | 'onKeyPress' | 'onKeyUp' | 'onKeyDown' | 'required' | 'className'> {
8
8
  leadingIcon?: IconProps;
@@ -0,0 +1,20 @@
1
+ /// <reference types="react" />
2
+ import { Row, UseTableOptions } from 'react-table';
3
+ import { EmptyTablePageProps } from './components/EmptyState';
4
+ import { ManualPagination, OnSort, RowActions, TableData } from './types';
5
+ export interface TableProps<T extends TableData> extends UseTableOptions<T> {
6
+ sortable?: boolean;
7
+ hideHeader?: boolean;
8
+ EmptyPage?: EmptyTablePageProps['EmptyPage'];
9
+ Footer?: JSX.Element;
10
+ noPagination?: boolean;
11
+ manualPagination?: ManualPagination;
12
+ withCheckbox?: boolean;
13
+ onSelectionChange?: (rows: Array<Row<T>>) => void;
14
+ actions?: RowActions<T>;
15
+ renderActions?: () => JSX.Element;
16
+ onSort?: OnSort<T>;
17
+ globalFilter?: string;
18
+ }
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;
20
+ export default Table;
@@ -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,7 @@
1
+ /// <reference types="react" />
2
+ export interface EmptyTablePageProps {
3
+ columnsCount: number;
4
+ EmptyPage?: JSX.Element;
5
+ }
6
+ declare const EmptyState: ({ columnsCount, EmptyPage }: EmptyTablePageProps) => JSX.Element;
7
+ export default EmptyState;
@@ -0,0 +1,7 @@
1
+ import { UsePaginationInstanceProps } from 'react-table';
2
+ import { TableData } from '../types';
3
+ interface Props<T extends TableData> extends Omit<UsePaginationInstanceProps<T>, 'page' | 'pageOptions' | 'setPageSize'> {
4
+ pageIndex: number;
5
+ }
6
+ declare const Pagination: <T extends TableData>({ canPreviousPage, nextPage, previousPage, canNextPage, gotoPage, pageCount, pageIndex, }: Props<T>) => JSX.Element;
7
+ export default Pagination;
@@ -0,0 +1,6 @@
1
+ interface Props {
2
+ count: number;
3
+ resetSelection: () => void;
4
+ }
5
+ declare const SelectedRowsCount: ({ count, resetSelection }: Props) => JSX.Element;
6
+ export default SelectedRowsCount;
@@ -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,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
+ }
8
+ declare const TableBody: <T extends TableData>({ rows, prepareRow, selectedRowsIds }: Props<T>) => JSX.Element;
9
+ export interface TableBodyTrProps {
10
+ isSelected?: boolean;
11
+ isDisabled?: boolean;
12
+ }
13
+ export default TableBody;
@@ -0,0 +1,2 @@
1
+ declare const TableFoot: import("styled-components").StyledComponent<"tfoot", import("styled-components").DefaultTheme, {}, never>;
2
+ export default TableFoot;
@@ -0,0 +1,7 @@
1
+ import { HeaderGroup } from 'react-table';
2
+ import { TableData } from '../types';
3
+ interface Props<T extends TableData> {
4
+ headerGroups: HeaderGroup<T>[];
5
+ }
6
+ declare const TableHeader: <T extends TableData>({ headerGroups }: Props<T>) => JSX.Element;
7
+ export default TableHeader;
@@ -0,0 +1,9 @@
1
+ import { Row } from 'react-table';
2
+ import { RowAction, TableData } from '../../types';
3
+ interface Props<T extends TableData> {
4
+ row: Row<T>;
5
+ actions: RowAction<T>[];
6
+ rowIsDisabled?: boolean;
7
+ }
8
+ declare const DropdownActions: <T extends TableData>({ row, actions, rowIsDisabled }: Props<T>) => JSX.Element;
9
+ export default DropdownActions;
@@ -0,0 +1,11 @@
1
+ import { Row } from 'react-table';
2
+ import { DropdownItemType } from '../../../dropdown/types';
3
+ import { RowAction, TableData } from '../../types';
4
+ interface Props<T extends TableData> {
5
+ action: RowAction<T>;
6
+ row: Row<T>;
7
+ rowIsDisabled?: boolean;
8
+ type?: DropdownItemType;
9
+ }
10
+ declare const PrimaryAction: <T extends TableData>({ action, row, rowIsDisabled, type, }: Props<T>) => JSX.Element | null;
11
+ export default PrimaryAction;
@@ -0,0 +1,4 @@
1
+ import { CellProps } from 'react-table';
2
+ import { TableData } from '../../types';
3
+ declare const Cell: <T extends TableData>({ row }: CellProps<T, any>) => JSX.Element;
4
+ export default Cell;
@@ -0,0 +1,4 @@
1
+ import { HeaderProps } from 'react-table';
2
+ import { TableData } from '../../types';
3
+ declare const Header: <T extends TableData>(props: HeaderProps<T>) => JSX.Element;
4
+ export default Header;
@@ -0,0 +1,12 @@
1
+ import { PropsWithChildren } from 'react';
2
+ import { HeaderProps, TableToggleAllRowsSelectedProps } from 'react-table';
3
+ import { TableData } from '../../types';
4
+ interface Props<T extends TableData> {
5
+ headerProps: PropsWithChildren<HeaderProps<T>>;
6
+ selectSinglePage?: boolean;
7
+ }
8
+ interface ReturnType extends TableToggleAllRowsSelectedProps {
9
+ disabled: boolean;
10
+ }
11
+ declare const useHeaderCheckboxProps: <T extends TableData>({ headerProps, selectSinglePage, }: Props<T>) => ReturnType;
12
+ export default useHeaderCheckboxProps;
@@ -0,0 +1,10 @@
1
+ import { ReactText } from 'react';
2
+ interface Props extends PageButtonWrapperProps {
3
+ text: ReactText;
4
+ onClick: () => void;
5
+ }
6
+ declare const PageButton: ({ text, onClick, isActive }: Props) => JSX.Element;
7
+ export interface PageButtonWrapperProps {
8
+ isActive: boolean;
9
+ }
10
+ export default PageButton;
@@ -0,0 +1,9 @@
1
+ import { UsePaginationInstanceProps } from 'react-table';
2
+ import { TableData } from '../../types';
3
+ interface Props<T extends TableData> {
4
+ pageCount: number;
5
+ pageIndex: number;
6
+ gotoPage: UsePaginationInstanceProps<T>['gotoPage'];
7
+ }
8
+ declare const PaginationButtons: <T extends TableData>({ pageCount, pageIndex, gotoPage }: Props<T>) => JSX.Element;
9
+ export default PaginationButtons;
@@ -0,0 +1,14 @@
1
+ import { DefaultTheme } from 'styled-components';
2
+ import { paletteColor } from '../../../../styles/types';
3
+ import { PageButtonWrapperProps } from './PageButton';
4
+ interface GetPageButtonParams extends PageButtonWrapperProps {
5
+ theme: DefaultTheme;
6
+ }
7
+ export interface PageButtonStyles {
8
+ color: paletteColor;
9
+ background: paletteColor;
10
+ hoverColor: paletteColor;
11
+ hoverBackground: paletteColor;
12
+ }
13
+ export declare const getPageButtonStyles: ({ theme, isActive }: GetPageButtonParams) => PageButtonStyles;
14
+ export {};
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ declare type alignType = 'left' | 'center' | 'right';
3
+ interface Props extends React.HTMLAttributes<HTMLTableDataCellElement> {
4
+ align?: alignType;
5
+ }
6
+ export declare const TableTd: import("styled-components").StyledComponent<({ children, align, ...rest }: Props) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
7
+ export default TableTd;
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ declare type Props = React.HTMLAttributes<HTMLTableHeaderCellElement>;
3
+ export declare const TableTh: import("styled-components").StyledComponent<({ children, ...rest }: Props) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
4
+ export default TableTh;
@@ -0,0 +1,2 @@
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>;
@@ -0,0 +1,4 @@
1
+ import { Hooks } from 'react-table';
2
+ import { TableData } from '../types';
3
+ declare const useCheckboxesComponents: <T extends TableData>(hooks: Hooks<T>) => void;
4
+ export default useCheckboxesComponents;
@@ -0,0 +1,6 @@
1
+ import { PluginHook } from 'react-table';
2
+ import { TableProps } from '../Table';
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>[];
6
+ export default useTableHooks;
@@ -0,0 +1,14 @@
1
+ import { Dispatch, SetStateAction } from 'react';
2
+ import { Row } from 'react-table';
3
+ import { TableData } from '../types';
4
+ interface Props {
5
+ initialFilter?: string;
6
+ }
7
+ interface ReturnType<DataType extends TableData> {
8
+ filter: string;
9
+ setFilter: Dispatch<SetStateAction<string>>;
10
+ selection: Row<DataType>[];
11
+ setSelection: Dispatch<SetStateAction<Row<DataType>[]>>;
12
+ }
13
+ declare const useTableValues: <DataType extends TableData>({ initialFilter }?: Props) => ReturnType<DataType>;
14
+ export default useTableValues;
@@ -1,2 +1,6 @@
1
- import { Table } from './table';
2
- export { Table };
1
+ import useTableValues from './hooks/useTableValues';
2
+ import Table from './Table';
3
+ import { TableProps } from './Table';
4
+ import tablePalette, { TablePalette } from './tablePalette';
5
+ import { ManualPagination, OnSort, RowActions, TableData } from './types';
6
+ export { Table, TableProps, TableData, tablePalette, useTableValues, TablePalette, RowActions, ManualPagination, OnSort, };
@@ -0,0 +1,3 @@
1
+ import { Column } from 'react-table';
2
+ import { DataType } from './components/types';
3
+ export declare const columns: Column<DataType>[];
@@ -0,0 +1,6 @@
1
+ import { CustomPersonData } from './types';
2
+ interface Props {
3
+ value: CustomPersonData;
4
+ }
5
+ declare const CustomPerson: ({ value: { img, name, role } }: Props) => JSX.Element;
6
+ export default CustomPerson;
@@ -0,0 +1,7 @@
1
+ export declare const rolesArray: readonly ["master", "admin", undefined];
2
+ export declare type roleType = typeof rolesArray[number];
3
+ interface Props {
4
+ role: roleType;
5
+ }
6
+ declare const Role: ({ role }: Props) => JSX.Element | null;
7
+ export default Role;
@@ -0,0 +1,14 @@
1
+ import { roleType } from './Role';
2
+ export interface CustomPersonData {
3
+ img: string;
4
+ name: string;
5
+ role?: roleType;
6
+ }
7
+ export interface DataType {
8
+ person: CustomPersonData;
9
+ name: string;
10
+ address: string;
11
+ date: string;
12
+ order: number;
13
+ isDisabled?: boolean;
14
+ }
@@ -0,0 +1,2 @@
1
+ import { DataType } from './components/types';
2
+ export declare const getRandomUsers: (n: number) => DataType[];
@@ -1,9 +1,6 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react';
3
- import { TablePropsInterface } from './typings/main';
4
- export declare const WithKnobs: () => JSX.Element;
5
- export declare const ScrollableHeader: () => JSX.Element;
6
- export declare const EmptySet: () => JSX.Element;
7
- export declare const LoadingStatus: () => JSX.Element;
8
- declare const TableStories: Meta<TablePropsInterface>;
1
+ import { Meta, Story } from '@storybook/react';
2
+ import { DataType } from './stories/components/types';
3
+ import { TableProps } from './Table';
4
+ export declare const Template: Story<TableProps<DataType>>;
5
+ declare const TableStories: Meta<TableProps<DataType>>;
9
6
  export default TableStories;
@@ -0,0 +1,33 @@
1
+ import { colorsPalette } from '../../common/types/colorsPalette';
2
+ import { ButtonProps, IconButtonProps } from '../buttons';
3
+ import { DropdownItemType } from '../dropdown/types';
4
+ declare type TableHeaderPalette = colorsPalette;
5
+ declare type rowStatus = 'normal' | 'hover' | 'selected' | 'disabled';
6
+ declare type TableRowsPalette = {
7
+ [k in rowStatus]: colorsPalette;
8
+ };
9
+ interface SelectedRowsCountPalette extends colorsPalette {
10
+ resetButtonColor: ButtonProps['color'];
11
+ }
12
+ declare type paginationItemStatus = 'normal' | 'hover' | 'active';
13
+ declare type PaginationPalette = {
14
+ numbers: {
15
+ [k in paginationItemStatus]: colorsPalette;
16
+ };
17
+ buttons: ButtonProps['color'];
18
+ };
19
+ declare type ActionsPalette = {
20
+ colors: {
21
+ [k in DropdownItemType]: ButtonProps['color'];
22
+ };
23
+ dropdownTriggerColor: IconButtonProps['color'];
24
+ };
25
+ export interface TablePalette {
26
+ header: TableHeaderPalette;
27
+ rows: TableRowsPalette;
28
+ selectedRowsCount: SelectedRowsCountPalette;
29
+ actions: ActionsPalette;
30
+ pagination: PaginationPalette;
31
+ }
32
+ declare const tablePalette: TablePalette;
33
+ export default tablePalette;
@@ -0,0 +1,27 @@
1
+ import { Row, SortingRule } from 'react-table';
2
+ import { DropdownItemType } from '../dropdown/types';
3
+ import { IconProps } from '../icon';
4
+ export interface TableData {
5
+ isDisabled?: boolean;
6
+ }
7
+ export interface CustomColumn {
8
+ align?: 'left' | 'center' | 'right';
9
+ }
10
+ export interface RowActions<T extends TableData> {
11
+ primary?: RowAction<T>;
12
+ dropdown?: RowAction<T>[];
13
+ }
14
+ export interface RowAction<T extends TableData> {
15
+ icon?: IconProps;
16
+ type?: DropdownItemType;
17
+ text: string;
18
+ onClick: (row: Row<T>) => void;
19
+ isDisabled?: boolean;
20
+ }
21
+ interface ManualPaginationConfig {
22
+ pageCount: number;
23
+ setCurrentPage: (page: number) => void;
24
+ }
25
+ export declare type ManualPagination = ManualPaginationConfig | undefined;
26
+ export declare type OnSort<T extends TableData> = (sortBy: Array<SortingRule<T>>) => void;
27
+ export {};
@@ -0,0 +1,14 @@
1
+ import { DefaultTheme } from 'styled-components';
2
+ import { paletteColor } from '../../styles/types';
3
+ import { TableBodyTrProps } from './components/TableBody';
4
+ interface GetTableBodyTrStylesParams extends TableBodyTrProps {
5
+ theme: DefaultTheme;
6
+ }
7
+ export interface TableBodyTrStyles {
8
+ background: paletteColor;
9
+ color: paletteColor;
10
+ hoverColor: paletteColor;
11
+ hoverBackground: paletteColor;
12
+ }
13
+ export declare const getTableBodyTrStyles: ({ theme, isDisabled, isSelected, }: GetTableBodyTrStylesParams) => TableBodyTrStyles;
14
+ export {};
package/dist/index.d.ts CHANGED
@@ -7,7 +7,8 @@ import { Chip } from './components/chips';
7
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
- import { Checkbox, CheckboxPalette, CheckboxProps, useCheckboxValue } from './components/form/checkbox';
10
+ import { Checkbox, CheckboxPalette, CheckboxProps, checkboxStatus, useCheckboxValue } from './components/form/checkbox';
11
+ import { FileRejection, FileUploader, fileUploaderOnDrop, FileUploaderPalette, FileUploaderProps } from './components/form/fileUploader';
11
12
  import { InputHelper, InputHelperPalette, InputHelperProps } from './components/form/inputHelper';
12
13
  import { InputText, InputTextPalette, InputTextProps, UnitDropdownProps } from './components/form/inputText';
13
14
  import { AsyncCreatableSelect, AsyncCreatableSelectProps, AsyncSelect, AsyncSelectProps, CreatableSelect, CreatableSelectProps, isSimpleValue, OptionType, Select, SelectComponentsType, SelectPalette, SelectProps, simpleValue, useSelectMultiValues, useSelectSimpleValue, useSelectValue } from './components/form/select';
@@ -27,7 +28,7 @@ import { Pagination } from './components/pagination';
27
28
  import { Progressbar } from './components/progressbar';
28
29
  import { RadioButton } from './components/radioButton';
29
30
  import { Stepper, StepperPalette, StepperProps } from './components/stepper';
30
- import { Table } from './components/table';
31
+ import { ManualPagination, OnSort, RowActions, Table, TableData, TablePalette, TableProps, useTableValues } from './components/table';
31
32
  import { DropdownTabs, ScrollableTabs, TabsItem } from './components/tabs';
32
33
  import { Tag, TagPalette, TagProps } from './components/tag';
33
34
  import { ThemeProvider } from './components/themeProvider';
@@ -37,4 +38,4 @@ import { Tooltip, TooltipPalette, TooltipProps } from './components/tooltip';
37
38
  import { autocompleteYellow } from './styles/defaultPalette/colors/others';
38
39
  import { Theme } from './styles/theme';
39
40
  import { Palette, paletteColor } from './styles/types';
40
- export { autocompleteYellow, paletteColor, Avatar, Banner, BannerProps, Button, ButtonProps, IconButton, IconButtonProps, Icon, IconProps, IconPalette, IconBackground, IconBackgroundPalette, Table, Checkbox, useCheckboxValue, CheckboxProps, CheckboxPalette, 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, };
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, };