@procore/core-react 12.30.0 → 12.32.0

package/CHANGELOG.md

@@ -1,5 +1,33 @@
 # Change Log
 
+## 12.32.0
+
+### Minor Changes
+
+- 9a1d3c4: Add settingsLink prop to ToolLandingPage.Title for client-side routing support while deprecating settingsHref
+- c8dad86: Basic Form.RichText textEditorComponent for migration. Will be required in v13.
+
+### Patch Changes
+
+- Updated dependencies [cbc7f68]
+- Updated dependencies [8112072]
+  - @procore/core-i18n-js@10.30.0
+  - @procore/core-icons@12.11.0
+
+## 12.31.0
+
+### Minor Changes
+
+- 129f3d0: Add support for new locales: Italian, Portuguese, Traditional Chinese (Taiwan) and Norwegian (Norway)
+- bcd2d3c: Adding in exports for internal template components as `UNSAFE_PageTemplate`
+- 83eeb39: Exposed `MenuImperative` as the export, deprecated `UNSAFE_MENU`
+
+### Patch Changes
+
+- c68e49f: Click `DropdownFlyout` when it's open, close it
+- 70ca908: Layout Cards like DetailPage.Card refreshes the anchor nav label on navigationLabel prop change
+- f95beb2: Add unsafe internal temporary helper exports to support migration to separate TextEditor package.
+
 ## 12.30.0
 
 ### Minor Changes

package/dist/AnchorNavigation/AnchorNavigation.styles.js

