@axinom/mosaic-ui 0.64.0-rc.10 → 0.64.0-rc.12
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/dist/components/List/List.d.ts +6 -1
- package/dist/components/List/List.d.ts.map +1 -1
- package/dist/components/List/ListRow/ListRow.d.ts +5 -20
- package/dist/components/List/ListRow/ListRow.d.ts.map +1 -1
- package/dist/components/List/ListRowRenderer/ListRowRenderer.d.ts +22 -0
- package/dist/components/List/ListRowRenderer/ListRowRenderer.d.ts.map +1 -0
- package/dist/index.es.js +4 -5
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +4 -5
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
- package/src/components/List/List.spec.tsx +209 -1
- package/src/components/List/List.stories.tsx +76 -0
- package/src/components/List/List.tsx +52 -31
- package/src/components/List/ListRow/ListRow.scss +5 -0
- package/src/components/List/ListRow/ListRow.spec.tsx +97 -155
- package/src/components/List/ListRow/ListRow.tsx +31 -57
- package/src/components/List/ListRowRenderer/ListRowRenderer.spec.tsx +353 -0
- package/src/components/List/ListRowRenderer/ListRowRenderer.tsx +68 -0
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { LocationDescriptor } from 'history';
|
|
2
|
-
import React from 'react';
|
|
2
|
+
import React, { ReactElement } from 'react';
|
|
3
3
|
import { ActionData } from '..';
|
|
4
4
|
import { Data } from '../../types/data';
|
|
5
5
|
import { Column, ItemSelectEventArgs, ListElement, ListSelectMode, SortData } from './List.model';
|
|
6
|
+
import { ListRowProps } from './ListRow/ListRow';
|
|
6
7
|
export interface ListProps<T extends Data> {
|
|
7
8
|
/**
|
|
8
9
|
* Column definitions
|
|
@@ -84,6 +85,10 @@ export interface ListProps<T extends Data> {
|
|
|
84
85
|
className?: string;
|
|
85
86
|
/** Provide inline actions which are available through '...' context menu */
|
|
86
87
|
inlineMenuActions?: (data: T) => ActionData[];
|
|
88
|
+
/** Function to determine if a specific row should be disabled */
|
|
89
|
+
isRowDisabled?: (data: T, index: number) => boolean;
|
|
90
|
+
/** Custom row renderer - if it returns null, the default ListRow will be used */
|
|
91
|
+
customRowRenderer?: (props: ListRowProps<T>) => ReactElement | null;
|
|
87
92
|
}
|
|
88
93
|
/**
|
|
89
94
|
* Renders various sets of data in a tabular format
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../src/components/List/List.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,
|
|
1
|
+
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../src/components/List/List.tsx"],"names":[],"mappings":"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"}
|
|
@@ -24,8 +24,6 @@ export interface ListRowProps<T extends Data> {
|
|
|
24
24
|
columns: Column<T>[];
|
|
25
25
|
/** Whether or not the item is selected (default: false) */
|
|
26
26
|
itemSelected?: boolean;
|
|
27
|
-
/** Whether or not the item is a trigger for pagination (default: false) */
|
|
28
|
-
isTrigger?: boolean;
|
|
29
27
|
/** Determines which selection mode the list is in. (default: ListSelectMode.None) */
|
|
30
28
|
selectionMode?: ListSelectMode;
|
|
31
29
|
/** Defines whether an action button will be rendered (default: true) */
|
|
@@ -45,26 +43,13 @@ export interface ListRowProps<T extends Data> {
|
|
|
45
43
|
* A function that is getting called, when the selection state of the row changes.
|
|
46
44
|
*/
|
|
47
45
|
onItemSelected?: (checked: boolean) => void;
|
|
48
|
-
/**
|
|
49
|
-
* A function that is getting called, when the element acts as a trigger (`isTrigger = true`) and gets into view.
|
|
50
|
-
*/
|
|
51
|
-
onTriggered?: () => void;
|
|
52
46
|
/** Provide inline actions which are available through '...' context menu */
|
|
53
47
|
inlineMenuActions?: (data: T) => ActionData[];
|
|
54
48
|
}
|
|
55
49
|
export declare const setLocale: (locale: string) => void;
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
* data={[{id: '1',desc: 'Description 1',title: 'Item 1'}]}
|
|
62
|
-
* columnSizes={'1fr'}
|
|
63
|
-
* columnGap={'5px'}
|
|
64
|
-
* rowHeight={'50px'}
|
|
65
|
-
* horizontalTextAlign={'left'}
|
|
66
|
-
* verticalTextAlign={'center'}
|
|
67
|
-
* />
|
|
68
|
-
*/
|
|
69
|
-
export declare const ListRow: <T extends Data>({ columnSizes, columnGap, actionSize, horizontalTextAlign, verticalTextAlign, textWrap, rowHeight, data, itemSelected, isTrigger, columns, selectionMode, showActionButton, showCheckMark, showItemCheckbox, onItemClicked, onItemSelected, onTriggered, isRowDisabled, inlineMenuActions, }: React.PropsWithChildren<ListRowProps<T>>) => JSX.Element;
|
|
50
|
+
export declare const ListRow: <T extends Data>(props: ListRowProps<T> & {
|
|
51
|
+
children?: React.ReactNode;
|
|
52
|
+
} & {
|
|
53
|
+
ref?: React.Ref<HTMLDivElement> | undefined;
|
|
54
|
+
}) => JSX.Element;
|
|
70
55
|
//# sourceMappingURL=ListRow.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListRow.d.ts","sourceRoot":"","sources":["../../../../src/components/List/ListRow/ListRow.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,EAAE,EAAE,iBAAiB,
|
|
1
|
+
{"version":3,"file":"ListRow.d.ts","sourceRoot":"","sources":["../../../../src/components/List/ListRow/ListRow.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAe,MAAM,OAAO,CAAC;AAG9D,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAE3C,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAI1D,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAIvD,MAAM,WAAW,YAAY,CAAC,CAAC,SAAS,IAAI;IAC1C,8BAA8B;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,wBAAwB;IACxB,SAAS,EAAE,MAAM,CAAC;IAClB,sBAAsB;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yCAAyC;IACzC,UAAU,EAAE,MAAM,CAAC;IACnB,mDAAmD;IACnD,mBAAmB,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;IAClD,kDAAkD;IAClD,iBAAiB,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC/C,4IAA4I;IAC5I,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB;IAChB,IAAI,EAAE,CAAC,CAAC;IACR,4BAA4B;IAC5B,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACrB,2DAA2D;IAC3D,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,qFAAqF;IACrF,aAAa,CAAC,EAAE,cAAc,CAAC;IAC/B,wEAAwE;IACxE,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,kFAAkF;IAClF,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,mFAAmF;IACnF,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,yDAAyD;IACzD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;wGAGoG;IACpG,aAAa,CAAC,EAAE,kBAAkB,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC,CAAC;IAClE;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5C,4EAA4E;IAC5E,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,UAAU,EAAE,CAAC;CAC/C;AAMD,eAAO,MAAM,SAAS,WAAY,MAAM,KAAG,IAW1C,CAAC;AAyTF,eAAO,MAAM,OAAO;;;;MAIf,WAAW,CAAC"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Data } from '../../../types/data';
|
|
3
|
+
import { ListRowProps } from '../ListRow/ListRow';
|
|
4
|
+
interface RowRendererProps<T extends Data> {
|
|
5
|
+
/**
|
|
6
|
+
* Custom renderer for the list row.
|
|
7
|
+
* If provided, it will override the default ListRow rendering.
|
|
8
|
+
* In case it returns null, the default ListRow will not be rendered.
|
|
9
|
+
*/
|
|
10
|
+
customRowRenderer?: (props: ListRowProps<T>) => React.ReactElement | null;
|
|
11
|
+
/** Props passed to the ListRow and custom renderer */
|
|
12
|
+
listRowProps: ListRowProps<T>;
|
|
13
|
+
/** Whether or not the item is a trigger for pagination (default: false) */
|
|
14
|
+
isTrigger?: boolean;
|
|
15
|
+
/**
|
|
16
|
+
* A function that is getting called, when the element acts as a trigger (`isTrigger = true`) and gets into view.
|
|
17
|
+
*/
|
|
18
|
+
onTriggered?: () => void;
|
|
19
|
+
}
|
|
20
|
+
export declare const ListRowRenderer: <T extends Data>({ listRowProps, isTrigger, customRowRenderer, onTriggered, }: RowRendererProps<T>) => React.ReactElement<T, string | React.JSXElementConstructor<T>> | null;
|
|
21
|
+
export {};
|
|
22
|
+
//# sourceMappingURL=ListRowRenderer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ListRowRenderer.d.ts","sourceRoot":"","sources":["../../../../src/components/List/ListRowRenderer/ListRowRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,EAAW,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAE3D,UAAU,gBAAgB,CAAC,CAAC,SAAS,IAAI;IACvC;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;IAC1E,sDAAsD;IACtD,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IAC9B,2EAA2E;IAC3E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,eAAO,MAAM,eAAe,8KA8C3B,CAAC"}
|