@yamada-ui/react/dist/cjs/components/avatar/avatar.cjs.map

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

{"version":3,"file":"avatar.cjs","names":["createSlotComponent","avatarStyle","useAvatar","styled","UserRoundIcon"],"sources":["../../../../src/components/avatar/avatar.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { AvatarStyle } from \"./avatar.style\"\nimport type { UseAvatarProps } from \"./use-avatar\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { UserRoundIcon } from \"../icon\"\nimport { avatarStyle } from \"./avatar.style\"\nimport { useAvatar } from \"./use-avatar\"\n\nexport interface AvatarProps\n  extends HTMLStyledProps,\n    ThemeProps<AvatarStyle>,\n    UseAvatarProps {\n  /**\n   * The avatar icon to use.\n   */\n  icon?: ReactElement\n  /**\n   * The props to pass to the fallback component.\n   */\n  fallbackProps?: AvatarFallbackProps\n  /**\n   * The props to pass to the image component.\n   */\n  imageProps?: AvatarImageProps\n}\n\nconst {\n  component,\n  PropsContext: AvatarPropsContext,\n  usePropsContext: useAvatarPropsContext,\n  withContext,\n  withProvider,\n  useRootComponentProps,\n} = createSlotComponent<AvatarProps, AvatarStyle>(\"avatar\", avatarStyle)\n\nexport {\n  AvatarPropsContext,\n  component,\n  useAvatarPropsContext,\n  useRootComponentProps,\n}\n\n/**\n * `Avatar` is a component that displays a profile picture or an icon with initials representing a user.\n *\n * @see https://yamada-ui.com/docs/components/avatar\n */\nexport const Avatar = withProvider<\"div\", AvatarProps>(\n  ({ fallbackProps, imageProps, ...rest }) => {\n    const { getFallbackProps, getImageProps, getRootProps } = useAvatar(rest)\n\n    return (\n      <styled.div {...getRootProps()}>\n        <AvatarFallback {...getFallbackProps(fallbackProps)} />\n        <AvatarImage {...getImageProps(imageProps)} />\n      </styled.div>\n    )\n  },\n  \"root\",\n)(({ icon, ...rest }) => ({\n  icon: icon ?? <UserRoundIcon fontSize=\"1.2em\" />,\n  ...rest,\n}))\n\ninterface AvatarImageProps extends HTMLStyledProps<\"img\"> {}\n\nconst AvatarImage = withContext<\"img\", AvatarImageProps>(\"img\", \"image\")()\n\ninterface AvatarFallbackProps extends HTMLStyledProps {}\n\nconst AvatarFallback = withContext<\"div\", AvatarFallbackProps>(\n  \"div\",\n  \"fallback\",\n)()\n"],"mappings":";;;;;;;;;;;;;AA6BA,MAAM,EACJ,WACA,cAAc,oBACd,iBAAiB,uBACjB,aACA,cACA,0BACEA,6CAA8C,UAAUC,iCAAY;;;;;;AAcxE,MAAa,SAAS,cACnB,EAAE,eAAe,WAAY,GAAG,WAAW;CAC1C,MAAM,EAAE,kBAAkB,eAAe,iBAAiBC,6BAAU,KAAK;AAEzE,QACE,4CAACC,uBAAO;EAAI,GAAI,cAAc;aAC5B,2CAAC,kBAAe,GAAI,iBAAiB,cAAc,GAAI,EACvD,2CAAC,eAAY,GAAI,cAAc,WAAW,GAAI;GACnC;GAGjB,OACD,EAAE,EAAE,KAAM,GAAG,YAAY;CACxB,MAAM,QAAQ,2CAACC,yCAAc,UAAS,UAAU;CAChD,GAAG;CACJ,EAAE;AAIH,MAAM,cAAc,YAAqC,OAAO,QAAQ,EAAE;AAI1E,MAAM,iBAAiB,YACrB,OACA,WACD,EAAE"}