@instructure/ui-list 8.33.1 → 8.33.2-snapshot-5
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 +8 -0
- package/es/InlineList/InlineListItem/InlineListItemLocator.js +2 -1
- package/es/InlineList/InlineListItem/index.js +9 -22
- package/es/InlineList/InlineListItem/props.js +1 -0
- package/es/InlineList/InlineListItem/styles.js +3 -4
- package/es/InlineList/InlineListItem/theme.js +5 -5
- package/es/InlineList/InlineListLocator.js +2 -1
- package/es/InlineList/__examples__/InlineList.examples.js +3 -2
- package/es/InlineList/index.js +4 -13
- package/es/InlineList/props.js +1 -0
- package/es/List/ListItem/index.js +9 -21
- package/es/List/ListItem/props.js +1 -0
- package/es/List/ListItem/styles.js +3 -4
- package/es/List/ListItem/theme.js +6 -6
- package/es/List/ListLocator.js +5 -2
- package/es/List/__examples__/List.examples.js +1 -1
- package/es/List/index.js +6 -19
- package/es/List/locator.js +1 -0
- package/es/List/props.js +1 -0
- package/es/List/styles.js +1 -2
- package/es/List/theme.js +3 -3
- package/es/index.js +1 -0
- package/lib/InlineList/InlineListItem/InlineListItemLocator.js +1 -4
- package/lib/InlineList/InlineListItem/index.js +9 -30
- package/lib/InlineList/InlineListItem/locator.js +0 -2
- package/lib/InlineList/InlineListItem/props.js +1 -4
- package/lib/InlineList/InlineListItem/styles.js +2 -5
- package/lib/InlineList/InlineListItem/theme.js +5 -6
- package/lib/InlineList/InlineListLocator.js +1 -4
- package/lib/InlineList/__examples__/InlineList.examples.js +2 -6
- package/lib/InlineList/index.js +4 -22
- package/lib/InlineList/locator.js +0 -2
- package/lib/InlineList/props.js +1 -6
- package/lib/List/ListItem/index.js +9 -30
- package/lib/List/ListItem/props.js +1 -4
- package/lib/List/ListItem/styles.js +2 -5
- package/lib/List/ListItem/theme.js +6 -7
- package/lib/List/ListLocator.js +3 -4
- package/lib/List/__examples__/List.examples.js +0 -5
- package/lib/List/index.js +6 -30
- package/lib/List/locator.js +0 -2
- package/lib/List/props.js +1 -6
- package/lib/List/styles.js +1 -3
- package/lib/List/theme.js +3 -4
- package/lib/index.js +0 -2
- package/package.json +13 -13
- package/tsconfig.build.tsbuildinfo +1 -1
|
@@ -1,34 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = exports.InlineListItem = void 0;
|
|
9
|
-
|
|
10
8
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
11
|
-
|
|
12
9
|
var _react = require("react");
|
|
13
|
-
|
|
14
10
|
var _View = require("@instructure/ui-view/lib/View");
|
|
15
|
-
|
|
16
11
|
var _testable = require("@instructure/ui-testable/lib/testable.js");
|
|
17
|
-
|
|
18
12
|
var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
|
|
19
|
-
|
|
20
13
|
var _emotion = require("@instructure/emotion");
|
|
21
|
-
|
|
22
14
|
var _styles = _interopRequireDefault(require("./styles"));
|
|
23
|
-
|
|
24
15
|
var _theme = _interopRequireDefault(require("./theme"));
|
|
25
|
-
|
|
26
16
|
var _props = require("./props");
|
|
27
|
-
|
|
28
17
|
const _excluded = ["delimiter", "size", "margin", "padding", "elementRef", "children", "spacing", "styles"];
|
|
29
|
-
|
|
30
18
|
var _dec, _dec2, _class, _class2;
|
|
31
|
-
|
|
32
19
|
/**
|
|
33
20
|
---
|
|
34
21
|
parent: InlineList
|
|
@@ -40,40 +27,33 @@ let InlineListItem = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.def
|
|
|
40
27
|
constructor() {
|
|
41
28
|
super(...arguments);
|
|
42
29
|
this.ref = null;
|
|
43
|
-
|
|
44
30
|
this.handleRef = el => {
|
|
45
31
|
const elementRef = this.props.elementRef;
|
|
46
32
|
this.ref = el;
|
|
47
|
-
|
|
48
33
|
if (typeof elementRef === 'function') {
|
|
49
34
|
elementRef(el);
|
|
50
35
|
}
|
|
51
36
|
};
|
|
52
37
|
}
|
|
53
|
-
|
|
54
38
|
componentDidMount() {
|
|
55
39
|
var _this$props$makeStyle, _this$props;
|
|
56
|
-
|
|
57
40
|
(_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
|
|
58
41
|
}
|
|
59
|
-
|
|
60
42
|
componentDidUpdate() {
|
|
61
43
|
var _this$props$makeStyle2, _this$props2;
|
|
62
|
-
|
|
63
44
|
(_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
|
|
64
45
|
}
|
|
65
|
-
|
|
66
46
|
render() {
|
|
67
47
|
const _this$props3 = this.props,
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
48
|
+
delimiter = _this$props3.delimiter,
|
|
49
|
+
size = _this$props3.size,
|
|
50
|
+
margin = _this$props3.margin,
|
|
51
|
+
padding = _this$props3.padding,
|
|
52
|
+
elementRef = _this$props3.elementRef,
|
|
53
|
+
children = _this$props3.children,
|
|
54
|
+
spacing = _this$props3.spacing,
|
|
55
|
+
styles = _this$props3.styles,
|
|
56
|
+
rest = (0, _objectWithoutProperties2.default)(_this$props3, _excluded);
|
|
77
57
|
return (0, _emotion.jsx)(_View.View, Object.assign({}, (0, _passthroughProps.passthroughProps)(rest), {
|
|
78
58
|
css: styles === null || styles === void 0 ? void 0 : styles.inlineListItem,
|
|
79
59
|
as: "li",
|
|
@@ -87,7 +67,6 @@ let InlineListItem = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.def
|
|
|
87
67
|
"aria-hidden": "true"
|
|
88
68
|
}));
|
|
89
69
|
}
|
|
90
|
-
|
|
91
70
|
}, _class2.displayName = "InlineListItem", _class2.componentId = 'InlineList.Item', _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.defaultProps = {
|
|
92
71
|
padding: 'none',
|
|
93
72
|
spacing: 'none',
|
|
@@ -1,16 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.propTypes = exports.allowedProps = void 0;
|
|
9
|
-
|
|
10
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
-
|
|
12
9
|
var _emotion = require("@instructure/emotion");
|
|
13
|
-
|
|
14
10
|
/*
|
|
15
11
|
* The MIT License (MIT)
|
|
16
12
|
*
|
|
@@ -34,6 +30,7 @@ var _emotion = require("@instructure/emotion");
|
|
|
34
30
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
35
31
|
* SOFTWARE.
|
|
36
32
|
*/
|
|
33
|
+
|
|
37
34
|
const propTypes = {
|
|
38
35
|
children: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]).isRequired,
|
|
39
36
|
delimiter: _propTypes.default.oneOf(['none', 'pipe', 'slash', 'arrow']),
|
|
@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _console = require("@instructure/console");
|
|
9
|
-
|
|
10
8
|
/*
|
|
11
9
|
* The MIT License (MIT)
|
|
12
10
|
*
|
|
@@ -45,8 +43,8 @@ var _console = require("@instructure/console");
|
|
|
45
43
|
*/
|
|
46
44
|
const generateStyle = (componentTheme, props) => {
|
|
47
45
|
const size = props.size,
|
|
48
|
-
|
|
49
|
-
|
|
46
|
+
delimiter = props.delimiter,
|
|
47
|
+
spacing = props.spacing;
|
|
50
48
|
const withDelimiter = delimiter !== 'none';
|
|
51
49
|
const withSpacing = spacing !== 'none';
|
|
52
50
|
(0, _console.logError)(!(withDelimiter && withSpacing), `[InlineList] \`itemSpacing\` has no effect inside Lists with the \`delimiter\` prop set to anything other than \`none\`.`);
|
|
@@ -150,6 +148,5 @@ const generateStyle = (componentTheme, props) => {
|
|
|
150
148
|
}
|
|
151
149
|
};
|
|
152
150
|
};
|
|
153
|
-
|
|
154
151
|
var _default = generateStyle;
|
|
155
152
|
exports.default = _default;
|
|
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
/*
|
|
9
8
|
* The MIT License (MIT)
|
|
10
9
|
*
|
|
@@ -36,9 +35,9 @@ exports.default = void 0;
|
|
|
36
35
|
*/
|
|
37
36
|
const generateComponentTheme = theme => {
|
|
38
37
|
const colors = theme.colors,
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
38
|
+
spacing = theme.spacing,
|
|
39
|
+
typography = theme.typography,
|
|
40
|
+
themeName = theme.key;
|
|
42
41
|
const themeSpecificStyle = {
|
|
43
42
|
canvas: {
|
|
44
43
|
color: theme['ic-brand-font-color-dark']
|
|
@@ -66,10 +65,10 @@ const generateComponentTheme = theme => {
|
|
|
66
65
|
spacingXLarge: spacing === null || spacing === void 0 ? void 0 : spacing.xLarge,
|
|
67
66
|
spacingXXLarge: spacing === null || spacing === void 0 ? void 0 : spacing.xxLarge
|
|
68
67
|
};
|
|
69
|
-
return {
|
|
68
|
+
return {
|
|
69
|
+
...componentVariables,
|
|
70
70
|
...themeSpecificStyle[themeName]
|
|
71
71
|
};
|
|
72
72
|
};
|
|
73
|
-
|
|
74
73
|
var _default = generateComponentTheme;
|
|
75
74
|
exports.default = _default;
|
|
@@ -4,13 +4,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.InlineListLocator = void 0;
|
|
7
|
-
|
|
8
7
|
var _locator = require("@instructure/ui-test-locator/lib/utils/locator.js");
|
|
9
|
-
|
|
10
8
|
var _index = require("./index");
|
|
11
|
-
|
|
12
9
|
var _InlineListItemLocator = require("./InlineListItem/InlineListItemLocator");
|
|
13
|
-
|
|
14
10
|
/*
|
|
15
11
|
* The MIT License (MIT)
|
|
16
12
|
*
|
|
@@ -34,6 +30,7 @@ var _InlineListItemLocator = require("./InlineListItem/InlineListItemLocator");
|
|
|
34
30
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
35
31
|
* SOFTWARE.
|
|
36
32
|
*/
|
|
33
|
+
|
|
37
34
|
// @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
|
|
38
35
|
const InlineListLocator = (0, _locator.locator)(_index.InlineList.selector, {
|
|
39
36
|
findAllItems: function () {
|
|
@@ -1,18 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = void 0;
|
|
9
|
-
|
|
10
8
|
var _react = _interopRequireDefault(require("react"));
|
|
11
|
-
|
|
12
9
|
var _index = require("../index");
|
|
13
|
-
|
|
14
10
|
var _InlineList$Item, _InlineList$Item2, _InlineList$Item3;
|
|
15
|
-
|
|
16
11
|
var _default = {
|
|
17
12
|
sectionProp: 'size',
|
|
18
13
|
getComponentProps: () => {
|
|
@@ -27,7 +22,8 @@ var _default = {
|
|
|
27
22
|
};
|
|
28
23
|
},
|
|
29
24
|
filter: props => {
|
|
30
|
-
return (
|
|
25
|
+
return (
|
|
26
|
+
// itemSpacing has no affect on the list if the delimiter prop is set
|
|
31
27
|
// to anything other than 'none' so filter the others
|
|
32
28
|
props.delimiter !== 'none' && props.itemSpacing !== 'none'
|
|
33
29
|
);
|
package/lib/InlineList/index.js
CHANGED
|
@@ -1,34 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports.default = exports.InlineList = void 0;
|
|
11
|
-
|
|
12
9
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
13
|
-
|
|
14
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
15
|
-
|
|
16
11
|
var _View = require("@instructure/ui-view/lib/View");
|
|
17
|
-
|
|
18
12
|
var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
|
|
19
|
-
|
|
20
13
|
var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElement.js");
|
|
21
|
-
|
|
22
14
|
var _testable = require("@instructure/ui-testable/lib/testable.js");
|
|
23
|
-
|
|
24
15
|
var _InlineListItem = require("./InlineListItem");
|
|
25
|
-
|
|
26
16
|
var _props = require("./props");
|
|
27
|
-
|
|
28
17
|
const _excluded = ["as", "margin", "elementRef"];
|
|
29
|
-
|
|
30
18
|
var _dec, _class, _class2;
|
|
31
|
-
|
|
32
19
|
/**
|
|
33
20
|
---
|
|
34
21
|
category: components
|
|
@@ -39,17 +26,14 @@ let InlineList = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 = cla
|
|
|
39
26
|
constructor() {
|
|
40
27
|
super(...arguments);
|
|
41
28
|
this.ref = null;
|
|
42
|
-
|
|
43
29
|
this.handleRef = el => {
|
|
44
30
|
const elementRef = this.props.elementRef;
|
|
45
31
|
this.ref = el;
|
|
46
|
-
|
|
47
32
|
if (typeof elementRef === 'function') {
|
|
48
33
|
elementRef(el);
|
|
49
34
|
}
|
|
50
35
|
};
|
|
51
36
|
}
|
|
52
|
-
|
|
53
37
|
renderChildren() {
|
|
54
38
|
return _react.Children.map(this.props.children, child => {
|
|
55
39
|
if (!child) return; // ignore null, falsy children
|
|
@@ -61,13 +45,12 @@ let InlineList = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 = cla
|
|
|
61
45
|
});
|
|
62
46
|
});
|
|
63
47
|
}
|
|
64
|
-
|
|
65
48
|
render() {
|
|
66
49
|
const _this$props = this.props,
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
50
|
+
as = _this$props.as,
|
|
51
|
+
margin = _this$props.margin,
|
|
52
|
+
elementRef = _this$props.elementRef,
|
|
53
|
+
rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
|
|
71
54
|
return /*#__PURE__*/_react.default.createElement(_View.View, Object.assign({}, (0, _passthroughProps.passthroughProps)(rest), {
|
|
72
55
|
as: as,
|
|
73
56
|
margin: margin,
|
|
@@ -76,7 +59,6 @@ let InlineList = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 = cla
|
|
|
76
59
|
display: "block"
|
|
77
60
|
}), this.renderChildren());
|
|
78
61
|
}
|
|
79
|
-
|
|
80
62
|
}, _class2.displayName = "InlineList", _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.defaultProps = {
|
|
81
63
|
itemSpacing: 'none',
|
|
82
64
|
as: 'ul',
|
package/lib/InlineList/props.js
CHANGED
|
@@ -1,20 +1,14 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.propTypes = exports.allowedProps = void 0;
|
|
9
|
-
|
|
10
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
-
|
|
12
9
|
var _Children = require("@instructure/ui-prop-types/lib/Children.js");
|
|
13
|
-
|
|
14
10
|
var _emotion = require("@instructure/emotion");
|
|
15
|
-
|
|
16
11
|
var _InlineListItem = require("./InlineListItem");
|
|
17
|
-
|
|
18
12
|
/*
|
|
19
13
|
* The MIT License (MIT)
|
|
20
14
|
*
|
|
@@ -38,6 +32,7 @@ var _InlineListItem = require("./InlineListItem");
|
|
|
38
32
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
39
33
|
* SOFTWARE.
|
|
40
34
|
*/
|
|
35
|
+
|
|
41
36
|
const propTypes = {
|
|
42
37
|
children: _Children.Children.oneOf([_InlineListItem.InlineListItem]),
|
|
43
38
|
as: _propTypes.default.oneOf(['ul', 'ol']),
|
|
@@ -1,34 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = exports.ListItem = void 0;
|
|
9
|
-
|
|
10
8
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
11
|
-
|
|
12
9
|
var _react = require("react");
|
|
13
|
-
|
|
14
10
|
var _View = require("@instructure/ui-view/lib/View");
|
|
15
|
-
|
|
16
11
|
var _testable = require("@instructure/ui-testable/lib/testable.js");
|
|
17
|
-
|
|
18
12
|
var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
|
|
19
|
-
|
|
20
13
|
var _emotion = require("@instructure/emotion");
|
|
21
|
-
|
|
22
14
|
var _styles = _interopRequireDefault(require("./styles"));
|
|
23
|
-
|
|
24
15
|
var _theme = _interopRequireDefault(require("./theme"));
|
|
25
|
-
|
|
26
16
|
var _props = require("./props");
|
|
27
|
-
|
|
28
17
|
const _excluded = ["delimiter", "spacing", "size", "margin", "padding", "elementRef", "children", "styles"];
|
|
29
|
-
|
|
30
18
|
var _dec, _dec2, _class, _class2;
|
|
31
|
-
|
|
32
19
|
/**
|
|
33
20
|
---
|
|
34
21
|
parent: List
|
|
@@ -40,40 +27,33 @@ let ListItem = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default),
|
|
|
40
27
|
constructor() {
|
|
41
28
|
super(...arguments);
|
|
42
29
|
this.ref = null;
|
|
43
|
-
|
|
44
30
|
this.handleRef = el => {
|
|
45
31
|
const elementRef = this.props.elementRef;
|
|
46
32
|
this.ref = el;
|
|
47
|
-
|
|
48
33
|
if (typeof elementRef === 'function') {
|
|
49
34
|
elementRef(el);
|
|
50
35
|
}
|
|
51
36
|
};
|
|
52
37
|
}
|
|
53
|
-
|
|
54
38
|
componentDidMount() {
|
|
55
39
|
var _this$props$makeStyle, _this$props;
|
|
56
|
-
|
|
57
40
|
(_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
|
|
58
41
|
}
|
|
59
|
-
|
|
60
42
|
componentDidUpdate() {
|
|
61
43
|
var _this$props$makeStyle2, _this$props2;
|
|
62
|
-
|
|
63
44
|
(_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
|
|
64
45
|
}
|
|
65
|
-
|
|
66
46
|
render() {
|
|
67
47
|
const _this$props3 = this.props,
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
48
|
+
delimiter = _this$props3.delimiter,
|
|
49
|
+
spacing = _this$props3.spacing,
|
|
50
|
+
size = _this$props3.size,
|
|
51
|
+
margin = _this$props3.margin,
|
|
52
|
+
padding = _this$props3.padding,
|
|
53
|
+
elementRef = _this$props3.elementRef,
|
|
54
|
+
children = _this$props3.children,
|
|
55
|
+
styles = _this$props3.styles,
|
|
56
|
+
rest = (0, _objectWithoutProperties2.default)(_this$props3, _excluded);
|
|
77
57
|
return (0, _emotion.jsx)(_View.View, Object.assign({}, (0, _passthroughProps.passthroughProps)(rest), {
|
|
78
58
|
css: styles === null || styles === void 0 ? void 0 : styles.listItem,
|
|
79
59
|
as: "li",
|
|
@@ -83,7 +63,6 @@ let ListItem = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default),
|
|
|
83
63
|
elementRef: this.handleRef
|
|
84
64
|
}), children);
|
|
85
65
|
}
|
|
86
|
-
|
|
87
66
|
}, _class2.displayName = "ListItem", _class2.componentId = 'List.Item', _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.defaultProps = {
|
|
88
67
|
padding: 'none',
|
|
89
68
|
spacing: 'none',
|
|
@@ -1,16 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.propTypes = exports.allowedProps = void 0;
|
|
9
|
-
|
|
10
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
-
|
|
12
9
|
var _emotion = require("@instructure/emotion");
|
|
13
|
-
|
|
14
10
|
/*
|
|
15
11
|
* The MIT License (MIT)
|
|
16
12
|
*
|
|
@@ -34,6 +30,7 @@ var _emotion = require("@instructure/emotion");
|
|
|
34
30
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
35
31
|
* SOFTWARE.
|
|
36
32
|
*/
|
|
33
|
+
|
|
37
34
|
const propTypes = {
|
|
38
35
|
children: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]).isRequired,
|
|
39
36
|
delimiter: _propTypes.default.oneOf(['none', 'dashed', 'solid']),
|
|
@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _console = require("@instructure/console");
|
|
9
|
-
|
|
10
8
|
/*
|
|
11
9
|
* The MIT License (MIT)
|
|
12
10
|
*
|
|
@@ -45,8 +43,8 @@ var _console = require("@instructure/console");
|
|
|
45
43
|
*/
|
|
46
44
|
const generateStyle = (componentTheme, props) => {
|
|
47
45
|
const size = props.size,
|
|
48
|
-
|
|
49
|
-
|
|
46
|
+
delimiter = props.delimiter,
|
|
47
|
+
spacing = props.spacing;
|
|
50
48
|
const withDelimiter = delimiter !== 'none';
|
|
51
49
|
const withSpacing = spacing !== 'none';
|
|
52
50
|
(0, _console.logError)(!(withDelimiter && withSpacing), `[List] \`itemSpacing\` has no effect inside Lists with the \`delimiter\` prop set to anything other than \`none\`.`);
|
|
@@ -131,6 +129,5 @@ const generateStyle = (componentTheme, props) => {
|
|
|
131
129
|
}
|
|
132
130
|
};
|
|
133
131
|
};
|
|
134
|
-
|
|
135
132
|
var _default = generateStyle;
|
|
136
133
|
exports.default = _default;
|
|
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
/*
|
|
9
8
|
* The MIT License (MIT)
|
|
10
9
|
*
|
|
@@ -36,10 +35,10 @@ exports.default = void 0;
|
|
|
36
35
|
*/
|
|
37
36
|
const generateComponentTheme = theme => {
|
|
38
37
|
const borders = theme.borders,
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
38
|
+
colors = theme.colors,
|
|
39
|
+
spacing = theme.spacing,
|
|
40
|
+
typography = theme.typography,
|
|
41
|
+
themeName = theme.key;
|
|
43
42
|
const themeSpecificStyle = {
|
|
44
43
|
canvas: {
|
|
45
44
|
color: theme['ic-brand-font-color-dark']
|
|
@@ -64,10 +63,10 @@ const generateComponentTheme = theme => {
|
|
|
64
63
|
delimiterDashedBorder: `${borders === null || borders === void 0 ? void 0 : borders.widthSmall} dashed ${colors === null || colors === void 0 ? void 0 : colors.borderMedium}`,
|
|
65
64
|
delimiterSolidBorder: `${borders === null || borders === void 0 ? void 0 : borders.widthSmall} solid ${colors === null || colors === void 0 ? void 0 : colors.borderMedium}`
|
|
66
65
|
};
|
|
67
|
-
return {
|
|
66
|
+
return {
|
|
67
|
+
...componentVariables,
|
|
68
68
|
...themeSpecificStyle[themeName]
|
|
69
69
|
};
|
|
70
70
|
};
|
|
71
|
-
|
|
72
71
|
var _default = generateComponentTheme;
|
|
73
72
|
exports.default = _default;
|
package/lib/List/ListLocator.js
CHANGED
|
@@ -4,11 +4,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.ListLocator = void 0;
|
|
7
|
-
|
|
8
7
|
var _locator = require("@instructure/ui-test-locator/lib/utils/locator.js");
|
|
9
|
-
|
|
10
8
|
var _index = require("./index");
|
|
11
|
-
|
|
12
9
|
/*
|
|
13
10
|
* The MIT License (MIT)
|
|
14
11
|
*
|
|
@@ -32,9 +29,11 @@ var _index = require("./index");
|
|
|
32
29
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
33
30
|
* SOFTWARE.
|
|
34
31
|
*/
|
|
32
|
+
|
|
35
33
|
// @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
|
|
36
|
-
const ListItemLocator = (0, _locator.locator)(_index.List.Item.selector);
|
|
34
|
+
const ListItemLocator = (0, _locator.locator)(_index.List.Item.selector);
|
|
37
35
|
|
|
36
|
+
// @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
|
|
38
37
|
const ListLocator = (0, _locator.locator)(_index.List.selector, {
|
|
39
38
|
findAllItems: function () {
|
|
40
39
|
return ListItemLocator.findAll(...arguments);
|
|
@@ -1,18 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = void 0;
|
|
9
|
-
|
|
10
8
|
var _react = _interopRequireDefault(require("react"));
|
|
11
|
-
|
|
12
9
|
var _index = require("../index");
|
|
13
|
-
|
|
14
10
|
var _List$Item, _List$Item2, _List$Item3;
|
|
15
|
-
|
|
16
11
|
var _default = {
|
|
17
12
|
sectionProp: 'size',
|
|
18
13
|
getComponentProps: () => {
|