@ahoo-wang/fetcher-viewer 3.1.8 → 3.2.0
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.
- package/README.md +1 -1
- package/README.zh-CN.md +1 -1
- package/dist/components/RemoteSelect.d.ts.map +1 -1
- package/dist/components/TagInput.d.ts.map +1 -1
- package/dist/filter/AssemblyFilter.d.ts.map +1 -1
- package/dist/filter/BoolFilter.d.ts.map +1 -1
- package/dist/filter/DateTimeFilter.d.ts.map +1 -1
- package/dist/filter/IdFilter.d.ts.map +1 -1
- package/dist/filter/NumberFilter.d.ts.map +1 -1
- package/dist/filter/SelectFilter.d.ts.map +1 -1
- package/dist/filter/TextFilter.d.ts.map +1 -1
- package/dist/filter/TypedFilter.d.ts +2 -2
- package/dist/filter/TypedFilter.d.ts.map +1 -1
- package/dist/filter/filterRegistry.d.ts +49 -47
- package/dist/filter/filterRegistry.d.ts.map +1 -1
- package/dist/filter/operator/locale/index.d.ts.map +1 -1
- package/dist/filter/operator/locale/operator.zh_CN.d.ts.map +1 -1
- package/dist/filter/panel/AvailableFilterSelect.d.ts.map +1 -1
- package/dist/filter/panel/AvailableFilterSelectModal.d.ts.map +1 -1
- package/dist/filter/panel/EditableFilterPanel.d.ts.map +1 -1
- package/dist/filter/panel/RemovableTypedFilter.d.ts.map +1 -1
- package/dist/filter/panel/index.d.ts.map +1 -1
- package/dist/filter/types.d.ts +1 -1
- package/dist/filter/types.d.ts.map +1 -1
- package/dist/filter/useFilterState.d.ts.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.es.js +1227 -841
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/dist/registry/componentRegistry.d.ts +100 -0
- package/dist/registry/componentRegistry.d.ts.map +1 -0
- package/dist/registry/index.d.ts +2 -0
- package/dist/registry/index.d.ts.map +1 -0
- package/dist/table/cell/AvatarCell.d.ts +122 -0
- package/dist/table/cell/AvatarCell.d.ts.map +1 -0
- package/dist/table/cell/CalendarTime.d.ts +178 -0
- package/dist/table/cell/CalendarTime.d.ts.map +1 -0
- package/dist/table/cell/CurrencyCell.d.ts +275 -0
- package/dist/table/cell/CurrencyCell.d.ts.map +1 -0
- package/dist/table/cell/DateTimeCell.d.ts +125 -0
- package/dist/table/cell/DateTimeCell.d.ts.map +1 -0
- package/dist/table/cell/ImageCell.d.ts +129 -0
- package/dist/table/cell/ImageCell.d.ts.map +1 -0
- package/dist/table/cell/ImageGroupCell.d.ts +129 -0
- package/dist/table/cell/ImageGroupCell.d.ts.map +1 -0
- package/dist/table/cell/LinkCell.d.ts +104 -0
- package/dist/table/cell/LinkCell.d.ts.map +1 -0
- package/dist/table/cell/TagCell.d.ts +101 -0
- package/dist/table/cell/TagCell.d.ts.map +1 -0
- package/dist/table/cell/TagsCell.d.ts +128 -0
- package/dist/table/cell/TagsCell.d.ts.map +1 -0
- package/dist/table/cell/TextCell.d.ts +101 -0
- package/dist/table/cell/TextCell.d.ts.map +1 -0
- package/dist/table/cell/TypedCell.d.ts +99 -0
- package/dist/table/cell/TypedCell.d.ts.map +1 -0
- package/dist/table/cell/cellRegistry.d.ts +40 -0
- package/dist/table/cell/cellRegistry.d.ts.map +1 -0
- package/dist/table/cell/currencyFormatter.d.ts +161 -0
- package/dist/table/cell/currencyFormatter.d.ts.map +1 -0
- package/dist/table/cell/index.d.ts +54 -0
- package/dist/table/cell/index.d.ts.map +1 -0
- package/dist/table/cell/types.d.ts +128 -0
- package/dist/table/cell/types.d.ts.map +1 -0
- package/dist/table/cell/utils.d.ts +24 -0
- package/dist/table/cell/utils.d.ts.map +1 -0
- package/dist/table/index.d.ts +2 -0
- package/dist/table/index.d.ts.map +1 -0
- package/dist/types.d.ts +3 -0
- package/dist/types.d.ts.map +1 -1
- package/package.json +3 -3
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
import { CellProps } from './types';
|
|
2
|
+
import { TextProps } from 'antd/es/typography/Text';
|
|
3
|
+
import { Dayjs } from 'dayjs';
|
|
4
|
+
/**
|
|
5
|
+
* Constant representing the type identifier for datetime cells.
|
|
6
|
+
*
|
|
7
|
+
* This constant is used to register and identify datetime cell components
|
|
8
|
+
* in the cell registry system. It should be used when creating typed
|
|
9
|
+
* cell renderers for datetime-based table cells.
|
|
10
|
+
*
|
|
11
|
+
* @constant
|
|
12
|
+
* @type {string}
|
|
13
|
+
* @default 'datetime'
|
|
14
|
+
*
|
|
15
|
+
* @example
|
|
16
|
+
* ```tsx
|
|
17
|
+
* import { typedCellRender, DATETIME_CELL_TYPE } from './table/cell';
|
|
18
|
+
*
|
|
19
|
+
* const datetimeRenderer = typedCellRender(DATETIME_CELL_TYPE, {
|
|
20
|
+
* format: 'YYYY-MM-DD HH:mm:ss'
|
|
21
|
+
* });
|
|
22
|
+
* ```
|
|
23
|
+
*/
|
|
24
|
+
export declare const DATETIME_CELL_TYPE = "datetime";
|
|
25
|
+
/**
|
|
26
|
+
* Props for the DateTimeCell component, extending CellProps with datetime value type and TextProps attributes.
|
|
27
|
+
*
|
|
28
|
+
* @template RecordType - The type of the record containing the cell data.
|
|
29
|
+
* @interface DateTimeCellProps
|
|
30
|
+
* @extends CellProps<string | number | Date | Dayjs, RecordType, TextProps & { format?: string }>
|
|
31
|
+
*
|
|
32
|
+
* @example
|
|
33
|
+
* ```tsx
|
|
34
|
+
* interface Event {
|
|
35
|
+
* id: number;
|
|
36
|
+
* title: string;
|
|
37
|
+
* createdAt: string;
|
|
38
|
+
* updatedAt: number;
|
|
39
|
+
* }
|
|
40
|
+
*
|
|
41
|
+
* const props: DateTimeCellProps<Event> = {
|
|
42
|
+
* data: {
|
|
43
|
+
* value: "2024-01-15T10:30:00Z",
|
|
44
|
+
* record: { id: 1, title: "Meeting", createdAt: "2024-01-15T10:30:00Z", updatedAt: 1705312200000 },
|
|
45
|
+
* index: 0
|
|
46
|
+
* },
|
|
47
|
+
* attributes: {
|
|
48
|
+
* format: "YYYY-MM-DD HH:mm:ss"
|
|
49
|
+
* }
|
|
50
|
+
* };
|
|
51
|
+
* ```
|
|
52
|
+
*/
|
|
53
|
+
export interface DateTimeCellProps<RecordType = any> extends CellProps<string | number | Date | Dayjs, RecordType, TextProps & {
|
|
54
|
+
format?: string | ((dayjs: Dayjs) => string);
|
|
55
|
+
}> {
|
|
56
|
+
}
|
|
57
|
+
export declare const DEFAULT_DATE_TIME_FORMAT = "YYYY-MM-DD HH:mm:ss";
|
|
58
|
+
/**
|
|
59
|
+
* Renders a datetime cell using Ant Design's Typography.Text component with dayjs formatting.
|
|
60
|
+
*
|
|
61
|
+
* This component displays datetime values in table cells, supporting various input formats
|
|
62
|
+
* (string, number timestamp, Date object, or Dayjs object) and customizable formatting
|
|
63
|
+
* through the dayjs library. It provides consistent datetime display with fallback handling
|
|
64
|
+
* for invalid dates.
|
|
65
|
+
*
|
|
66
|
+
* @template RecordType - The type of the record containing the cell data.
|
|
67
|
+
* @param props - The props for the datetime cell component.
|
|
68
|
+
* @param props.data - The cell data containing value, record, and index.
|
|
69
|
+
* @param props.data.value - The datetime value to display (string, number, Date, or Dayjs).
|
|
70
|
+
* @param props.data.record - The full record object for context.
|
|
71
|
+
* @param props.data.index - The index of the row in the table.
|
|
72
|
+
* @param props.attributes - Optional attributes including format string and TextProps.
|
|
73
|
+
* @param props.attributes.format - Optional dayjs format string (default: 'YYYY-MM-DD HH:mm:ss').
|
|
74
|
+
* @returns A React element representing the formatted datetime cell.
|
|
75
|
+
*
|
|
76
|
+
* @example
|
|
77
|
+
* ```tsx
|
|
78
|
+
* <DateTimeCell
|
|
79
|
+
* data={{
|
|
80
|
+
* value: "2024-01-15T10:30:00Z",
|
|
81
|
+
* record: { id: 1, title: "Event", createdAt: "2024-01-15T10:30:00Z" },
|
|
82
|
+
* index: 0
|
|
83
|
+
* }}
|
|
84
|
+
* attributes={{
|
|
85
|
+
* format: "YYYY-MM-DD HH:mm:ss"
|
|
86
|
+
* }}
|
|
87
|
+
* />
|
|
88
|
+
* ```
|
|
89
|
+
*
|
|
90
|
+
* @example
|
|
91
|
+
* ```tsx
|
|
92
|
+
* // With TypeScript and timestamp
|
|
93
|
+
* interface Log {
|
|
94
|
+
* id: number;
|
|
95
|
+
* message: string;
|
|
96
|
+
* timestamp: number;
|
|
97
|
+
* }
|
|
98
|
+
*
|
|
99
|
+
* <DateTimeCell<Log>
|
|
100
|
+
* data={{
|
|
101
|
+
* value: 1705312200000,
|
|
102
|
+
* record: { id: 1, message: "User login", timestamp: 1705312200000 },
|
|
103
|
+
* index: 0
|
|
104
|
+
* }}
|
|
105
|
+
* attributes={{
|
|
106
|
+
* format: "MMM DD, YYYY hh:mm A",
|
|
107
|
+
* style: { color: '#666' }
|
|
108
|
+
* }}
|
|
109
|
+
* />
|
|
110
|
+
* ```
|
|
111
|
+
*
|
|
112
|
+
* @example
|
|
113
|
+
* ```tsx
|
|
114
|
+
* // With Date object
|
|
115
|
+
* <DateTimeCell
|
|
116
|
+
* data={{
|
|
117
|
+
* value: new Date(),
|
|
118
|
+
* record: { id: 1, title: "Current time" },
|
|
119
|
+
* index: 0
|
|
120
|
+
* }}
|
|
121
|
+
* />
|
|
122
|
+
* ```
|
|
123
|
+
*/
|
|
124
|
+
export declare function DateTimeCell<RecordType = any>(props: DateTimeCellProps<RecordType>): import("react/jsx-runtime").JSX.Element;
|
|
125
|
+
//# sourceMappingURL=DateTimeCell.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateTimeCell.d.ts","sourceRoot":"","sources":["../../../src/table/cell/DateTimeCell.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAc,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAKrC;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,kBAAkB,aAAa,CAAC;AAE7C;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,WAAW,iBAAiB,CAAC,UAAU,GAAG,GAAG,CACjD,SAAQ,SAAS,CACf,MAAM,GAAG,MAAM,GAAG,IAAI,GAAG,KAAK,EAC9B,UAAU,EACV,SAAS,GAAG;IAAE,MAAM,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,KAAK,MAAM,CAAC,CAAA;CAAE,CAC7D;CACF;AAED,eAAO,MAAM,wBAAwB,wBAAwB,CAAC;AAE9D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiEG;AACH,wBAAgB,YAAY,CAAC,UAAU,GAAG,GAAG,EAC3C,KAAK,EAAE,iBAAiB,CAAC,UAAU,CAAC,2CAerC"}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import { CellProps } from './types';
|
|
2
|
+
import { ImageProps } from 'antd/es/image';
|
|
3
|
+
/**
|
|
4
|
+
* Constant representing the type identifier for image cells.
|
|
5
|
+
*
|
|
6
|
+
* This constant is used to register and identify image cell components
|
|
7
|
+
* in the cell registry system. It should be used when creating typed
|
|
8
|
+
* cell renderers for image-based table cells.
|
|
9
|
+
*
|
|
10
|
+
* @constant
|
|
11
|
+
* @type {string}
|
|
12
|
+
* @default 'image'
|
|
13
|
+
*
|
|
14
|
+
* @example
|
|
15
|
+
* ```tsx
|
|
16
|
+
* import { typedCellRender, IMAGE_CELL_TYPE } from './table/cell';
|
|
17
|
+
*
|
|
18
|
+
* const imageRenderer = typedCellRender(IMAGE_CELL_TYPE, {
|
|
19
|
+
* width: 50,
|
|
20
|
+
* height: 50
|
|
21
|
+
* });
|
|
22
|
+
* ```
|
|
23
|
+
*/
|
|
24
|
+
export declare const IMAGE_CELL_TYPE = "image";
|
|
25
|
+
/**
|
|
26
|
+
* Props for the ImageCell component, extending CellProps with string value type and ImageProps attributes.
|
|
27
|
+
*
|
|
28
|
+
* @template RecordType - The type of the record containing the cell data.
|
|
29
|
+
* @interface ImageCellProps
|
|
30
|
+
* @extends CellProps<string, RecordType, ImageProps>
|
|
31
|
+
*
|
|
32
|
+
* @example
|
|
33
|
+
* ```tsx
|
|
34
|
+
* interface Product {
|
|
35
|
+
* id: number;
|
|
36
|
+
* name: string;
|
|
37
|
+
* imageUrl: string;
|
|
38
|
+
* }
|
|
39
|
+
*
|
|
40
|
+
* const props: ImageCellProps<Product> = {
|
|
41
|
+
* data: {
|
|
42
|
+
* value: "https://example.com/image.jpg",
|
|
43
|
+
* record: { id: 1, name: "Product A", imageUrl: "https://example.com/image.jpg" },
|
|
44
|
+
* index: 0
|
|
45
|
+
* },
|
|
46
|
+
* attributes: {
|
|
47
|
+
* width: 80,
|
|
48
|
+
* height: 80,
|
|
49
|
+
* alt: "Product image"
|
|
50
|
+
* }
|
|
51
|
+
* };
|
|
52
|
+
* ```
|
|
53
|
+
*/
|
|
54
|
+
export interface ImageCellProps<RecordType = any> extends CellProps<string, RecordType, ImageProps> {
|
|
55
|
+
}
|
|
56
|
+
/**
|
|
57
|
+
* Renders an image cell using Ant Design's Image component.
|
|
58
|
+
*
|
|
59
|
+
* This component displays image URLs in table cells with support for
|
|
60
|
+
* preview, fallback images, and all Image component features. It handles
|
|
61
|
+
* null/undefined values gracefully by showing a placeholder.
|
|
62
|
+
*
|
|
63
|
+
* @template RecordType - The type of the record containing the cell data.
|
|
64
|
+
* @param props - The props for the image cell component.
|
|
65
|
+
* @param props.data - The cell data containing value, record, and index.
|
|
66
|
+
* @param props.data.value - The image URL string to display.
|
|
67
|
+
* @param props.data.record - The full record object for context.
|
|
68
|
+
* @param props.data.index - The index of the row in the table.
|
|
69
|
+
* @param props.attributes - Optional attributes for the Image component.
|
|
70
|
+
* @returns A React element representing the image cell.
|
|
71
|
+
*
|
|
72
|
+
* @example
|
|
73
|
+
* ```tsx
|
|
74
|
+
* <ImageCell
|
|
75
|
+
* data={{
|
|
76
|
+
* value: "https://example.com/avatar.jpg",
|
|
77
|
+
* record: { id: 1, name: "John", avatar: "https://example.com/avatar.jpg" },
|
|
78
|
+
* index: 0
|
|
79
|
+
* }}
|
|
80
|
+
* attributes={{
|
|
81
|
+
* width: 40,
|
|
82
|
+
* height: 40,
|
|
83
|
+
* preview: true
|
|
84
|
+
* }}
|
|
85
|
+
* />
|
|
86
|
+
* ```
|
|
87
|
+
*
|
|
88
|
+
* @example
|
|
89
|
+
* ```tsx
|
|
90
|
+
* // With fallback image
|
|
91
|
+
* <ImageCell
|
|
92
|
+
* data={{
|
|
93
|
+
* value: "https://example.com/image.jpg",
|
|
94
|
+
* record: { id: 1, title: "Product", imageUrl: "https://example.com/image.jpg" },
|
|
95
|
+
* index: 0
|
|
96
|
+
* }}
|
|
97
|
+
* attributes={{
|
|
98
|
+
* width: 100,
|
|
99
|
+
* height: 100,
|
|
100
|
+
* fallback: "https://example.com/placeholder.jpg"
|
|
101
|
+
* }}
|
|
102
|
+
* />
|
|
103
|
+
* ```
|
|
104
|
+
*
|
|
105
|
+
* @example
|
|
106
|
+
* ```tsx
|
|
107
|
+
* // With TypeScript
|
|
108
|
+
* interface User {
|
|
109
|
+
* id: number;
|
|
110
|
+
* name: string;
|
|
111
|
+
* avatar: string;
|
|
112
|
+
* }
|
|
113
|
+
*
|
|
114
|
+
* <ImageCell<User>
|
|
115
|
+
* data={{
|
|
116
|
+
* value: user.avatar,
|
|
117
|
+
* record: user,
|
|
118
|
+
* index: 0
|
|
119
|
+
* }}
|
|
120
|
+
* attributes={{
|
|
121
|
+
* width: 32,
|
|
122
|
+
* height: 32,
|
|
123
|
+
* style: { borderRadius: '50%' }
|
|
124
|
+
* }}
|
|
125
|
+
* />
|
|
126
|
+
* ```
|
|
127
|
+
*/
|
|
128
|
+
export declare function ImageCell<RecordType = any>(props: ImageCellProps<RecordType>): import("react/jsx-runtime").JSX.Element;
|
|
129
|
+
//# sourceMappingURL=ImageCell.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ImageCell.d.ts","sourceRoot":"","sources":["../../../src/table/cell/ImageCell.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,eAAe,UAAU,CAAC;AAEvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,MAAM,WAAW,cAAc,CAAC,UAAU,GAAG,GAAG,CAC9C,SAAQ,SAAS,CAAC,MAAM,EAAE,UAAU,EAAE,UAAU,CAAC;CAClD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuEG;AACH,wBAAgB,SAAS,CAAC,UAAU,GAAG,GAAG,EAAE,KAAK,EAAE,cAAc,CAAC,UAAU,CAAC,2CAQ5E"}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import { CellProps } from './types';
|
|
2
|
+
import { ImageProps } from 'antd/es/image';
|
|
3
|
+
/**
|
|
4
|
+
* Constant representing the type identifier for image group cells.
|
|
5
|
+
*
|
|
6
|
+
* This constant is used to register and identify image group cell components
|
|
7
|
+
* in the cell registry system. It should be used when creating typed
|
|
8
|
+
* cell renderers for image group-based table cells.
|
|
9
|
+
*
|
|
10
|
+
* @constant
|
|
11
|
+
* @type {string}
|
|
12
|
+
* @default 'image-group'
|
|
13
|
+
*
|
|
14
|
+
* @example
|
|
15
|
+
* ```tsx
|
|
16
|
+
* import { typedCellRender, IMAGE_GROUP_CELL_TYPE } from './table/cell';
|
|
17
|
+
*
|
|
18
|
+
* const imageGroupRenderer = typedCellRender(IMAGE_GROUP_CELL_TYPE, {
|
|
19
|
+
* width: 50,
|
|
20
|
+
* height: 50
|
|
21
|
+
* });
|
|
22
|
+
* ```
|
|
23
|
+
*/
|
|
24
|
+
export declare const IMAGE_GROUP_CELL_TYPE = "image-group";
|
|
25
|
+
/**
|
|
26
|
+
* Props for the ImageGroupCell component, extending CellProps with string array value type and ImageProps attributes.
|
|
27
|
+
*
|
|
28
|
+
* @template RecordType - The type of the record containing the cell data.
|
|
29
|
+
* @interface ImageGroupCellProps
|
|
30
|
+
* @extends CellProps<string[], RecordType, ImageProps>
|
|
31
|
+
*
|
|
32
|
+
* @example
|
|
33
|
+
* ```tsx
|
|
34
|
+
* interface Product {
|
|
35
|
+
* id: number;
|
|
36
|
+
* name: string;
|
|
37
|
+
* images: string[];
|
|
38
|
+
* }
|
|
39
|
+
*
|
|
40
|
+
* const props: ImageGroupCellProps<Product> = {
|
|
41
|
+
* data: {
|
|
42
|
+
* value: ["https://example.com/image1.jpg", "https://example.com/image2.jpg"],
|
|
43
|
+
* record: { id: 1, name: "Product A", images: ["https://example.com/image1.jpg", "https://example.com/image2.jpg"] },
|
|
44
|
+
* index: 0
|
|
45
|
+
* },
|
|
46
|
+
* attributes: {
|
|
47
|
+
* width: 80,
|
|
48
|
+
* height: 80,
|
|
49
|
+
* preview: true
|
|
50
|
+
* }
|
|
51
|
+
* };
|
|
52
|
+
* ```
|
|
53
|
+
*/
|
|
54
|
+
export interface ImageGroupCellProps<RecordType = any> extends CellProps<string[], RecordType, ImageProps> {
|
|
55
|
+
}
|
|
56
|
+
/**
|
|
57
|
+
* Renders an image group cell using Ant Design's Image.PreviewGroup component.
|
|
58
|
+
*
|
|
59
|
+
* This component displays multiple images in a group that can be previewed together,
|
|
60
|
+
* allowing navigation between images. It handles null/undefined/empty arrays gracefully
|
|
61
|
+
* by showing a placeholder.
|
|
62
|
+
*
|
|
63
|
+
* @template RecordType - The type of the record containing the cell data.
|
|
64
|
+
* @param props - The props for the image group cell component.
|
|
65
|
+
* @param props.data - The cell data containing value, record, and index.
|
|
66
|
+
* @param props.data.value - The array of image URLs to display.
|
|
67
|
+
* @param props.data.record - The full record object for context.
|
|
68
|
+
* @param props.data.index - The index of the row in the table.
|
|
69
|
+
* @param props.attributes - Optional attributes for the Image components.
|
|
70
|
+
* @returns A React element representing the image group cell.
|
|
71
|
+
*
|
|
72
|
+
* @example
|
|
73
|
+
* ```tsx
|
|
74
|
+
* <ImageGroupCell
|
|
75
|
+
* data={{
|
|
76
|
+
* value: ["https://example.com/avatar1.jpg", "https://example.com/avatar2.jpg"],
|
|
77
|
+
* record: { id: 1, name: "John", avatars: ["https://example.com/avatar1.jpg", "https://example.com/avatar2.jpg"] },
|
|
78
|
+
* index: 0
|
|
79
|
+
* }}
|
|
80
|
+
* attributes={{
|
|
81
|
+
* width: 40,
|
|
82
|
+
* height: 40,
|
|
83
|
+
* preview: true
|
|
84
|
+
* }}
|
|
85
|
+
* />
|
|
86
|
+
* ```
|
|
87
|
+
*
|
|
88
|
+
* @example
|
|
89
|
+
* ```tsx
|
|
90
|
+
* // With fallback images
|
|
91
|
+
* <ImageGroupCell
|
|
92
|
+
* data={{
|
|
93
|
+
* value: ["https://example.com/image1.jpg", "https://example.com/image2.jpg"],
|
|
94
|
+
* record: { id: 1, title: "Product", images: ["https://example.com/image1.jpg", "https://example.com/image2.jpg"] },
|
|
95
|
+
* index: 0
|
|
96
|
+
* }}
|
|
97
|
+
* attributes={{
|
|
98
|
+
* width: 100,
|
|
99
|
+
* height: 100,
|
|
100
|
+
* fallback: "https://example.com/placeholder.jpg"
|
|
101
|
+
* }}
|
|
102
|
+
* />
|
|
103
|
+
* ```
|
|
104
|
+
*
|
|
105
|
+
* @example
|
|
106
|
+
* ```tsx
|
|
107
|
+
* // With TypeScript
|
|
108
|
+
* interface Gallery {
|
|
109
|
+
* id: number;
|
|
110
|
+
* name: string;
|
|
111
|
+
* photos: string[];
|
|
112
|
+
* }
|
|
113
|
+
*
|
|
114
|
+
* <ImageGroupCell<Gallery>
|
|
115
|
+
* data={{
|
|
116
|
+
* value: gallery.photos,
|
|
117
|
+
* record: gallery,
|
|
118
|
+
* index: 0
|
|
119
|
+
* }}
|
|
120
|
+
* attributes={{
|
|
121
|
+
* width: 64,
|
|
122
|
+
* height: 64,
|
|
123
|
+
* style: { borderRadius: '4px' }
|
|
124
|
+
* }}
|
|
125
|
+
* />
|
|
126
|
+
* ```
|
|
127
|
+
*/
|
|
128
|
+
export declare function ImageGroupCell<RecordType = any>(props: ImageGroupCellProps<RecordType>): import("react/jsx-runtime").JSX.Element;
|
|
129
|
+
//# sourceMappingURL=ImageGroupCell.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ImageGroupCell.d.ts","sourceRoot":"","sources":["../../../src/table/cell/ImageGroupCell.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,qBAAqB,gBAAgB,CAAC;AAEnD;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,MAAM,WAAW,mBAAmB,CAAC,UAAU,GAAG,GAAG,CACnD,SAAQ,SAAS,CAAC,MAAM,EAAE,EAAE,UAAU,EAAE,UAAU,CAAC;CAAG;AAExD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuEG;AACH,wBAAgB,cAAc,CAAC,UAAU,GAAG,GAAG,EAC7C,KAAK,EAAE,mBAAmB,CAAC,UAAU,CAAC,2CAuBvC"}
|
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
import { CellProps } from './types';
|
|
2
|
+
import { LinkProps } from 'antd/es/typography/Link';
|
|
3
|
+
/**
|
|
4
|
+
* Constant representing the type identifier for link cells.
|
|
5
|
+
*
|
|
6
|
+
* This constant is used to register and identify link cell components
|
|
7
|
+
* in the cell registry system. It should be used when creating typed
|
|
8
|
+
* cell renderers for link-based table cells.
|
|
9
|
+
*
|
|
10
|
+
* @constant
|
|
11
|
+
* @type {string}
|
|
12
|
+
* @default 'link'
|
|
13
|
+
*
|
|
14
|
+
* @example
|
|
15
|
+
* ```tsx
|
|
16
|
+
* import { typedCellRender, LINK_CELL_TYPE } from './table/cell';
|
|
17
|
+
*
|
|
18
|
+
* const linkRenderer = typedCellRender(LINK_CELL_TYPE, { href: '#' });
|
|
19
|
+
* ```
|
|
20
|
+
*/
|
|
21
|
+
export declare const LINK_CELL_TYPE = "link";
|
|
22
|
+
/**
|
|
23
|
+
* Props for the LinkCell component, extending CellProps with string value type and LinkProps attributes.
|
|
24
|
+
*
|
|
25
|
+
* @template RecordType - The type of the record containing the cell data.
|
|
26
|
+
* @interface LinkCellProps
|
|
27
|
+
* @extends CellProps<string, RecordType, LinkProps>
|
|
28
|
+
*
|
|
29
|
+
* @example
|
|
30
|
+
* ```tsx
|
|
31
|
+
* interface Article {
|
|
32
|
+
* id: number;
|
|
33
|
+
* title: string;
|
|
34
|
+
* url: string;
|
|
35
|
+
* }
|
|
36
|
+
*
|
|
37
|
+
* const props: LinkCellProps<Article> = {
|
|
38
|
+
* data: {
|
|
39
|
+
* value: "Read More",
|
|
40
|
+
* record: { id: 1, title: "Article Title", url: "https://example.com" },
|
|
41
|
+
* index: 0
|
|
42
|
+
* },
|
|
43
|
+
* attributes: { href: "https://example.com" }
|
|
44
|
+
* };
|
|
45
|
+
* ```
|
|
46
|
+
*/
|
|
47
|
+
export interface LinkCellProps<RecordType = any> extends CellProps<string, RecordType, LinkProps> {
|
|
48
|
+
}
|
|
49
|
+
/**
|
|
50
|
+
* Renders a link cell using Ant Design's Typography.Link component.
|
|
51
|
+
*
|
|
52
|
+
* This component displays clickable links in table cells with support for
|
|
53
|
+
* various link formatting options provided by Ant Design's Typography.Link.
|
|
54
|
+
* It handles the rendering of link content while allowing customization
|
|
55
|
+
* through attributes like href, target, and other LinkProps.
|
|
56
|
+
*
|
|
57
|
+
* @template RecordType - The type of the record containing the cell data.
|
|
58
|
+
* @param props - The props for the link cell component.
|
|
59
|
+
* @param props.data - The cell data containing value, record, and index.
|
|
60
|
+
* @param props.data.value - The string value to display as the link text.
|
|
61
|
+
* @param props.data.record - The full record object for context.
|
|
62
|
+
* @param props.data.index - The index of the row in the table.
|
|
63
|
+
* @param props.attributes - Optional attributes to pass to Typography.Link component.
|
|
64
|
+
* @returns A React element representing the link cell.
|
|
65
|
+
*
|
|
66
|
+
* @example
|
|
67
|
+
* ```tsx
|
|
68
|
+
* <LinkCell
|
|
69
|
+
* data={{
|
|
70
|
+
* value: "Visit Website",
|
|
71
|
+
* record: { id: 1, name: "Example", url: "https://example.com" },
|
|
72
|
+
* index: 0
|
|
73
|
+
* }}
|
|
74
|
+
* attributes={{
|
|
75
|
+
* href: "https://example.com",
|
|
76
|
+
* target: "_blank"
|
|
77
|
+
* }}
|
|
78
|
+
* />
|
|
79
|
+
* ```
|
|
80
|
+
*
|
|
81
|
+
* @example
|
|
82
|
+
* ```tsx
|
|
83
|
+
* // With TypeScript
|
|
84
|
+
* interface LinkItem {
|
|
85
|
+
* id: number;
|
|
86
|
+
* text: string;
|
|
87
|
+
* href: string;
|
|
88
|
+
* }
|
|
89
|
+
*
|
|
90
|
+
* <LinkCell<LinkItem>
|
|
91
|
+
* data={{
|
|
92
|
+
* value: "Click Here",
|
|
93
|
+
* record: { id: 1, text: "Click Here", href: "https://example.com" },
|
|
94
|
+
* index: 0
|
|
95
|
+
* }}
|
|
96
|
+
* attributes={{
|
|
97
|
+
* href: "https://example.com",
|
|
98
|
+
* style: { color: '#1890ff' }
|
|
99
|
+
* }}
|
|
100
|
+
* />
|
|
101
|
+
* ```
|
|
102
|
+
*/
|
|
103
|
+
export declare function LinkCell<RecordType = any>(props: LinkCellProps<RecordType>): import("react/jsx-runtime").JSX.Element;
|
|
104
|
+
//# sourceMappingURL=LinkCell.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LinkCell.d.ts","sourceRoot":"","sources":["../../../src/table/cell/LinkCell.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAIpD;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,cAAc,SAAS,CAAC;AAErC;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,WAAW,aAAa,CAAC,UAAU,GAAG,GAAG,CAC7C,SAAQ,SAAS,CAAC,MAAM,EAAE,UAAU,EAAE,SAAS,CAAC;CACjD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,wBAAgB,QAAQ,CAAC,UAAU,GAAG,GAAG,EAAE,KAAK,EAAE,aAAa,CAAC,UAAU,CAAC,2CAM1E"}
|
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
import { TagProps } from 'antd';
|
|
2
|
+
import { CellProps } from './types';
|
|
3
|
+
/**
|
|
4
|
+
* Constant representing the type identifier for tag cells.
|
|
5
|
+
*
|
|
6
|
+
* This constant is used to register and identify tag cell components
|
|
7
|
+
* in the cell registry system. It should be used when creating typed
|
|
8
|
+
* cell renderers for tag-based table cells.
|
|
9
|
+
*
|
|
10
|
+
* @constant
|
|
11
|
+
* @type {string}
|
|
12
|
+
* @default 'tag'
|
|
13
|
+
*
|
|
14
|
+
* @example
|
|
15
|
+
* ```tsx
|
|
16
|
+
* import { typedCellRender, TAG_CELL_TYPE } from './table/cell';
|
|
17
|
+
*
|
|
18
|
+
* const tagRenderer = typedCellRender(TAG_CELL_TYPE, { color: 'blue' });
|
|
19
|
+
* ```
|
|
20
|
+
*/
|
|
21
|
+
export declare const TAG_CELL_TYPE = "tag";
|
|
22
|
+
/**
|
|
23
|
+
* Props for the TagCell component, extending CellProps with string value type and TagProps attributes.
|
|
24
|
+
*
|
|
25
|
+
* @template RecordType - The type of the record containing the cell data.
|
|
26
|
+
* @interface TagCellProps
|
|
27
|
+
* @extends CellProps<string, RecordType, TagProps>
|
|
28
|
+
*
|
|
29
|
+
* @example
|
|
30
|
+
* ```tsx
|
|
31
|
+
* interface Product {
|
|
32
|
+
* id: number;
|
|
33
|
+
* name: string;
|
|
34
|
+
* category: string;
|
|
35
|
+
* }
|
|
36
|
+
*
|
|
37
|
+
* const props: TagCellProps<Product> = {
|
|
38
|
+
* data: {
|
|
39
|
+
* value: "electronics",
|
|
40
|
+
* record: { id: 1, name: "Laptop", category: "electronics" },
|
|
41
|
+
* index: 0
|
|
42
|
+
* },
|
|
43
|
+
* attributes: { color: "blue" }
|
|
44
|
+
* };
|
|
45
|
+
* ```
|
|
46
|
+
*/
|
|
47
|
+
export interface TagCellProps<RecordType = any> extends CellProps<string, RecordType, TagProps> {
|
|
48
|
+
}
|
|
49
|
+
/**
|
|
50
|
+
* Renders a tag cell using Ant Design's Tag component.
|
|
51
|
+
*
|
|
52
|
+
* This component displays a single string tag in table cells with support for
|
|
53
|
+
* various tag formatting options provided by Ant Design's Tag. It allows
|
|
54
|
+
* customization through attributes like color, closable, and other TagProps.
|
|
55
|
+
*
|
|
56
|
+
* @template RecordType - The type of the record containing the cell data.
|
|
57
|
+
* @param props - The props for the tag cell component.
|
|
58
|
+
* @param props.data - The cell data containing value, record, and index.
|
|
59
|
+
* @param props.data.value - The string tag to display in the cell.
|
|
60
|
+
* @param props.data.record - The full record object for context.
|
|
61
|
+
* @param props.data.index - The index of the row in the table.
|
|
62
|
+
* @param props.attributes - Optional attributes to pass to the Tag component.
|
|
63
|
+
* @returns A React element representing the tag cell.
|
|
64
|
+
*
|
|
65
|
+
* @throws {Error} If the value is not a string.
|
|
66
|
+
*
|
|
67
|
+
* @example
|
|
68
|
+
* ```tsx
|
|
69
|
+
* <TagCell
|
|
70
|
+
* data={{
|
|
71
|
+
* value: "urgent",
|
|
72
|
+
* record: { id: 1, title: "Task", priority: "urgent" },
|
|
73
|
+
* index: 0
|
|
74
|
+
* }}
|
|
75
|
+
* attributes={{
|
|
76
|
+
* color: "red"
|
|
77
|
+
* }}
|
|
78
|
+
* />
|
|
79
|
+
* ```
|
|
80
|
+
*
|
|
81
|
+
* @example
|
|
82
|
+
* ```tsx
|
|
83
|
+
* // With TypeScript
|
|
84
|
+
* interface Task {
|
|
85
|
+
* id: number;
|
|
86
|
+
* title: string;
|
|
87
|
+
* priority: string;
|
|
88
|
+
* }
|
|
89
|
+
*
|
|
90
|
+
* <TagCell<Task>
|
|
91
|
+
* data={{
|
|
92
|
+
* value: "urgent",
|
|
93
|
+
* record: { id: 1, title: "Task", priority: "urgent" },
|
|
94
|
+
* index: 0
|
|
95
|
+
* }}
|
|
96
|
+
* attributes={{ color: "orange", closable: true }}
|
|
97
|
+
* />
|
|
98
|
+
* ```
|
|
99
|
+
*/
|
|
100
|
+
export declare function TagCell<RecordType = any>(props: TagCellProps<RecordType>): import("react/jsx-runtime").JSX.Element | null;
|
|
101
|
+
//# sourceMappingURL=TagCell.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TagCell.d.ts","sourceRoot":"","sources":["../../../src/table/cell/TagCell.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAO,QAAQ,EAAE,MAAM,MAAM,CAAC;AACrC,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGpC;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,aAAa,QAAQ,CAAC;AAEnC;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,WAAW,YAAY,CAAC,UAAU,GAAG,GAAG,CAC5C,SAAQ,SAAS,CAAC,MAAM,EAAE,UAAU,EAAE,QAAQ,CAAC;CAChD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkDG;AACH,wBAAgB,OAAO,CAAC,UAAU,GAAG,GAAG,EAAE,KAAK,EAAE,YAAY,CAAC,UAAU,CAAC,kDAOxE"}
|