@fattureincloud/fic-design-system 0.4.4 → 0.4.6-table.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (80) hide show
  1. package/CHANGELOG.md +35 -0
  2. package/dist/components/dropdown/components/DefaultTrigger.d.ts +2 -2
  3. package/dist/components/form/checkbox/index.d.ts +2 -1
  4. package/dist/components/form/common/styles.d.ts +2 -0
  5. package/dist/components/form/fileUploader/FileUploader.d.ts +14 -0
  6. package/dist/components/form/fileUploader/components/FileUploaderContent.d.ts +12 -0
  7. package/dist/components/form/fileUploader/fileUploader.stories.d.ts +5 -0
  8. package/dist/components/form/fileUploader/fileUploaderPalette.d.ts +18 -0
  9. package/dist/components/form/fileUploader/hooks/useCustomPalette.d.ts +3 -0
  10. package/dist/components/form/fileUploader/hooks/useIcon.d.ts +4 -0
  11. package/dist/components/form/fileUploader/hooks/useTexts.d.ts +3 -0
  12. package/dist/components/form/fileUploader/index.d.ts +4 -0
  13. package/dist/components/form/fileUploader/styled.d.ts +14 -0
  14. package/dist/components/form/fileUploader/types.d.ts +18 -0
  15. package/dist/components/form/fileUploader/utils.d.ts +2 -0
  16. package/dist/components/form/inputText/InputText.d.ts +2 -1
  17. package/dist/components/form/inputText/components/InputElement.d.ts +4 -2
  18. package/dist/components/form/inputText/components/UnitDropdown.d.ts +7 -0
  19. package/dist/components/form/inputText/components/unitDropdown/UnitDropdownTrigger.d.ts +9 -0
  20. package/dist/components/form/inputText/index.d.ts +2 -1
  21. package/dist/components/form/inputText/inputText.stories.d.ts +1 -0
  22. package/dist/components/form/inputText/types.d.ts +5 -1
  23. package/dist/components/form/label/Label.d.ts +2 -1
  24. package/dist/components/form/select/SelectWrapper.d.ts +2 -2
  25. package/dist/components/form/select/components/Option.d.ts +1 -1
  26. package/dist/components/form/select/hooks/useSelectGeneric.d.ts +10 -0
  27. package/dist/components/form/select/hooks/useSelectSimpleValue.d.ts +8 -0
  28. package/dist/components/form/select/hooks/useSelectThemeStyles.d.ts +6 -2
  29. package/dist/components/form/select/index.d.ts +4 -2
  30. package/dist/components/form/select/select.stories.d.ts +1 -0
  31. package/dist/components/form/select/types.d.ts +11 -4
  32. package/dist/components/form/select/utils.d.ts +3 -0
  33. package/dist/components/form/textArea/components/TextAreaElement.d.ts +2 -2
  34. package/dist/components/form/textArea/types.d.ts +1 -0
  35. package/dist/components/modals/modalStyled.d.ts +2 -0
  36. package/dist/components/modals/types.d.ts +2 -0
  37. package/dist/components/table/Table.d.ts +20 -0
  38. package/dist/components/table/components/ActionsCell.d.ts +10 -0
  39. package/dist/components/table/components/EmptyState.d.ts +7 -0
  40. package/dist/components/table/components/Pagination.d.ts +7 -0
  41. package/dist/components/table/components/SelectedRowsCount.d.ts +6 -0
  42. package/dist/components/table/components/SortIndicator.d.ts +6 -0
  43. package/dist/components/table/components/TableBody.d.ts +13 -0
  44. package/dist/components/table/components/TableFoot.d.ts +2 -0
  45. package/dist/components/table/components/TableHeader.d.ts +7 -0
  46. package/dist/components/table/components/actions/DropdownActions.d.ts +9 -0
  47. package/dist/components/table/components/actions/PrimaryAction.d.ts +11 -0
  48. package/dist/components/table/components/checkboxes/Cell.d.ts +4 -0
  49. package/dist/components/table/components/checkboxes/Header.d.ts +4 -0
  50. package/dist/components/table/components/checkboxes/useHeaderCheckboxProps.d.ts +12 -0
  51. package/dist/components/table/components/pagination/PageButton.d.ts +10 -0
  52. package/dist/components/table/components/pagination/PaginationButtons.d.ts +9 -0
  53. package/dist/components/table/components/pagination/utils.d.ts +14 -0
  54. package/dist/components/table/components/tableParts/TableTd.d.ts +7 -0
  55. package/dist/components/table/components/tableParts/TableTh.d.ts +4 -0
  56. package/dist/components/table/components/tableParts/styled.d.ts +2 -0
  57. package/dist/components/table/hooks/useCheckboxesComponents.d.ts +4 -0
  58. package/dist/components/table/hooks/useTableHooks.d.ts +6 -0
  59. package/dist/components/table/hooks/useTableValues.d.ts +14 -0
  60. package/dist/components/table/index.d.ts +6 -2
  61. package/dist/components/table/stories/columns.d.ts +3 -0
  62. package/dist/components/table/stories/components/CustomPerson.d.ts +6 -0
  63. package/dist/components/table/stories/components/Role.d.ts +7 -0
  64. package/dist/components/table/stories/components/types.d.ts +14 -0
  65. package/dist/components/table/stories/data.d.ts +2 -0
  66. package/dist/components/table/table.stories.d.ts +5 -8
  67. package/dist/components/table/tablePalette.d.ts +33 -0
  68. package/dist/components/table/types.d.ts +27 -0
  69. package/dist/components/table/utils.d.ts +14 -0
  70. package/dist/index.d.ts +7 -5
  71. package/dist/index.esm.js +15 -2
  72. package/dist/index.esm.js.map +1 -1
  73. package/dist/index.js +14 -1
  74. package/dist/index.js.map +1 -1
  75. package/dist/styles/defaultPalette/colors/others.d.ts +1 -0
  76. package/dist/styles/theme.d.ts +4 -0
  77. package/package.json +13 -13
  78. package/dist/components/table/components/pagination.d.ts +0 -2
  79. package/dist/components/table/table.d.ts +0 -2
  80. package/dist/styles/elevations.d.ts +0 -7
