@bsol-oss/react-datatable5 12.0.0-beta.7 → 12.0.0-beta.70

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 (52) hide show
  1. package/README.md +192 -0
  2. package/dist/index.d.ts +277 -83
  3. package/dist/index.js +1577 -469
  4. package/dist/index.mjs +1585 -477
  5. package/dist/types/components/DataTable/DataTable.d.ts +3 -1
  6. package/dist/types/components/DataTable/DataTableServer.d.ts +6 -4
  7. package/dist/types/components/DataTable/DefaultTable.d.ts +6 -9
  8. package/dist/types/components/DataTable/context/DataTableContext.d.ts +21 -3
  9. package/dist/types/components/DataTable/context/useDataTableContext.d.ts +2 -2
  10. package/dist/types/components/DataTable/controls/ReloadButton.d.ts +1 -2
  11. package/dist/types/components/DataTable/controls/ResetFilteringButton.d.ts +1 -4
  12. package/dist/types/components/DataTable/controls/ResetSelectionButton.d.ts +1 -4
  13. package/dist/types/components/DataTable/controls/ResetSortingButton.d.ts +1 -4
  14. package/dist/types/components/DataTable/controls/TableControls.d.ts +10 -2
  15. package/dist/types/components/DataTable/display/TableBody.d.ts +1 -2
  16. package/dist/types/components/DataTable/display/TableCardContainer.d.ts +6 -3
  17. package/dist/types/components/DataTable/display/TableDataDisplay.d.ts +6 -1
  18. package/dist/types/components/DataTable/display/TableFooter.d.ts +1 -5
  19. package/dist/types/components/DataTable/display/TableHeader.d.ts +46 -8
  20. package/dist/types/components/DataTable/useDataTableServer.d.ts +55 -3
  21. package/dist/types/components/DatePicker/DatePicker.d.ts +23 -0
  22. package/dist/types/components/DatePicker/DateTimePicker.d.ts +11 -0
  23. package/dist/types/components/DatePicker/DurationPicker.d.ts +12 -0
  24. package/dist/types/components/DatePicker/IsoTimePicker.d.ts +16 -0
  25. package/dist/types/components/DatePicker/PickerDemo.d.ts +1 -0
  26. package/dist/types/components/DatePicker/UniversalPicker.d.ts +9 -0
  27. package/dist/types/components/DatePicker/index.d.ts +7 -0
  28. package/dist/types/components/Filter/TagFilter.d.ts +5 -1
  29. package/dist/types/components/Form/SchemaFormContext.d.ts +8 -1
  30. package/dist/types/components/Form/components/core/DefaultForm.d.ts +1 -0
  31. package/dist/types/components/Form/components/core/FormRoot.d.ts +9 -2
  32. package/dist/types/components/Form/components/fields/CustomInput.d.ts +8 -0
  33. package/dist/types/components/Form/components/fields/DatePicker.d.ts +2 -7
  34. package/dist/types/components/Form/components/fields/DateTimePicker.d.ts +2 -0
  35. package/dist/types/components/Form/components/fields/EnumPicker.d.ts +2 -1
  36. package/dist/types/components/Form/components/fields/FilePicker.d.ts +2 -5
  37. package/dist/types/components/Form/components/fields/StringInputField.d.ts +19 -5
  38. package/dist/types/components/Form/components/fields/TextAreaInput.d.ts +12 -0
  39. package/dist/types/components/Form/components/fields/TimePicker.d.ts +7 -0
  40. package/dist/types/components/Form/components/fields/types.d.ts +6 -0
  41. package/dist/types/components/Form/components/types/CustomJSONSchema7.d.ts +19 -1
  42. package/dist/types/components/Form/components/viewers/CustomViewer.d.ts +8 -0
  43. package/dist/types/components/Form/components/viewers/DateTimeViewer.d.ts +7 -0
  44. package/dist/types/components/Form/components/viewers/TextAreaViewer.d.ts +12 -0
  45. package/dist/types/components/Form/components/viewers/TimeViewer.d.ts +7 -0
  46. package/dist/types/components/Form/utils/translateWrapper.d.ts +6 -0
  47. package/dist/types/components/Form/utils/validateData.d.ts +9 -0
  48. package/dist/types/components/Form/utils/validation.d.ts +104 -0
  49. package/dist/types/components/TextArea/TextArea.d.ts +22 -0
  50. package/dist/types/components/TimePicker/TimePicker.d.ts +21 -0
  51. package/dist/types/index.d.ts +17 -2
  52. package/package.json +9 -2
@@ -1,12 +1,30 @@
1
1
  import { JSONSchema7 } from "json-schema";
2
2
  import { ReactNode } from "react";
3
3
  import { ForeignKeyProps } from "../fields/StringInputField";
