@instructure/ui-avatar 8.11.2-snapshot.7 → 8.12.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/CHANGELOG.md +11 -0
- package/es/Avatar/__examples__/Avatar.examples.js +26 -2
- package/es/Avatar/index.js +33 -10
- package/es/Avatar/props.js +4 -2
- package/es/Avatar/styles.js +25 -4
- package/es/package.json +1 -0
- package/lib/Avatar/__examples__/Avatar.examples.js +30 -2
- package/lib/Avatar/index.js +34 -9
- package/lib/Avatar/props.js +4 -2
- package/lib/Avatar/styles.js +25 -4
- package/package.json +14 -14
- package/src/Avatar/README.md +71 -13
- package/src/Avatar/__examples__/{Avatar.examples.ts → Avatar.examples.tsx} +34 -3
- package/src/Avatar/index.tsx +20 -6
- package/src/Avatar/props.ts +18 -4
- package/src/Avatar/styles.ts +32 -5
- package/types/Avatar/__examples__/Avatar.examples.d.ts +3 -9
- package/types/Avatar/__examples__/Avatar.examples.d.ts.map +1 -1
- package/types/Avatar/index.d.ts +6 -12
- package/types/Avatar/index.d.ts.map +1 -1
- package/types/Avatar/props.d.ts +10 -2
- package/types/Avatar/props.d.ts.map +1 -1
- package/types/Avatar/styles.d.ts.map +1 -1
- package/LICENSE.md +0 -27
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,17 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [8.12.0](https://github.com/instructure/instructure-ui/compare/v8.11.1...v8.12.0) (2021-11-17)
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
- **ui-avatar:** add unset logic for image loaded state ([e6665c1](https://github.com/instructure/instructure-ui/commit/e6665c159832d0020d7da263be0e959c41589135))
|
|
11
|
+
|
|
12
|
+
### Features
|
|
13
|
+
|
|
14
|
+
- **ui-avatar:** add `hasInverseColor` prop to Avatars ([feef554](https://github.com/instructure/instructure-ui/commit/feef5549628027c176009575463e187f95a0affd))
|
|
15
|
+
- **ui-avatar:** add `renderIcon` prop to Avatar ([d7233d8](https://github.com/instructure/instructure-ui/commit/d7233d876cf2a6a968f764ad05e6dd1544b62f5f))
|
|
16
|
+
|
|
6
17
|
## [8.11.1](https://github.com/instructure/instructure-ui/compare/v8.11.0...v8.11.1) (2021-10-19)
|
|
7
18
|
|
|
8
19
|
**Note:** Version bump only for package @instructure/ui-avatar
|
|
@@ -21,12 +21,36 @@
|
|
|
21
21
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
|
+
import React from 'react';
|
|
25
|
+
import { IconGroupLine } from '@instructure/ui-icons';
|
|
24
26
|
export default {
|
|
25
27
|
sectionProp: 'shape',
|
|
26
28
|
propValues: {
|
|
27
|
-
src: [null, 'data:image/jpeg;base64,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']
|
|
29
|
+
src: [null, 'data:image/jpeg;base64,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'],
|
|
30
|
+
renderIcon: [void 0, /*#__PURE__*/React.createElement(IconGroupLine, {
|
|
31
|
+
key: "icon"
|
|
32
|
+
})]
|
|
28
33
|
},
|
|
29
|
-
|
|
34
|
+
filter: props => {
|
|
35
|
+
if (props.color !== 'default' && props.size !== 'medium') {
|
|
36
|
+
return true;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
if (props.renderIcon && props.src) {
|
|
40
|
+
return true;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
if (props.src && props.color !== 'default') {
|
|
44
|
+
return true;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
if (props.hasInverseColor && (props.size !== 'medium' || props.display !== 'block')) {
|
|
48
|
+
return true;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
return false;
|
|
52
|
+
},
|
|
53
|
+
getComponentProps: () => {
|
|
30
54
|
return {
|
|
31
55
|
name: 'Kyle Montgomery'
|
|
32
56
|
};
|
package/es/Avatar/index.js
CHANGED
|
@@ -30,7 +30,7 @@ var _dec, _dec2, _class, _class2, _temp;
|
|
|
30
30
|
/** @jsx jsx */
|
|
31
31
|
import { Component } from 'react';
|
|
32
32
|
import { View } from '@instructure/ui-view';
|
|
33
|
-
import { passthroughProps } from '@instructure/ui-react-utils';
|
|
33
|
+
import { callRenderProp, passthroughProps } from '@instructure/ui-react-utils';
|
|
34
34
|
import { testable } from '@instructure/ui-testable';
|
|
35
35
|
import { withStyle, jsx } from '@instructure/emotion';
|
|
36
36
|
import generateStyle from './styles';
|
|
@@ -69,13 +69,21 @@ let Avatar = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = t
|
|
|
69
69
|
}
|
|
70
70
|
|
|
71
71
|
componentDidMount() {
|
|
72
|
-
|
|
73
|
-
|
|
72
|
+
var _this$props$makeStyle, _this$props;
|
|
73
|
+
|
|
74
|
+
(_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, this.state);
|
|
74
75
|
}
|
|
75
76
|
|
|
76
77
|
componentDidUpdate() {
|
|
77
|
-
|
|
78
|
-
|
|
78
|
+
var _this$props$makeStyle2, _this$props2;
|
|
79
|
+
|
|
80
|
+
(_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, this.state); // in case the image is unset in an update, show icons/initials again
|
|
81
|
+
|
|
82
|
+
if (this.state.loaded && !this.props.src) {
|
|
83
|
+
this.setState({
|
|
84
|
+
loaded: false
|
|
85
|
+
});
|
|
86
|
+
}
|
|
79
87
|
}
|
|
80
88
|
|
|
81
89
|
makeInitialsFromName() {
|
|
@@ -108,13 +116,27 @@ let Avatar = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = t
|
|
|
108
116
|
}, this.makeInitialsFromName());
|
|
109
117
|
}
|
|
110
118
|
|
|
119
|
+
renderContent() {
|
|
120
|
+
const _this$props3 = this.props,
|
|
121
|
+
renderIcon = _this$props3.renderIcon,
|
|
122
|
+
styles = _this$props3.styles;
|
|
123
|
+
|
|
124
|
+
if (!renderIcon) {
|
|
125
|
+
return this.renderInitials();
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
return jsx("span", {
|
|
129
|
+
css: styles === null || styles === void 0 ? void 0 : styles.iconSVG
|
|
130
|
+
}, callRenderProp(renderIcon));
|
|
131
|
+
}
|
|
132
|
+
|
|
111
133
|
render() {
|
|
112
134
|
var _this$props$styles2;
|
|
113
135
|
|
|
114
|
-
const _this$
|
|
115
|
-
onImageLoaded = _this$
|
|
116
|
-
styles = _this$
|
|
117
|
-
props = _objectWithoutProperties(_this$
|
|
136
|
+
const _this$props4 = this.props,
|
|
137
|
+
onImageLoaded = _this$props4.onImageLoaded,
|
|
138
|
+
styles = _this$props4.styles,
|
|
139
|
+
props = _objectWithoutProperties(_this$props4, _excluded);
|
|
118
140
|
|
|
119
141
|
return jsx(View, Object.assign({}, passthroughProps(props), {
|
|
120
142
|
"aria-label": this.props.alt ? this.props.alt : void 0,
|
|
@@ -131,12 +153,13 @@ let Avatar = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = t
|
|
|
131
153
|
alt: this.props.alt,
|
|
132
154
|
onLoad: this.handleImageLoaded,
|
|
133
155
|
"aria-hidden": "true"
|
|
134
|
-
}), !this.state.loaded && this.
|
|
156
|
+
}), !this.state.loaded && this.renderContent());
|
|
135
157
|
}
|
|
136
158
|
|
|
137
159
|
}, _class2.displayName = "Avatar", _class2.componentId = 'Avatar', _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.defaultProps = {
|
|
138
160
|
size: 'medium',
|
|
139
161
|
color: 'default',
|
|
162
|
+
hasInverseColor: false,
|
|
140
163
|
shape: 'circle',
|
|
141
164
|
display: 'inline-block',
|
|
142
165
|
onImageLoaded: _event => {}
|
package/es/Avatar/props.js
CHANGED
|
@@ -29,12 +29,14 @@ const propTypes = {
|
|
|
29
29
|
alt: PropTypes.string,
|
|
30
30
|
size: PropTypes.oneOf(['auto', 'xx-small', 'x-small', 'small', 'medium', 'large', 'x-large', 'xx-large']),
|
|
31
31
|
color: PropTypes.oneOf(['default', 'shamrock', 'barney', 'crimson', 'fire', 'licorice', 'ash']),
|
|
32
|
+
hasInverseColor: PropTypes.bool,
|
|
32
33
|
shape: PropTypes.oneOf(['circle', 'rectangle']),
|
|
33
34
|
margin: ThemeablePropTypes.spacing,
|
|
34
35
|
display: PropTypes.oneOf(['inline-block', 'block']),
|
|
35
36
|
onImageLoaded: PropTypes.func,
|
|
36
37
|
as: PropTypes.elementType,
|
|
37
|
-
elementRef: PropTypes.func
|
|
38
|
+
elementRef: PropTypes.func,
|
|
39
|
+
renderIcon: PropTypes.oneOfType([PropTypes.node, PropTypes.func])
|
|
38
40
|
};
|
|
39
|
-
const allowedProps = ['name', 'src', 'alt', 'size', 'color', 'shape', 'margin', 'display', 'onImageLoaded', 'as', 'elementRef'];
|
|
41
|
+
const allowedProps = ['name', 'src', 'alt', 'size', 'color', 'hasInverseColor', 'shape', 'margin', 'display', 'onImageLoaded', 'as', 'elementRef', 'renderIcon'];
|
|
40
42
|
export { propTypes, allowedProps };
|
package/es/Avatar/styles.js
CHANGED
|
@@ -35,6 +35,7 @@
|
|
|
35
35
|
const generateStyle = (componentTheme, props, state) => {
|
|
36
36
|
const size = props.size,
|
|
37
37
|
color = props.color,
|
|
38
|
+
hasInverseColor = props.hasInverseColor,
|
|
38
39
|
shape = props.shape,
|
|
39
40
|
src = props.src;
|
|
40
41
|
const loaded = state.loaded;
|
|
@@ -83,7 +84,7 @@ const generateStyle = (componentTheme, props, state) => {
|
|
|
83
84
|
width: '3em'
|
|
84
85
|
}
|
|
85
86
|
};
|
|
86
|
-
const
|
|
87
|
+
const colorVariants = {
|
|
87
88
|
default: componentTheme.color,
|
|
88
89
|
// = brand
|
|
89
90
|
shamrock: componentTheme.colorShamrock,
|
|
@@ -93,12 +94,14 @@ const generateStyle = (componentTheme, props, state) => {
|
|
|
93
94
|
licorice: componentTheme.colorLicorice,
|
|
94
95
|
ash: componentTheme.colorAsh
|
|
95
96
|
};
|
|
97
|
+
const backgroundColor = hasInverseColor ? colorVariants[color] : componentTheme.background;
|
|
98
|
+
const contentColor = hasInverseColor ? componentTheme.background : colorVariants[color];
|
|
96
99
|
return {
|
|
97
100
|
avatar: {
|
|
98
101
|
label: 'avatar',
|
|
99
102
|
height: '2.5em',
|
|
100
103
|
boxSizing: 'border-box',
|
|
101
|
-
backgroundColor:
|
|
104
|
+
backgroundColor: backgroundColor,
|
|
102
105
|
backgroundPosition: 'center',
|
|
103
106
|
backgroundSize: 'cover',
|
|
104
107
|
backgroundClip: 'content-box',
|
|
@@ -115,12 +118,17 @@ const generateStyle = (componentTheme, props, state) => {
|
|
|
115
118
|
} : {
|
|
116
119
|
backgroundImage: void 0,
|
|
117
120
|
borderStyle: 'solid',
|
|
118
|
-
borderColor: componentTheme.borderColor
|
|
121
|
+
borderColor: componentTheme.borderColor,
|
|
122
|
+
...(hasInverseColor && {
|
|
123
|
+
border: 0,
|
|
124
|
+
padding: sizeStyles[size].borderWidth,
|
|
125
|
+
backgroundClip: 'border-box'
|
|
126
|
+
})
|
|
119
127
|
})
|
|
120
128
|
},
|
|
121
129
|
initials: {
|
|
122
130
|
label: 'avatar__initials',
|
|
123
|
-
color:
|
|
131
|
+
color: contentColor,
|
|
124
132
|
lineHeight: '2.375em',
|
|
125
133
|
fontFamily: componentTheme.fontFamily,
|
|
126
134
|
fontWeight: componentTheme.fontWeight,
|
|
@@ -129,6 +137,19 @@ const generateStyle = (componentTheme, props, state) => {
|
|
|
129
137
|
loadImage: {
|
|
130
138
|
label: 'avatar__loadImage',
|
|
131
139
|
display: 'none'
|
|
140
|
+
},
|
|
141
|
+
iconSVG: {
|
|
142
|
+
label: 'avatar__iconSVG',
|
|
143
|
+
display: 'flex',
|
|
144
|
+
alignItems: 'center',
|
|
145
|
+
justifyContent: 'center',
|
|
146
|
+
height: '100%',
|
|
147
|
+
width: '100%',
|
|
148
|
+
svg: {
|
|
149
|
+
fill: contentColor,
|
|
150
|
+
height: '1em',
|
|
151
|
+
width: '1em'
|
|
152
|
+
}
|
|
132
153
|
}
|
|
133
154
|
};
|
|
134
155
|
};
|
package/es/package.json
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"type":"module"}
|
|
@@ -1,10 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
|
4
6
|
value: true
|
|
5
7
|
});
|
|
6
8
|
exports.default = void 0;
|
|
7
9
|
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
12
|
+
var _IconGroupLine = require("@instructure/ui-icons/lib/IconGroupLine.js");
|
|
13
|
+
|
|
8
14
|
/*
|
|
9
15
|
* The MIT License (MIT)
|
|
10
16
|
*
|
|
@@ -31,9 +37,31 @@ exports.default = void 0;
|
|
|
31
37
|
var _default = {
|
|
32
38
|
sectionProp: 'shape',
|
|
33
39
|
propValues: {
|
|
34
|
-
src: [null, 'data:image/jpeg;base64,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']
|
|
40
|
+
src: [null, 'data:image/jpeg;base64,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'],
|
|
41
|
+
renderIcon: [void 0, /*#__PURE__*/_react.default.createElement(_IconGroupLine.IconGroupLine, {
|
|
42
|
+
key: "icon"
|
|
43
|
+
})]
|
|
44
|
+
},
|
|
45
|
+
filter: props => {
|
|
46
|
+
if (props.color !== 'default' && props.size !== 'medium') {
|
|
47
|
+
return true;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
if (props.renderIcon && props.src) {
|
|
51
|
+
return true;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
if (props.src && props.color !== 'default') {
|
|
55
|
+
return true;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
if (props.hasInverseColor && (props.size !== 'medium' || props.display !== 'block')) {
|
|
59
|
+
return true;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
return false;
|
|
35
63
|
},
|
|
36
|
-
getComponentProps:
|
|
64
|
+
getComponentProps: () => {
|
|
37
65
|
return {
|
|
38
66
|
name: 'Kyle Montgomery'
|
|
39
67
|
};
|
package/lib/Avatar/index.js
CHANGED
|
@@ -13,6 +13,8 @@ var _react = require("react");
|
|
|
13
13
|
|
|
14
14
|
var _View = require("@instructure/ui-view/lib/View");
|
|
15
15
|
|
|
16
|
+
var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
|
|
17
|
+
|
|
16
18
|
var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
|
|
17
19
|
|
|
18
20
|
var _testable = require("@instructure/ui-testable/lib/testable.js");
|
|
@@ -61,13 +63,21 @@ let Avatar = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _
|
|
|
61
63
|
}
|
|
62
64
|
|
|
63
65
|
componentDidMount() {
|
|
64
|
-
|
|
65
|
-
|
|
66
|
+
var _this$props$makeStyle, _this$props;
|
|
67
|
+
|
|
68
|
+
(_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, this.state);
|
|
66
69
|
}
|
|
67
70
|
|
|
68
71
|
componentDidUpdate() {
|
|
69
|
-
|
|
70
|
-
|
|
72
|
+
var _this$props$makeStyle2, _this$props2;
|
|
73
|
+
|
|
74
|
+
(_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, this.state); // in case the image is unset in an update, show icons/initials again
|
|
75
|
+
|
|
76
|
+
if (this.state.loaded && !this.props.src) {
|
|
77
|
+
this.setState({
|
|
78
|
+
loaded: false
|
|
79
|
+
});
|
|
80
|
+
}
|
|
71
81
|
}
|
|
72
82
|
|
|
73
83
|
makeInitialsFromName() {
|
|
@@ -100,13 +110,27 @@ let Avatar = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _
|
|
|
100
110
|
}, this.makeInitialsFromName());
|
|
101
111
|
}
|
|
102
112
|
|
|
113
|
+
renderContent() {
|
|
114
|
+
const _this$props3 = this.props,
|
|
115
|
+
renderIcon = _this$props3.renderIcon,
|
|
116
|
+
styles = _this$props3.styles;
|
|
117
|
+
|
|
118
|
+
if (!renderIcon) {
|
|
119
|
+
return this.renderInitials();
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
return (0, _emotion.jsx)("span", {
|
|
123
|
+
css: styles === null || styles === void 0 ? void 0 : styles.iconSVG
|
|
124
|
+
}, (0, _callRenderProp.callRenderProp)(renderIcon));
|
|
125
|
+
}
|
|
126
|
+
|
|
103
127
|
render() {
|
|
104
128
|
var _this$props$styles2;
|
|
105
129
|
|
|
106
|
-
const _this$
|
|
107
|
-
onImageLoaded = _this$
|
|
108
|
-
styles = _this$
|
|
109
|
-
props = (0, _objectWithoutProperties2.default)(_this$
|
|
130
|
+
const _this$props4 = this.props,
|
|
131
|
+
onImageLoaded = _this$props4.onImageLoaded,
|
|
132
|
+
styles = _this$props4.styles,
|
|
133
|
+
props = (0, _objectWithoutProperties2.default)(_this$props4, _excluded);
|
|
110
134
|
return (0, _emotion.jsx)(_View.View, Object.assign({}, (0, _passthroughProps.passthroughProps)(props), {
|
|
111
135
|
"aria-label": this.props.alt ? this.props.alt : void 0,
|
|
112
136
|
role: this.props.alt ? 'img' : void 0,
|
|
@@ -122,12 +146,13 @@ let Avatar = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _
|
|
|
122
146
|
alt: this.props.alt,
|
|
123
147
|
onLoad: this.handleImageLoaded,
|
|
124
148
|
"aria-hidden": "true"
|
|
125
|
-
}), !this.state.loaded && this.
|
|
149
|
+
}), !this.state.loaded && this.renderContent());
|
|
126
150
|
}
|
|
127
151
|
|
|
128
152
|
}, _class2.displayName = "Avatar", _class2.componentId = 'Avatar', _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.defaultProps = {
|
|
129
153
|
size: 'medium',
|
|
130
154
|
color: 'default',
|
|
155
|
+
hasInverseColor: false,
|
|
131
156
|
shape: 'circle',
|
|
132
157
|
display: 'inline-block',
|
|
133
158
|
onImageLoaded: _event => {}
|
package/lib/Avatar/props.js
CHANGED
|
@@ -40,13 +40,15 @@ const propTypes = {
|
|
|
40
40
|
alt: _propTypes.default.string,
|
|
41
41
|
size: _propTypes.default.oneOf(['auto', 'xx-small', 'x-small', 'small', 'medium', 'large', 'x-large', 'xx-large']),
|
|
42
42
|
color: _propTypes.default.oneOf(['default', 'shamrock', 'barney', 'crimson', 'fire', 'licorice', 'ash']),
|
|
43
|
+
hasInverseColor: _propTypes.default.bool,
|
|
43
44
|
shape: _propTypes.default.oneOf(['circle', 'rectangle']),
|
|
44
45
|
margin: _emotion.ThemeablePropTypes.spacing,
|
|
45
46
|
display: _propTypes.default.oneOf(['inline-block', 'block']),
|
|
46
47
|
onImageLoaded: _propTypes.default.func,
|
|
47
48
|
as: _propTypes.default.elementType,
|
|
48
|
-
elementRef: _propTypes.default.func
|
|
49
|
+
elementRef: _propTypes.default.func,
|
|
50
|
+
renderIcon: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func])
|
|
49
51
|
};
|
|
50
52
|
exports.propTypes = propTypes;
|
|
51
|
-
const allowedProps = ['name', 'src', 'alt', 'size', 'color', 'shape', 'margin', 'display', 'onImageLoaded', 'as', 'elementRef'];
|
|
53
|
+
const allowedProps = ['name', 'src', 'alt', 'size', 'color', 'hasInverseColor', 'shape', 'margin', 'display', 'onImageLoaded', 'as', 'elementRef', 'renderIcon'];
|
|
52
54
|
exports.allowedProps = allowedProps;
|
package/lib/Avatar/styles.js
CHANGED
|
@@ -42,6 +42,7 @@ exports.default = void 0;
|
|
|
42
42
|
const generateStyle = (componentTheme, props, state) => {
|
|
43
43
|
const size = props.size,
|
|
44
44
|
color = props.color,
|
|
45
|
+
hasInverseColor = props.hasInverseColor,
|
|
45
46
|
shape = props.shape,
|
|
46
47
|
src = props.src;
|
|
47
48
|
const loaded = state.loaded;
|
|
@@ -90,7 +91,7 @@ const generateStyle = (componentTheme, props, state) => {
|
|
|
90
91
|
width: '3em'
|
|
91
92
|
}
|
|
92
93
|
};
|
|
93
|
-
const
|
|
94
|
+
const colorVariants = {
|
|
94
95
|
default: componentTheme.color,
|
|
95
96
|
// = brand
|
|
96
97
|
shamrock: componentTheme.colorShamrock,
|
|
@@ -100,12 +101,14 @@ const generateStyle = (componentTheme, props, state) => {
|
|
|
100
101
|
licorice: componentTheme.colorLicorice,
|
|
101
102
|
ash: componentTheme.colorAsh
|
|
102
103
|
};
|
|
104
|
+
const backgroundColor = hasInverseColor ? colorVariants[color] : componentTheme.background;
|
|
105
|
+
const contentColor = hasInverseColor ? componentTheme.background : colorVariants[color];
|
|
103
106
|
return {
|
|
104
107
|
avatar: {
|
|
105
108
|
label: 'avatar',
|
|
106
109
|
height: '2.5em',
|
|
107
110
|
boxSizing: 'border-box',
|
|
108
|
-
backgroundColor:
|
|
111
|
+
backgroundColor: backgroundColor,
|
|
109
112
|
backgroundPosition: 'center',
|
|
110
113
|
backgroundSize: 'cover',
|
|
111
114
|
backgroundClip: 'content-box',
|
|
@@ -122,12 +125,17 @@ const generateStyle = (componentTheme, props, state) => {
|
|
|
122
125
|
} : {
|
|
123
126
|
backgroundImage: void 0,
|
|
124
127
|
borderStyle: 'solid',
|
|
125
|
-
borderColor: componentTheme.borderColor
|
|
128
|
+
borderColor: componentTheme.borderColor,
|
|
129
|
+
...(hasInverseColor && {
|
|
130
|
+
border: 0,
|
|
131
|
+
padding: sizeStyles[size].borderWidth,
|
|
132
|
+
backgroundClip: 'border-box'
|
|
133
|
+
})
|
|
126
134
|
})
|
|
127
135
|
},
|
|
128
136
|
initials: {
|
|
129
137
|
label: 'avatar__initials',
|
|
130
|
-
color:
|
|
138
|
+
color: contentColor,
|
|
131
139
|
lineHeight: '2.375em',
|
|
132
140
|
fontFamily: componentTheme.fontFamily,
|
|
133
141
|
fontWeight: componentTheme.fontWeight,
|
|
@@ -136,6 +144,19 @@ const generateStyle = (componentTheme, props, state) => {
|
|
|
136
144
|
loadImage: {
|
|
137
145
|
label: 'avatar__loadImage',
|
|
138
146
|
display: 'none'
|
|
147
|
+
},
|
|
148
|
+
iconSVG: {
|
|
149
|
+
label: 'avatar__iconSVG',
|
|
150
|
+
display: 'flex',
|
|
151
|
+
alignItems: 'center',
|
|
152
|
+
justifyContent: 'center',
|
|
153
|
+
height: '100%',
|
|
154
|
+
width: '100%',
|
|
155
|
+
svg: {
|
|
156
|
+
fill: contentColor,
|
|
157
|
+
height: '1em',
|
|
158
|
+
width: '1em'
|
|
159
|
+
}
|
|
139
160
|
}
|
|
140
161
|
};
|
|
141
162
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@instructure/ui-avatar",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.12.0",
|
|
4
4
|
"description": "An image or letters that represents a user.",
|
|
5
5
|
"author": "Instructure, Inc. Engineering and Product Design",
|
|
6
6
|
"type": "commonjs",
|
|
@@ -25,20 +25,21 @@
|
|
|
25
25
|
"license": "MIT",
|
|
26
26
|
"dependencies": {
|
|
27
27
|
"@babel/runtime": "^7.13.10",
|
|
28
|
-
"@instructure/console": "8.
|
|
29
|
-
"@instructure/emotion": "8.
|
|
30
|
-
"@instructure/shared-types": "8.
|
|
31
|
-
"@instructure/ui-
|
|
32
|
-
"@instructure/ui-
|
|
33
|
-
"@instructure/ui-
|
|
28
|
+
"@instructure/console": "8.12.0",
|
|
29
|
+
"@instructure/emotion": "8.12.0",
|
|
30
|
+
"@instructure/shared-types": "8.12.0",
|
|
31
|
+
"@instructure/ui-icons": "8.12.0",
|
|
32
|
+
"@instructure/ui-react-utils": "8.12.0",
|
|
33
|
+
"@instructure/ui-testable": "8.12.0",
|
|
34
|
+
"@instructure/ui-view": "8.12.0",
|
|
34
35
|
"prop-types": "^15"
|
|
35
36
|
},
|
|
36
37
|
"devDependencies": {
|
|
37
|
-
"@instructure/ui-babel-preset": "8.
|
|
38
|
-
"@instructure/ui-color-utils": "8.
|
|
39
|
-
"@instructure/ui-test-locator": "8.
|
|
40
|
-
"@instructure/ui-test-utils": "8.
|
|
41
|
-
"@instructure/ui-themes": "8.
|
|
38
|
+
"@instructure/ui-babel-preset": "8.12.0",
|
|
39
|
+
"@instructure/ui-color-utils": "8.12.0",
|
|
40
|
+
"@instructure/ui-test-locator": "8.12.0",
|
|
41
|
+
"@instructure/ui-test-utils": "8.12.0",
|
|
42
|
+
"@instructure/ui-themes": "8.12.0"
|
|
42
43
|
},
|
|
43
44
|
"peerDependencies": {
|
|
44
45
|
"react": ">=16.8 <=17"
|
|
@@ -46,6 +47,5 @@
|
|
|
46
47
|
"publishConfig": {
|
|
47
48
|
"access": "public"
|
|
48
49
|
},
|
|
49
|
-
"sideEffects": false
|
|
50
|
-
"gitHead": "2681e145ad469e1396536d3e9eed75a19995eb8a"
|
|
50
|
+
"sideEffects": false
|
|
51
51
|
}
|
package/src/Avatar/README.md
CHANGED
|
@@ -2,7 +2,11 @@
|
|
|
2
2
|
describes: Avatar
|
|
3
3
|
---
|
|
4
4
|
|
|
5
|
-
The avatar component can be used to display a user's avatar. When an image src is not supplied the user's initials will display.
|
|
5
|
+
The avatar component can be used to display a user's avatar. When an image src is not supplied the user's initials will display.
|
|
6
|
+
|
|
7
|
+
Instead of the initials, an SVG icon can be displayed with the `renderIcon` property.
|
|
8
|
+
|
|
9
|
+
The avatar can be `circle` _(default)_ or `rectangle`. Use the `margin` prop to add space between Avatar and other content.
|
|
6
10
|
|
|
7
11
|
```js
|
|
8
12
|
---
|
|
@@ -11,8 +15,10 @@ example: true
|
|
|
11
15
|
<div>
|
|
12
16
|
<Avatar name="Sarah Robinson" src={avatarSquare} margin="0 small 0 0" />
|
|
13
17
|
<Avatar name="Sarah Robinson" margin="0 small 0 0" />
|
|
18
|
+
<Avatar name="Sarah Robinson" renderIcon={<IconGroupLine />} margin="0 small 0 0" />
|
|
14
19
|
<Avatar name="Kyle Montgomery" src={avatarSquare} shape="rectangle" margin="0 small 0 0" />
|
|
15
|
-
<Avatar name="Kyle Montgomery" shape="rectangle" />
|
|
20
|
+
<Avatar name="Kyle Montgomery" shape="rectangle" margin="0 small 0 0" />
|
|
21
|
+
<Avatar name="Kyle Montgomery" renderIcon={<IconGroupLine />} shape="rectangle" />
|
|
16
22
|
</div>
|
|
17
23
|
```
|
|
18
24
|
|
|
@@ -44,25 +50,75 @@ example: true
|
|
|
44
50
|
<Avatar name="David Herbert" size="x-large" margin="0 small 0 0" src={avatarSquare} />
|
|
45
51
|
<Avatar name="Isaac Asimov" size="xx-large" src={avatarSquare} />
|
|
46
52
|
</View>
|
|
53
|
+
<View display="block" padding="small medium">
|
|
54
|
+
<Avatar name="Arthur C. Clarke" renderIcon={<IconGroupLine />} size="xx-small" margin="0 small 0 0" />
|
|
55
|
+
<Avatar name="James Arias" renderIcon={<IconGroupLine />} size="x-small" margin="0 small 0 0" />
|
|
56
|
+
<Avatar name="Charles Kimball" renderIcon={<IconGroupLine />} size="small" margin="0 small 0 0" />
|
|
57
|
+
<Avatar name="Melissa Reed" renderIcon={<IconGroupLine />} size="medium" margin="0 small 0 0" />
|
|
58
|
+
<Avatar name="Heather Wheeler" renderIcon={<IconGroupLine />} size="large" margin="0 small 0 0" />
|
|
59
|
+
<Avatar name="David Herbert" renderIcon={<IconGroupLine />} size="x-large" margin="0 small 0 0" />
|
|
60
|
+
<Avatar name="Isaac Asimov" renderIcon={<IconGroupLine />} size="xx-large" />
|
|
61
|
+
</View>
|
|
62
|
+
</div>
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
### Colors
|
|
66
|
+
|
|
67
|
+
The color of the initials and icons can be set with the `color` prop, and it allows you to select from `default`, `shamrock`, `barney`, `crimson`, `fire`, `licorice` and `ash`.
|
|
68
|
+
|
|
69
|
+
```js
|
|
70
|
+
---
|
|
71
|
+
example: true
|
|
72
|
+
---
|
|
73
|
+
<div>
|
|
74
|
+
<View display="block" padding="small medium">
|
|
75
|
+
<Avatar name="Arthur C. Clarke" margin="0 small 0 0" />
|
|
76
|
+
<Avatar name="James Arias" color="shamrock" margin="0 small 0 0" />
|
|
77
|
+
<Avatar name="Charles Kimball" color="barney" margin="0 small 0 0" />
|
|
78
|
+
<Avatar name="Melissa Reed" color="crimson" margin="0 small 0 0" />
|
|
79
|
+
<Avatar name="Heather Wheeler" color="fire" margin="0 small 0 0" />
|
|
80
|
+
<Avatar name="David Herbert" color="licorice" margin="0 small 0 0" />
|
|
81
|
+
<Avatar name="Isaac Asimov" color="ash" />
|
|
82
|
+
</View>
|
|
83
|
+
<View display="block" padding="small medium">
|
|
84
|
+
<Avatar renderIcon={<IconGroupLine />} name="Arthur C. Clarke" margin="0 small 0 0" />
|
|
85
|
+
<Avatar renderIcon={<IconGroupLine />} name="James Arias" color="shamrock" margin="0 small 0 0" />
|
|
86
|
+
<Avatar renderIcon={<IconGroupLine />} name="Charles Kimball" color="barney" margin="0 small 0 0" />
|
|
87
|
+
<Avatar renderIcon={<IconGroupLine />} name="Melissa Reed" color="crimson" margin="0 small 0 0" />
|
|
88
|
+
<Avatar renderIcon={<IconGroupLine />} name="Heather Wheeler" color="fire" margin="0 small 0 0" />
|
|
89
|
+
<Avatar renderIcon={<IconGroupLine />} name="David Herbert" color="licorice" margin="0 small 0 0" />
|
|
90
|
+
<Avatar renderIcon={<IconGroupLine />} name="Isaac Asimov" color="ash" />
|
|
91
|
+
</View>
|
|
47
92
|
</div>
|
|
48
93
|
```
|
|
49
94
|
|
|
50
|
-
|
|
95
|
+
The `hasInverseColor` prop inverts the background color and the text/icon color.
|
|
51
96
|
|
|
52
|
-
|
|
97
|
+
Inverted Avatars have **no border**.
|
|
53
98
|
|
|
54
99
|
```js
|
|
55
100
|
---
|
|
56
101
|
example: true
|
|
57
102
|
---
|
|
58
103
|
<div>
|
|
59
|
-
<
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
104
|
+
<View display="block" padding="small medium" background="primary">
|
|
105
|
+
<Avatar name="Arthur C. Clarke" hasInverseColor margin="0 small 0 0" />
|
|
106
|
+
<Avatar name="James Arias" color="shamrock" hasInverseColor margin="0 small 0 0" />
|
|
107
|
+
<Avatar name="Charles Kimball" color="barney" hasInverseColor margin="0 small 0 0" />
|
|
108
|
+
<Avatar name="Melissa Reed" color="crimson" hasInverseColor margin="0 small 0 0" />
|
|
109
|
+
<Avatar name="Heather Wheeler" color="fire" hasInverseColor margin="0 small 0 0" />
|
|
110
|
+
<Avatar name="David Herbert" color="licorice" hasInverseColor margin="0 small 0 0" />
|
|
111
|
+
<Avatar name="Isaac Asimov" color="ash" hasInverseColor />
|
|
112
|
+
</View>
|
|
113
|
+
<View display="block" padding="small medium" background="primary">
|
|
114
|
+
<Avatar renderIcon={<IconGroupLine />} name="Arthur C. Clarke" hasInverseColor margin="0 small 0 0" />
|
|
115
|
+
<Avatar renderIcon={<IconGroupLine />} name="James Arias" color="shamrock" hasInverseColor margin="0 small 0 0" />
|
|
116
|
+
<Avatar renderIcon={<IconGroupLine />} name="Charles Kimball" color="barney" hasInverseColor margin="0 small 0 0" />
|
|
117
|
+
<Avatar renderIcon={<IconGroupLine />} name="Melissa Reed" color="crimson" hasInverseColor margin="0 small 0 0" />
|
|
118
|
+
<Avatar renderIcon={<IconGroupLine />} name="Heather Wheeler" color="fire" hasInverseColor margin="0 small 0 0" />
|
|
119
|
+
<Avatar renderIcon={<IconGroupLine />} name="David Herbert" color="licorice" hasInverseColor margin="0 small 0 0" />
|
|
120
|
+
<Avatar renderIcon={<IconGroupLine />} name="Isaac Asimov" color="ash" hasInverseColor />
|
|
121
|
+
</View>
|
|
66
122
|
</div>
|
|
67
123
|
```
|
|
68
124
|
|
|
@@ -73,8 +129,10 @@ In case you need more control over the color, feel free to use the `themeOverrid
|
|
|
73
129
|
example: true
|
|
74
130
|
---
|
|
75
131
|
<div>
|
|
76
|
-
<Avatar name="Isaac Asimov" themeOverride={{ color: '#efb410' }} margin="0 small 0 0" />
|
|
77
|
-
<Avatar name="Heather Wheeler" color="fire" themeOverride={{ colorFire: 'magenta' }} />
|
|
132
|
+
<Avatar name="Isaac Asimov" renderIcon={<IconGroupLine />} themeOverride={{ color: '#efb410' }} margin="0 small 0 0" />
|
|
133
|
+
<Avatar name="Heather Wheeler" color="fire" themeOverride={{ colorFire: 'magenta' }} margin="0 small 0 0" />
|
|
134
|
+
<Avatar name="Charles Kimball" renderIcon={<IconGroupLine />} hasInverseColor themeOverride={{ color: 'lightblue', background: 'black' }} margin="0 small 0 0" />
|
|
135
|
+
<Avatar name="David Herbert" hasInverseColor color="fire" themeOverride={{ colorFire: '#efb410' }} />
|
|
78
136
|
</div>
|
|
79
137
|
```
|
|
80
138
|
|
|
@@ -22,17 +22,48 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
+
import React from 'react'
|
|
26
|
+
|
|
27
|
+
import { IconGroupLine } from '@instructure/ui-icons'
|
|
28
|
+
|
|
29
|
+
import type { StoryConfig } from '@instructure/ui-test-utils'
|
|
30
|
+
|
|
31
|
+
import type { AvatarProps } from '../props'
|
|
32
|
+
|
|
25
33
|
export default {
|
|
26
34
|
sectionProp: 'shape',
|
|
27
35
|
propValues: {
|
|
28
36
|
src: [
|
|
29
37
|
null,
|
|
30
38
|
'data:image/jpeg;base64,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'
|
|
31
|
-
]
|
|
39
|
+
],
|
|
40
|
+
renderIcon: [undefined, <IconGroupLine key="icon" />]
|
|
41
|
+
},
|
|
42
|
+
filter: (props) => {
|
|
43
|
+
if (props.color !== 'default' && props.size !== 'medium') {
|
|
44
|
+
return true
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
if (props.renderIcon && props.src) {
|
|
48
|
+
return true
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
if (props.src && props.color !== 'default') {
|
|
52
|
+
return true
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
if (
|
|
56
|
+
props.hasInverseColor &&
|
|
57
|
+
(props.size !== 'medium' || props.display !== 'block')
|
|
58
|
+
) {
|
|
59
|
+
return true
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
return false
|
|
32
63
|
},
|
|
33
|
-
getComponentProps: (
|
|
64
|
+
getComponentProps: () => {
|
|
34
65
|
return {
|
|
35
66
|
name: 'Kyle Montgomery'
|
|
36
67
|
}
|
|
37
68
|
}
|
|
38
|
-
}
|
|
69
|
+
} as StoryConfig<AvatarProps>
|
package/src/Avatar/index.tsx
CHANGED
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
import { Component, SyntheticEvent } from 'react'
|
|
27
27
|
|
|
28
28
|
import { View } from '@instructure/ui-view'
|
|
29
|
-
import { passthroughProps } from '@instructure/ui-react-utils'
|
|
29
|
+
import { callRenderProp, passthroughProps } from '@instructure/ui-react-utils'
|
|
30
30
|
import { testable } from '@instructure/ui-testable'
|
|
31
31
|
|
|
32
32
|
import { withStyle, jsx } from '@instructure/emotion'
|
|
@@ -53,6 +53,7 @@ class Avatar extends Component<AvatarProps, AvatarState> {
|
|
|
53
53
|
static defaultProps = {
|
|
54
54
|
size: 'medium',
|
|
55
55
|
color: 'default',
|
|
56
|
+
hasInverseColor: false,
|
|
56
57
|
shape: 'circle',
|
|
57
58
|
display: 'inline-block',
|
|
58
59
|
onImageLoaded: (_event: SyntheticEvent) => {}
|
|
@@ -73,13 +74,16 @@ class Avatar extends Component<AvatarProps, AvatarState> {
|
|
|
73
74
|
}
|
|
74
75
|
|
|
75
76
|
componentDidMount() {
|
|
76
|
-
|
|
77
|
-
this.props.makeStyles(this.state)
|
|
77
|
+
this.props.makeStyles?.(this.state)
|
|
78
78
|
}
|
|
79
79
|
|
|
80
80
|
componentDidUpdate() {
|
|
81
|
-
|
|
82
|
-
|
|
81
|
+
this.props.makeStyles?.(this.state)
|
|
82
|
+
|
|
83
|
+
// in case the image is unset in an update, show icons/initials again
|
|
84
|
+
if (this.state.loaded && !this.props.src) {
|
|
85
|
+
this.setState({ loaded: false })
|
|
86
|
+
}
|
|
83
87
|
}
|
|
84
88
|
|
|
85
89
|
makeInitialsFromName() {
|
|
@@ -114,6 +118,16 @@ class Avatar extends Component<AvatarProps, AvatarState> {
|
|
|
114
118
|
)
|
|
115
119
|
}
|
|
116
120
|
|
|
121
|
+
renderContent() {
|
|
122
|
+
const { renderIcon, styles } = this.props
|
|
123
|
+
|
|
124
|
+
if (!renderIcon) {
|
|
125
|
+
return this.renderInitials()
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
return <span css={styles?.iconSVG}>{callRenderProp(renderIcon)}</span>
|
|
129
|
+
}
|
|
130
|
+
|
|
117
131
|
render() {
|
|
118
132
|
const { onImageLoaded, styles, ...props } = this.props
|
|
119
133
|
|
|
@@ -135,7 +149,7 @@ class Avatar extends Component<AvatarProps, AvatarState> {
|
|
|
135
149
|
onLoad={this.handleImageLoaded}
|
|
136
150
|
aria-hidden="true"
|
|
137
151
|
/>
|
|
138
|
-
{!this.state.loaded && this.
|
|
152
|
+
{!this.state.loaded && this.renderContent()}
|
|
139
153
|
</View>
|
|
140
154
|
)
|
|
141
155
|
}
|
package/src/Avatar/props.ts
CHANGED
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
import { SyntheticEvent } from 'react'
|
|
25
|
+
import React, { SyntheticEvent } from 'react'
|
|
26
26
|
import PropTypes from 'prop-types'
|
|
27
27
|
|
|
28
28
|
import { ThemeablePropTypes } from '@instructure/emotion'
|
|
@@ -69,6 +69,10 @@ type AvatarOwnProps = {
|
|
|
69
69
|
| 'fire'
|
|
70
70
|
| 'licorice'
|
|
71
71
|
| 'ash'
|
|
72
|
+
/**
|
|
73
|
+
* In inverse color mode the background and text/icon colors are inverted
|
|
74
|
+
*/
|
|
75
|
+
hasInverseColor?: boolean
|
|
72
76
|
shape: 'circle' | 'rectangle'
|
|
73
77
|
display: 'inline-block' | 'block'
|
|
74
78
|
/**
|
|
@@ -89,6 +93,10 @@ type AvatarOwnProps = {
|
|
|
89
93
|
* provides a reference to the underlying html root element
|
|
90
94
|
*/
|
|
91
95
|
elementRef?: (element: Element | null) => void
|
|
96
|
+
/**
|
|
97
|
+
* An icon, or function that returns an icon that gets displayed. If the `src` prop is provided, `src` will have priority.
|
|
98
|
+
*/
|
|
99
|
+
renderIcon?: React.ReactNode | (() => React.ReactNode)
|
|
92
100
|
}
|
|
93
101
|
|
|
94
102
|
export type AvatarState = {
|
|
@@ -103,7 +111,9 @@ type AvatarProps = AvatarOwnProps &
|
|
|
103
111
|
WithStyleProps<AvatarTheme, AvatarStyle> &
|
|
104
112
|
OtherHTMLAttributes<AvatarOwnProps>
|
|
105
113
|
|
|
106
|
-
type AvatarStyle = ComponentStyle<
|
|
114
|
+
type AvatarStyle = ComponentStyle<
|
|
115
|
+
'avatar' | 'initials' | 'loadImage' | 'iconSVG'
|
|
116
|
+
>
|
|
107
117
|
|
|
108
118
|
const propTypes: PropValidators<PropKeys> = {
|
|
109
119
|
name: PropTypes.string.isRequired,
|
|
@@ -128,12 +138,14 @@ const propTypes: PropValidators<PropKeys> = {
|
|
|
128
138
|
'licorice',
|
|
129
139
|
'ash'
|
|
130
140
|
]),
|
|
141
|
+
hasInverseColor: PropTypes.bool,
|
|
131
142
|
shape: PropTypes.oneOf(['circle', 'rectangle']),
|
|
132
143
|
margin: ThemeablePropTypes.spacing,
|
|
133
144
|
display: PropTypes.oneOf(['inline-block', 'block']),
|
|
134
145
|
onImageLoaded: PropTypes.func,
|
|
135
146
|
as: PropTypes.elementType,
|
|
136
|
-
elementRef: PropTypes.func
|
|
147
|
+
elementRef: PropTypes.func,
|
|
148
|
+
renderIcon: PropTypes.oneOfType([PropTypes.node, PropTypes.func])
|
|
137
149
|
}
|
|
138
150
|
|
|
139
151
|
const allowedProps: AllowedPropKeys = [
|
|
@@ -142,12 +154,14 @@ const allowedProps: AllowedPropKeys = [
|
|
|
142
154
|
'alt',
|
|
143
155
|
'size',
|
|
144
156
|
'color',
|
|
157
|
+
'hasInverseColor',
|
|
145
158
|
'shape',
|
|
146
159
|
'margin',
|
|
147
160
|
'display',
|
|
148
161
|
'onImageLoaded',
|
|
149
162
|
'as',
|
|
150
|
-
'elementRef'
|
|
163
|
+
'elementRef',
|
|
164
|
+
'renderIcon'
|
|
151
165
|
]
|
|
152
166
|
|
|
153
167
|
export type { AvatarProps, AvatarStyle }
|
package/src/Avatar/styles.ts
CHANGED
|
@@ -40,7 +40,7 @@ const generateStyle = (
|
|
|
40
40
|
props: AvatarProps,
|
|
41
41
|
state: AvatarState
|
|
42
42
|
): AvatarStyle => {
|
|
43
|
-
const { size, color, shape, src } = props
|
|
43
|
+
const { size, color, hasInverseColor, shape, src } = props
|
|
44
44
|
const { loaded } = state
|
|
45
45
|
|
|
46
46
|
const sizeStyles = {
|
|
@@ -90,7 +90,7 @@ const generateStyle = (
|
|
|
90
90
|
}
|
|
91
91
|
}
|
|
92
92
|
|
|
93
|
-
const
|
|
93
|
+
const colorVariants = {
|
|
94
94
|
default: componentTheme.color, // = brand
|
|
95
95
|
shamrock: componentTheme.colorShamrock,
|
|
96
96
|
barney: componentTheme.colorBarney,
|
|
@@ -100,12 +100,20 @@ const generateStyle = (
|
|
|
100
100
|
ash: componentTheme.colorAsh
|
|
101
101
|
}
|
|
102
102
|
|
|
103
|
+
const backgroundColor = hasInverseColor
|
|
104
|
+
? colorVariants[color]
|
|
105
|
+
: componentTheme.background
|
|
106
|
+
|
|
107
|
+
const contentColor = hasInverseColor
|
|
108
|
+
? componentTheme.background
|
|
109
|
+
: colorVariants[color]
|
|
110
|
+
|
|
103
111
|
return {
|
|
104
112
|
avatar: {
|
|
105
113
|
label: 'avatar',
|
|
106
114
|
height: '2.5em',
|
|
107
115
|
boxSizing: 'border-box',
|
|
108
|
-
backgroundColor:
|
|
116
|
+
backgroundColor: backgroundColor,
|
|
109
117
|
backgroundPosition: 'center',
|
|
110
118
|
backgroundSize: 'cover',
|
|
111
119
|
backgroundClip: 'content-box',
|
|
@@ -124,12 +132,17 @@ const generateStyle = (
|
|
|
124
132
|
: {
|
|
125
133
|
backgroundImage: undefined,
|
|
126
134
|
borderStyle: 'solid',
|
|
127
|
-
borderColor: componentTheme.borderColor
|
|
135
|
+
borderColor: componentTheme.borderColor,
|
|
136
|
+
...(hasInverseColor && {
|
|
137
|
+
border: 0,
|
|
138
|
+
padding: sizeStyles[size].borderWidth,
|
|
139
|
+
backgroundClip: 'border-box'
|
|
140
|
+
})
|
|
128
141
|
})
|
|
129
142
|
},
|
|
130
143
|
initials: {
|
|
131
144
|
label: 'avatar__initials',
|
|
132
|
-
color:
|
|
145
|
+
color: contentColor,
|
|
133
146
|
lineHeight: '2.375em',
|
|
134
147
|
fontFamily: componentTheme.fontFamily,
|
|
135
148
|
fontWeight: componentTheme.fontWeight,
|
|
@@ -138,6 +151,20 @@ const generateStyle = (
|
|
|
138
151
|
loadImage: {
|
|
139
152
|
label: 'avatar__loadImage',
|
|
140
153
|
display: 'none'
|
|
154
|
+
},
|
|
155
|
+
iconSVG: {
|
|
156
|
+
label: 'avatar__iconSVG',
|
|
157
|
+
display: 'flex',
|
|
158
|
+
alignItems: 'center',
|
|
159
|
+
justifyContent: 'center',
|
|
160
|
+
height: '100%',
|
|
161
|
+
width: '100%',
|
|
162
|
+
|
|
163
|
+
svg: {
|
|
164
|
+
fill: contentColor,
|
|
165
|
+
height: '1em',
|
|
166
|
+
width: '1em'
|
|
167
|
+
}
|
|
141
168
|
}
|
|
142
169
|
}
|
|
143
170
|
}
|
|
@@ -1,11 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
src: (string | null)[];
|
|
5
|
-
};
|
|
6
|
-
getComponentProps: (_props: any) => {
|
|
7
|
-
name: string;
|
|
8
|
-
};
|
|
9
|
-
};
|
|
1
|
+
import type { StoryConfig } from '@instructure/ui-test-utils';
|
|
2
|
+
import type { AvatarProps } from '../props';
|
|
3
|
+
declare const _default: StoryConfig<AvatarProps>;
|
|
10
4
|
export default _default;
|
|
11
5
|
//# sourceMappingURL=Avatar.examples.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.examples.d.ts","sourceRoot":"","sources":["../../../src/Avatar/__examples__/Avatar.examples.
|
|
1
|
+
{"version":3,"file":"Avatar.examples.d.ts","sourceRoot":"","sources":["../../../src/Avatar/__examples__/Avatar.examples.tsx"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAA;AAE7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;;AAE3C,wBAoC6B"}
|
package/types/Avatar/index.d.ts
CHANGED
|
@@ -12,45 +12,38 @@ declare class Avatar extends Component<AvatarProps, AvatarState> {
|
|
|
12
12
|
static readonly componentId = "Avatar";
|
|
13
13
|
static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
|
|
14
14
|
name: string;
|
|
15
|
-
/**
|
|
16
|
-
---
|
|
17
|
-
category: components
|
|
18
|
-
---
|
|
19
|
-
@tsProps
|
|
20
|
-
**/
|
|
21
15
|
src?: string | undefined;
|
|
22
16
|
alt?: string | undefined;
|
|
23
17
|
size: "auto" | "xx-small" | "x-small" | "small" | "medium" | "large" | "x-large" | "xx-large";
|
|
24
18
|
color: "default" | "shamrock" | "barney" | "crimson" | "fire" | "licorice" | "ash";
|
|
19
|
+
hasInverseColor?: boolean | undefined;
|
|
25
20
|
shape: "circle" | "rectangle";
|
|
26
21
|
display: "inline-block" | "block";
|
|
27
22
|
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
28
23
|
onImageLoaded: (event: SyntheticEvent<Element, Event>) => void;
|
|
29
24
|
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
30
25
|
elementRef?: ((element: Element | null) => void) | undefined;
|
|
26
|
+
renderIcon?: import("react").ReactNode | (() => import("react").ReactNode);
|
|
31
27
|
}>;
|
|
32
28
|
static allowedProps: readonly (keyof {
|
|
33
29
|
name: string;
|
|
34
|
-
/**
|
|
35
|
-
---
|
|
36
|
-
category: components
|
|
37
|
-
---
|
|
38
|
-
@tsProps
|
|
39
|
-
**/
|
|
40
30
|
src?: string | undefined;
|
|
41
31
|
alt?: string | undefined;
|
|
42
32
|
size: "auto" | "xx-small" | "x-small" | "small" | "medium" | "large" | "x-large" | "xx-large";
|
|
43
33
|
color: "default" | "shamrock" | "barney" | "crimson" | "fire" | "licorice" | "ash";
|
|
34
|
+
hasInverseColor?: boolean | undefined;
|
|
44
35
|
shape: "circle" | "rectangle";
|
|
45
36
|
display: "inline-block" | "block";
|
|
46
37
|
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
47
38
|
onImageLoaded: (event: SyntheticEvent<Element, Event>) => void;
|
|
48
39
|
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
49
40
|
elementRef?: ((element: Element | null) => void) | undefined;
|
|
41
|
+
renderIcon?: import("react").ReactNode | (() => import("react").ReactNode);
|
|
50
42
|
})[];
|
|
51
43
|
static defaultProps: {
|
|
52
44
|
readonly size: "medium";
|
|
53
45
|
readonly color: "default";
|
|
46
|
+
readonly hasInverseColor: false;
|
|
54
47
|
readonly shape: "circle";
|
|
55
48
|
readonly display: "inline-block";
|
|
56
49
|
readonly onImageLoaded: (_event: SyntheticEvent) => void;
|
|
@@ -65,6 +58,7 @@ declare class Avatar extends Component<AvatarProps, AvatarState> {
|
|
|
65
58
|
makeInitialsFromName(): string | undefined;
|
|
66
59
|
handleImageLoaded: (event: SyntheticEvent) => void;
|
|
67
60
|
renderInitials(): jsx.JSX.Element;
|
|
61
|
+
renderContent(): jsx.JSX.Element;
|
|
68
62
|
render(): jsx.JSX.Element;
|
|
69
63
|
}
|
|
70
64
|
export default Avatar;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Avatar/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAMjD,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAMrD,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAEvD;;;;;GAKG;AACH,cAEM,MAAO,SAAQ,SAAS,CAAC,WAAW,EAAE,WAAW,CAAC;IACtD,MAAM,CAAC,QAAQ,CAAC,WAAW,YAAW;IAEtC,MAAM,CAAC,SAAS
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Avatar/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAMjD,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAMrD,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAEvD;;;;;GAKG;AACH,cAEM,MAAO,SAAQ,SAAS,CAAC,WAAW,EAAE,WAAW,CAAC;IACtD,MAAM,CAAC,QAAQ,CAAC,WAAW,YAAW;IAEtC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;yCAMO,cAAc;MAC9B;IAEV,KAAK;;MAAoB;IAEzB,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAQ9B;IAED,iBAAiB;IAIjB,kBAAkB;IASlB,oBAAoB;IAmBpB,iBAAiB,UAAW,cAAc,UAGzC;IAED,cAAc;IAQd,aAAa;IAUb,MAAM;CAyBP;AAED,eAAe,MAAM,CAAA;AACrB,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
package/types/Avatar/props.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { SyntheticEvent } from 'react';
|
|
1
|
+
import React, { SyntheticEvent } from 'react';
|
|
2
2
|
import type { Spacing, WithStyleProps, ComponentStyle } from '@instructure/emotion';
|
|
3
3
|
import type { AsElementType, AvatarTheme, OtherHTMLAttributes, PropValidators } from '@instructure/shared-types';
|
|
4
4
|
declare type AvatarOwnProps = {
|
|
@@ -16,6 +16,10 @@ declare type AvatarOwnProps = {
|
|
|
16
16
|
alt?: string;
|
|
17
17
|
size: 'auto' | 'xx-small' | 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xx-large';
|
|
18
18
|
color: 'default' | 'shamrock' | 'barney' | 'crimson' | 'fire' | 'licorice' | 'ash';
|
|
19
|
+
/**
|
|
20
|
+
* In inverse color mode the background and text/icon colors are inverted
|
|
21
|
+
*/
|
|
22
|
+
hasInverseColor?: boolean;
|
|
19
23
|
shape: 'circle' | 'rectangle';
|
|
20
24
|
display: 'inline-block' | 'block';
|
|
21
25
|
/**
|
|
@@ -36,6 +40,10 @@ declare type AvatarOwnProps = {
|
|
|
36
40
|
* provides a reference to the underlying html root element
|
|
37
41
|
*/
|
|
38
42
|
elementRef?: (element: Element | null) => void;
|
|
43
|
+
/**
|
|
44
|
+
* An icon, or function that returns an icon that gets displayed. If the `src` prop is provided, `src` will have priority.
|
|
45
|
+
*/
|
|
46
|
+
renderIcon?: React.ReactNode | (() => React.ReactNode);
|
|
39
47
|
};
|
|
40
48
|
export declare type AvatarState = {
|
|
41
49
|
loaded: boolean;
|
|
@@ -43,7 +51,7 @@ export declare type AvatarState = {
|
|
|
43
51
|
declare type PropKeys = keyof AvatarOwnProps;
|
|
44
52
|
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
45
53
|
declare type AvatarProps = AvatarOwnProps & WithStyleProps<AvatarTheme, AvatarStyle> & OtherHTMLAttributes<AvatarOwnProps>;
|
|
46
|
-
declare type AvatarStyle = ComponentStyle<'avatar' | 'initials' | 'loadImage'>;
|
|
54
|
+
declare type AvatarStyle = ComponentStyle<'avatar' | 'initials' | 'loadImage' | 'iconSVG'>;
|
|
47
55
|
declare const propTypes: PropValidators<PropKeys>;
|
|
48
56
|
declare const allowedProps: AllowedPropKeys;
|
|
49
57
|
export type { AvatarProps, AvatarStyle };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Avatar/props.ts"],"names":[],"mappings":"AAwBA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Avatar/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAK7C,OAAO,KAAK,EACV,OAAO,EACP,cAAc,EACd,cAAc,EACf,MAAM,sBAAsB,CAAA;AAC7B,OAAO,KAAK,EACV,aAAa,EACb,WAAW,EACX,mBAAmB,EACnB,cAAc,EACf,MAAM,2BAA2B,CAAA;AAElC,aAAK,cAAc,GAAG;IACpB;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,EACA,MAAM,GACN,UAAU,GACV,SAAS,GACT,OAAO,GACP,QAAQ,GACR,OAAO,GACP,SAAS,GACT,UAAU,CAAA;IACd,KAAK,EACD,SAAS,GACT,UAAU,GACV,QAAQ,GACR,SAAS,GACT,MAAM,GACN,UAAU,GACV,KAAK,CAAA;IACT;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,KAAK,EAAE,QAAQ,GAAG,WAAW,CAAA;IAC7B,OAAO,EAAE,cAAc,GAAG,OAAO,CAAA;IACjC;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB;;OAEG;IACH,aAAa,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAA;IAC9C;;OAEG;IACH,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;IAC9C;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,MAAM,KAAK,CAAC,SAAS,CAAC,CAAA;CACvD,CAAA;AAED,oBAAY,WAAW,GAAG;IACxB,MAAM,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,cAAc,CAAA;AAEpC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,WAAW,GAAG,cAAc,GAC/B,cAAc,CAAC,WAAW,EAAE,WAAW,CAAC,GACxC,mBAAmB,CAAC,cAAc,CAAC,CAAA;AAErC,aAAK,WAAW,GAAG,cAAc,CAC/B,QAAQ,GAAG,UAAU,GAAG,WAAW,GAAG,SAAS,CAChD,CAAA;AAED,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA+BvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAcnB,CAAA;AAED,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,CAAA;AACxC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/Avatar/styles.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAEpE;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,mBACD,WAAW,SACpB,WAAW,SACX,WAAW,KACjB,
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/Avatar/styles.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAEpE;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,mBACD,WAAW,SACpB,WAAW,SACX,WAAW,KACjB,WAgIF,CAAA;AAED,eAAe,aAAa,CAAA"}
|
package/LICENSE.md
DELETED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: The MIT License (MIT)
|
|
3
|
-
category: Getting Started
|
|
4
|
-
order: 9
|
|
5
|
-
---
|
|
6
|
-
|
|
7
|
-
# The MIT License (MIT)
|
|
8
|
-
|
|
9
|
-
Copyright (c) 2015 Instructure, Inc.
|
|
10
|
-
|
|
11
|
-
**Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
12
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
13
|
-
in the Software without restriction, including without limitation the rights
|
|
14
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
15
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
16
|
-
furnished to do so, subject to the following conditions.**
|
|
17
|
-
|
|
18
|
-
The above copyright notice and this permission notice shall be included in all
|
|
19
|
-
copies or substantial portions of the Software.
|
|
20
|
-
|
|
21
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
22
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
23
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
24
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
25
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
26
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
27
|
-
SOFTWARE.
|