@teamturing/react-kit 2.47.0 → 2.47.1

package/dist/core/Avatar/index.d.ts

@@ -6,8 +6,8 @@ type AvatarSizeType = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';
 type Props = {
     size?: ResponsiveValue<AvatarSizeType>;
 } & ImageProps & SxProp;
-declare const _default: import("react").ForwardRefExoticComponent<{
+declare const Avatar: import("react").ForwardRefExoticComponent<{
     size?: ResponsiveValue<AvatarSizeType> | undefined;
 } & import("react").ImgHTMLAttributes<HTMLImageElement> & SxProp & import("styled-system").LayoutProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & import("react").RefAttributes<HTMLImageElement>>;
-export default _default;
+export default Avatar;
 export type { Props as AvatarProps };

package/dist/index.js

@@ -16794,24 +16794,27 @@ const Image = styled__default.default.img`
   ${sx}
 `;
 
-const Avatar = ({
-  src,
+const DEFAULT_AVATAR_URL = 'https://cdn.teamturing.com/cms/uploads/2024-02-21/1708481300_empty-profile.png';
+const Avatar = /*#__PURE__*/React.forwardRef(({
+  src = DEFAULT_AVATAR_URL,
   alt = '',
   size = 'm',
   sx,
   ...props
 }, ref) => /*#__PURE__*/jsxRuntimeExports.jsx(BaseAvatar, {
   ref: ref,
+  role: 'presentation',
   src: src,
   alt: alt,
   sx: sx,
   size: size,
   ...props
-});
+}));
 const BaseAvatar = styled__default.default(Image)`
   border-radius: ${({
   theme
 }) => forcePixelValue(theme.radii.full)};
+  object-fit: cover;
 
   ${variant({
   prop: 'size',
@@ -16853,7 +16856,6 @@ const BaseAvatar = styled__default.default(Image)`
 
   ${sx}
 `;
-var Avatar$1 = /*#__PURE__*/React.forwardRef(Avatar);
 
 function* iterateFocusableElements(container, options = {}) {
   var _a, _b;
@@ -35289,7 +35291,7 @@ const AvatarGroupItem = ({
   onClick: onClick,
   children: /*#__PURE__*/jsxRuntimeExports.jsx(Tooltip, {
     text: props.alt,
-    children: /*#__PURE__*/jsxRuntimeExports.jsx(Avatar$1, {
+    children: /*#__PURE__*/jsxRuntimeExports.jsx(Avatar, {
       ref: ref,
       size: 's',
       ...props
@@ -35318,41 +35320,39 @@ const AvatarGroup = ({
       children: [...childrenArray.slice(0, maxItemCount)].reverse()
     }), isOverflown ? /*#__PURE__*/jsxRuntimeExports.jsx(OverlayPopper, {
       placement: 'bottom',
-      renderOverlay: overlayProps => {
-        return /*#__PURE__*/jsxRuntimeExports.jsx(Overlay$1, {
-          size: 's',
-          maxHeight: 300,
-          sx: {
-            overflow: 'auto'
-          },
-          onClick: e => e.stopPropagation(),
-          ...overlayProps,
-          children: /*#__PURE__*/jsxRuntimeExports.jsx(Space, {
-            px: 1,
-            py: 2,
-            children: childrenArray.slice(maxItemCount).map(({
-              key,
-              props
-            }) => /*#__PURE__*/jsxRuntimeExports.jsxs(View, {
-              sx: {
-                p: 3,
-                display: 'flex',
-                alignItems: 'center',
-                columnGap: 2
-              },
-              children: [/*#__PURE__*/jsxRuntimeExports.jsx(Avatar$1, {
-                size: 'xs',
-                src: props.src,
-                alt: props.alt
-              }), /*#__PURE__*/jsxRuntimeExports.jsx(Text, {
-                typography: 'xs',
-                color: 'text/neutral',
-                children: props.alt
-              })]
-            }, key))
-          })
-        });
-      },
+      renderOverlay: overlayProps => /*#__PURE__*/jsxRuntimeExports.jsx(Overlay$1, {
+        size: 's',
+        maxHeight: 300,
+        sx: {
+          overflow: 'auto'
+        },
+        onClick: e => e.stopPropagation(),
+        ...overlayProps,
+        children: /*#__PURE__*/jsxRuntimeExports.jsx(Space, {
+          px: 1,
+          py: 2,
+          children: childrenArray.slice(maxItemCount).map(({
+            key,
+            props
+          }) => /*#__PURE__*/jsxRuntimeExports.jsxs(View, {
+            sx: {
+              p: 3,
+              display: 'flex',
+              alignItems: 'center',
+              columnGap: 2
+            },
+            children: [/*#__PURE__*/jsxRuntimeExports.jsx(Avatar, {
+              size: 'xs',
+              src: props.src,
+              alt: props.alt
+            }), /*#__PURE__*/jsxRuntimeExports.jsx(Text, {
+              typography: 'xs',
+              color: 'text/neutral',
+              children: props.alt
+            })]
+          }, key))
+        })
+      }),
       children: popperProps => /*#__PURE__*/jsxRuntimeExports.jsxs(UnstyledButton, {
         ...popperProps,
         onClick: e => {
@@ -43179,7 +43179,7 @@ const useTabState = ({
 
 exports.ActionList = index$f;
 exports.AnimatePresence = AnimatePresence;
-exports.Avatar = Avatar$1;
+exports.Avatar = Avatar;
 exports.AvatarGroup = index$c;
 exports.BadgeAttacher = BadgeAttacher;
 exports.Breadcrumbs = index$b;

package/esm/core/Avatar/index.js

@@ -7,24 +7,27 @@ import Image from '../Image/index.js';
 import { j as jsxRuntimeExports } from '../../node_modules/react/jsx-runtime.js';
 import { variant } from '../../node_modules/@styled-system/variant/dist/index.esm.js';
 
-const Avatar = ({
-  src,
+const DEFAULT_AVATAR_URL = 'https://cdn.teamturing.com/cms/uploads/2024-02-21/1708481300_empty-profile.png';
+const Avatar = /*#__PURE__*/forwardRef(({
+  src = DEFAULT_AVATAR_URL,
   alt = '',
   size = 'm',
   sx,
   ...props
 }, ref) => /*#__PURE__*/jsxRuntimeExports.jsx(BaseAvatar, {
   ref: ref,
+  role: 'presentation',
   src: src,
   alt: alt,
   sx: sx,
   size: size,
   ...props
-});
+}));
 const BaseAvatar = styled(Image)`
   border-radius: ${({
   theme
 }) => forcePixelValue(theme.radii.full)};
+  object-fit: cover;
 
   ${variant({
   prop: 'size',
@@ -66,6 +69,5 @@ const BaseAvatar = styled(Image)`
 
   ${sx}
 `;
-var Avatar$1 = /*#__PURE__*/forwardRef(Avatar);
 
-export { Avatar$1 as default };
+export { Avatar as default };

package/esm/core/AvatarGroup/index.js

@@ -26,41 +26,39 @@ const AvatarGroup = ({
       children: [...childrenArray.slice(0, maxItemCount)].reverse()
     }), isOverflown ? /*#__PURE__*/jsxRuntimeExports.jsx(OverlayPopper, {
       placement: 'bottom',
-      renderOverlay: overlayProps => {
-        return /*#__PURE__*/jsxRuntimeExports.jsx(Overlay, {
-          size: 's',
-          maxHeight: 300,
-          sx: {
-            overflow: 'auto'
-          },
-          onClick: e => e.stopPropagation(),
-          ...overlayProps,
-          children: /*#__PURE__*/jsxRuntimeExports.jsx(Space, {
-            px: 1,
-            py: 2,
-            children: childrenArray.slice(maxItemCount).map(({
-              key,
-              props
-            }) => /*#__PURE__*/jsxRuntimeExports.jsxs(View, {
-              sx: {
-                p: 3,
-                display: 'flex',
-                alignItems: 'center',
-                columnGap: 2
-              },
-              children: [/*#__PURE__*/jsxRuntimeExports.jsx(Avatar, {
-                size: 'xs',
-                src: props.src,
-                alt: props.alt
-              }), /*#__PURE__*/jsxRuntimeExports.jsx(Text, {
-                typography: 'xs',
-                color: 'text/neutral',
-                children: props.alt
-              })]
-            }, key))
-          })
-        });
-      },
+      renderOverlay: overlayProps => /*#__PURE__*/jsxRuntimeExports.jsx(Overlay, {
+        size: 's',
+        maxHeight: 300,
+        sx: {
+          overflow: 'auto'
+        },
+        onClick: e => e.stopPropagation(),
+        ...overlayProps,
+        children: /*#__PURE__*/jsxRuntimeExports.jsx(Space, {
+          px: 1,
+          py: 2,
+          children: childrenArray.slice(maxItemCount).map(({
+            key,
+            props
+          }) => /*#__PURE__*/jsxRuntimeExports.jsxs(View, {
+            sx: {
+              p: 3,
+              display: 'flex',
+              alignItems: 'center',
+              columnGap: 2
+            },
+            children: [/*#__PURE__*/jsxRuntimeExports.jsx(Avatar, {
+              size: 'xs',
+              src: props.src,
+              alt: props.alt
+            }), /*#__PURE__*/jsxRuntimeExports.jsx(Text, {
+              typography: 'xs',
+              color: 'text/neutral',
+              children: props.alt
+            })]
+          }, key))
+        })
+      }),
       children: popperProps => /*#__PURE__*/jsxRuntimeExports.jsxs(UnstyledButton, {
         ...popperProps,
         onClick: e => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teamturing/react-kit",
-  "version": "2.47.0",
+  "version": "2.47.1",
   "description": "React components, hooks for create teamturing web application",
   "author": "Sungchang Park <psch300@gmail.com> (https://github.com/psch300)",
   "homepage": "https://github.com/weareteamturing/bombe#readme",
@@ -66,5 +66,5 @@
     "react-textarea-autosize": "^8.5.3",
     "styled-system": "^5.1.5"
   },
-  "gitHead": "e32009b5d122928a1b9dc24800de22aa3b39344c"
+  "gitHead": "d4def05b872fd881706a5a6a1598cae05aadba49"
 }