@@ -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,10 +7,11 @@ 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
- import { InputText, InputTextPalette, InputTextProps } from './components/form/inputText';
13
- import { AsyncCreatableSelect, AsyncCreatableSelectProps, AsyncSelect, AsyncSelectProps, CreatableSelect, CreatableSelectProps, OptionType, Select, SelectComponentsType, SelectPalette, SelectProps, useSelectMultiValues, useSelectValue } from './components/form/select';
13
+ import { InputText, InputTextPalette, InputTextProps, UnitDropdownProps } from './components/form/inputText';
14
+ import { AsyncCreatableSelect, AsyncCreatableSelectProps, AsyncSelect, AsyncSelectProps, CreatableSelect, CreatableSelectProps, isSimpleValue, OptionType, Select, SelectComponentsType, SelectPalette, SelectProps, simpleValue, useSelectMultiValues, useSelectSimpleValue, useSelectValue } from './components/form/select';
14
15
  import { TextArea, TextAreaPalette, TextAreaProps } from './components/form/textArea';
15
16
  import { GroupedList, GroupType, ItemType } from './components/groupedList';
16
17
  import { RadioButtonGroup } from './components/groupRadioButton';
@@ -27,13 +28,14 @@ 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';
34
35
  import { ShortcutTip, Tip } from './components/tip';
35
36
  import { Toast, ToastProps } from './components/toast';
36
37
  import { Tooltip, TooltipPalette, TooltipProps } from './components/tooltip';
38
+ import { autocompleteYellow } from './styles/defaultPalette/colors/others';
37
39
  import { Theme } from './styles/theme';
38
40
  import { Palette, paletteColor } from './styles/types';
39
- export { 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, 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, 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, };