4
+ import { UseFormReturn } from "react-hook-form";
4
5
  export interface CustomJSONSchema7 extends JSONSchema7 {
5
6
  gridColumn?: string;
6
7
  gridRow?: string;
7
8
  foreign_key?: ForeignKeyProps;
8
9
  variant?: string;
9
- renderDisplay: (item: unknown) => ReactNode;
10
+ renderDisplay?: (item: unknown) => ReactNode;
11
+ inputRender?: (props: {
12
+ column: string;
13
+ schema: CustomJSONSchema7;
14
+ prefix: string;
15
+ formContext: UseFormReturn;
16
+ }) => ReactNode;
17
+ inputViewerRender?: (props: {
18
+ column: string;
19
+ schema: CustomJSONSchema7;
20
+ prefix: string;
21
+ formContext: UseFormReturn;
22
+ }) => ReactNode;
23
+ dateFormat?: string;
24
+ displayDateFormat?: string;
25
+ timeFormat?: string;
26
+ displayTimeFormat?: string;
27
+ showLabel?: boolean;
10
28
  }
11
29
  export interface TagPickerProps {
12
30
  column: string;
@@ -0,0 +1,8 @@
1
+ /// <reference types="react" />
2
+ import { CustomJSONSchema7 } from "../types/CustomJSONSchema7";
3
+ export interface DatePickerProps {
4
+ column: string;
5
+ schema: CustomJSONSchema7;
6
+ prefix: string;
7
+ }
8
+ export declare const CustomViewer: ({ column, schema, prefix }: DatePickerProps) => import("react").ReactNode;
@@ -0,0 +1,7 @@
1
+ import { CustomJSONSchema7 } from "../types/CustomJSONSchema7";
2
+ export interface DateViewerProps {
3
+ column: string;
4
+ schema: CustomJSONSchema7;
5
+ prefix: string;
6
+ }
7
+ export declare const DateTimeViewer: ({ column, schema, prefix }: DateViewerProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,12 @@
1
+ import { CustomJSONSchema7 } from "../types/CustomJSONSchema7";
2
+ export interface TextAreaViewerProps {
3
+ column: string;
4
+ schema: CustomJSONSchema7;
5
+ prefix: string;
6
+ }
7
+ export interface ForeignKeyProps {
8
+ column: string;
9
+ table: string;
10
+ display_column: string;
11
+ }
12
+ export declare const TextAreaViewer: ({ column, schema, prefix, }: TextAreaViewerProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,7 @@
1
+ import { CustomJSONSchema7 } from "../types/CustomJSONSchema7";
2
+ export interface TimeViewerProps {
3
+ column: string;
4
+ schema: CustomJSONSchema7;
5
+ prefix: string;
6
+ }
7
+ export declare const TimeViewer: ({ column, schema, prefix }: TimeViewerProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,6 @@
1
+ export declare function translateWrapper({ prefix, column, label, translate, }: {
2
+ prefix: string;
3
+ column: string;
4
+ label: string;
5
+ translate: any;
6
+ }): any;
@@ -0,0 +1,9 @@
1
+ import { ErrorObject, ValidateFunction } from "ajv";
2
+ import { JSONSchema7 } from "json-schema";
3
+ type ValidateDataResult = {
4
+ isValid: boolean;
5
+ validate: ValidateFunction;
6
+ errors: ErrorObject<string, Record<string, any>, unknown>[] | null | undefined;
7
+ };
8
+ export declare const validateData: (data: unknown, schema: JSONSchema7) => ValidateDataResult;
9
+ export {};
@@ -0,0 +1,104 @@
1
+ import { JSONSchema7 } from "json-schema";
2
+ declare const errorMessages: {
3
+ en: {
4
+ required: (field: string) => string;
5
+ format: (format: string) => string;
6
+ type: (expectedType: string, actualType: string) => string;
7
+ minLength: (limit: number) => string;
8
+ maxLength: (limit: number) => string;
9
+ minimum: (limit: number) => string;
10
+ maximum: (limit: number) => string;
11
+ pattern: () => string;
12
+ enum: (allowedValues: string[]) => string;
13
+ default: () => string;
14
+ };
15
+ 'zh-HK': {
16
+ required: (field: string) => string;
17
+ format: (format: string) => string;
18
+ type: (expectedType: string, actualType: string) => string;
19
+ minLength: (limit: number) => string;
20
+ maxLength: (limit: number) => string;
21
+ minimum: (limit: number) => string;
22
+ maximum: (limit: number) => string;
23
+ pattern: () => string;
24
+ enum: (allowedValues: string[]) => string;
25
+ default: () => string;
26
+ };
27
+ 'zh-TW': {
28
+ required: (field: string) => string;
29
+ format: (format: string) => string;
30
+ type: (expectedType: string, actualType: string) => string;
31
+ minLength: (limit: number) => string;
32
+ maxLength: (limit: number) => string;
33
+ minimum: (limit: number) => string;
34
+ maximum: (limit: number) => string;
35
+ pattern: () => string;
36
+ enum: (allowedValues: string[]) => string;
37
+ default: () => string;
38
+ };
39
+ 'zh-CN': {
40
+ required: (field: string) => string;
41
+ format: (format: string) => string;
42
+ type: (expectedType: string, actualType: string) => string;
43
+ minLength: (limit: number) => string;
44
+ maxLength: (limit: number) => string;
45
+ minimum: (limit: number) => string;
46
+ maximum: (limit: number) => string;
47
+ pattern: () => string;
48
+ enum: (allowedValues: string[]) => string;
49
+ default: () => string;
50
+ };
51
+ zh: {
52
+ required: (field: string) => string;
53
+ format: (format: string) => string;
54
+ type: (expectedType: string, actualType: string) => string;
55
+ minLength: (limit: number) => string;
56
+ maxLength: (limit: number) => string;
57
+ minimum: (limit: number) => string;
58
+ maximum: (limit: number) => string;
59
+ pattern: () => string;
60
+ enum: (allowedValues: string[]) => string;
61
+ default: () => string;
62
+ };
63
+ };
64
+ export type SupportedLocale = keyof typeof errorMessages;
65
+ export interface ValidationError {
66
+ field: string;
67
+ message: string;
68
+ value?: unknown;
69
+ schemaPath?: string;
70
+ }
71
+ export interface ValidationResult {
72
+ isValid: boolean;
73
+ errors: ValidationError[];
74
+ }
75
+ export interface ValidationOptions {
76
+ locale?: SupportedLocale;
77
+ }
78
+ /**
79
+ * Validates data against a JSON Schema using AJV with i18n support
80
+ * @param data - The data to validate
81
+ * @param schema - The JSON Schema to validate against
82
+ * @param options - Validation options including locale
83
+ * @returns ValidationResult containing validation status and errors
84
+ */
85
+ export declare const validateData: (data: unknown, schema: JSONSchema7, options?: ValidationOptions) => ValidationResult;
86
+ /**
87
+ * Creates a reusable validator function for a specific schema with i18n support
88
+ * @param schema - The JSON Schema to create validator for
89
+ * @param locale - The locale to use for error messages
90
+ * @returns A function that validates data against the schema
91
+ */
92
+ export declare const createSchemaValidator: (schema: JSONSchema7, locale?: SupportedLocale) => (data: unknown) => ValidationResult;
93
+ /**
94
+ * Get available locales for validation error messages
95
+ * @returns Array of supported locale codes
96
+ */
97
+ export declare const getSupportedLocales: () => SupportedLocale[];
98
+ /**
99
+ * Check if a locale is supported
100
+ * @param locale - The locale to check
101
+ * @returns Boolean indicating if the locale is supported
102
+ */
103
+ export declare const isLocaleSupported: (locale: string) => locale is "en" | "zh-HK" | "zh-TW" | "zh-CN" | "zh";
104
+ export {};
@@ -0,0 +1,22 @@
1
+ import type React from "react";
2
+ interface CustomTextareaProps {
3
+ value?: string;
4
+ defaultValue?: string;
5
+ placeholder?: string;
6
+ onChange?: (value: string) => void;
7
+ onFocus?: () => void;
8
+ onBlur?: () => void;
9
+ disabled?: boolean;
10
+ readOnly?: boolean;
11
+ className?: string;
12
+ rows?: number;
13
+ maxLength?: number;
14
+ autoFocus?: boolean;
15
+ invalid?: boolean;
16
+ required?: boolean;
17
+ label?: string;
18
+ helperText?: string;
19
+ errorText?: string;
20
+ }
21
+ declare const Textarea: React.ForwardRefExoticComponent<CustomTextareaProps & React.RefAttributes<HTMLDivElement>>;
22
+ export { Textarea };
@@ -0,0 +1,21 @@
1
+ import { Dispatch, SetStateAction } from "react";
2
+ interface TimePickerProps {
3
+ hour: number | null;
4
+ setHour: Dispatch<SetStateAction<number | null>>;
5
+ minute: number | null;
6
+ setMinute: Dispatch<SetStateAction<number | null>>;
7
+ meridiem: "am" | "pm" | null;
8
+ setMeridiem: Dispatch<SetStateAction<"am" | "pm" | null>>;
9
+ onChange?: (newValue: {
10
+ hour: number | null;
11
+ minute: number | null;
12
+ meridiem: "am" | "pm" | null;
13
+ }) => void;
14
+ meridiemLabel?: {
15
+ am: string;
16
+ pm: string;
17
+ };
18
+ timezone?: string;
19
+ }
20
+ export declare function TimePicker({ hour, setHour, minute, setMinute, meridiem, setMeridiem, meridiemLabel, onChange, timezone, }: TimePickerProps): import("react/jsx-runtime").JSX.Element;
21
+ export {};
@@ -12,6 +12,17 @@ declare module "@tanstack/react-table" {
12
12
  * The display name of the column, used for rendering headers.
13
13
  */
14
14
  displayName?: string;
15
+ /**
16
+ * Text configuration for the column header menu items.
17
+ * These strings can be customized per column.
18
+ */
19
+ headerTexts?: {
20
+ pinColumn?: string;
21
+ cancelPin?: string;
22
+ sortAscending?: string;
23
+ sortDescending?: string;
24
+ clearSorting?: string;
25
+ };
15
26
  /**
16
27
  * Specifies the type of filter to be used for the column.
17
28
  *
@@ -32,7 +43,10 @@ declare module "@tanstack/react-table" {
32
43
  /**
33
44
  * Options for the select filter variant, if applicable.
34
45
  */
35
- filterOptions?: string[];
46
+ filterOptions?: {
47
+ label: string;
48
+ value: string;
49
+ }[];
36
50
  /**
37
51
  * Configuration for the range filter variant, if applicable.
38
52
  *
@@ -86,6 +100,7 @@ export * from "./components/DataTable/controls/TableFilters";
86
100
  export * from "./components/DataTable/controls/TableFilterTags";
87
101
  export * from "./components/DataTable/display/TableFooter";
88
102
  export * from "./components/DataTable/display/TableHeader";
103
+ export type { TableHeaderTexts } from "./components/DataTable/display/TableHeader";
89
104
  export * from "./components/DataTable/display/TableLoadingComponent";
90
105
  export * from "./components/DataTable/controls/TableSelector";
91
106
  export * from "./components/DataTable/controls/TableSorter";
@@ -94,7 +109,7 @@ export * from "./components/DataTable/display/TextCell";
94
109
  export * from "./components/DataTable/useDataTable";
95
110
  export * from "./components/DataTable/useDataTableServer";
96
111
  export * from "./components/DataTable/utils/getColumns";
97
- export * from "./components/Filter/FilterOptions";
112
+ export * from "./components/DataTable/display/TableDataDisplay";
98
113
  export * from "./components/Filter/GlobalFilter";
99
114
  export * from "./components/Form/components/core/DefaultForm";
100
115
  export * from "./components/Form/components/core/FormRoot";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bsol-oss/react-datatable5",
3
- "version": "12.0.0-beta.7",
3
+ "version": "12.0.0-beta.70",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",
@@ -37,12 +37,15 @@
37
37
  "peerDependencies": {
38
38
  "@atlaskit/pragmatic-drag-and-drop": "^1.4.0",
39
39
  "@bsol-oss/dayzed-react19": "^0.0.4",
40
- "@chakra-ui/react": "^3.2.3",
40
+ "@chakra-ui/react": "^3.19.1",
41
41
  "@emotion/react": "^11.13.5",
42
42
  "@tanstack/match-sorter-utils": "^8.15.1",
43
43
  "@tanstack/react-query": "^5.66.9",
44
44
  "@tanstack/react-table": "^8.21.2",
45
45
  "@uidotdev/usehooks": "^2.4.1",
46
+ "ajv": "^8.12.0",
47
+ "ajv-errors": "^3.0.0",
48
+ "ajv-formats": "^3.0.1",
46
49
  "axios": "^1.7.9",
47
50
  "dayjs": "^1.11.13",
48
51
  "next-themes": "^0.4.4",
@@ -63,6 +66,7 @@
63
66
  "@storybook/react": "^8.4.7",
64
67
  "@storybook/react-vite": "^8.4.7",
65
68
  "@storybook/test": "^8.4.7",
69
+ "@types/ajv-errors": "^2.0.0",
66
70
  "@types/json-schema": "^7.0.15",
67
71
  "@types/react": "19.0.2",
68
72
  "@types/react-beautiful-dnd": "^13.1.8",
@@ -70,6 +74,9 @@
70
74
  "@typescript-eslint/eslint-plugin": "^7.2.0",
71
75
  "@typescript-eslint/parser": "^7.2.0",
72
76
  "@vitejs/plugin-react": "^4.2.1",
77
+ "ajv": "^8.12.0",
78
+ "ajv-errors": "^3.0.0",
79
+ "ajv-formats": "^3.0.1",
73
80
  "eslint": "^8.57.0",
74
81
  "eslint-plugin-react-hooks": "^4.6.0",
75
82
  "eslint-plugin-react-refresh": "^0.4.6",