@redi.run/redi-components 0.0.20 → 0.0.21

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.
@@ -1,83 +1,103 @@
1
- export interface Column<T = any> {
2
- id: string;
3
- label: string;
4
- accessor: keyof T | ((row: T) => any);
5
- sortable?: boolean;
6
- filterable?: boolean;
7
- width?: number;
8
- minWidth?: number;
9
- align?: 'left' | 'center' | 'right';
10
- render?: (value: any, row: T, index: number) => React.ReactNode;
11
- hidden?: boolean;
12
- }
13
- export interface SortConfig {
14
- column: string;
15
- direction: 'asc' | 'desc';
16
- }
17
- export interface FilterConfig {
18
- [columnId: string]: {
19
- type: 'text' | 'select' | 'multiselect';
20
- value: string | string[];
21
- textValue?: string;
22
- options?: string[];
23
- };
24
- }
25
- export interface PaginationConfig {
26
- page: number;
27
- pageSize: number;
28
- total: number;
29
- }
30
- export interface TableConfig {
31
- columns: Column[];
32
- sort?: SortConfig;
33
- filters: FilterConfig;
34
- pagination: PaginationConfig;
35
- columnOrder: string[];
36
- hiddenColumns: string[];
37
- }
38
- export interface LabelsProps {
39
- configuration?: string;
40
- columnVisibility?: string;
41
- clearAllFilters?: string;
42
- pagination?: {
43
- showingItems: string;
44
- to: string;
45
- of: string;
46
- items: string;
47
- showPerPage?: string;
48
- perPageItems?: string;
49
- };
50
- }
51
- export interface AdvancedTableProps<T = any> {
52
- data: T[];
53
- columns: Column<T>[];
54
- defaultSort?: SortConfig;
55
- defaultFilters?: FilterConfig;
56
- defaultPageSize?: number;
57
- pageSizeOptions?: number[];
58
- enableSorting?: boolean;
59
- enableFiltering?: boolean;
60
- enablePagination?: boolean;
61
- enableColumnReordering?: boolean;
62
- enableExport?: boolean;
63
- persistConfig?: boolean;
64
- configKey?: string;
65
- onRowClick?: (row: T, index: number) => void;
66
- onConfigChange?: (config: TableConfig) => void;
67
- className?: string;
68
- loading?: boolean;
69
- emptyMessage?: string;
70
- exportFileName?: string;
71
- labels?: LabelsProps;
72
- }
73
- export interface TableState<T = any> {
74
- data: T[];
75
- filteredData: T[];
76
- paginatedData: T[];
77
- sortConfig: SortConfig | undefined;
78
- filters: FilterConfig;
79
- pagination: PaginationConfig;
80
- columnOrder: string[];
81
- hiddenColumns: string[];
82
- loading: boolean;
83
- }
1
+ import { JSX } from 'react/jsx-runtime';
2
+
3
+ export declare const AdvancedTable: <T extends Record<string, unknown>>({ data, columns, defaultSort, defaultFilters, defaultPageSize, pageSizeOptions, enableSorting, enableFiltering, enablePagination, enableExport, persistConfig, configKey, className, labels, }: AdvancedTableProps<T>) => JSX.Element;
4
+
5
+ declare interface AdvancedTableProps<T = any> {
6
+ data: T[];
7
+ columns: Column<T>[];
8
+ defaultSort?: SortConfig;
9
+ defaultFilters?: FilterConfig;
10
+ defaultPageSize?: number;
11
+ pageSizeOptions?: number[];
12
+ enableSorting?: boolean;
13
+ enableFiltering?: boolean;
14
+ enablePagination?: boolean;
15
+ enableColumnReordering?: boolean;
16
+ enableExport?: boolean;
17
+ persistConfig?: boolean;
18
+ configKey?: string;
19
+ onRowClick?: (row: T, index: number) => void;
20
+ onConfigChange?: (config: TableConfig) => void;
21
+ className?: string;
22
+ loading?: boolean;
23
+ emptyMessage?: string;
24
+ exportFileName?: string;
25
+ labels?: LabelsProps;
26
+ }
27
+
28
+ /** Primary UI component for user interaction */
29
+ export declare const Button: ({ level, size, type, posIcon, disabled, label, icon, children, ...props }: ButtonProps) => JSX.Element;
30
+
31
+ declare type ButtonLevel = 'primary' | 'secondary' | 'tertiary' | 'link' | 'icon';
32
+
33
+ declare interface ButtonProps {
34
+ level?: ButtonLevel;
35
+ color?: string;
36
+ backgroundColor?: string;
37
+ size?: 'small' | 'medium' | 'large';
38
+ type?: 'button' | 'submit' | 'reset';
39
+ label?: string;
40
+ onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
41
+ icon?: React.ReactNode;
42
+ posIcon?: 'left' | 'right';
43
+ disabled?: boolean;
44
+ children?: React.ReactNode;
45
+ }
46
+
47
+ declare interface Column<T = any> {
48
+ id: string;
49
+ label: string;
50
+ accessor: keyof T | ((row: T) => any);
51
+ sortable?: boolean;
52
+ filterable?: boolean;
53
+ width?: number;
54
+ minWidth?: number;
55
+ align?: 'left' | 'center' | 'right';
56
+ render?: (value: any, row: T, index: number) => React.ReactNode;
57
+ hidden?: boolean;
58
+ }
59
+
60
+ declare interface FilterConfig {
61
+ [columnId: string]: {
62
+ type: 'text' | 'select' | 'multiselect';
63
+ value: string | string[];
64
+ textValue?: string;
65
+ options?: string[];
66
+ };
67
+ }
68
+
69
+ declare interface LabelsProps {
70
+ configuration?: string;
71
+ columnVisibility?: string;
72
+ clearAllFilters?: string;
73
+ pagination?: {
74
+ showingItems: string;
75
+ to: string;
76
+ of: string;
77
+ items: string;
78
+ showPerPage?: string;
79
+ perPageItems?: string;
80
+ };
81
+ }
82
+
83
+ declare interface PaginationConfig {
84
+ page: number;
85
+ pageSize: number;
86
+ total: number;
87
+ }
88
+
89
+ declare interface SortConfig {
90
+ column: string;
91
+ direction: 'asc' | 'desc';
92
+ }
93
+
94
+ declare interface TableConfig {
95
+ columns: Column[];
96
+ sort?: SortConfig;
97
+ filters: FilterConfig;
98
+ pagination: PaginationConfig;
99
+ columnOrder: string[];
100
+ hiddenColumns: string[];
101
+ }
102
+
103
+ export { }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@redi.run/redi-components",
3
3
  "description": "This project was created to define the style of the UI and improve the UX in all projects from REDI",
