@zendeskgarden/react-avatars 9.3.0 → 9.5.0

package/dist/esm/styled/StyledAvatar.js

@@ -5,7 +5,7 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled, { keyframes, css } from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME, getColor } from '@zendeskgarden/react-theming';
+import { componentStyles, DEFAULT_THEME, getColor } from '@zendeskgarden/react-theming';
 import { math } from 'polished';
 import { SIZE } from '../types/index.js';
 import { StyledText } from './StyledText.js';
@@ -108,11 +108,11 @@ const sizeStyles = props => {
 };
 const StyledAvatar = styled.figure.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledAvatar",
   componentId: "sc-608m04-0"
-})(["display:inline-flex;position:relative;align-items:center;justify-content:center;transition:box-shadow ", "s ease-in-out,color 0.1s ease-in-out;margin:0;vertical-align:middle;box-sizing:border-box;", ";", ";&::before{position:absolute;top:0;left:0;transition:box-shadow ", "s ease-in-out;content:'';}&::before,&& > img{border-radius:inherit;width:100%;height:100%;}&& > img{box-sizing:inherit;vertical-align:bottom;object-fit:cover;}&& > svg{width:1em;height:1em;}& > ", "{", ";}", ";"], TRANSITION_DURATION, props => sizeStyles(props), props => colorStyles(props), TRANSITION_DURATION, StyledStatusIndicator, badgeStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
+})(["display:inline-flex;position:relative;align-items:center;justify-content:center;transition:box-shadow ", "s ease-in-out,color 0.1s ease-in-out;margin:0;vertical-align:middle;box-sizing:border-box;", ";", ";&::before{position:absolute;top:0;left:0;transition:box-shadow ", "s ease-in-out;content:'';}&::before,&& > img{border-radius:inherit;width:100%;height:100%;}&& > img{box-sizing:inherit;vertical-align:bottom;object-fit:cover;}&& > svg{width:1em;height:1em;}& > ", "{", ";}", ";"], TRANSITION_DURATION, props => sizeStyles(props), props => colorStyles(props), TRANSITION_DURATION, StyledStatusIndicator, badgeStyles, componentStyles);
 StyledAvatar.defaultProps = {
   $size: 'medium',
   theme: DEFAULT_THEME

package/dist/esm/styled/StyledStandaloneStatus.js

@@ -5,16 +5,16 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled from 'styled-components';
-import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
+import { componentStyles } from '@zendeskgarden/react-theming';
 import { TRANSITION_DURATION } from './utility.js';
 
 const COMPONENT_ID = 'avatars.status-indicator.status';
 const StyledStandaloneStatus = styled.figure.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledStandaloneStatus",
   componentId: "sc-1ow4nfj-0"
-})(["display:inline-flex;flex-flow:row nowrap;transition:all ", "s ease-in-out;margin:0;box-sizing:content-box;", ";"], TRANSITION_DURATION, props => retrieveComponentStyles(COMPONENT_ID, props));
+})(["display:inline-flex;flex-flow:row nowrap;transition:all ", "s ease-in-out;margin:0;box-sizing:content-box;", ";"], TRANSITION_DURATION, componentStyles);
 
 export { StyledStandaloneStatus };

package/dist/esm/styled/StyledStandaloneStatusCaption.js

@@ -5,7 +5,7 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled, { css } from 'styled-components';
-import { retrieveComponentStyles, getLineHeight } from '@zendeskgarden/react-theming';
+import { componentStyles, getLineHeight } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'avatars.status-indicator.caption';
 function sizeStyles(props) {
@@ -14,10 +14,10 @@ function sizeStyles(props) {
 }
 const StyledStandaloneStatusCaption = styled.figcaption.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledStandaloneStatusCaption",
   componentId: "sc-aalyk1-0"
-})(["", " ", ";"], sizeStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
+})(["", " ", ";"], sizeStyles, componentStyles);
 
 export { StyledStandaloneStatusCaption };

package/dist/esm/styled/StyledStandaloneStatusIndicator.js

@@ -5,18 +5,18 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { componentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
 import { getStatusSize } from './utility.js';
 import { StyledStatusIndicatorBase } from './StyledStatusIndicatorBase.js';
 
 const COMPONENT_ID = 'avatars.status-indicator.indicator';
 const StyledStandaloneStatusIndicator = styled(StyledStatusIndicatorBase).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledStandaloneStatusIndicator",
   componentId: "sc-1xt1heq-0"
-})(["position:relative;box-sizing:content-box;margin-top:", ";", ";"], props => `calc((${props.theme.lineHeights.md} - ${getStatusSize(props, '0')}) / 2)`, props => retrieveComponentStyles(COMPONENT_ID, props));
+})(["position:relative;box-sizing:content-box;margin-top:", ";", ";"], props => `calc((${props.theme.lineHeights.md} - ${getStatusSize(props, '0')}) / 2)`, componentStyles);
 StyledStandaloneStatusIndicator.defaultProps = {
   $type: 'offline',
   theme: DEFAULT_THEME

package/dist/esm/styled/StyledStatusIndicator.js

@@ -5,7 +5,7 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled, { css } from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME, getColor } from '@zendeskgarden/react-theming';
+import { componentStyles, DEFAULT_THEME, getColor } from '@zendeskgarden/react-theming';
 import { math } from 'polished';
 import { SIZE } from '../types/index.js';
 import { StyledStatusIndicatorBase } from './StyledStatusIndicatorBase.js';
