flowbite-react/dist/esm/components/Avatar/Avatar.mjs.map

Official React components built for Flowbite and Tailwind CSS

{"version":3,"file":"Avatar.mjs","sources":["../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import type { ComponentProps, FC, ReactElement } from \"react\";\nimport { twMerge } from \"tailwind-merge\";\nimport { mergeDeep } from \"../../helpers/merge-deep\";\nimport { getTheme } from \"../../theme-store\";\nimport type { DeepPartial } from \"../../types\";\nimport type { FlowbiteBoolean, FlowbiteColors, FlowbitePositions, FlowbiteSizes } from \"../Flowbite\";\nimport type { FlowbiteAvatarGroupTheme } from \"./AvatarGroup\";\nimport { AvatarGroup } from \"./AvatarGroup\";\nimport type { FlowbiteAvatarGroupCounterTheme } from \"./AvatarGroupCounter\";\nimport { AvatarGroupCounter } from \"./AvatarGroupCounter\";\n\nexport interface FlowbiteAvatarTheme {\n  root: FlowbiteAvatarRootTheme;\n  group: FlowbiteAvatarGroupTheme;\n  groupCounter: FlowbiteAvatarGroupCounterTheme;\n}\n\nexport interface FlowbiteAvatarRootTheme {\n  base: string;\n  bordered: string;\n  color: AvatarColors;\n  img: FlowbiteAvatarImageTheme;\n  initials: FlowbiteAvatarInitialsTheme;\n  rounded: string;\n  size: AvatarSizes;\n  stacked: string;\n  status: FlowbiteAvatarStatusTheme;\n  statusPosition: FlowbitePositions;\n}\n\nexport interface FlowbiteAvatarImageTheme extends FlowbiteBoolean {\n  base: string;\n  placeholder: string;\n}\n\nexport interface FlowbiteAvatarStatusTheme {\n  away: string;\n  base: string;\n  busy: string;\n  offline: string;\n  online: string;\n}\n\nexport interface FlowbiteAvatarInitialsTheme {\n  base: string;\n  text: string;\n}\n\nexport interface AvatarColors\n  extends Pick<FlowbiteColors, \"failure\" | \"gray\" | \"info\" | \"pink\" | \"purple\" | \"success\" | \"warning\"> {\n  [key: string]: string;\n}\n\nexport interface AvatarSizes extends Pick<FlowbiteSizes, \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\"> {\n  [key: string]: string;\n}\n\nexport interface AvatarImageProps {\n  alt?: string;\n  className: string;\n  \"data-testid\": string;\n}\n\nexport interface AvatarProps extends Omit<ComponentProps<\"div\">, \"color\"> {\n  alt?: string;\n  bordered?: boolean;\n  img?: string | ((props: AvatarImageProps) => ReactElement);\n  color?: keyof AvatarColors;\n  rounded?: boolean;\n  size?: keyof AvatarSizes;\n  stacked?: boolean;\n  status?: \"away\" | \"busy\" | \"offline\" | \"online\";\n  statusPosition?: keyof FlowbitePositions;\n  placeholderInitials?: string;\n  theme?: DeepPartial<FlowbiteAvatarTheme>;\n}\n\nconst AvatarComponent: FC<AvatarProps> = ({\n  alt = \"\",\n  bordered = false,\n  children,\n  className,\n  color = \"light\",\n  img,\n  placeholderInitials = \"\",\n  rounded = false,\n  size = \"md\",\n  stacked = false,\n  status,\n  statusPosition = \"top-left\",\n  theme: customTheme = {},\n  ...props\n}) => {\n  const theme = mergeDeep(getTheme().avatar, customTheme);\n\n  const imgClassName = twMerge(\n    theme.root.img.base,\n    bordered && theme.root.bordered,\n    bordered && theme.root.color[color],\n    rounded && theme.root.rounded,\n    stacked && theme.root.stacked,\n    theme.root.img.on,\n    theme.root.size[size],\n  );\n\n  const imgProps = {\n    className: twMerge(imgClassName, theme.root.img.on),\n    \"data-testid\": \"flowbite-avatar-img\",\n  };\n  return (\n    <div className={twMerge(theme.root.base, className)} data-testid=\"flowbite-avatar\" {...props}>\n      <div className=\"relative\">\n        {img ? (\n          typeof img === \"string\" ? (\n            <img alt={alt} src={img} {...imgProps} />\n          ) : (\n            img({ alt, ...imgProps })\n          )\n        ) : placeholderInitials ? (\n          <div\n            className={twMerge(\n              theme.root.img.off,\n              theme.root.initials.base,\n              stacked && theme.root.stacked,\n              bordered && theme.root.bordered,\n              bordered && theme.root.color[color],\n              theme.root.size[size],\n              rounded && theme.root.rounded,\n            )}\n            data-testid=\"flowbite-avatar-initials-placeholder\"\n          >\n            <span className={twMerge(theme.root.initials.text)} data-testid=\"flowbite-avatar-initials-placeholder-text\">\n              {placeholderInitials}\n            </span>\n          </div>\n        ) : (\n          <div className={twMerge(imgClassName, theme.root.img.off)} data-testid=\"flowbite-avatar-img\">\n            <svg\n              className={theme.root.img.placeholder}\n              fill=\"currentColor\"\n              viewBox=\"0 0 20 20\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path fillRule=\"evenodd\" d=\"M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z\" clipRule=\"evenodd\" />\n            </svg>\n          </div>\n        )}\n        {status && (\n          <span\n            data-testid=\"flowbite-avatar-status\"\n            className={twMerge(\n              theme.root.status.base,\n              theme.root.status[status],\n              theme.root.statusPosition[statusPosition],\n            )}\n          />\n        )}\n      </div>\n      {children && <div>{children}</div>}\n    </div>\n  );\n};\n\nAvatarComponent.displayName = \"Avatar\";\n\nexport const Avatar = Object.assign(AvatarComponent, {\n  Group: AvatarGroup,\n  Counter: AvatarGroupCounter,\n});\n"],"names":[],"mappings":"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"}