4
- "version": "0.0.20",
4
+ "version": "0.0.21",
5
5
  "type": "module",
6
6
  "author": {
7
7
  "name": "Jonathan Manchego Sosa",
@@ -29,10 +29,12 @@
29
29
  "files": [
30
30
  "dist"
31
31
  ],
32
+ "types": "./dist/index.d.ts",
32
33
  "main": "./dist/redi-components.umd.cjs",
33
34
  "module": "./dist/redi-components.js",
34
35
  "exports": {
35
36
  ".": {
37
+ "types": "./dist/index.d.ts",
36
38
  "import": "./dist/redi-components.js",
37
39
  "require": "./dist/redi-components.umd.cjs"
38
40
  },
@@ -1,18 +0,0 @@
1
- export interface FilterOption {
2
- value: string;
3
- count: number;
4
- label: string;
5
- }
6
- interface AdvancedFilterProps {
7
- color?: string;
8
- columnId: string;
9
- label: string;
10
- options: FilterOption[];
11
- textValue: string;
12
- selectedValues: string[];
13
- onTextChange: (value: string) => void;
14
- onSelectionChange: (values: string[]) => void;
15
- onClose: () => void;
16
- }
17
- declare const AdvancedFilter: React.FC<AdvancedFilterProps>;
18
- export default AdvancedFilter;
@@ -1,3 +0,0 @@
1
- import { AdvancedTableProps } from './types';
2
- declare const AdvancedTable: <T extends Record<string, unknown>>({ data, columns, defaultSort, defaultFilters, defaultPageSize, pageSizeOptions, enableSorting, enableFiltering, enablePagination, enableExport, persistConfig, configKey, className, labels, }: AdvancedTableProps<T>) => import("react/jsx-runtime").JSX.Element;
3
- export default AdvancedTable;
@@ -1,16 +0,0 @@
1
- import { StoryObj } from '@storybook/react-vite';
2
- declare const meta: {
3
- title: string;
4
- parameters: {
5
- layout: string;
6
- };
7
- tags: string[];
8
- args: {
9
- onRowClick: import('@vitest/spy').Mock<(...args: any[]) => any>;
10
- onConfigChange: import('@vitest/spy').Mock<(...args: any[]) => any>;
11
- };
12
- component: <T extends Record<string, unknown>>({ data, columns, defaultSort, defaultFilters, defaultPageSize, pageSizeOptions, enableSorting, enableFiltering, enablePagination, enableExport, persistConfig, configKey, className, labels, }: import('./types').AdvancedTableProps<T>) => import("react/jsx-runtime").JSX.Element;
13
- };
14
- export default meta;
15
- type Story = StoryObj<typeof meta>;
16
- export declare const Default: Story;
@@ -1,9 +0,0 @@
1
- interface FilterDropdownProps {
2
- label: string;
3
- options: string[];
4
- selectedValues: string[];
5
- onSelectionChange: (values: string[]) => void;
6
- placeholder?: string;
7
- }
8
- declare const FilterDropdown: React.FC<FilterDropdownProps>;
9
- export default FilterDropdown;
@@ -1,15 +0,0 @@
1
- import { AdvancedTableProps, Column, TableState } from '../types';
2
- export declare const useAdvancedTable: <T>(props: AdvancedTableProps<T>) => {
3
- state: TableState<T>;
4
- orderedColumns: Column<T>[];
5
- pageSizeOptions: number[];
6
- handleSort: (columnId: string) => void;
7
- handleFilter: (columnId: string, filterValue: string | string[], filterType?: "text" | "select" | "multiselect") => void;
8
- clearFilter: (columnId: string) => void;
9
- clearAllFilters: () => void;
10
- handlePageChange: (page: number) => void;
11
- handlePageSizeChange: (pageSize: number) => void;
12
- handleColumnReorder: (newOrder: string[]) => void;
13
- handleToggleColumn: (columnId: string) => void;
14
- allColumns: Column<T>[];
15
- };
@@ -1,2 +0,0 @@
1
- export { default } from './AdvancedTable';
2
- export * from './types';
@@ -1,4 +0,0 @@
1
- import { ButtonProps } from './types';
2
- /** Primary UI component for user interaction */
3
- declare const Button: ({ level, size, type, posIcon, disabled, label, icon, children, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
4
- export default Button;
@@ -1,19 +0,0 @@
1
- import { StoryObj } from '@storybook/react-vite';
2
- declare const meta: {
3
- title: string;
4
- component: ({ level, size, type, posIcon, disabled, label, icon, children, ...props }: import('./types').ButtonProps) => import("react/jsx-runtime").JSX.Element;
5
- parameters: {
6
- layout: string;
7
- };
8
- tags: string[];
9
- args: {
10
- onClick: import('@vitest/spy').Mock<(...args: any[]) => any>;
11
- };
12
- };
13
- export default meta;
14
- type Story = StoryObj<typeof meta>;
15
- export declare const ButtonPrimary: Story;
16
- export declare const ButtonSecondary: Story;
17
- export declare const ButtonTertiary: Story;
18
- export declare const ButtonLink: Story;
19
- export declare const ButtonIcon: Story;
@@ -1,2 +0,0 @@
1
- export { default } from './Button';
2
- export * from './types';
@@ -1,20 +0,0 @@
1
- export type ButtonLevel = 'primary' | 'secondary' | 'tertiary' | 'link' | 'icon';
2
- export interface ButtonProps {
3
- level?: ButtonLevel;
4
- color?: string;
5
- backgroundColor?: string;
6
- size?: 'small' | 'medium' | 'large';
7
- type?: 'button' | 'submit' | 'reset';
8
- label?: string;
9
- onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
10
- icon?: React.ReactNode;
11
- posIcon?: 'left' | 'right';
12
- disabled?: boolean;
13
- children?: React.ReactNode;
14
- }
15
- export interface IconsProps {
16
- color?: string;
17
- size?: number;
18
- width?: number;
19
- height?: number;
20
- }
@@ -1,3 +0,0 @@
1
- import { RediInputProps } from './types';
2
- declare const RediInput: ({ placeholder, value, onChange }: RediInputProps) => import("react/jsx-runtime").JSX.Element;
3
- export default RediInput;
@@ -1,12 +0,0 @@
1
- import { StoryObj } from '@storybook/react-vite';
2
- declare const meta: {
3
- title: string;
4
- component: ({ placeholder, value, onChange }: import('./types').RediInputProps) => import("react/jsx-runtime").JSX.Element;
5
- parameters: {
6
- layout: string;
7
- };
8
- tags: string[];
9
- };
10
- export default meta;
11
- type Story = StoryObj<typeof meta>;
12
- export declare const InputDefault: Story;
@@ -1,2 +0,0 @@
1
- export { default } from './Input';
2
- export * from './types';
@@ -1,10 +0,0 @@
1
- export type InputType = 'text' | 'password' | 'email' | 'number' | 'phone';
2
- export interface RediInputProps {
3
- value: string;
4
- onChange: (value: string) => void;
5
- placeholder?: string;
6
- disabled?: boolean;
7
- error?: string;
8
- hint?: string;
9
- type?: InputType;
10
- }
@@ -1,2 +0,0 @@
1
- import { IconsProps } from '../components/Button';
2
- export declare const CloseIcon: ({ color, size }: IconsProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,2 +0,0 @@
1
- import { IconsProps } from '../components/Button';
2
- export declare const DownloadIcon: ({ color, size }: IconsProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,2 +0,0 @@
1
- import { IconsProps } from '../components/Button';
2
- export declare const EyeIcon: ({ color, size }: IconsProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,2 +0,0 @@
1
- import { IconsProps } from '../components/Button';
2
- export declare const FilterIcon: ({ color, size }: IconsProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,2 +0,0 @@
1
- import { IconsProps } from '../components/Button';
2
- export declare const YinYanIcon: ({ color, size }: IconsProps) => import("react/jsx-runtime").JSX.Element;
package/dist/main.d.ts DELETED
@@ -1,2 +0,0 @@
1
- export { default as AdvancedTable } from './components/AdvancedTable';
2
- export { default as Button } from './components/Button';
@@ -1,16 +0,0 @@
1
- import { Column } from '../components/AdvancedTable';
2
- export interface Contract extends Record<string, unknown> {
3
- id: string;
4
- contractNumber: string;
5
- property: string;
6
- responsible: string;
7
- createdBy: string;
8
- openingDate: string;
9
- type: string;
10
- subtype: string;
11
- status: string;
12
- province: string;
13
- population: string;
14
- }
15
- export declare const sampleData: Contract[];
16
- export declare const columns: Column<Contract>[];
@@ -1 +0,0 @@
1
- export declare const formatCellValue: <T>(value: T) => string;