@zendeskgarden/react-avatars 8.47.0 → 8.48.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs.js
CHANGED
|
@@ -76,9 +76,9 @@ function _objectWithoutProperties(source, excluded) {
|
|
|
76
76
|
}
|
|
77
77
|
|
|
78
78
|
var COMPONENT_ID$1 = 'avatars.text';
|
|
79
|
-
var StyledText = styled__default[
|
|
79
|
+
var StyledText = styled__default["default"].span.attrs({
|
|
80
80
|
'data-garden-id': COMPONENT_ID$1,
|
|
81
|
-
'data-garden-version': '8.
|
|
81
|
+
'data-garden-version': '8.48.1'
|
|
82
82
|
}).withConfig({
|
|
83
83
|
displayName: "StyledText",
|
|
84
84
|
componentId: "sc-1a6hivh-0"
|
|
@@ -203,9 +203,9 @@ var sizeStyles = function sizeStyles(props) {
|
|
|
203
203
|
}
|
|
204
204
|
return styled.css(["border-radius:", ";width:", " !important;height:", " !important;::before{box-shadow:", ";}& > svg{font-size:", ";}& ", "{line-height:", ";font-size:", ";}"], borderRadius, size, size, boxShadow, svgSize, StyledText, size, fontSize);
|
|
205
205
|
};
|
|
206
|
-
var StyledAvatar = styled__default[
|
|
206
|
+
var StyledAvatar = styled__default["default"].figure.attrs({
|
|
207
207
|
'data-garden-id': COMPONENT_ID,
|
|
208
|
-
'data-garden-version': '8.
|
|
208
|
+
'data-garden-version': '8.48.1'
|
|
209
209
|
}).withConfig({
|
|
210
210
|
displayName: "StyledAvatar",
|
|
211
211
|
componentId: "sc-608m04-0"
|
|
@@ -223,8 +223,16 @@ StyledAvatar.defaultProps = {
|
|
|
223
223
|
theme: reactTheming.DEFAULT_THEME
|
|
224
224
|
};
|
|
225
225
|
|
|
226
|
+
var TextComponent = React.forwardRef(function (props, ref) {
|
|
227
|
+
return React__default["default"].createElement(StyledText, _extends({
|
|
228
|
+
ref: ref
|
|
229
|
+
}, props));
|
|
230
|
+
});
|
|
231
|
+
TextComponent.displayName = 'Avatar.Text';
|
|
232
|
+
var Text = TextComponent;
|
|
233
|
+
|
|
226
234
|
var _excluded = ["isSystem", "size", "status", "children", "badge", "surfaceColor", "backgroundColor", "foregroundColor"];
|
|
227
|
-
var
|
|
235
|
+
var AvatarComponent = React.forwardRef(function (_ref, ref) {
|
|
228
236
|
var isSystem = _ref.isSystem,
|
|
229
237
|
size = _ref.size,
|
|
230
238
|
status = _ref.status,
|
|
@@ -235,7 +243,7 @@ var Avatar = React__default['default'].forwardRef(function (_ref, ref) {
|
|
|
235
243
|
foregroundColor = _ref.foregroundColor,
|
|
236
244
|
other = _objectWithoutProperties(_ref, _excluded);
|
|
237
245
|
var computedStatus = badge === undefined ? status : 'active';
|
|
238
|
-
return React__default[
|
|
246
|
+
return React__default["default"].createElement(StyledAvatar, _extends({
|
|
239
247
|
ref: ref,
|
|
240
248
|
isSystem: isSystem,
|
|
241
249
|
size: size,
|
|
@@ -248,19 +256,20 @@ var Avatar = React__default['default'].forwardRef(function (_ref, ref) {
|
|
|
248
256
|
"aria-live": "polite"
|
|
249
257
|
}, other), React.Children.only(children));
|
|
250
258
|
});
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
backgroundColor: PropTypes__default[
|
|
254
|
-
foregroundColor: PropTypes__default[
|
|
255
|
-
surfaceColor: PropTypes__default[
|
|
256
|
-
isSystem: PropTypes__default[
|
|
257
|
-
badge: PropTypes__default[
|
|
258
|
-
size: PropTypes__default[
|
|
259
|
-
status: PropTypes__default[
|
|
259
|
+
AvatarComponent.displayName = 'Avatar';
|
|
260
|
+
AvatarComponent.propTypes = {
|
|
261
|
+
backgroundColor: PropTypes__default["default"].string,
|
|
262
|
+
foregroundColor: PropTypes__default["default"].string,
|
|
263
|
+
surfaceColor: PropTypes__default["default"].string,
|
|
264
|
+
isSystem: PropTypes__default["default"].bool,
|
|
265
|
+
badge: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
|
|
266
|
+
size: PropTypes__default["default"].oneOf(['extraextrasmall', 'extrasmall', 'small', 'medium', 'large']),
|
|
267
|
+
status: PropTypes__default["default"].oneOf(['available', 'away'])
|
|
260
268
|
};
|
|
261
|
-
|
|
269
|
+
AvatarComponent.defaultProps = {
|
|
262
270
|
size: 'medium'
|
|
263
271
|
};
|
|
264
|
-
Avatar
|
|
272
|
+
var Avatar = AvatarComponent;
|
|
273
|
+
Avatar.Text = Text;
|
|
265
274
|
|
|
266
275
|
exports.Avatar = Avatar;
|
package/dist/index.esm.js
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
|
|
8
|
-
import React, { Children } from 'react';
|
|
8
|
+
import React, { forwardRef, Children } from 'react';
|
|
9
9
|
import PropTypes from 'prop-types';
|
|
10
10
|
import styled, { css, keyframes } from 'styled-components';
|
|
11
11
|
import { math } from 'polished';
|
|
@@ -68,7 +68,7 @@ function _objectWithoutProperties(source, excluded) {
|
|
|
68
68
|
var COMPONENT_ID$1 = 'avatars.text';
|
|
69
69
|
var StyledText = styled.span.attrs({
|
|
70
70
|
'data-garden-id': COMPONENT_ID$1,
|
|
71
|
-
'data-garden-version': '8.
|
|
71
|
+
'data-garden-version': '8.48.1'
|
|
72
72
|
}).withConfig({
|
|
73
73
|
displayName: "StyledText",
|
|
74
74
|
componentId: "sc-1a6hivh-0"
|
|
@@ -195,7 +195,7 @@ var sizeStyles = function sizeStyles(props) {
|
|
|
195
195
|
};
|
|
196
196
|
var StyledAvatar = styled.figure.attrs({
|
|
197
197
|
'data-garden-id': COMPONENT_ID,
|
|
198
|
-
'data-garden-version': '8.
|
|
198
|
+
'data-garden-version': '8.48.1'
|
|
199
199
|
}).withConfig({
|
|
200
200
|
displayName: "StyledAvatar",
|
|
201
201
|
componentId: "sc-608m04-0"
|
|
@@ -213,8 +213,16 @@ StyledAvatar.defaultProps = {
|
|
|
213
213
|
theme: DEFAULT_THEME
|
|
214
214
|
};
|
|
215
215
|
|
|
216
|
+
var TextComponent = forwardRef(function (props, ref) {
|
|
217
|
+
return React.createElement(StyledText, _extends({
|
|
218
|
+
ref: ref
|
|
219
|
+
}, props));
|
|
220
|
+
});
|
|
221
|
+
TextComponent.displayName = 'Avatar.Text';
|
|
222
|
+
var Text = TextComponent;
|
|
223
|
+
|
|
216
224
|
var _excluded = ["isSystem", "size", "status", "children", "badge", "surfaceColor", "backgroundColor", "foregroundColor"];
|
|
217
|
-
var
|
|
225
|
+
var AvatarComponent = forwardRef(function (_ref, ref) {
|
|
218
226
|
var isSystem = _ref.isSystem,
|
|
219
227
|
size = _ref.size,
|
|
220
228
|
status = _ref.status,
|
|
@@ -238,8 +246,8 @@ var Avatar = React.forwardRef(function (_ref, ref) {
|
|
|
238
246
|
"aria-live": "polite"
|
|
239
247
|
}, other), Children.only(children));
|
|
240
248
|
});
|
|
241
|
-
|
|
242
|
-
|
|
249
|
+
AvatarComponent.displayName = 'Avatar';
|
|
250
|
+
AvatarComponent.propTypes = {
|
|
243
251
|
backgroundColor: PropTypes.string,
|
|
244
252
|
foregroundColor: PropTypes.string,
|
|
245
253
|
surfaceColor: PropTypes.string,
|
|
@@ -248,9 +256,10 @@ Avatar.propTypes = {
|
|
|
248
256
|
size: PropTypes.oneOf(['extraextrasmall', 'extrasmall', 'small', 'medium', 'large']),
|
|
249
257
|
status: PropTypes.oneOf(['available', 'away'])
|
|
250
258
|
};
|
|
251
|
-
|
|
259
|
+
AvatarComponent.defaultProps = {
|
|
252
260
|
size: 'medium'
|
|
253
261
|
};
|
|
254
|
-
Avatar
|
|
262
|
+
var Avatar = AvatarComponent;
|
|
263
|
+
Avatar.Text = Text;
|
|
255
264
|
|
|
256
265
|
export { Avatar };
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import React, { HTMLAttributes } from 'react';
|
|
8
|
-
import {
|
|
8
|
+
import { Text } from './components/Text';
|
|
9
9
|
export interface IAvatarProps extends HTMLAttributes<HTMLElement> {
|
|
10
10
|
/** Sets the avatar background color */
|
|
11
11
|
backgroundColor?: string;
|
|
@@ -22,10 +22,9 @@ export interface IAvatarProps extends HTMLAttributes<HTMLElement> {
|
|
|
22
22
|
/** Sets the badge text and applies active styling */
|
|
23
23
|
badge?: string | number;
|
|
24
24
|
}
|
|
25
|
-
declare const _default: React.FunctionComponent<IAvatarProps & React.RefAttributes<HTMLElement>> & {
|
|
26
|
-
Text: typeof StyledText;
|
|
27
|
-
};
|
|
28
25
|
/**
|
|
29
26
|
* @extends HTMLAttributes<HTMLElement>
|
|
30
27
|
*/
|
|
31
|
-
export
|
|
28
|
+
export declare const Avatar: React.ForwardRefExoticComponent<IAvatarProps & React.RefAttributes<HTMLElement>> & {
|
|
29
|
+
Text: typeof Text;
|
|
30
|
+
};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright Zendesk, Inc.
|
|
3
|
+
*
|
|
4
|
+
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
|
+
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
+
*/
|
|
7
|
+
import React from 'react';
|
|
8
|
+
/**
|
|
9
|
+
* @extends HTMLAttributes<HTMLSpanElement>
|
|
10
|
+
*/
|
|
11
|
+
export declare const Text: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
|
package/dist/typings/index.d.ts
CHANGED
|
@@ -4,5 +4,5 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
export {
|
|
7
|
+
export { Avatar } from './elements/Avatar';
|
|
8
8
|
export type { IAvatarProps } from './elements/Avatar';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zendeskgarden/react-avatars",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.48.1",
|
|
4
4
|
"description": "Components relating to avatars in the Garden Design System",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "Zendesk Garden <garden@zendesk.com>",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"styled-components": "^4.2.0 || ^5.0.0"
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|
|
34
|
-
"@zendeskgarden/react-theming": "^8.
|
|
34
|
+
"@zendeskgarden/react-theming": "^8.48.1"
|
|
35
35
|
},
|
|
36
36
|
"keywords": [
|
|
37
37
|
"components",
|
|
@@ -43,5 +43,5 @@
|
|
|
43
43
|
"access": "public"
|
|
44
44
|
},
|
|
45
45
|
"zendeskgarden:src": "src/index.ts",
|
|
46
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "82c621bfbc943904baa6647a2f5e89d3271d7edf"
|
|
47
47
|
}
|