@zendeskgarden/react-avatars 9.0.0-next.0 → 9.0.0-next.10

package/dist/esm/types/index.js

@@ -0,0 +1,10 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+const SIZE = ['extraextrasmall', 'extrasmall', 'small', 'medium', 'large'];
+const STATUS = ['available', 'away', 'transfers', 'offline'];
+
+export { SIZE, STATUS };

package/dist/index.cjs.js

@@ -1,10 +1,9 @@
 /**
- * Copyright Zendesk, Inc.
- *
- * Use of this source code is governed under the Apache License, Version 2.0
- * found at http://www.apache.org/licenses/LICENSE-2.0.
- */
-
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
 'use strict';
 
 var React = require('react');
@@ -37,21 +36,6 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
 var styled__default = /*#__PURE__*/_interopDefault(styled);
 
-function _extends$4() {
-  _extends$4 = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends$4.apply(this, arguments);
-}
-
 var _g$1;
 function _extends$3() { _extends$3 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3.apply(this, arguments); }
 var SvgClockStroke$1 = function SvgClockStroke(props) {
@@ -138,7 +122,7 @@ const STATUS = ['available', 'away', 'transfers', 'offline'];
 const COMPONENT_ID$6 = 'avatars.text';
 const StyledText = styled__default.default.span.attrs({
   'data-garden-id': COMPONENT_ID$6,
-  'data-garden-version': '9.0.0-next.0'
+  'data-garden-version': '9.0.0-next.10'
 }).withConfig({
   displayName: "StyledText",
   componentId: "sc-1a6hivh-0"
@@ -152,15 +136,15 @@ const TRANSITION_DURATION = 0.25;
 function getStatusColor(type, theme) {
   switch (type) {
     case 'active':
-      return reactTheming.getColor('crimson', 400, theme);
+      return reactTheming.getColorV8('crimson', 400, theme);
     case 'available':
-      return reactTheming.getColor('mint', 400, theme);
+      return reactTheming.getColorV8('mint', 400, theme);
     case 'away':
-      return reactTheming.getColor('orange', 400, theme);
+      return reactTheming.getColorV8('orange', 400, theme);
     case 'transfers':
-      return reactTheming.getColor('azure', 400, theme);
+      return reactTheming.getColorV8('azure', 400, theme);
     case 'offline':
-      return reactTheming.getColor('grey', 500, theme);
+      return reactTheming.getColorV8('grey', 500, theme);
     default:
       return 'transparent';
   }
@@ -206,7 +190,7 @@ const colorStyles$2 = props => {
 };
 const StyledStatusIndicatorBase = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$5,
-  'data-garden-version': '9.0.0-next.0'
+  'data-garden-version': '9.0.0-next.10'
 }).withConfig({
   displayName: "StyledStatusIndicatorBase",
   componentId: "sc-1rininy-0"
@@ -237,7 +221,7 @@ const colorStyles$1 = props => {
     borderColor,
     surfaceColor
   } = props;
-  let boxShadow = theme.shadows.sm(surfaceColor || (type ? theme.colors.background : theme.palette.white));
+  let boxShadow = theme.shadows.sm(surfaceColor || (type ? reactTheming.getColorV8('background', 600 , theme) : theme.palette.white));
   if (size === xxs) {
     boxShadow = boxShadow.replace(theme.shadowWidths.sm, '1px');
   }
@@ -245,7 +229,7 @@ const colorStyles$1 = props => {
 };
 const StyledStatusIndicator = styled__default.default(StyledStatusIndicatorBase).attrs({
   'data-garden-id': COMPONENT_ID$4,
-  'data-garden-version': '9.0.0-next.0'
+  'data-garden-version': '9.0.0-next.10'
 }).withConfig({
   displayName: "StyledStatusIndicator",
   componentId: "sc-16t9if3-0"
@@ -277,7 +261,7 @@ const colorStyles = props => {
   const statusColor = getStatusColor(props.status, props.theme);
   const backgroundColor = props.backgroundColor || 'transparent';
   const foregroundColor = props.foregroundColor || props.theme.palette.white;
-  const surfaceColor = props.status ? props.surfaceColor || props.theme.colors.background : 'transparent';
+  const surfaceColor = props.status ? props.surfaceColor || reactTheming.getColorV8('background', 600 , props.theme) : 'transparent';
   return styled.css(["box-shadow:", ";background-color:", ";color:", ";& > svg,& ", "{color:", ";}"], props.theme.shadows.sm(statusColor), backgroundColor, surfaceColor, StyledText, foregroundColor);
 };
 const sizeStyles$1 = props => {
@@ -321,7 +305,7 @@ const sizeStyles$1 = props => {
 };
 const StyledAvatar = styled__default.default.figure.attrs({
   'data-garden-id': COMPONENT_ID$3,
-  'data-garden-version': '9.0.0-next.0'
+  'data-garden-version': '9.0.0-next.10'
 }).withConfig({
   displayName: "StyledAvatar",
   componentId: "sc-608m04-0"
@@ -334,7 +318,7 @@ StyledAvatar.defaultProps = {
 const COMPONENT_ID$2 = 'avatars.status-indicator.status';
 const StyledStandaloneStatus = styled__default.default.figure.attrs({
   'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '9.0.0-next.0'
+  'data-garden-version': '9.0.0-next.10'
 }).withConfig({
   displayName: "StyledStandaloneStatus",
   componentId: "sc-1ow4nfj-0"
@@ -350,7 +334,7 @@ function sizeStyles(props) {
 }
 const StyledStandaloneStatusCaption = styled__default.default.figcaption.attrs({
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '9.0.0-next.0'
+  'data-garden-version': '9.0.0-next.10'
 }).withConfig({
   displayName: "StyledStandaloneStatusCaption",
   componentId: "sc-aalyk1-0"
@@ -362,7 +346,7 @@ StyledStandaloneStatusCaption.defaultProps = {
 const COMPONENT_ID = 'avatars.status-indicator.indicator';
 const StyledStandaloneStatusIndicator = styled__default.default(StyledStatusIndicatorBase).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.0'
+  'data-garden-version': '9.0.0-next.10'
 }).withConfig({
   displayName: "StyledStandaloneStatusIndicator",
   componentId: "sc-1xt1heq-0"
@@ -372,7 +356,7 @@ StyledStandaloneStatusIndicator.defaultProps = {
   theme: reactTheming.DEFAULT_THEME
 };
 
-const TextComponent = React.forwardRef((props, ref) => React__namespace.default.createElement(StyledText, _extends$4({
+const TextComponent = React.forwardRef((props, ref) => React__namespace.default.createElement(StyledText, Object.assign({
   ref: ref
 }, props)));
 TextComponent.displayName = 'Avatar.Text';
@@ -407,7 +391,7 @@ const AvatarComponent = React.forwardRef((_ref, ref) => {
   }, [computedStatus, badge]);
   const shouldValidate = computedStatus !== undefined;
   const statusLabel = reactTheming.useText(AvatarComponent, props, 'statusLabel', defaultStatusLabel, shouldValidate);
-  return React__namespace.default.createElement(StyledAvatar, _extends$4({
+  return React__namespace.default.createElement(StyledAvatar, Object.assign({
     ref: ref,
     isSystem: isSystem,
     size: size,
@@ -467,7 +451,7 @@ const StatusIndicator = React.forwardRef((_ref, ref) => {
     'aria-label': label
   }, 'aria-label', defaultLabel);
   return (
-    React__namespace.default.createElement(StyledStandaloneStatus, _extends$4({
+    React__namespace.default.createElement(StyledStandaloneStatus, Object.assign({
       role: "status",
       ref: ref
     }, props), React__namespace.default.createElement(StyledStandaloneStatusIndicator, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zendeskgarden/react-avatars",
-  "version": "9.0.0-next.0",
+  "version": "9.0.0-next.10",
   "description": "Components relating to avatars in the Garden Design System",
   "license": "Apache-2.0",
   "author": "Zendesk Garden <garden@zendesk.com>",
@@ -10,7 +10,7 @@
     "url": "https://github.com/zendeskgarden/react-components/issues"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.esm.js",
+  "module": "dist/esm/index.js",
   "files": [
     "dist"
   ],
@@ -25,13 +25,13 @@
     "prop-types": "^15.5.7"
   },
   "peerDependencies": {
-    "@zendeskgarden/react-theming": "^8.65.0",
+    "@zendeskgarden/react-theming": ">=9.0.0-next",
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
-    "styled-components": "^4.2.0 || ^5.0.0"
+    "styled-components": "^5.3.1"
   },
   "devDependencies": {
-    "@zendeskgarden/react-theming": "^9.0.0-next.0",
+    "@zendeskgarden/react-theming": "^9.0.0-next.10",
     "@zendeskgarden/svg-icons": "7.0.0"
   },
   "keywords": [
@@ -44,5 +44,5 @@
     "access": "public"
   },
   "zendeskgarden:src": "src/index.ts",
-  "gitHead": "7145e970afa57b024ab7d505f2220a656e430c04"
+  "gitHead": "818e6100aa6676af7e972198b82516d330307d60"
 }