@@ -5,11 +5,11 @@ import { getEllipsis } from '../_styles/mixins';
 import { spacing } from '../_styles/spacing';
 export var StyledAnchorNavigation = /*#__PURE__*/styled.ul.withConfig({
   displayName: "StyledAnchorNavigation",
-  componentId: "core-12_30_0__sc-aacdj4-0"
+  componentId: "core-12_32_0__sc-aacdj4-0"
 })(["max-width:200px;margin:0;padding-inline-start:0;"]);
 export var StyledAnchorSection = /*#__PURE__*/styled.li.withConfig({
   displayName: "StyledAnchorSection",
-  componentId: "core-12_30_0__sc-aacdj4-1"
+  componentId: "core-12_32_0__sc-aacdj4-1"
 })(["display:flex;cursor:pointer;border-left:", "px solid ", ";background-color:", ";border-top-right-radius:4px;border-bottom-right-radius:4px;:hover{border-left:", "px solid ", ";background-color:", ";}"], spacing.xs, function (_ref) {
   var $selected = _ref.$selected;
   return $selected ? colors.gray15 : colors.gray90;
@@ -22,7 +22,7 @@ export var StyledAnchorSection = /*#__PURE__*/styled.li.withConfig({
 }, colors.gray90);
 export var StyledAnchor = /*#__PURE__*/styled.a.withConfig({
   displayName: "StyledAnchor",
-  componentId: "core-12_30_0__sc-aacdj4-2"
+  componentId: "core-12_32_0__sc-aacdj4-2"
 })(["width:100%;padding:6px ", "px;", " ", ";", " :focus-visible{box-shadow:inset 0 0 0 2px ", ";outline:none;}"], spacing.sm, getTypographyIntent('body'), function (_ref4) {
   var $selected = _ref4.$selected;
   return $selected ? css(["font-weight:600;"]) : '';

package/dist/Avatar/Avatar.js

@@ -1,8 +1,9 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 var _excluded = ["as", "clickable", "disabled", "href", "size", "children", "onBlur", "onFocus", "rel", "role", "target"],
-  _excluded2 = ["icon"],
-  _excluded3 = ["children"],
-  _excluded4 = ["imageUrl"];
+  _excluded2 = ["onPress", "onClick"],
+  _excluded3 = ["icon"],
+  _excluded4 = ["children"],
+  _excluded5 = ["imageUrl"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -29,19 +30,21 @@ function AvatarInner(_ref, ref) {
     target = _ref.target,
     props = _objectWithoutProperties(_ref, _excluded);
   var _ref2 = props,
-    onPress = _ref2.onPress;
-  var _useButton = useButton(_objectSpread(_objectSpread({}, props), {}, {
+    onPress = _ref2.onPress,
+    onClick = _ref2.onClick,
+    buttonPropsBase = _objectWithoutProperties(_ref2, _excluded2);
+  var elementType = typeof as === 'string' && as === 'a' ? 'a' : 'div';
+  var _useButton = useButton(_objectSpread(_objectSpread({}, buttonPropsBase), {}, {
       onBlur: onBlur,
       onFocus: onFocus,
-      elementType: as === 'a' ? 'a' : 'div',
+      elementType: elementType,
       href: href,
       isDisabled: disabled,
       onPress: onPress,
       rel: rel,
       target: target,
       type: 'button'
-    }), ref // TODO fix
-    ),
+    }), ref),
     buttonProps = _useButton.buttonProps;
   var linkDisabled = disabled || role === 'link' && !href;
   var a11yProps = role === 'button' ? _objectSpread(_objectSpread({}, buttonProps), {}, {
@@ -51,13 +54,18 @@ function AvatarInner(_ref, ref) {
     onBlur: onBlur,
     onFocus: onFocus
   };
+
+  // For button role, spread buttonPropsBase to preserve useButton's onClick
+  // For other roles, spread all props
+  // Exclude ref since it's passed separately
+  var roleSpecificProps = role === 'button' ? buttonPropsBase : props;
   return /*#__PURE__*/React.createElement(StyledAvatarContainer, _extends({
     ref: ref,
     $clickable: clickable,
     $disabled: disabled,
     $size: size,
     "data-qa": "core-avatar"
-  }, a11yProps, props), React.Children.only(children), /*#__PURE__*/React.createElement(StyledAvatarOverlay, {
+  }, a11yProps, roleSpecificProps), React.Children.only(children), /*#__PURE__*/React.createElement(StyledAvatarOverlay, {
     "aria-hidden": true
   }));
 }
@@ -65,14 +73,14 @@ var Avatar_ = /*#__PURE__*/React.forwardRef(AvatarInner);
 var NextAvatar_ = /*#__PURE__*/React.forwardRef(AvatarInner);
 export var Icon = /*#__PURE__*/React.forwardRef(function Icon(_ref5, ref) {
   var icon = _ref5.icon,
-    props = _objectWithoutProperties(_ref5, _excluded2);
+    props = _objectWithoutProperties(_ref5, _excluded3);
   return /*#__PURE__*/React.createElement(StyledIconContainer, _extends({
     ref: ref
   }, props), icon);
 });
 export var Label = /*#__PURE__*/React.forwardRef(function Label(_ref6, ref) {
   var children = _ref6.children,
-    props = _objectWithoutProperties(_ref6, _excluded3);
+    props = _objectWithoutProperties(_ref6, _excluded4);
   // Breaking change: Option to make aria-hidden since parent requires a label.
   // Can add in major once labelling is enforced
   return /*#__PURE__*/React.createElement(StyledLabelContainer, _extends({
@@ -81,7 +89,7 @@ export var Label = /*#__PURE__*/React.forwardRef(function Label(_ref6, ref) {
 });
 export var Portrait = /*#__PURE__*/React.forwardRef(function Portrait(_ref7, ref) {
   var imageUrl = _ref7.imageUrl,
-    props = _objectWithoutProperties(_ref7, _excluded4);
+    props = _objectWithoutProperties(_ref7, _excluded5);
   return /*#__PURE__*/React.createElement(StyledPortraitContainer, _extends({
     ref: ref,
     $imageUrl: imageUrl

package/dist/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","names":["useButton","React","addSubcomponents","StyledAvatarContainer","StyledAvatarOverlay","StyledIconContainer","StyledLabelContainer","StyledPortraitContainer","AvatarInner","_ref","ref","as","clickable","disabled","href","size","children","onBlur","onFocus","rel","role","target","props","_objectWithoutProperties","_excluded","_ref2","onPress","_useButton","_objectSpread","elementType","isDisabled","type","buttonProps","linkDisabled","a11yProps","$clickable","_defineProperty","undefined","createElement","_extends","$disabled","$size","Children","only","Avatar_","forwardRef","NextAvatar_","Icon","_ref5","icon","_excluded2","Label","_ref6","_excluded3","Portrait","_ref7","imageUrl","_excluded4","$imageUrl","displayName","NextAvatar","Avatar"],"sources":["../../src/Avatar/Avatar.tsx"],"sourcesContent":["import { useButton } from '@react-aria/button'\nimport React from 'react'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport {\n  StyledAvatarContainer,\n  StyledAvatarOverlay,\n  StyledIconContainer,\n  StyledLabelContainer,\n  StyledPortraitContainer,\n} from './Avatar.styles'\nimport type {\n  AvatarIconProps,\n  AvatarLabelProps,\n  AvatarPortraitProps,\n  AvatarProps,\n  AvatarRef,\n  AvatarRoles,\n  AvatarRoleType,\n  BaseAvatarProps,\n} from './Avatar.types'\n\nfunction AvatarInner(\n  {\n    as,\n    clickable,\n    disabled,\n    // @ts-ignore link only\n    href,\n    size,\n    children,\n    onBlur,\n    onFocus,\n    // @ts-ignore link only\n    rel,\n    // @ts-ignore not on legacy\n    role,\n    // @ts-ignore link only\n    target,\n    ...props\n  }: AvatarProps<AvatarRoleType>,\n  ref: AvatarRef<AvatarRoleType>\n) {\n  const { onPress } = props as AvatarProps<'button'>\n\n  let { buttonProps } = useButton(\n    {\n      ...props,\n      onBlur: onBlur as (e: React.FocusEvent) => void,\n      onFocus: onFocus as (e: React.FocusEvent) => void,\n      elementType: (as as any as string) === 'a' ? 'a' : 'div',\n      href,\n      isDisabled: disabled,\n      onPress,\n      rel,\n      target,\n      type: 'button',\n    },\n    ref as any // TODO fix\n  )\n\n  const linkDisabled = disabled || (role === 'link' && !href)\n\n  const a11yProps =\n    role === 'button'\n      ? { ...buttonProps, as: as || 'div', $clickable: !disabled }\n      : role === 'link'\n      ? {\n          ['aria-disabled']: linkDisabled ? true : undefined,\n          as: as || 'a',\n          $clickable: !linkDisabled,\n          href: linkDisabled ? undefined : href,\n          onBlur,\n          onFocus,\n          rel,\n          role: 'link',\n          target,\n        }\n      : role === 'img'\n      ? {\n          ['aria-disabled']: disabled ? true : undefined,\n          role: 'img',\n          onBlur,\n          onFocus,\n        }\n      : { onBlur, onFocus }\n\n  return (\n    <StyledAvatarContainer\n      ref={ref as any}\n      $clickable={clickable}\n      $disabled={disabled}\n      $size={size}\n      data-qa=\"core-avatar\"\n      {...a11yProps}\n      {...(props as any)} // TODO fix\n    >\n      {React.Children.only(children)}\n      <StyledAvatarOverlay aria-hidden />\n    </StyledAvatarContainer>\n  )\n}\n\nconst Avatar_ = React.forwardRef(AvatarInner) as <Role extends AvatarRoles>(\n  props:\n    | AvatarProps<Role>\n    // Legacy\n    | (BaseAvatarProps & { ref?: React.ComponentPropsWithRef<'div'>['ref'] })\n) => ReturnType<typeof AvatarInner>\n\nconst NextAvatar_ = React.forwardRef(AvatarInner) as <Role extends AvatarRoles>(\n  props: AvatarProps<Role>\n) => ReturnType<typeof AvatarInner>\n\nexport const Icon = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & AvatarIconProps\n>(function Icon({ icon, ...props }, ref) {\n  return (\n    <StyledIconContainer ref={ref} {...props}>\n      {icon}\n    </StyledIconContainer>\n  )\n})\n\nexport const Label = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & AvatarLabelProps\n>(function Label({ children, ...props }, ref) {\n  // Breaking change: Option to make aria-hidden since parent requires a label.\n  // Can add in major once labelling is enforced\n  return (\n    <StyledLabelContainer ref={ref} {...props}>\n      {children}\n    </StyledLabelContainer>\n  )\n})\n\nexport const Portrait = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & AvatarPortraitProps\n>(function Portrait({ imageUrl, ...props }, ref) {\n  return (\n    <StyledPortraitContainer ref={ref} $imageUrl={imageUrl} {...props}>\n      <StyledAvatarOverlay />\n    </StyledPortraitContainer>\n  )\n})\n\n// @ts-ignore\nAvatar_.displayName = 'Avatar'\n\nIcon.displayName = 'Avatar.Icon'\n\nLabel.displayName = 'Avatar.Label'\n\nPortrait.displayName = 'Avatar.Portrait'\n\n// @ts-ignore\nNextAvatar_.displayName = 'Avatar'\n\n/**\n\n We use avatars to visually represent our users, places, and things in the app.\n These can be in the form of rich media or representative illustrations.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-avatar--demo)\n\n @see [Design Guidelines](https://design.procore.com/avatar)\n\n @a11y Avatar's need a `aria-label` and can be enhanced with `role` for interaction. If decorative only, add `aria-hidden`. The inaccessible `clickable` prop is for UI only\n\n */\nexport const NextAvatar = addSubcomponents(\n  {\n    Icon,\n    Label,\n    Portrait,\n  },\n  NextAvatar_\n)\n\n/**\n\n We use avatars to visually represent our users, places, and things in the app.\n These can be in the form of rich media or representative illustrations.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-avatar--demo)\n\n @see [Design Guidelines](https://design.procore.com/avatar)\n\n @a11y Avatar's need a `aria-label` and can be enhanced with `role` for interaction. If decorative only, add `aria-hidden`. The inaccessible `clickable` prop is for UI only\n\n */\nexport const Avatar = addSubcomponents(\n  {\n    Icon,\n    Label,\n    Portrait,\n  },\n  Avatar_\n)\n"],"mappings":"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"}
+{"version":3,"file":"Avatar.js","names":["useButton","React","addSubcomponents","StyledAvatarContainer","StyledAvatarOverlay","StyledIconContainer","StyledLabelContainer","StyledPortraitContainer","AvatarInner","_ref","ref","as","clickable","disabled","href","size","children","onBlur","onFocus","rel","role","target","props","_objectWithoutProperties","_excluded","_ref2","onPress","onClick","buttonPropsBase","_excluded2","elementType","_useButton","_objectSpread","isDisabled","type","buttonProps","linkDisabled","a11yProps","$clickable","_defineProperty","undefined","roleSpecificProps","createElement","_extends","$disabled","$size","Children","only","Avatar_","forwardRef","NextAvatar_","Icon","_ref5","icon","_excluded3","Label","_ref6","_excluded4","Portrait","_ref7","imageUrl","_excluded5","$imageUrl","displayName","NextAvatar","Avatar"],"sources":["../../src/Avatar/Avatar.tsx"],"sourcesContent":["import { useButton } from '@react-aria/button'\nimport React from 'react'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport {\n  StyledAvatarContainer,\n  StyledAvatarOverlay,\n  StyledIconContainer,\n  StyledLabelContainer,\n  StyledPortraitContainer,\n} from './Avatar.styles'\nimport type {\n  AvatarIconProps,\n  AvatarLabelProps,\n  AvatarPortraitProps,\n  AvatarProps,\n  AvatarRef,\n  AvatarRoles,\n  AvatarRoleType,\n  BaseAvatarProps,\n} from './Avatar.types'\n\nfunction AvatarInner(\n  {\n    as,\n    clickable,\n    disabled,\n    // @ts-ignore link only\n    href,\n    size,\n    children,\n    onBlur,\n    onFocus,\n    // @ts-ignore link only\n    rel,\n    // @ts-ignore not on legacy\n    role,\n    // @ts-ignore link only\n    target,\n    ...props\n  }: AvatarProps<AvatarRoleType>,\n  ref: AvatarRef<AvatarRoleType>\n) {\n  const { onPress, onClick, ...buttonPropsBase } =\n    props as AvatarProps<'button'>\n\n  const elementType =\n    typeof as === 'string' && as === 'a' ? ('a' as const) : ('div' as const)\n\n  let { buttonProps } = useButton(\n    {\n      ...buttonPropsBase,\n      onBlur: onBlur as (e: React.FocusEvent) => void,\n      onFocus: onFocus as (e: React.FocusEvent) => void,\n      elementType,\n      href,\n      isDisabled: disabled,\n      onPress,\n      rel,\n      target,\n      type: 'button',\n    },\n    ref as unknown as React.RefObject<HTMLElement>\n  )\n\n  const linkDisabled = disabled || (role === 'link' && !href)\n\n  const a11yProps =\n    role === 'button'\n      ? { ...buttonProps, as: as || 'div', $clickable: !disabled }\n      : role === 'link'\n      ? {\n          ['aria-disabled']: linkDisabled ? true : undefined,\n          as: as || 'a',\n          $clickable: !linkDisabled,\n          href: linkDisabled ? undefined : href,\n          onBlur,\n          onFocus,\n          rel,\n          role: 'link',\n          target,\n        }\n      : role === 'img'\n      ? {\n          ['aria-disabled']: disabled ? true : undefined,\n          role: 'img',\n          onBlur,\n          onFocus,\n        }\n      : { onBlur, onFocus }\n\n  // For button role, spread buttonPropsBase to preserve useButton's onClick\n  // For other roles, spread all props\n  // Exclude ref since it's passed separately\n  const roleSpecificProps =\n    role === 'button'\n      ? (buttonPropsBase as Omit<\n          AvatarProps<'button'>,\n          'onPress' | 'onClick' | 'ref'\n        >)\n      : (props as Omit<AvatarProps<AvatarRoleType>, 'ref'>)\n\n  return (\n    <StyledAvatarContainer\n      ref={ref as unknown as React.Ref<HTMLDivElement>}\n      $clickable={clickable}\n      $disabled={disabled}\n      $size={size}\n      data-qa=\"core-avatar\"\n      {...(a11yProps as Record<string, unknown>)}\n      {...(roleSpecificProps as Record<string, unknown>)}\n    >\n      {React.Children.only(children)}\n      <StyledAvatarOverlay aria-hidden />\n    </StyledAvatarContainer>\n  )\n}\n\nconst Avatar_ = React.forwardRef(AvatarInner) as <Role extends AvatarRoles>(\n  props:\n    | AvatarProps<Role>\n    // Legacy\n    | (BaseAvatarProps & { ref?: React.ComponentPropsWithRef<'div'>['ref'] })\n) => ReturnType<typeof AvatarInner>\n\nconst NextAvatar_ = React.forwardRef(AvatarInner) as <Role extends AvatarRoles>(\n  props: AvatarProps<Role>\n) => ReturnType<typeof AvatarInner>\n\nexport const Icon = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & AvatarIconProps\n>(function Icon({ icon, ...props }, ref) {\n  return (\n    <StyledIconContainer ref={ref} {...props}>\n      {icon}\n    </StyledIconContainer>\n  )\n})\n\nexport const Label = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & AvatarLabelProps\n>(function Label({ children, ...props }, ref) {\n  // Breaking change: Option to make aria-hidden since parent requires a label.\n  // Can add in major once labelling is enforced\n  return (\n    <StyledLabelContainer ref={ref} {...props}>\n      {children}\n    </StyledLabelContainer>\n  )\n})\n\nexport const Portrait = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & AvatarPortraitProps\n>(function Portrait({ imageUrl, ...props }, ref) {\n  return (\n    <StyledPortraitContainer ref={ref} $imageUrl={imageUrl} {...props}>\n      <StyledAvatarOverlay />\n    </StyledPortraitContainer>\n  )\n})\n\n// @ts-ignore\nAvatar_.displayName = 'Avatar'\n\nIcon.displayName = 'Avatar.Icon'\n\nLabel.displayName = 'Avatar.Label'\n\nPortrait.displayName = 'Avatar.Portrait'\n\n// @ts-ignore\nNextAvatar_.displayName = 'Avatar'\n\n/**\n\n We use avatars to visually represent our users, places, and things in the app.\n These can be in the form of rich media or representative illustrations.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-avatar--demo)\n\n @see [Design Guidelines](https://design.procore.com/avatar)\n\n @a11y Avatar's need a `aria-label` and can be enhanced with `role` for interaction. If decorative only, add `aria-hidden`. The inaccessible `clickable` prop is for UI only\n\n */\nexport const NextAvatar = addSubcomponents(\n  {\n    Icon,\n    Label,\n    Portrait,\n  },\n  NextAvatar_\n)\n\n/**\n\n We use avatars to visually represent our users, places, and things in the app.\n These can be in the form of rich media or representative illustrations.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-avatar--demo)\n\n @see [Design Guidelines](https://design.procore.com/avatar)\n\n @a11y Avatar's need a `aria-label` and can be enhanced with `role` for interaction. If decorative only, add `aria-hidden`. The inaccessible `clickable` prop is for UI only\n\n */\nexport const Avatar = addSubcomponents(\n  {\n    Icon,\n    Label,\n    Portrait,\n  },\n  Avatar_\n)\n"],"mappings":"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"}

package/dist/Avatar/Avatar.styles.js

@@ -28,26 +28,26 @@ var iconSize = {
 };
 export var StyledAvatarOverlay = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledAvatarOverlay",
-  componentId: "core-12_30_0__sc-7q2ydl-0"
+  componentId: "core-12_32_0__sc-7q2ydl-0"
 })(["width:100%;height:100%;position:absolute;top:0;left:0;border-radius:100%;opacity:0;"]);
 export var StyledIconContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledIconContainer",
-  componentId: "core-12_30_0__sc-7q2ydl-1"
+  componentId: "core-12_32_0__sc-7q2ydl-1"
 })(["display:inline-flex;"]);
 export var StyledLabelContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledLabelContainer",
-  componentId: "core-12_30_0__sc-7q2ydl-2"
+  componentId: "core-12_32_0__sc-7q2ydl-2"
 })(["text-transform:uppercase;"]);
 export var StyledPortraitContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledPortraitContainer",
-  componentId: "core-12_30_0__sc-7q2ydl-3"
+  componentId: "core-12_32_0__sc-7q2ydl-3"
 })(["background-color:", ";background-position:center;background-repeat:no-repeat;background-size:cover;height:100%;width:100%;", ""], colors.white, function (_ref) {
   var $imageUrl = _ref.$imageUrl;
   return css(["background-image:url(", ");"], $imageUrl);
 });
 export var StyledAvatarContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledAvatarContainer",
-  componentId: "core-12_30_0__sc-7q2ydl-4"
+  componentId: "core-12_32_0__sc-7q2ydl-4"
 })(["display:inline-flex;justify-content:center;align-items:center;border-radius:100%;overflow:hidden;position:relative;cursor:default;color:", ";background-color:", ";text-decoration:none;a:has(> &){text-decoration:none;}&:focus{", "}a:focus:has(> &){", " border-radius:100%;}", " ", ";"], colors.white, colors.gray30, getGapOutlineFocus, getGapOutlineFocus, function (_ref2) {
   var _ref2$$size = _ref2.$size,
     $size = _ref2$$size === void 0 ? 'md' : _ref2$$size;