@synerise/ds-list 1.0.12 → 1.0.14
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/CHANGELOG.md +245 -1032
- package/README.md +13 -13
- package/dist/Elements/Divider/Divider.styles.js +0 -2
- package/dist/Elements/ItemWrapper/ItemWrapper.d.ts +1 -1
- package/dist/Elements/ItemWrapper/ItemWrapper.styles.js +0 -2
- package/dist/Elements/Text/Text.d.ts +2 -2
- package/dist/Elements/Text/Text.styles.js +6 -2
- package/dist/List.d.ts +3 -3
- package/dist/List.js +3 -5
- package/dist/List.types.d.ts +2 -2
- package/package.json +5 -5
package/README.md
CHANGED
|
@@ -15,35 +15,35 @@ List UI Component
|
|
|
15
15
|
|
|
16
16
|
| Property | Description | Type | Default |
|
|
17
17
|
| ---------- | ----------------------------------------------------------------------------------------------------------------- | ---------------------------- | -------------------- |
|
|
18
|
-
| bordered | Toggles rendering of the border around the list | boolean
|
|
18
|
+
| bordered | Toggles rendering of the border around the list | boolean | `false` |
|
|
19
19
|
| dataSource | DataSource array of arrays for list | any[][] | - |
|
|
20
|
-
| dashed | Define type of divider line | boolean | `true`
|
|
20
|
+
| dashed | Define type of divider line | boolean | `true` |
|
|
21
21
|
| grid | The grid type of list. You can set grid to something like {gutter: 16, column: 4} | object | - |
|
|
22
22
|
| header | List header renderer | string | - |
|
|
23
23
|
| itemLayout | The layout of list, default is horizontal, If a vertical list is desired, set the itemLayout property to vertical | string | - |
|
|
24
|
-
| loading | Shows a loading indicator while the contents of the list are being fetched | boolean / object
|
|
24
|
+
| loading | Shows a loading indicator while the contents of the list are being fetched | boolean / object | `false` |
|
|
25
25
|
| loadMore | Shows a load more content | string / React.ReactNode | - |
|
|
26
26
|
| locale | i18n text including empty text | object | emptyText: 'No Data' |
|
|
27
27
|
| options | Options for radio group, if radio prop is provided | RadioGroupProps | - |
|
|
28
28
|
| pagination | Pagination config, hide it by setting it to`false` | boolean | object |
|
|
29
|
-
| split | Toggles rendering of the split under the list item | boolean | `true`
|
|
29
|
+
| split | Toggles rendering of the split under the list item | boolean | `true` |
|
|
30
30
|
| renderItem | Customize list item when using dataSource | item => ReactNode | - |
|
|
31
31
|
| rowKey | Item's unique key, could be a string or function that returns a string | string / (record) = > string | key |
|
|
32
32
|
| radio | Whether or not list should be wrapper with radio group | boolean | - |
|
|
33
33
|
|
|
34
34
|
### List.TextItem
|
|
35
35
|
|
|
36
|
-
| Property | Description | Type
|
|
37
|
-
| -------- | --------------------------------------------------------- |
|
|
38
|
-
| disabled | If element is disabled | boolean
|
|
39
|
-
| icon | Item will be prefixed with this element | React.ReactNode
|
|
40
|
-
| danger | If element should be marked as danger action (ie. delete) | boolean
|
|
41
|
-
| actions | Actions for item, will be rendered at the end of the row | React.ReactNode
|
|
42
|
-
| onSelect | Callback for selecting item | (e?: React.MouseEvent | React.KeyboardEvent) => void
|
|
43
|
-
| size | Size of item in list | `small` / `medium`
|
|
36
|
+
| Property | Description | Type | Default |
|
|
37
|
+
| -------- | --------------------------------------------------------- | --------------------- | ---------------------------- | --- |
|
|
38
|
+
| disabled | If element is disabled | boolean | - |
|
|
39
|
+
| icon | Item will be prefixed with this element | React.ReactNode | - |
|
|
40
|
+
| danger | If element should be marked as danger action (ie. delete) | boolean | - |
|
|
41
|
+
| actions | Actions for item, will be rendered at the end of the row | React.ReactNode | - |
|
|
42
|
+
| onSelect | Callback for selecting item | (e?: React.MouseEvent | React.KeyboardEvent) => void | - |
|
|
43
|
+
| size | Size of item in list | `small` / `medium` | `medium` |
|
|
44
44
|
|
|
45
45
|
### List.Divider
|
|
46
46
|
|
|
47
47
|
| Property | Description | Type | Default |
|
|
48
48
|
| -------- | ------------------- | ------- | ------- |
|
|
49
|
-
| dashed | Dash type of a line | boolean | `true`
|
|
49
|
+
| dashed | Dash type of a line | boolean | `true` |
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import React, {
|
|
2
|
-
import { WithHTMLAttributes } from '@synerise/ds-utils';
|
|
1
|
+
import React, { type KeyboardEvent, type MouseEvent, type ReactNode } from 'react';
|
|
2
|
+
import { type WithHTMLAttributes } from '@synerise/ds-utils';
|
|
3
3
|
import * as S from './Text.styles';
|
|
4
4
|
export type TextProps = WithHTMLAttributes<HTMLLIElement, {
|
|
5
5
|
disabled?: boolean;
|
|
@@ -7,8 +7,12 @@ export var Wrapper = styled.li.withConfig({
|
|
|
7
7
|
displayName: "Textstyles__Wrapper",
|
|
8
8
|
componentId: "sc-ztsq94-1"
|
|
9
9
|
})(["color:", ";opacity:", ";cursor:", ";font-weight:500;border-radius:3px;display:flex;align-items:center;", " ", " ", "{svg{", "}}&:hover{", " span{color:", ";}}&:focus{box-shadow:inset 0 0 0 2px ", ";}"], function (props) {
|
|
10
|
-
if (props.danger)
|
|
11
|
-
|
|
10
|
+
if (props.danger) {
|
|
11
|
+
return props.theme.palette['red-600'];
|
|
12
|
+
}
|
|
13
|
+
if (props.disabled) {
|
|
14
|
+
return props.theme.palette['grey-700'];
|
|
15
|
+
}
|
|
12
16
|
return props.theme.palette['grey-700'];
|
|
13
17
|
}, function (props) {
|
|
14
18
|
return props.disabled ? '0.4' : '1';
|
package/dist/List.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import '@synerise/ds-core/dist/js/style';
|
|
3
|
+
import { ItemWrapper, ListDivider, TextItem } from './Elements';
|
|
4
|
+
import { type ListPropsType } from './List.types';
|
|
3
5
|
import './style/index.less';
|
|
4
|
-
|
|
5
|
-
import { ListPropsType } from './List.types';
|
|
6
|
-
export declare const isNestedArray: <V extends unknown>(array: V[] | V[][]) => boolean;
|
|
6
|
+
export declare const isNestedArray: <V>(array: V[] | V[][]) => boolean;
|
|
7
7
|
declare class List<T> extends React.PureComponent<ListPropsType<T>> {
|
|
8
8
|
static ItemWrapper: typeof ItemWrapper;
|
|
9
9
|
static Item: typeof TextItem;
|
package/dist/List.js
CHANGED
|
@@ -3,20 +3,18 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
|
|
|
3
3
|
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
4
4
|
function _inheritsLoose(t, o) { t.prototype = Object.create(o.prototype), t.prototype.constructor = t, _setPrototypeOf(t, o); }
|
|
5
5
|
function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
|
|
6
|
+
import AntdList from 'antd/lib/list';
|
|
6
7
|
import React from 'react';
|
|
7
8
|
import { v4 as uuid } from 'uuid';
|
|
8
9
|
import '@synerise/ds-core/dist/js/style';
|
|
9
10
|
import Radio from '@synerise/ds-radio';
|
|
10
|
-
import
|
|
11
|
+
import { ItemWrapper, ListDivider, TextItem } from './Elements';
|
|
11
12
|
import "./style/index.css";
|
|
12
|
-
import { TextItem, ListDivider, ItemWrapper } from './Elements';
|
|
13
13
|
var RadioGroupWrapper = function RadioGroupWrapper(_ref) {
|
|
14
14
|
var children = _ref.children,
|
|
15
15
|
options = _ref.options;
|
|
16
16
|
return /*#__PURE__*/React.createElement(Radio.Group, options, children);
|
|
17
17
|
};
|
|
18
|
-
|
|
19
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
20
18
|
export var isNestedArray = function isNestedArray(array) {
|
|
21
19
|
return !!array.length && array[0] instanceof Array;
|
|
22
20
|
};
|
|
@@ -39,7 +37,7 @@ var List = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
39
37
|
var ReadyList;
|
|
40
38
|
if (isNestedArray(dataSource)) {
|
|
41
39
|
ReadyList = !!dataSource &&
|
|
42
|
-
// @ts-
|
|
40
|
+
// @ts-expect-error type mismatch
|
|
43
41
|
dataSource.map(function (singleDataSource, index) {
|
|
44
42
|
var isLastItem = dataSource.length === index + 1;
|
|
45
43
|
if (index === 0) {
|
package/dist/List.types.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { ListProps } from 'antd/lib/list';
|
|
2
|
-
import { RadioGroupProps } from 'antd/lib/radio';
|
|
1
|
+
import { type ListProps } from 'antd/lib/list';
|
|
2
|
+
import { type RadioGroupProps } from 'antd/lib/radio';
|
|
3
3
|
export type ListPropsType<T> = Omit<ListProps<T>, 'dataSource' | 'footer'> & {
|
|
4
4
|
dataSource: T[] | T[][];
|
|
5
5
|
radio?: boolean;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@synerise/ds-list",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.14",
|
|
4
4
|
"description": "List UI Component for the Synerise Design System",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"repository": "Synerise/synerise-design",
|
|
@@ -34,9 +34,9 @@
|
|
|
34
34
|
],
|
|
35
35
|
"types": "dist/index.d.ts",
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@synerise/ds-divider": "^1.0.
|
|
38
|
-
"@synerise/ds-radio": "^1.0.
|
|
39
|
-
"@synerise/ds-utils": "^1.3.
|
|
37
|
+
"@synerise/ds-divider": "^1.0.13",
|
|
38
|
+
"@synerise/ds-radio": "^1.0.14",
|
|
39
|
+
"@synerise/ds-utils": "^1.3.1",
|
|
40
40
|
"uuid": "^8.3.2"
|
|
41
41
|
},
|
|
42
42
|
"peerDependencies": {
|
|
@@ -45,5 +45,5 @@
|
|
|
45
45
|
"react": ">=16.9.0 <= 18.3.1",
|
|
46
46
|
"styled-components": "^5.3.3"
|
|
47
47
|
},
|
|
48
|
-
"gitHead": "
|
|
48
|
+
"gitHead": "2161bdb04f3db0f79b7d0465ce6b41121f1543ef"
|
|
49
49
|
}
|