@iress-oss/ids-mcp-server 0.0.1-dev.4 → 0.0.1
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/LICENSE +193 -0
- package/README.md +159 -29
- package/build/componentHandlers.js +205 -0
- package/{dist → build}/config.js +5 -5
- package/build/index.js +51 -0
- package/{dist → build}/iressHandlers.js +46 -52
- package/{dist → build}/resourceHandlers.js +22 -23
- package/{dist → build}/searchHandlers.js +92 -107
- package/{dist → build}/toolHandler.js +13 -13
- package/build/tools.js +165 -0
- package/{dist → build}/utils.js +15 -11
- package/docs/api-reference.md +0 -0
- package/docs/best-practices.md +0 -0
- package/docs/configuration.md +0 -0
- package/docs/examples.md +0 -0
- package/docs/guidelines.md +269 -0
- package/{generated/docs → docs/ids}/components-autocomplete-docs.md +5 -5
- package/{generated/docs → docs/ids}/components-autocomplete-recipes-docs.md +51 -17
- package/{generated/docs → docs/ids}/components-card-recipes-docs.md +1 -1
- package/{generated/docs → docs/ids}/components-checkbox-docs.md +19 -6
- package/{generated/docs → docs/ids}/components-checkboxgroup-docs.md +18 -18
- package/{generated/docs → docs/ids}/components-checkboxgroup-recipes-docs.md +9 -9
- package/{generated/docs → docs/ids}/components-col-docs.md +1 -1
- package/{generated/docs → docs/ids}/components-combobox-docs.md +6 -6
- package/{generated/docs → docs/ids}/components-container-docs.md +42 -8
- package/{generated/docs → docs/ids}/components-filter-docs.md +66 -13
- package/{generated/docs → docs/ids}/components-form-docs.md +368 -342
- package/{generated/docs → docs/ids}/components-form-recipes-docs.md +11 -202
- package/{generated/docs → docs/ids}/components-hide-docs.md +70 -16
- package/{generated/docs → docs/ids}/components-icon-docs.md +4 -4
- package/{generated/docs → docs/ids}/components-input-recipes-docs.md +2 -2
- package/{generated/docs → docs/ids}/components-inputcurrency-recipes-docs.md +40 -6
- package/{generated/docs → docs/ids}/components-modal-docs.md +113 -3
- package/docs/ids/components-popover-docs.md +4 -0
- package/{generated/docs → docs/ids}/components-radiogroup-docs.md +21 -21
- package/{generated/docs → docs/ids}/components-richselect-docs.md +111 -149
- package/{generated/docs → docs/ids}/components-row-docs.md +4 -4
- package/{generated/docs → docs/ids}/components-skeleton-docs.md +3 -3
- package/{generated/docs → docs/ids}/components-skeleton-recipes-docs.md +1 -1
- package/{generated/docs → docs/ids}/components-skiplink-docs.md +1 -1
- package/{generated/docs → docs/ids}/components-slideout-docs.md +113 -3
- package/docs/ids/components-table-ag-grid-docs.md +2694 -0
- package/{generated/docs → docs/ids}/components-table-docs.md +597 -92
- package/{generated/docs → docs/ids}/components-tabset-docs.md +2 -2
- package/{generated/docs → docs/ids}/components-tag-docs.md +1 -1
- package/{generated/docs → docs/ids}/components-toaster-docs.md +5 -56
- package/{generated/docs → docs/ids}/extensions-editor-docs.md +5 -5
- package/{generated/docs → docs/ids}/foundations-colours-docs.md +1 -1
- package/{generated/docs → docs/ids}/foundations-typography-docs.md +2 -7
- package/docs/ids/get-started-develop-docs.md +48 -0
- package/{generated/docs → docs/ids}/introduction-docs.md +4 -4
- package/{generated/docs → docs/ids}/patterns-loading-docs.md +2 -332
- package/docs/ids/resources-migration-guides-from-v4-to-v5-docs.md +639 -0
- package/docs/ids/themes-available-themes-docs.md +74 -0
- package/docs/ids/themes-tokens-docs.md +4580 -0
- package/docs/ids/versions-docs.md +27 -0
- package/docs/tutorials/basic-integration.md +0 -0
- package/package.json +15 -44
- package/LICENSE.txt +0 -201
- package/dist/componentHandlers.js +0 -241
- package/dist/componentHandlers.test.js +0 -380
- package/dist/index.js +0 -53
- package/dist/iressHandlers.test.js +0 -316
- package/dist/resourceHandlers.test.js +0 -352
- package/dist/searchHandlers.test.js +0 -524
- package/dist/toolHandler.test.js +0 -369
- package/dist/tools.js +0 -165
- package/dist/utils.test.js +0 -286
- package/generated/docs/components-popover-docs.md +0 -464
- package/generated/docs/components-provider-docs.md +0 -105
- package/generated/docs/components-table-ag-grid-docs.md +0 -1074
- package/generated/docs/foundations-accessibility-docs.md +0 -62
- package/generated/docs/foundations-consistency-docs.md +0 -52
- package/generated/docs/foundations-content-docs.md +0 -23
- package/generated/docs/foundations-introduction-docs.md +0 -17
- package/generated/docs/foundations-principles-docs.md +0 -70
- package/generated/docs/foundations-user-experience-docs.md +0 -63
- package/generated/docs/foundations-visual-design-docs.md +0 -46
- package/generated/docs/get-started-develop-docs.md +0 -209
- package/generated/docs/guidelines.md +0 -812
- package/generated/docs/resources-migration-guides-from-v4-to-v5-docs.md +0 -437
- package/generated/docs/themes-available-themes-docs.md +0 -66
- package/generated/docs/themes-tokens-docs.md +0 -1200
- package/generated/docs/versions-docs.md +0 -17
- /package/{dist → build}/types.js +0 -0
- /package/{generated/docs → docs/ids}/components-alert-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-badge-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-button-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-button-recipes-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-buttongroup-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-card-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-divider-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-expander-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-field-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-inline-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-input-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-inputcurrency-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-label-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-menu-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-menu-menuitem-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-navbar-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-navbar-recipes-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-panel-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-placeholder-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-popover-recipes-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-progress-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-radio-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-readonly-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-select-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-slider-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-spinner-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-stack-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-tabset-tab-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-text-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-toaster-toast-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-toggle-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-tooltip-docs.md +0 -0
- /package/{generated/docs → docs/ids}/components-validationmessage-docs.md +0 -0
- /package/{generated/docs → docs/ids}/contact-us-docs.md +0 -0
- /package/{generated/docs → docs/ids}/extensions-editor-recipes-docs.md +0 -0
- /package/{generated/docs → docs/ids}/frequently-asked-questions-docs.md +0 -0
- /package/{generated/docs → docs/ids}/get-started-using-storybook-docs.md +0 -0
- /package/{generated/docs → docs/ids}/resources-changelog-docs.md +0 -0
- /package/{generated/docs → docs/ids}/resources-code-katas-docs.md +0 -0
- /package/{generated/docs → docs/ids}/themes-introduction-docs.md +0 -0
|
@@ -7,11 +7,38 @@ Overview
|
|
|
7
7
|
Data driven component for displaying tabular data.
|
|
8
8
|
|
|
9
9
|
My investments
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
10
|
+
|
|
11
|
+
Investment Name
|
|
12
|
+
|
|
13
|
+
Cost
|
|
14
|
+
|
|
15
|
+
Investment Date
|
|
16
|
+
|
|
17
|
+
Total Percentage
|
|
18
|
+
|
|
19
|
+
Artemis Fund Managers Limited
|
|
20
|
+
|
|
21
|
+
23898
|
|
22
|
+
|
|
23
|
+
2019-09-23
|
|
24
|
+
|
|
25
|
+
24.8
|
|
26
|
+
|
|
27
|
+
CASH.CASH
|
|
28
|
+
|
|
29
|
+
49751.4
|
|
30
|
+
|
|
31
|
+
2020-06-28
|
|
32
|
+
|
|
33
|
+
49
|
|
34
|
+
|
|
35
|
+
VODAFONE GRP
|
|
36
|
+
|
|
37
|
+
26382.456
|
|
38
|
+
|
|
39
|
+
2019-02-05
|
|
40
|
+
|
|
41
|
+
26.2
|
|
15
42
|
|
|
16
43
|
Hide code
|
|
17
44
|
|
|
@@ -54,11 +81,38 @@ To get started, the `IressTable` component only requires the `caption` and `rows
|
|
|
54
81
|
* `rows` are an array of objects, each object represents a row in the table. The table will use the key of the first object to determine the columns, automatically made human readable if the key is camel case, snake case or kebab case.
|
|
55
82
|
|
|
56
83
|
My investments
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
84
|
+
|
|
85
|
+
Investment Name
|
|
86
|
+
|
|
87
|
+
Cost
|
|
88
|
+
|
|
89
|
+
Investment Date
|
|
90
|
+
|
|
91
|
+
Total Percentage
|
|
92
|
+
|
|
93
|
+
Artemis Fund Managers Limited
|
|
94
|
+
|
|
95
|
+
23898
|
|
96
|
+
|
|
97
|
+
2019-09-23
|
|
98
|
+
|
|
99
|
+
24.8
|
|
100
|
+
|
|
101
|
+
CASH.CASH
|
|
102
|
+
|
|
103
|
+
49751.4
|
|
104
|
+
|
|
105
|
+
2020-06-28
|
|
106
|
+
|
|
107
|
+
49
|
|
108
|
+
|
|
109
|
+
VODAFONE GRP
|
|
110
|
+
|
|
111
|
+
26382.456
|
|
112
|
+
|
|
113
|
+
2019-02-05
|
|
114
|
+
|
|
115
|
+
26.2
|
|
62
116
|
|
|
63
117
|
Hide code
|
|
64
118
|
|
|
@@ -97,11 +151,38 @@ For more control over the columns, the `columns` prop can be used to define the
|
|
|
97
151
|
Each array item represents a key in the objects in your `rows` prop. If one of the keys in your `rows` prop is not defined in the `columns` prop, it will not be displayed in the table.
|
|
98
152
|
|
|
99
153
|
My investments
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
154
|
+
|
|
155
|
+
Investment
|
|
156
|
+
|
|
157
|
+
Date
|
|
158
|
+
|
|
159
|
+
Share
|
|
160
|
+
|
|
161
|
+
Cost
|
|
162
|
+
|
|
163
|
+
Artemis Fund Managers Limited
|
|
164
|
+
|
|
165
|
+
23/09/2019
|
|
166
|
+
|
|
167
|
+
24.8%
|
|
168
|
+
|
|
169
|
+
$23,898.00
|
|
170
|
+
|
|
171
|
+
CASH.CASH
|
|
172
|
+
|
|
173
|
+
28/06/2020
|
|
174
|
+
|
|
175
|
+
49%
|
|
176
|
+
|
|
177
|
+
$49,751.40
|
|
178
|
+
|
|
179
|
+
VODAFONE GRP
|
|
180
|
+
|
|
181
|
+
05/02/2019
|
|
182
|
+
|
|
183
|
+
26.2%
|
|
184
|
+
|
|
185
|
+
$26,382.46
|
|
105
186
|
|
|
106
187
|
Hide code
|
|
107
188
|
|
|
@@ -112,7 +193,7 @@ import {
|
|
|
112
193
|
IressTable,
|
|
113
194
|
IressTableFormattedValue,
|
|
114
195
|
IressTableProps,
|
|
115
|
-
} from '@iress
|
|
196
|
+
} from '@iress/ids-components';
|
|
116
197
|
type Props \= Partial<IressTableProps<object, never\>>;
|
|
117
198
|
const renderColumn \= (value: number) \=> (
|
|
118
199
|
<IressBadge mode\={value \> 30000 ? 'success' : 'danger'}\>
|
|
@@ -244,15 +325,48 @@ The table component provides some basic formatting. This is controlled by the `f
|
|
|
244
325
|
To completely customise it, you can also send in a function that returns a ReactNode. It has two parameters, the original value and the row it is connected to.
|
|
245
326
|
|
|
246
327
|
Available formats
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
328
|
+
|
|
329
|
+
String
|
|
330
|
+
|
|
331
|
+
Number
|
|
332
|
+
|
|
333
|
+
Date
|
|
334
|
+
|
|
335
|
+
Short date
|
|
336
|
+
|
|
337
|
+
ISO Date & Time
|
|
338
|
+
|
|
339
|
+
Relative time
|
|
340
|
+
|
|
341
|
+
Currency (AUD)
|
|
342
|
+
|
|
343
|
+
Percent
|
|
344
|
+
|
|
345
|
+
Custom
|
|
346
|
+
|
|
347
|
+
Hello, world!
|
|
348
|
+
|
|
349
|
+
123456
|
|
350
|
+
|
|
351
|
+
28/06/2020
|
|
352
|
+
|
|
353
|
+
28 Jun 2020
|
|
354
|
+
|
|
355
|
+
2020-06-28 10:00:00 (AEST)
|
|
356
|
+
|
|
357
|
+
12 seconds ago
|
|
358
|
+
|
|
359
|
+
123,456.78
|
|
360
|
+
|
|
361
|
+
12%
|
|
362
|
+
|
|
363
|
+
Custom
|
|
250
364
|
|
|
251
365
|
Hide code
|
|
252
366
|
|
|
253
367
|
\[data-radix-scroll-area-viewport\] { scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; } \[data-radix-scroll-area-viewport\]::-webkit-scrollbar { display: none; } :where(\[data-radix-scroll-area-viewport\]) { display: flex; flex-direction: column; align-items: stretch; } :where(\[data-radix-scroll-area-content\]) { flex-grow: 1; }
|
|
254
368
|
|
|
255
|
-
import { IressBadge, IressTable, IressTableProps } from '@iress
|
|
369
|
+
import { IressBadge, IressTable, IressTableProps } from '@iress/ids-components';
|
|
256
370
|
type Props \= Partial<IressTableProps<object, never\>>;
|
|
257
371
|
const renderColumn \= (value: string) \=> (
|
|
258
372
|
<IressBadge mode\="info"\>{value}</IressBadge\>
|
|
@@ -314,11 +428,38 @@ Sorting can be enabled on a column by setting the `sort` property of the `TableC
|
|
|
314
428
|
The sort button has some visually hidden text for screenreaders to signify that the column is sortable. If you need to change this (ie. for translation purposes), it can be done with the `sortableText` column option which defaults to: sortable.
|
|
315
429
|
|
|
316
430
|
My investments
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
431
|
+
|
|
432
|
+
Investment
|
|
433
|
+
|
|
434
|
+
Date
|
|
435
|
+
|
|
436
|
+
Share
|
|
437
|
+
|
|
438
|
+
Cost
|
|
439
|
+
|
|
440
|
+
Artemis Fund Managers Limited
|
|
441
|
+
|
|
442
|
+
23/09/2019
|
|
443
|
+
|
|
444
|
+
24.8%
|
|
445
|
+
|
|
446
|
+
$23,898.00
|
|
447
|
+
|
|
448
|
+
CASH.CASH
|
|
449
|
+
|
|
450
|
+
28/06/2020
|
|
451
|
+
|
|
452
|
+
49%
|
|
453
|
+
|
|
454
|
+
$49,751.40
|
|
455
|
+
|
|
456
|
+
VODAFONE GRP
|
|
457
|
+
|
|
458
|
+
05/02/2019
|
|
459
|
+
|
|
460
|
+
26.2%
|
|
461
|
+
|
|
462
|
+
$26,382.46
|
|
322
463
|
|
|
323
464
|
Hide code
|
|
324
465
|
|
|
@@ -329,7 +470,7 @@ import {
|
|
|
329
470
|
IressTable,
|
|
330
471
|
IressTableFormattedValue,
|
|
331
472
|
IressTableProps,
|
|
332
|
-
} from '@iress
|
|
473
|
+
} from '@iress/ids-components';
|
|
333
474
|
type Props \= Partial<IressTableProps<object, never\>>;
|
|
334
475
|
const renderColumn \= (value: number) \=> (
|
|
335
476
|
<IressBadge mode\={value \> 30000 ? 'success' : 'danger'}\>
|
|
@@ -402,11 +543,38 @@ If you need to customise the sorting logic, you can use the `sortFn` property of
|
|
|
402
543
|
* A custom sort function that takes two arguments: `a` and `b`, which are the two rows being compared. It should return `-1`, `0` or `1` depending on the comparison.
|
|
403
544
|
|
|
404
545
|
My investments
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
546
|
+
|
|
547
|
+
Investment
|
|
548
|
+
|
|
549
|
+
Date
|
|
550
|
+
|
|
551
|
+
Share
|
|
552
|
+
|
|
553
|
+
Cost (sorts by net cost if available)
|
|
554
|
+
|
|
555
|
+
Artemis Fund Managers Limited
|
|
556
|
+
|
|
557
|
+
23/09/2019
|
|
558
|
+
|
|
559
|
+
24.8%
|
|
560
|
+
|
|
561
|
+
$23,898.00 (net: N/A)
|
|
562
|
+
|
|
563
|
+
CASH.CASH
|
|
564
|
+
|
|
565
|
+
28/06/2020
|
|
566
|
+
|
|
567
|
+
49%
|
|
568
|
+
|
|
569
|
+
$49,751.40 (net: $20,000.00)
|
|
570
|
+
|
|
571
|
+
VODAFONE GRP
|
|
572
|
+
|
|
573
|
+
05/02/2019
|
|
574
|
+
|
|
575
|
+
26.2%
|
|
576
|
+
|
|
577
|
+
$26,382.46 (net: N/A)
|
|
410
578
|
|
|
411
579
|
Hide code
|
|
412
580
|
|
|
@@ -417,7 +585,7 @@ import {
|
|
|
417
585
|
IressTableFormattedValue,
|
|
418
586
|
IressTableProps,
|
|
419
587
|
TableColumn,
|
|
420
|
-
} from '@iress
|
|
588
|
+
} from '@iress/ids-components';
|
|
421
589
|
type Props \= Partial<IressTableProps<Row, never\>>;
|
|
422
590
|
interface Row {
|
|
423
591
|
investment\_name: string;
|
|
@@ -509,11 +677,38 @@ The width of a column is controlled by the `width` property on the `TableColumn`
|
|
|
509
677
|
When the table exceeds the width of the container, a horizontal scrollbar is triggered. This makes it possible to view larger tables on mobile devices.
|
|
510
678
|
|
|
511
679
|
My investments
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
680
|
+
|
|
681
|
+
Investment
|
|
682
|
+
|
|
683
|
+
Cost
|
|
684
|
+
|
|
685
|
+
Investment date
|
|
686
|
+
|
|
687
|
+
Share
|
|
688
|
+
|
|
689
|
+
Artemis Fund Managers Limited
|
|
690
|
+
|
|
691
|
+
23898
|
|
692
|
+
|
|
693
|
+
2019-09-23
|
|
694
|
+
|
|
695
|
+
24.8%
|
|
696
|
+
|
|
697
|
+
CASH.CASH
|
|
698
|
+
|
|
699
|
+
49751.4
|
|
700
|
+
|
|
701
|
+
2020-06-28
|
|
702
|
+
|
|
703
|
+
49%
|
|
704
|
+
|
|
705
|
+
VODAFONE GRP
|
|
706
|
+
|
|
707
|
+
26382.456
|
|
708
|
+
|
|
709
|
+
2019-02-05
|
|
710
|
+
|
|
711
|
+
26.2%
|
|
517
712
|
|
|
518
713
|
Hide code
|
|
519
714
|
|
|
@@ -574,11 +769,38 @@ Columns can be aligned using the `align` property on the `TableColumn` object. C
|
|
|
574
769
|
Currency and number formats are automatically right aligned to make the values easier to compare, but this can be overriden by setting the `align` property.
|
|
575
770
|
|
|
576
771
|
My investments
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
772
|
+
|
|
773
|
+
Investment (left)
|
|
774
|
+
|
|
775
|
+
Cost (center)
|
|
776
|
+
|
|
777
|
+
Date (center)
|
|
778
|
+
|
|
779
|
+
Share (right)
|
|
780
|
+
|
|
781
|
+
Artemis Fund Managers Limited
|
|
782
|
+
|
|
783
|
+
$23,898.00
|
|
784
|
+
|
|
785
|
+
23/09/2019
|
|
786
|
+
|
|
787
|
+
24.8%
|
|
788
|
+
|
|
789
|
+
CASH.CASH
|
|
790
|
+
|
|
791
|
+
$49,751.40
|
|
792
|
+
|
|
793
|
+
28/06/2020
|
|
794
|
+
|
|
795
|
+
49%
|
|
796
|
+
|
|
797
|
+
VODAFONE GRP
|
|
798
|
+
|
|
799
|
+
$26,382.46
|
|
800
|
+
|
|
801
|
+
05/02/2019
|
|
802
|
+
|
|
803
|
+
26.2%
|
|
582
804
|
|
|
583
805
|
Hide code
|
|
584
806
|
|
|
@@ -642,11 +864,38 @@ As a general rule we don't add vertical column borders to our tables. Sometimes
|
|
|
642
864
|
To add a vertical divider you can set the `divider` prop in the `TableColumn` to true. This will add a vertical border to the end of the column.
|
|
643
865
|
|
|
644
866
|
My investments
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
867
|
+
|
|
868
|
+
Investment
|
|
869
|
+
|
|
870
|
+
Date
|
|
871
|
+
|
|
872
|
+
Share
|
|
873
|
+
|
|
874
|
+
Cost
|
|
875
|
+
|
|
876
|
+
Artemis Fund Managers Limited
|
|
877
|
+
|
|
878
|
+
23/09/2019
|
|
879
|
+
|
|
880
|
+
24.8%
|
|
881
|
+
|
|
882
|
+
$23,898.00
|
|
883
|
+
|
|
884
|
+
CASH.CASH
|
|
885
|
+
|
|
886
|
+
28/06/2020
|
|
887
|
+
|
|
888
|
+
49%
|
|
889
|
+
|
|
890
|
+
$49,751.40
|
|
891
|
+
|
|
892
|
+
VODAFONE GRP
|
|
893
|
+
|
|
894
|
+
05/02/2019
|
|
895
|
+
|
|
896
|
+
26.2%
|
|
897
|
+
|
|
898
|
+
$26,382.46
|
|
650
899
|
|
|
651
900
|
Hide code
|
|
652
901
|
|
|
@@ -705,11 +954,38 @@ Copy
|
|
|
705
954
|
This can be enabled by setting the `hover` prop. This will bring attention to the row the user is hovering over, allowing users to focus on the relationship between the columns of a specific row.
|
|
706
955
|
|
|
707
956
|
My investments
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
957
|
+
|
|
958
|
+
Investment Name
|
|
959
|
+
|
|
960
|
+
Cost
|
|
961
|
+
|
|
962
|
+
Investment Date
|
|
963
|
+
|
|
964
|
+
Total Percentage
|
|
965
|
+
|
|
966
|
+
Artemis Fund Managers Limited
|
|
967
|
+
|
|
968
|
+
23898
|
|
969
|
+
|
|
970
|
+
2019-09-23
|
|
971
|
+
|
|
972
|
+
24.8
|
|
973
|
+
|
|
974
|
+
CASH.CASH
|
|
975
|
+
|
|
976
|
+
49751.4
|
|
977
|
+
|
|
978
|
+
2020-06-28
|
|
979
|
+
|
|
980
|
+
49
|
|
981
|
+
|
|
982
|
+
VODAFONE GRP
|
|
983
|
+
|
|
984
|
+
26382.456
|
|
985
|
+
|
|
986
|
+
2019-02-05
|
|
987
|
+
|
|
988
|
+
26.2
|
|
713
989
|
|
|
714
990
|
Hide code
|
|
715
991
|
|
|
@@ -747,11 +1023,38 @@ Copy
|
|
|
747
1023
|
`scope` defaults to row, which means the first cell in the row will be a `<th>`. When it is set to col the first cell in the row will be a `<td>`.
|
|
748
1024
|
|
|
749
1025
|
My investments
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
|
|
1026
|
+
|
|
1027
|
+
Investment Name
|
|
1028
|
+
|
|
1029
|
+
Cost
|
|
1030
|
+
|
|
1031
|
+
Investment Date
|
|
1032
|
+
|
|
1033
|
+
Total Percentage
|
|
1034
|
+
|
|
1035
|
+
Artemis Fund Managers Limited
|
|
1036
|
+
|
|
1037
|
+
23898
|
|
1038
|
+
|
|
1039
|
+
2019-09-23
|
|
1040
|
+
|
|
1041
|
+
24.8
|
|
1042
|
+
|
|
1043
|
+
CASH.CASH
|
|
1044
|
+
|
|
1045
|
+
49751.4
|
|
1046
|
+
|
|
1047
|
+
2020-06-28
|
|
1048
|
+
|
|
1049
|
+
49
|
|
1050
|
+
|
|
1051
|
+
VODAFONE GRP
|
|
1052
|
+
|
|
1053
|
+
26382.456
|
|
1054
|
+
|
|
1055
|
+
2019-02-05
|
|
1056
|
+
|
|
1057
|
+
26.2
|
|
755
1058
|
|
|
756
1059
|
Hide code
|
|
757
1060
|
|
|
@@ -788,7 +1091,31 @@ Copy
|
|
|
788
1091
|
|
|
789
1092
|
For very simple tabular data, you have the option to hide the table header with the `hiddenHeader` prop. When this is set to true, the table header will not be rendered.
|
|
790
1093
|
|
|
791
|
-
|
|
1094
|
+
My investments
|
|
1095
|
+
|
|
1096
|
+
Artemis Fund Managers Limited
|
|
1097
|
+
|
|
1098
|
+
23898
|
|
1099
|
+
|
|
1100
|
+
2019-09-23
|
|
1101
|
+
|
|
1102
|
+
24.8
|
|
1103
|
+
|
|
1104
|
+
CASH.CASH
|
|
1105
|
+
|
|
1106
|
+
49751.4
|
|
1107
|
+
|
|
1108
|
+
2020-06-28
|
|
1109
|
+
|
|
1110
|
+
49
|
|
1111
|
+
|
|
1112
|
+
VODAFONE GRP
|
|
1113
|
+
|
|
1114
|
+
26382.456
|
|
1115
|
+
|
|
1116
|
+
2019-02-05
|
|
1117
|
+
|
|
1118
|
+
26.2
|
|
792
1119
|
|
|
793
1120
|
Hide code
|
|
794
1121
|
|
|
@@ -828,11 +1155,38 @@ The `rows` prop allows you to use `ReactNodes` as the value of a cell. This can
|
|
|
828
1155
|
**Note:** If you are using the `sort` property, the sorting may not work properly with rich content. If this happens, either remove the `sort` property or use the `format` prop on the column to set a custom formatter.
|
|
829
1156
|
|
|
830
1157
|
My rich investments
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
1158
|
+
|
|
1159
|
+
Investment Name
|
|
1160
|
+
|
|
1161
|
+
Cost
|
|
1162
|
+
|
|
1163
|
+
Investment Date
|
|
1164
|
+
|
|
1165
|
+
Total Percentage
|
|
1166
|
+
|
|
1167
|
+
Artemis Fund Managers Limited
|
|
1168
|
+
|
|
1169
|
+
$23,898
|
|
1170
|
+
|
|
1171
|
+
2019/09/23
|
|
1172
|
+
|
|
1173
|
+
24.8%
|
|
1174
|
+
|
|
1175
|
+
CASH.CASH
|
|
1176
|
+
|
|
1177
|
+
$49,751.40
|
|
1178
|
+
|
|
1179
|
+
2020/06/28
|
|
1180
|
+
|
|
1181
|
+
49%
|
|
1182
|
+
|
|
1183
|
+
VODAFONE GRP
|
|
1184
|
+
|
|
1185
|
+
$26,382.46
|
|
1186
|
+
|
|
1187
|
+
2019/02/05
|
|
1188
|
+
|
|
1189
|
+
26.2%
|
|
836
1190
|
|
|
837
1191
|
Hide code
|
|
838
1192
|
|
|
@@ -870,9 +1224,15 @@ You can provide the table with some content to display when there is no row data
|
|
|
870
1224
|
|
|
871
1225
|
This is reliant on `columns` prop to provide the information for the table header. If `columns` is not provided and there is no row data the table will not render.
|
|
872
1226
|
|
|
873
|
-
|
|
874
|
-
|
|
875
|
-
|
|
1227
|
+
Investment
|
|
1228
|
+
|
|
1229
|
+
Date
|
|
1230
|
+
|
|
1231
|
+
Share
|
|
1232
|
+
|
|
1233
|
+
Cost
|
|
1234
|
+
|
|
1235
|
+
This table has no data
|
|
876
1236
|
|
|
877
1237
|
Hide code
|
|
878
1238
|
|
|
@@ -917,11 +1277,38 @@ It accepts any of the table sub-elements. To ensure best display, please make us
|
|
|
917
1277
|
**Note:** Only the `caption`, `hiddenCaption`, `hiddenHeader` and `hover` props are supported when using `children` to render a table.
|
|
918
1278
|
|
|
919
1279
|
My investments
|
|
920
|
-
|
|
921
|
-
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
1280
|
+
|
|
1281
|
+
Investment
|
|
1282
|
+
|
|
1283
|
+
Cost
|
|
1284
|
+
|
|
1285
|
+
Investment date
|
|
1286
|
+
|
|
1287
|
+
Share
|
|
1288
|
+
|
|
1289
|
+
Artemis Fund Managers Limited
|
|
1290
|
+
|
|
1291
|
+
$23,898
|
|
1292
|
+
|
|
1293
|
+
2019/09/23
|
|
1294
|
+
|
|
1295
|
+
24.8%
|
|
1296
|
+
|
|
1297
|
+
CASH.CASH
|
|
1298
|
+
|
|
1299
|
+
$49,751.40
|
|
1300
|
+
|
|
1301
|
+
2020/06/28
|
|
1302
|
+
|
|
1303
|
+
49%
|
|
1304
|
+
|
|
1305
|
+
VODAFONE GRP
|
|
1306
|
+
|
|
1307
|
+
$26,382.46
|
|
1308
|
+
|
|
1309
|
+
2019/02/05
|
|
1310
|
+
|
|
1311
|
+
26.2%
|
|
925
1312
|
|
|
926
1313
|
Hide code
|
|
927
1314
|
|
|
@@ -981,11 +1368,38 @@ Copy
|
|
|
981
1368
|
You can customise the rows by passing in a `rowProps` object or function. It accepts a map of table row props that can be passed to a `tr` element, or a function that accepts the row data currently being rendered, and returns a map of table props.
|
|
982
1369
|
|
|
983
1370
|
My investments
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
1371
|
+
|
|
1372
|
+
Investment Name
|
|
1373
|
+
|
|
1374
|
+
Cost
|
|
1375
|
+
|
|
1376
|
+
Investment Date
|
|
1377
|
+
|
|
1378
|
+
Total Percentage
|
|
1379
|
+
|
|
1380
|
+
Artemis Fund Managers Limited
|
|
1381
|
+
|
|
1382
|
+
23898
|
|
1383
|
+
|
|
1384
|
+
2019-09-23
|
|
1385
|
+
|
|
1386
|
+
24.8
|
|
1387
|
+
|
|
1388
|
+
CASH.CASH
|
|
1389
|
+
|
|
1390
|
+
49751.4
|
|
1391
|
+
|
|
1392
|
+
2020-06-28
|
|
1393
|
+
|
|
1394
|
+
49
|
|
1395
|
+
|
|
1396
|
+
VODAFONE GRP
|
|
1397
|
+
|
|
1398
|
+
26382.456
|
|
1399
|
+
|
|
1400
|
+
2019-02-05
|
|
1401
|
+
|
|
1402
|
+
26.2
|
|
989
1403
|
|
|
990
1404
|
Hide code
|
|
991
1405
|
|
|
@@ -1028,11 +1442,38 @@ Copy
|
|
|
1028
1442
|
The `compact` prop can be used to reduce the padding around the table cells and reduce the font size. This can be useful when you have a lot of data to display and allow users to see as many columns as possible.
|
|
1029
1443
|
|
|
1030
1444
|
My investments
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1445
|
+
|
|
1446
|
+
Investment Name
|
|
1447
|
+
|
|
1448
|
+
Cost
|
|
1449
|
+
|
|
1450
|
+
Investment Date
|
|
1451
|
+
|
|
1452
|
+
Total Percentage
|
|
1453
|
+
|
|
1454
|
+
Artemis Fund Managers Limited
|
|
1455
|
+
|
|
1456
|
+
23898
|
|
1457
|
+
|
|
1458
|
+
2019-09-23
|
|
1459
|
+
|
|
1460
|
+
24.8
|
|
1461
|
+
|
|
1462
|
+
CASH.CASH
|
|
1463
|
+
|
|
1464
|
+
49751.4
|
|
1465
|
+
|
|
1466
|
+
2020-06-28
|
|
1467
|
+
|
|
1468
|
+
49
|
|
1469
|
+
|
|
1470
|
+
VODAFONE GRP
|
|
1471
|
+
|
|
1472
|
+
26382.456
|
|
1473
|
+
|
|
1474
|
+
2019-02-05
|
|
1475
|
+
|
|
1476
|
+
26.2
|
|
1036
1477
|
|
|
1037
1478
|
Hide code
|
|
1038
1479
|
|
|
@@ -1070,7 +1511,45 @@ Copy
|
|
|
1070
1511
|
|
|
1071
1512
|
In some cases you may have a table with multiple groups of rows inside it, however the columns are the same. For these cases, you can use the `IressTableBody` component.
|
|
1072
1513
|
|
|
1073
|
-
|
|
1514
|
+
My liabilities
|
|
1515
|
+
|
|
1516
|
+
Current liabilities
|
|
1517
|
+
|
|
1518
|
+
Owner
|
|
1519
|
+
|
|
1520
|
+
Type
|
|
1521
|
+
|
|
1522
|
+
Provider
|
|
1523
|
+
|
|
1524
|
+
Status
|
|
1525
|
+
|
|
1526
|
+
Frequency
|
|
1527
|
+
|
|
1528
|
+
Outstanding (GBP)
|
|
1529
|
+
|
|
1530
|
+
Interest rate p.a.
|
|
1531
|
+
|
|
1532
|
+
Repayment (GBP)
|
|
1533
|
+
|
|
1534
|
+
Client
|
|
1535
|
+
|
|
1536
|
+
Credit card
|
|
1537
|
+
|
|
1538
|
+
Current
|
|
1539
|
+
|
|
1540
|
+
Monthly
|
|
1541
|
+
|
|
1542
|
+
5,000.00
|
|
1543
|
+
|
|
1544
|
+
0%
|
|
1545
|
+
|
|
1546
|
+
300.00
|
|
1547
|
+
|
|
1548
|
+
Add current liability
|
|
1549
|
+
|
|
1550
|
+
Long term liabilities
|
|
1551
|
+
|
|
1552
|
+
Contingent liabilities
|
|
1074
1553
|
|
|
1075
1554
|
Hide code
|
|
1076
1555
|
|
|
@@ -1227,16 +1706,42 @@ Copy
|
|
|
1227
1706
|
It has been exposed so you can use it in your own components to format values in the same way as the table component.
|
|
1228
1707
|
|
|
1229
1708
|
IressTableFormattedValue
|
|
1230
|
-
|
|
1231
|
-
|
|
1232
|
-
|
|
1233
|
-
|
|
1234
|
-
|
|
1235
|
-
|
|
1236
|
-
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
1709
|
+
|
|
1710
|
+
Mode
|
|
1711
|
+
|
|
1712
|
+
Example
|
|
1713
|
+
|
|
1714
|
+
string
|
|
1715
|
+
|
|
1716
|
+
string
|
|
1717
|
+
|
|
1718
|
+
number
|
|
1719
|
+
|
|
1720
|
+
10000
|
|
1721
|
+
|
|
1722
|
+
date
|
|
1723
|
+
|
|
1724
|
+
15/05/2025
|
|
1725
|
+
|
|
1726
|
+
shortDate
|
|
1727
|
+
|
|
1728
|
+
15 May 2025
|
|
1729
|
+
|
|
1730
|
+
isoDateTime
|
|
1731
|
+
|
|
1732
|
+
2025-05-15 12:41:29 (AEST)
|
|
1733
|
+
|
|
1734
|
+
relativeTime
|
|
1735
|
+
|
|
1736
|
+
now
|
|
1737
|
+
|
|
1738
|
+
currency
|
|
1739
|
+
|
|
1740
|
+
$10,000.00
|
|
1741
|
+
|
|
1742
|
+
percent
|
|
1743
|
+
|
|
1744
|
+
50%
|
|
1240
1745
|
|
|
1241
1746
|
Hide code
|
|
1242
1747
|
|