@@ -50,11 +50,11 @@ const colorStyles = _ref => {
 };
 const StyledStatusIndicator = styled(StyledStatusIndicatorBase).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledStatusIndicator",
   componentId: "sc-16t9if3-0"
-})(["", " ", " ", ";"], sizeStyles, colorStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
+})(["", " ", " ", ";"], sizeStyles, colorStyles, componentStyles);
 StyledStatusIndicator.defaultProps = {
   $size: 'medium',
   theme: DEFAULT_THEME

package/dist/esm/styled/StyledStatusIndicatorBase.js

@@ -5,7 +5,7 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled, { keyframes, css } from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME, getColor } from '@zendeskgarden/react-theming';
+import { componentStyles, DEFAULT_THEME, getColor } from '@zendeskgarden/react-theming';
 import { getStatusBorderOffset, getStatusSize, TRANSITION_DURATION, getStatusColor } from './utility.js';
 
 const COMPONENT_ID = 'avatars.status-indicator.base';
@@ -40,11 +40,11 @@ const colorStyles = _ref => {
 };
 const StyledStatusIndicatorBase = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledStatusIndicatorBase",
   componentId: "sc-1rininy-0"
-})(["transition:inherit;", " ", " ", ";"], sizeStyles, colorStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
+})(["transition:inherit;", " ", " ", ";"], sizeStyles, colorStyles, componentStyles);
 StyledStatusIndicatorBase.defaultProps = {
   theme: DEFAULT_THEME,
   $size: 'small'

package/dist/esm/styled/StyledText.js

@@ -5,15 +5,15 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled from 'styled-components';
-import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
+import { componentStyles } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'avatars.text';
 const StyledText = styled.span.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledText",
   componentId: "sc-1a6hivh-0"
-})(["overflow:hidden;text-align:center;white-space:nowrap;", ";"], props => retrieveComponentStyles(COMPONENT_ID, props));
+})(["overflow:hidden;text-align:center;white-space:nowrap;", ";"], componentStyles);
 
 export { StyledText };

package/dist/index.cjs.js

@@ -122,11 +122,11 @@ 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.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledText",
   componentId: "sc-1a6hivh-0"
-})(["overflow:hidden;text-align:center;white-space:nowrap;", ";"], props => reactTheming.retrieveComponentStyles(COMPONENT_ID$6, props));
+})(["overflow:hidden;text-align:center;white-space:nowrap;", ";"], reactTheming.componentStyles);
 
 const [xxs$1, xs$1, s$1, m$1, l$1] = SIZE;
 const TRANSITION_DURATION = 0.25;
@@ -242,11 +242,11 @@ const colorStyles$2 = _ref => {
 };
 const StyledStatusIndicatorBase = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$5,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledStatusIndicatorBase",
   componentId: "sc-1rininy-0"
