@saptanshuwanjari/react-component-library 0.1.10 → 0.1.11

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.
Files changed (7) hide show
  1. package/dist/index.d.mts +27 -167
  2. package/dist/index.d.ts +27 -167
  3. package/dist/index.js +361 -1287
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +356 -1284
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -1,138 +1,10 @@
1
- import * as react from 'react';
2
- import { ComponentType, ReactNode } from 'react';
3
- import * as react_hook_form from 'react-hook-form';
4
- import { FieldValues, Path, ControllerRenderProps } from 'react-hook-form';
5
- import * as react_jsx_runtime from 'react/jsx-runtime';
6
- import * as z from 'zod';
7
- import * as class_variance_authority_types from 'class-variance-authority/types';
8
- import { VariantProps } from 'class-variance-authority';
9
- import { ColumnDef } from '@tanstack/react-table';
10
1
  import { ClassValue } from 'clsx';
2
+ import * as react_jsx_runtime from 'react/jsx-runtime';
3
+ import { Table, ColumnDef } from '@tanstack/react-table';
4
+ import * as react from 'react';
11
5
 
12
- type ZodSchema = z.ZodTypeAny;
13
-
14
- type RootProps$1<T extends FieldValues> = {
15
- schema?: ZodSchema;
16
- defaultValues?: Partial<T>;
17
- onSubmit: (values: T) => void | Promise<void>;
18
- children: React.ReactNode;
19
- enableOptimistic?: boolean;
20
- title?: string;
21
- description?: string;
22
- enableEditMode?: boolean;
23
- formId?: string;
24
- };
25
- declare function Root$1<T extends FieldValues = FieldValues>({ schema, defaultValues, onSubmit, children, enableOptimistic, title, description, enableEditMode, formId, }: RootProps$1<T>): react_jsx_runtime.JSX.Element;
26
-
27
- type FieldProps<TFieldValues extends FieldValues> = {
28
- name: Path<TFieldValues>;
29
- label?: string;
30
- children: (field: ControllerRenderProps<TFieldValues, Path<TFieldValues>>) => React.ReactNode;
31
- };
32
- declare function Field<TFieldValues extends FieldValues>({ name, label, children, }: FieldProps<TFieldValues>): react_jsx_runtime.JSX.Element;
33
-
34
- declare const Button$1: ({ children, ...props }: React.ComponentProps<"button">) => react_jsx_runtime.JSX.Element;
35
- declare function Submit({ children, ...props }: React.ComponentProps<typeof Button$1>): react_jsx_runtime.JSX.Element | null;
36
-
37
- declare const buttonVariants: (props?: ({
38
- variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
39
- size?: "icon" | "default" | "sm" | "lg" | "icon-sm" | "icon-lg" | null | undefined;
40
- } & class_variance_authority_types.ClassProp) | undefined) => string;
41
- declare function Button({ className, variant, size, asChild, ...props }: react.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
42
- asChild?: boolean;
43
- }): react_jsx_runtime.JSX.Element;
44
-
45
- type EditButtonProps = React.ComponentProps<typeof Button> & {
46
- formId?: string;
47
- };
48
- declare function EditButton({ children, formId, ...props }: EditButtonProps): react_jsx_runtime.JSX.Element | null;
49
-
50
- declare function CancelButton({ children, ...props }: React.ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element | null;
51
-
52
- type LinkFieldProps = {
53
- label?: string;
54
- link: string;
55
- LinkComponent?: ComponentType<{
56
- href: string;
57
- className?: string;
58
- children: ReactNode;
59
- }>;
60
- className?: string;
61
- };
62
- declare function LinkField({ label, link, LinkComponent, className }: LinkFieldProps): react_jsx_runtime.JSX.Element;
63
-
64
- type FieldGroupProps = {
65
- children: ReactNode;
66
- className?: string;
67
- title?: string;
68
- };
69
- declare function FieldGroup({ children, className, title }: FieldGroupProps): react_jsx_runtime.JSX.Element;
70
-
71
- declare const Form: typeof Root$1 & {
72
- Root: typeof Root$1;
73
- Field: typeof Field;
74
- InputField: <TFieldValues extends react_hook_form.FieldValues>(props: {
75
- name: react_hook_form.Path<TFieldValues>;
76
- label?: string;
77
- placeholder?: string;
78
- type?: React.HTMLInputTypeAttribute;
79
- icon?: React.ReactNode;
80
- iconAlign?: "inline-start" | "inline-end" | "block-start" | "block-end";
81
- startAddon?: React.ReactNode;
82
- endAddon?: React.ReactNode;
83
- useGroup?: boolean;
84
- }) => react.ReactNode;
85
- PasswordField: <TFieldValues extends react_hook_form.FieldValues>(props: {
86
- name: react_hook_form.Path<TFieldValues>;
87
- label?: string;
88
- placeholder?: string;
89
- }) => react.ReactNode;
90
- TextareaField: <TFieldValues extends react_hook_form.FieldValues>(props: {
91
- name: react_hook_form.Path<TFieldValues>;
92
- label?: string;
93
- placeholder?: string;
94
- rows?: number;
95
- }) => react.ReactNode;
96
- SelectField: <TFieldValues extends react_hook_form.FieldValues>(props: {
97
- name: react_hook_form.Path<TFieldValues>;
98
- label?: string;
99
- placeholder?: string;
100
- options: Array<{
101
- label: string;
102
- value: string;
103
- }>;
104
- }) => react.ReactNode;
105
- CheckboxField: <TFieldValues extends react_hook_form.FieldValues>(props: {
106
- name: react_hook_form.Path<TFieldValues>;
107
- label?: string;
108
- description?: string;
109
- }) => react.ReactNode;
110
- DateField: <TFieldValues extends react_hook_form.FieldValues>(props: {
111
- name: react_hook_form.Path<TFieldValues>;
112
- label?: string;
113
- placeholder?: string;
114
- }) => react.ReactNode;
115
- FileField: <TFieldValues extends react_hook_form.FieldValues>(props: {
116
- name: react_hook_form.Path<TFieldValues>;
117
- label?: string;
118
- accept?: string;
119
- multiple?: boolean;
120
- }) => react.ReactNode;
121
- ProfilePictureField: <TFieldValues extends react_hook_form.FieldValues>(props: {
122
- name: react_hook_form.Path<TFieldValues>;
123
- label?: string;
124
- className?: string;
125
- avatarClassName?: string;
126
- fallback?: string;
127
- }) => react.ReactNode;
128
- Submit: typeof Submit;
129
- EditButton: typeof EditButton;
130
- CancelButton: typeof CancelButton;
131
- Group: typeof FieldGroup;
132
- LinkField: typeof LinkField;
133
- };
6
+ declare function cn(...inputs: ClassValue[]): string;
134
7
 
135
- type ViewMode = 'table' | 'grid';
136
8
  interface FilterOption {
137
9
  id: string;
138
10
  label: string;
@@ -141,41 +13,41 @@ interface FilterOption {
141
13
  label: string;
142
14
  }[];
143
15
  placeholder?: string;
144
- multiSelect?: boolean;
145
16
  }
17
+ type ViewMode = "table" | "grid";
18
+ interface DataTableContextValue<TData> {
19
+ table: Table<TData>;
20
+ viewMode: ViewMode;
21
+ setViewMode: (mode: ViewMode) => void;
22
+ filters: FilterOption[];
23
+ showFilters: boolean;
24
+ globalFilter: string;
25
+ setGlobalFilter: (value: string) => void;
26
+ }
27
+ declare const DataTableContext: react.Context<DataTableContextValue<any> | null>;
28
+ declare function useDataTableContext<TData>(): DataTableContextValue<TData>;
29
+
30
+ declare function useViewMode(defaultMode?: ViewMode): {
31
+ viewMode: ViewMode;
32
+ setViewMode: react.Dispatch<react.SetStateAction<ViewMode>>;
33
+ };
146
34
 
147
35
  interface RootProps<TData, TValue> {
148
36
  columns: ColumnDef<TData, TValue>[];
149
37
  data: TData[];
150
38
  filters?: FilterOption[];
151
39
  defaultViewMode?: ViewMode;
152
- viewMode?: ViewMode;
153
- onViewModeChange?: (mode: ViewMode) => void;
154
- defaultPageSize?: number;
40
+ showFilters?: boolean;
155
41
  children: React.ReactNode;
156
42
  }
157
- declare function Root<TData, TValue>({ columns, data, filters, defaultViewMode, viewMode: controlledViewMode, onViewModeChange: controlledOnViewModeChange, defaultPageSize, children, }: RootProps<TData, TValue>): react_jsx_runtime.JSX.Element;
43
+ declare function Root<TData, TValue>({ columns, data, filters, defaultViewMode, showFilters, children, }: RootProps<TData, TValue>): react_jsx_runtime.JSX.Element;
158
44
 
159
- interface ToolbarProps {
160
- viewOptions?: React.ReactNode;
161
- }
162
- declare function Toolbar({ viewOptions }?: ToolbarProps): react_jsx_runtime.JSX.Element;
45
+ declare function Toolbar(): react_jsx_runtime.JSX.Element;
163
46
 
164
47
  interface ContentProps<TData> {
165
48
  renderCard?: (item: TData, index: number) => React.ReactNode;
166
- gridColumns?: number;
167
- gridGap?: number;
168
49
  }
169
- declare function Content<TData>({ renderCard, gridColumns, gridGap }: ContentProps<TData>): react_jsx_runtime.JSX.Element;
170
-
171
- declare function TableView(): react_jsx_runtime.JSX.Element;
172
-
173
- interface GridViewProps<TData> {
174
- renderCard?: (item: TData, index: number) => React.ReactNode;
175
- columns?: number;
176
- gap?: number;
177
- }
178
- declare function GridView<TData>({ renderCard, columns, gap }: GridViewProps<TData>): react_jsx_runtime.JSX.Element;
50
+ declare function Content<TData>({ renderCard }: ContentProps<TData>): react_jsx_runtime.JSX.Element;
179
51
 
180
52
  declare function Pagination(): react_jsx_runtime.JSX.Element;
181
53
 
@@ -183,18 +55,6 @@ interface ViewOptionsProps {
183
55
  viewMode?: ViewMode;
184
56
  onViewModeChange?: (mode: ViewMode) => void;
185
57
  }
186
- declare function ViewOptions({ viewMode: propViewMode, onViewModeChange: propOnViewModeChange }: ViewOptionsProps): react_jsx_runtime.JSX.Element;
187
-
188
- declare const DataTable: typeof Root & {
189
- Root: typeof Root;
190
- Toolbar: typeof Toolbar;
191
- Content: typeof Content;
192
- TableView: typeof TableView;
193
- GridView: typeof GridView;
194
- Pagination: typeof Pagination;
195
- ViewOptions: typeof ViewOptions;
196
- };
197
-
198
- declare function cn(...inputs: ClassValue[]): string;
58
+ declare function ViewOptions({ viewMode: propViewMode, onViewModeChange: propOnViewModeChange, }: ViewOptionsProps): react_jsx_runtime.JSX.Element | null;
199
59
 
200
- export { DataTable, Form, cn };
60
+ export { Content, DataTableContext, type FilterOption, Pagination, Root, Toolbar, type ViewMode, ViewOptions, cn, useDataTableContext, useViewMode };
package/dist/index.d.ts CHANGED
@@ -1,138 +1,10 @@
1
- import * as react from 'react';
2
- import { ComponentType, ReactNode } from 'react';
3
- import * as react_hook_form from 'react-hook-form';
4
- import { FieldValues, Path, ControllerRenderProps } from 'react-hook-form';
5
- import * as react_jsx_runtime from 'react/jsx-runtime';
6
- import * as z from 'zod';
7
- import * as class_variance_authority_types from 'class-variance-authority/types';
8
- import { VariantProps } from 'class-variance-authority';
9
- import { ColumnDef } from '@tanstack/react-table';
10
1
  import { ClassValue } from 'clsx';
2
+ import * as react_jsx_runtime from 'react/jsx-runtime';
3
+ import { Table, ColumnDef } from '@tanstack/react-table';
4
+ import * as react from 'react';
11
5
 
12
- type ZodSchema = z.ZodTypeAny;
13
-
14
- type RootProps$1<T extends FieldValues> = {
15
- schema?: ZodSchema;
16
- defaultValues?: Partial<T>;
17
- onSubmit: (values: T) => void | Promise<void>;
18
- children: React.ReactNode;
19
- enableOptimistic?: boolean;
20
- title?: string;
21
- description?: string;
22
- enableEditMode?: boolean;
23
- formId?: string;
24
- };
25
- declare function Root$1<T extends FieldValues = FieldValues>({ schema, defaultValues, onSubmit, children, enableOptimistic, title, description, enableEditMode, formId, }: RootProps$1<T>): react_jsx_runtime.JSX.Element;
26
-
27
- type FieldProps<TFieldValues extends FieldValues> = {
28
- name: Path<TFieldValues>;
29
- label?: string;
30
- children: (field: ControllerRenderProps<TFieldValues, Path<TFieldValues>>) => React.ReactNode;
31
- };
32
- declare function Field<TFieldValues extends FieldValues>({ name, label, children, }: FieldProps<TFieldValues>): react_jsx_runtime.JSX.Element;
33
-
34
- declare const Button$1: ({ children, ...props }: React.ComponentProps<"button">) => react_jsx_runtime.JSX.Element;
35
- declare function Submit({ children, ...props }: React.ComponentProps<typeof Button$1>): react_jsx_runtime.JSX.Element | null;
36
-
37
- declare const buttonVariants: (props?: ({
38
- variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
39
- size?: "icon" | "default" | "sm" | "lg" | "icon-sm" | "icon-lg" | null | undefined;
40
- } & class_variance_authority_types.ClassProp) | undefined) => string;
41
- declare function Button({ className, variant, size, asChild, ...props }: react.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
42
- asChild?: boolean;
43
- }): react_jsx_runtime.JSX.Element;
44
-
45
- type EditButtonProps = React.ComponentProps<typeof Button> & {
46
- formId?: string;
47
- };
48
- declare function EditButton({ children, formId, ...props }: EditButtonProps): react_jsx_runtime.JSX.Element | null;
49
-
50
- declare function CancelButton({ children, ...props }: React.ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element | null;
51
-
52
- type LinkFieldProps = {
53
- label?: string;
54
- link: string;
55
- LinkComponent?: ComponentType<{
56
- href: string;
57
- className?: string;
58
- children: ReactNode;
59
- }>;
60
- className?: string;
61
- };
62
- declare function LinkField({ label, link, LinkComponent, className }: LinkFieldProps): react_jsx_runtime.JSX.Element;
63
-
64
- type FieldGroupProps = {
65
- children: ReactNode;
66
- className?: string;
67
- title?: string;
68
- };
69
- declare function FieldGroup({ children, className, title }: FieldGroupProps): react_jsx_runtime.JSX.Element;
70
-
71
- declare const Form: typeof Root$1 & {
72
- Root: typeof Root$1;
73
- Field: typeof Field;
74
- InputField: <TFieldValues extends react_hook_form.FieldValues>(props: {
75
- name: react_hook_form.Path<TFieldValues>;
76
- label?: string;
77
- placeholder?: string;
78
- type?: React.HTMLInputTypeAttribute;
79
- icon?: React.ReactNode;
80
- iconAlign?: "inline-start" | "inline-end" | "block-start" | "block-end";
81
- startAddon?: React.ReactNode;
82
- endAddon?: React.ReactNode;
83
- useGroup?: boolean;
84
- }) => react.ReactNode;
85
- PasswordField: <TFieldValues extends react_hook_form.FieldValues>(props: {
86
- name: react_hook_form.Path<TFieldValues>;
87
- label?: string;
88
- placeholder?: string;
89
- }) => react.ReactNode;
90
- TextareaField: <TFieldValues extends react_hook_form.FieldValues>(props: {
91
- name: react_hook_form.Path<TFieldValues>;
92
- label?: string;
93
- placeholder?: string;
94
- rows?: number;
95
- }) => react.ReactNode;
96
- SelectField: <TFieldValues extends react_hook_form.FieldValues>(props: {
97
- name: react_hook_form.Path<TFieldValues>;
98
- label?: string;
99
- placeholder?: string;
100
- options: Array<{
101
- label: string;
102
- value: string;
103
- }>;
104
- }) => react.ReactNode;
105
- CheckboxField: <TFieldValues extends react_hook_form.FieldValues>(props: {
106
- name: react_hook_form.Path<TFieldValues>;
107
- label?: string;
108
- description?: string;
109
- }) => react.ReactNode;
110
- DateField: <TFieldValues extends react_hook_form.FieldValues>(props: {
111
- name: react_hook_form.Path<TFieldValues>;
112
- label?: string;
113
- placeholder?: string;
114
- }) => react.ReactNode;
115
- FileField: <TFieldValues extends react_hook_form.FieldValues>(props: {
116
- name: react_hook_form.Path<TFieldValues>;
117
- label?: string;
118
- accept?: string;
119
- multiple?: boolean;
120
- }) => react.ReactNode;
121
- ProfilePictureField: <TFieldValues extends react_hook_form.FieldValues>(props: {
122
- name: react_hook_form.Path<TFieldValues>;
123
- label?: string;
124
- className?: string;
125
- avatarClassName?: string;
126
- fallback?: string;
127
- }) => react.ReactNode;
128
- Submit: typeof Submit;
129
- EditButton: typeof EditButton;
130
- CancelButton: typeof CancelButton;
131
- Group: typeof FieldGroup;
132
- LinkField: typeof LinkField;
133
- };
6
+ declare function cn(...inputs: ClassValue[]): string;
134
7
 
135
- type ViewMode = 'table' | 'grid';
136
8
  interface FilterOption {
137
9
  id: string;
138
10
  label: string;
@@ -141,41 +13,41 @@ interface FilterOption {
141
13
  label: string;
142
14
  }[];
143
15
  placeholder?: string;
144
- multiSelect?: boolean;
145
16
  }
17
+ type ViewMode = "table" | "grid";
18
+ interface DataTableContextValue<TData> {
19
+ table: Table<TData>;
20
+ viewMode: ViewMode;
21
+ setViewMode: (mode: ViewMode) => void;
22
+ filters: FilterOption[];
23
+ showFilters: boolean;
24
+ globalFilter: string;
25
+ setGlobalFilter: (value: string) => void;
26
+ }
27
+ declare const DataTableContext: react.Context<DataTableContextValue<any> | null>;
28
+ declare function useDataTableContext<TData>(): DataTableContextValue<TData>;
29
+
30
+ declare function useViewMode(defaultMode?: ViewMode): {
31
+ viewMode: ViewMode;
32
+ setViewMode: react.Dispatch<react.SetStateAction<ViewMode>>;
33
+ };
146
34
 
147
35
  interface RootProps<TData, TValue> {
148
36
  columns: ColumnDef<TData, TValue>[];
149
37
  data: TData[];
150
38
  filters?: FilterOption[];
151
39
  defaultViewMode?: ViewMode;
152
- viewMode?: ViewMode;
153
- onViewModeChange?: (mode: ViewMode) => void;
154
- defaultPageSize?: number;
40
+ showFilters?: boolean;
155
41
  children: React.ReactNode;
156
42
  }
157
- declare function Root<TData, TValue>({ columns, data, filters, defaultViewMode, viewMode: controlledViewMode, onViewModeChange: controlledOnViewModeChange, defaultPageSize, children, }: RootProps<TData, TValue>): react_jsx_runtime.JSX.Element;
43
+ declare function Root<TData, TValue>({ columns, data, filters, defaultViewMode, showFilters, children, }: RootProps<TData, TValue>): react_jsx_runtime.JSX.Element;
158
44
 
159
- interface ToolbarProps {
160
- viewOptions?: React.ReactNode;
161
- }
162
- declare function Toolbar({ viewOptions }?: ToolbarProps): react_jsx_runtime.JSX.Element;
45
+ declare function Toolbar(): react_jsx_runtime.JSX.Element;
163
46
 
164
47
  interface ContentProps<TData> {
165
48
  renderCard?: (item: TData, index: number) => React.ReactNode;
166
- gridColumns?: number;
167
- gridGap?: number;
168
49
  }
169
- declare function Content<TData>({ renderCard, gridColumns, gridGap }: ContentProps<TData>): react_jsx_runtime.JSX.Element;
170
-
171
- declare function TableView(): react_jsx_runtime.JSX.Element;
172
-
173
- interface GridViewProps<TData> {
174
- renderCard?: (item: TData, index: number) => React.ReactNode;
175
- columns?: number;
176
- gap?: number;
177
- }
178
- declare function GridView<TData>({ renderCard, columns, gap }: GridViewProps<TData>): react_jsx_runtime.JSX.Element;
50
+ declare function Content<TData>({ renderCard }: ContentProps<TData>): react_jsx_runtime.JSX.Element;
179
51
 
180
52
  declare function Pagination(): react_jsx_runtime.JSX.Element;
181
53
 
@@ -183,18 +55,6 @@ interface ViewOptionsProps {
183
55
  viewMode?: ViewMode;
184
56
  onViewModeChange?: (mode: ViewMode) => void;
185
57
  }
186
- declare function ViewOptions({ viewMode: propViewMode, onViewModeChange: propOnViewModeChange }: ViewOptionsProps): react_jsx_runtime.JSX.Element;
187
-
188
- declare const DataTable: typeof Root & {
189
- Root: typeof Root;
190
- Toolbar: typeof Toolbar;
191
- Content: typeof Content;
192
- TableView: typeof TableView;
193
- GridView: typeof GridView;
194
- Pagination: typeof Pagination;
195
- ViewOptions: typeof ViewOptions;
196
- };
197
-
198
- declare function cn(...inputs: ClassValue[]): string;
58
+ declare function ViewOptions({ viewMode: propViewMode, onViewModeChange: propOnViewModeChange, }: ViewOptionsProps): react_jsx_runtime.JSX.Element | null;
199
59
 
200
- export { DataTable, Form, cn };
60
+ export { Content, DataTableContext, type FilterOption, Pagination, Root, Toolbar, type ViewMode, ViewOptions, cn, useDataTableContext, useViewMode };