-})(["transition:inherit;", " ", " ", ";"], sizeStyles$3, colorStyles$2, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$5, props));
+})(["transition:inherit;", " ", " ", ";"], sizeStyles$3, colorStyles$2, reactTheming.componentStyles);
 StyledStatusIndicatorBase.defaultProps = {
   theme: reactTheming.DEFAULT_THEME,
   $size: 'small'
@@ -291,11 +291,11 @@ const colorStyles$1 = _ref => {
 };
 const StyledStatusIndicator = styled__default.default(StyledStatusIndicatorBase).attrs({
   'data-garden-id': COMPONENT_ID$4,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledStatusIndicator",
   componentId: "sc-16t9if3-0"
-})(["", " ", " ", ";"], sizeStyles$2, colorStyles$1, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$4, props));
+})(["", " ", " ", ";"], sizeStyles$2, colorStyles$1, reactTheming.componentStyles);
 StyledStatusIndicator.defaultProps = {
   $size: 'medium',
   theme: reactTheming.DEFAULT_THEME
@@ -397,11 +397,11 @@ const sizeStyles$1 = props => {
 };
 const StyledAvatar = styled__default.default.figure.attrs({
   'data-garden-id': COMPONENT_ID$3,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledAvatar",
   componentId: "sc-608m04-0"
-})(["display:inline-flex;position:relative;align-items:center;justify-content:center;transition:box-shadow ", "s ease-in-out,color 0.1s ease-in-out;margin:0;vertical-align:middle;box-sizing:border-box;", ";", ";&::before{position:absolute;top:0;left:0;transition:box-shadow ", "s ease-in-out;content:'';}&::before,&& > img{border-radius:inherit;width:100%;height:100%;}&& > img{box-sizing:inherit;vertical-align:bottom;object-fit:cover;}&& > svg{width:1em;height:1em;}& > ", "{", ";}", ";"], TRANSITION_DURATION, props => sizeStyles$1(props), props => colorStyles(props), TRANSITION_DURATION, StyledStatusIndicator, badgeStyles, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$3, props));
+})(["display:inline-flex;position:relative;align-items:center;justify-content:center;transition:box-shadow ", "s ease-in-out,color 0.1s ease-in-out;margin:0;vertical-align:middle;box-sizing:border-box;", ";", ";&::before{position:absolute;top:0;left:0;transition:box-shadow ", "s ease-in-out;content:'';}&::before,&& > img{border-radius:inherit;width:100%;height:100%;}&& > img{box-sizing:inherit;vertical-align:bottom;object-fit:cover;}&& > svg{width:1em;height:1em;}& > ", "{", ";}", ";"], TRANSITION_DURATION, props => sizeStyles$1(props), props => colorStyles(props), TRANSITION_DURATION, StyledStatusIndicator, badgeStyles, reactTheming.componentStyles);
 StyledAvatar.defaultProps = {
   $size: 'medium',
   theme: reactTheming.DEFAULT_THEME
@@ -410,11 +410,11 @@ 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.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledStandaloneStatus",
   componentId: "sc-1ow4nfj-0"
-})(["display:inline-flex;flex-flow:row nowrap;transition:all ", "s ease-in-out;margin:0;box-sizing:content-box;", ";"], TRANSITION_DURATION, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$2, props));
+})(["display:inline-flex;flex-flow:row nowrap;transition:all ", "s ease-in-out;margin:0;box-sizing:content-box;", ";"], TRANSITION_DURATION, reactTheming.componentStyles);
 
 const COMPONENT_ID$1 = 'avatars.status-indicator.caption';
 function sizeStyles(props) {
@@ -423,20 +423,20 @@ function sizeStyles(props) {
 }
 const StyledStandaloneStatusCaption = styled__default.default.figcaption.attrs({
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledStandaloneStatusCaption",
   componentId: "sc-aalyk1-0"
-})(["", " ", ";"], sizeStyles, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$1, props));
+})(["", " ", ";"], sizeStyles, reactTheming.componentStyles);
 
 const COMPONENT_ID = 'avatars.status-indicator.indicator';
 const StyledStandaloneStatusIndicator = styled__default.default(StyledStatusIndicatorBase).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.3.0'
+  'data-garden-version': '9.5.0'
 }).withConfig({
   displayName: "StyledStandaloneStatusIndicator",
   componentId: "sc-1xt1heq-0"
-})(["position:relative;box-sizing:content-box;margin-top:", ";", ";"], props => `calc((${props.theme.lineHeights.md} - ${getStatusSize(props, '0')}) / 2)`, props => reactTheming.retrieveComponentStyles(COMPONENT_ID, props));
+})(["position:relative;box-sizing:content-box;margin-top:", ";", ";"], props => `calc((${props.theme.lineHeights.md} - ${getStatusSize(props, '0')}) / 2)`, reactTheming.componentStyles);
 StyledStandaloneStatusIndicator.defaultProps = {
   $type: 'offline',
   theme: reactTheming.DEFAULT_THEME

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zendeskgarden/react-avatars",
-  "version": "9.3.0",
+  "version": "9.5.0",
   "description": "Components relating to avatars in the Garden Design System",
   "license": "Apache-2.0",
   "author": "Zendesk Garden <garden@zendesk.com>",
@@ -31,9 +31,9 @@
     "styled-components": "^5.3.1 || ^6.0.0"
   },
   "devDependencies": {
-    "@zendeskgarden/react-dropdowns": "^9.3.0",
-    "@zendeskgarden/react-theming": "^9.3.0",
-    "@zendeskgarden/svg-icons": "7.3.0"
+    "@zendeskgarden/react-dropdowns": "^9.5.0",
+    "@zendeskgarden/react-theming": "^9.5.0",
+    "@zendeskgarden/svg-icons": "7.5.0"
   },
   "keywords": [
     "components",
@@ -45,5 +45,5 @@
     "access": "public"
   },
   "zendeskgarden:src": "src/index.ts",
-  "gitHead": "fa6461e0d9fae27956980056006e8013daedc6b9"
+  "gitHead": "43546784a9aa985332ddcc6dd09209a11e2c03ff"
 }