@frank-auth/react
Version:
Flexible and customizable React UI components for Frank Authentication
1 lines • 18.6 kB
Source Map (JSON)
{"version":3,"file":"avatar.cjs","sources":["../../../../../src/components/ui/avatar/avatar.tsx"],"sourcesContent":["import { useTheme } from \"@/theme/context\";\nimport { type StyledProps, getColorVariant } from \"@/theme/styled\";\nimport { css } from \"@emotion/react\";\nimport styled from \"@emotion/styled\";\nimport React, { useState, useEffect } from \"react\";\n\nexport interface AvatarProps extends React.HTMLAttributes<HTMLDivElement> {\n\t/** Avatar source - image URL */\n\tsrc?: string;\n\t/** Alt text for image */\n\talt?: string;\n\t/** Name to generate initials from */\n\tname?: string;\n\t/** Avatar size */\n\tsize?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n\t/** Avatar color theme (for initials background) */\n\tcolor?: \"primary\" | \"secondary\" | \"success\" | \"warning\" | \"danger\";\n\t/** Avatar radius */\n\tradius?: \"none\" | \"sm\" | \"md\" | \"lg\" | \"full\";\n\t/** Show border */\n\tisBordered?: boolean;\n\t/** Disabled state */\n\tisDisabled?: boolean;\n\t/** Fallback icon when no image or name */\n\tfallback?: React.ReactNode;\n\t/** Status indicator */\n\tshowStatus?: boolean;\n\t/** Status color */\n\tstatusColor?: \"primary\" | \"secondary\" | \"success\" | \"warning\" | \"danger\";\n\t/** Status placement */\n\tstatusPlacement?: \"top-right\" | \"top-left\" | \"bottom-right\" | \"bottom-left\";\n\t/** Custom class name */\n\tclassName?: string;\n\t/** Custom styles */\n\tcss?: any;\n\t/** Image loading error callback */\n\tonError?: () => void;\n}\n\ntype StyledAvatarProps = StyledProps<AvatarProps>;\n\nconst getAvatarSizeStyles = (props: StyledAvatarProps) => {\n\tconst { theme, size = \"md\" } = props;\n\n\tswitch (size) {\n\t\tcase \"xs\":\n\t\t\treturn css`\n width: ${theme.spacing[6]};\n height: ${theme.spacing[6]};\n font-size: ${theme.fontSizes.xs};\n `;\n\t\tcase \"sm\":\n\t\t\treturn css`\n width: ${theme.spacing[8]};\n height: ${theme.spacing[8]};\n font-size: ${theme.fontSizes.sm};\n `;\n\t\tcase \"md\":\n\t\t\treturn css`\n width: ${theme.spacing[10]};\n height: ${theme.spacing[10]};\n font-size: ${theme.fontSizes.base};\n `;\n\t\tcase \"lg\":\n\t\t\treturn css`\n width: ${theme.spacing[12]};\n height: ${theme.spacing[12]};\n font-size: ${theme.fontSizes.lg};\n `;\n\t\tcase \"xl\":\n\t\t\treturn css`\n width: ${theme.spacing[16]};\n height: ${theme.spacing[16]};\n font-size: ${theme.fontSizes.xl};\n `;\n\t\tdefault:\n\t\t\treturn css``;\n\t}\n};\n\nconst getAvatarRadiusStyles = (props: StyledAvatarProps) => {\n\tconst { theme, radius = \"full\" } = props;\n\n\tswitch (radius) {\n\t\tcase \"none\":\n\t\t\treturn css`border-radius: ${theme.borderRadius.none};`;\n\t\tcase \"sm\":\n\t\t\treturn css`border-radius: ${theme.borderRadius.sm};`;\n\t\tcase \"md\":\n\t\t\treturn css`border-radius: ${theme.borderRadius.md};`;\n\t\tcase \"lg\":\n\t\t\treturn css`border-radius: ${theme.borderRadius.lg};`;\n\t\tcase \"full\":\n\t\t\treturn css`border-radius: ${theme.borderRadius.full};`;\n\t\tdefault:\n\t\t\treturn css`border-radius: ${theme.borderRadius.full};`;\n\t}\n};\n\nconst getAvatarColorStyles = (props: StyledAvatarProps) => {\n\tconst { theme, color = \"primary\", isDisabled } = props;\n\tconst baseColor = getColorVariant(theme, color, 500);\n\tconst lightColor = getColorVariant(theme, color, 100);\n\tconst darkColor = getColorVariant(theme, color, 700);\n\n\tif (isDisabled) {\n\t\treturn css`\n opacity: 0.5;\n cursor: not-allowed;\n `;\n\t}\n\n\treturn css`\n background-color: ${lightColor};\n color: ${darkColor};\n `;\n};\n\nconst StyledAvatar = styled.div<StyledAvatarProps>`\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-family: inherit;\n font-weight: ${(props) => props.theme.fontWeights.medium};\n line-height: ${(props) => props.theme.lineHeights.tight};\n user-select: none;\n overflow: hidden;\n flex-shrink: 0;\n transition: all ${(props) => props.theme.transitions.normal};\n\n ${getAvatarSizeStyles}\n ${getAvatarRadiusStyles}\n ${getAvatarColorStyles}\n\n ${(props) =>\n\t\tprops.isBordered &&\n\t\tcss`\n border: 2px solid ${props.theme.colors.border.primary};\n `}\n\n /* Custom CSS prop */\n ${(props) => props.css}\n`;\n\nconst AvatarImage = styled.img<StyledAvatarProps>`\n width: 100%;\n height: 100%;\n object-fit: cover;\n ${getAvatarRadiusStyles}\n`;\n\nconst AvatarInitials = styled.span`\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n text-transform: uppercase;\n`;\n\nconst AvatarFallback = styled.div`\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n color: ${(props) => props.theme.colors.text.tertiary};\n`;\n\nconst StatusIndicator = styled.div<\n\tStyledAvatarProps & {\n\t\tstatusColor: string;\n\t\tstatusPlacement: string;\n\t\tsize: string;\n\t}\n>`\n position: absolute;\n border: 2px solid ${(props) => props.theme.colors.background.primary};\n border-radius: ${(props) => props.theme.borderRadius.full};\n background-color: ${(props) => {\n\t\tconst color = props.statusColor || \"success\";\n\t\treturn getColorVariant(props.theme, color as any, 500);\n\t}};\n\n ${(props) => {\n\t\tconst sizeMap = {\n\t\t\txs: \"8px\",\n\t\t\tsm: \"10px\",\n\t\t\tmd: \"12px\",\n\t\t\tlg: \"14px\",\n\t\t\txl: \"16px\",\n\t\t};\n\t\tconst size = sizeMap[props.size as keyof typeof sizeMap] || \"12px\";\n\n\t\treturn css`\n width: ${size};\n height: ${size};\n `;\n\t}}\n\n ${(props) => {\n\t\tswitch (props.statusPlacement) {\n\t\t\tcase \"top-right\":\n\t\t\t\treturn css`\n top: 0;\n right: 0;\n transform: translate(25%, -25%);\n `;\n\t\t\tcase \"top-left\":\n\t\t\t\treturn css`\n top: 0;\n left: 0;\n transform: translate(-25%, -25%);\n `;\n\t\t\tcase \"bottom-right\":\n\t\t\t\treturn css`\n bottom: 0;\n right: 0;\n transform: translate(25%, 25%);\n `;\n\t\t\tcase \"bottom-left\":\n\t\t\t\treturn css`\n bottom: 0;\n left: 0;\n transform: translate(-25%, 25%);\n `;\n\t\t\tdefault:\n\t\t\t\treturn css`\n bottom: 0;\n right: 0;\n transform: translate(25%, 25%);\n `;\n\t\t}\n\t}}\n`;\n\n// Default fallback icon\nconst DefaultFallbackIcon = () => (\n\t<svg width=\"60%\" height=\"60%\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n\t\t<path d=\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\" />\n\t</svg>\n);\n\n// Function to generate initials from name\nconst getInitials = (name: string): string => {\n\treturn name\n\t\t.split(\" \")\n\t\t.map((word) => word.charAt(0))\n\t\t.join(\"\")\n\t\t.slice(0, 2)\n\t\t.toUpperCase();\n};\n\nexport const Avatar = React.forwardRef<HTMLDivElement, AvatarProps>(\n\t(\n\t\t{\n\t\t\tsrc,\n\t\t\talt,\n\t\t\tname,\n\t\t\tsize = \"md\",\n\t\t\tcolor = \"primary\",\n\t\t\tradius = \"full\",\n\t\t\tisBordered = false,\n\t\t\tisDisabled = false,\n\t\t\tfallback,\n\t\t\tshowStatus = false,\n\t\t\tstatusColor = \"success\",\n\t\t\tstatusPlacement = \"bottom-right\",\n\t\t\tclassName,\n\t\t\tcss,\n\t\t\tonError,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst { theme } = useTheme();\n\t\tconst [imageError, setImageError] = useState(false);\n\t\tconst [imageLoaded, setImageLoaded] = useState(false);\n\n\t\t// Reset image error state when src changes\n\t\tuseEffect(() => {\n\t\t\tsetImageError(false);\n\t\t\tsetImageLoaded(false);\n\t\t}, [src]);\n\n\t\tconst handleImageError = () => {\n\t\t\tsetImageError(true);\n\t\t\tonError?.();\n\t\t};\n\n\t\tconst handleImageLoad = () => {\n\t\t\tsetImageLoaded(true);\n\t\t};\n\n\t\tconst avatarProps = {\n\t\t\t...props,\n\t\t\tsize,\n\t\t\tcolor,\n\t\t\tradius,\n\t\t\tisBordered,\n\t\t\tisDisabled,\n\t\t\tclassName,\n\t\t\tcss,\n\t\t};\n\n\t\tconst renderContent = () => {\n\t\t\t// Show image if src exists and no error\n\t\t\tif (src && !imageError) {\n\t\t\t\treturn (\n\t\t\t\t\t<AvatarImage\n\t\t\t\t\t\ttheme={theme}\n\t\t\t\t\t\tsrc={src}\n\t\t\t\t\t\talt={alt || name}\n\t\t\t\t\t\tradius={radius}\n\t\t\t\t\t\tonError={handleImageError}\n\t\t\t\t\t\tonLoad={handleImageLoad}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\topacity: imageLoaded ? 1 : 0,\n\t\t\t\t\t\t\ttransition: theme.transitions.normal,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t}\n\n\t\t\t// Show initials if name exists\n\t\t\tif (name) {\n\t\t\t\treturn (\n\t\t\t\t\t<AvatarInitials theme={theme}>{getInitials(name)}</AvatarInitials>\n\t\t\t\t);\n\t\t\t}\n\n\t\t\t// Show custom fallback or default icon\n\t\t\treturn (\n\t\t\t\t<AvatarFallback theme={theme}>\n\t\t\t\t\t{fallback || <DefaultFallbackIcon />}\n\t\t\t\t</AvatarFallback>\n\t\t\t);\n\t\t};\n\n\t\treturn (\n\t\t\t<StyledAvatar theme={theme} ref={ref} {...avatarProps}>\n\t\t\t\t{renderContent()}\n\t\t\t\t{showStatus && (\n\t\t\t\t\t<StatusIndicator\n\t\t\t\t\t\ttheme={theme}\n\t\t\t\t\t\tstatusColor={statusColor}\n\t\t\t\t\t\tstatusPlacement={statusPlacement}\n\t\t\t\t\t\tsize={size}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</StyledAvatar>\n\t\t);\n\t},\n);\n\nAvatar.displayName = \"Avatar\";\n\n// Avatar Group Component\nexport interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n\t/** Maximum number of avatars to show */\n\tmax?: number;\n\t/** Avatar size for all children */\n\tsize?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n\t/** Spacing between avatars (negative for overlap) */\n\tspacing?: number;\n\t/** Show border on avatars */\n\tisBordered?: boolean;\n\t/** Avatar radius for all children */\n\tradius?: \"none\" | \"sm\" | \"md\" | \"lg\" | \"full\";\n\t/** Custom class name */\n\tclassName?: string;\n\t/** Custom styles */\n\tcss?: any;\n\t/** Children avatars */\n\tchildren: React.ReactNode;\n}\n\nconst StyledAvatarGroup = styled.div<StyledProps<AvatarGroupProps>>`\n display: flex;\n align-items: center;\n\n ${(props) => props.css}\n`;\n\nconst AvatarGroupItem = styled.div<{ spacing: number; index: number }>`\n position: relative;\n margin-left: ${(props) => (props.index > 0 ? `${props.spacing}px` : \"0\")};\n\n &:hover {\n z-index: 1;\n }\n`;\n\nconst ExtraAvatarsCount = styled(StyledAvatar)`\n background-color: ${(props) => props.theme.colors.neutral[200]};\n color: ${(props) => props.theme.colors.text.secondary};\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n`;\n\nexport const AvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(\n\t(\n\t\t{\n\t\t\tchildren,\n\t\t\tmax = 5,\n\t\t\tsize = \"md\",\n\t\t\tspacing = -8,\n\t\t\tisBordered = false,\n\t\t\tradius = \"full\",\n\t\t\tclassName,\n\t\t\tcss,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst { theme } = useTheme();\n\t\tconst childrenArray = React.Children.toArray(children);\n\t\tconst visibleChildren = childrenArray.slice(0, max);\n\t\tconst extraCount = Math.max(0, childrenArray.length - max);\n\n\t\tconst groupProps = {\n\t\t\t...props,\n\t\t\tclassName,\n\t\t\tcss,\n\t\t};\n\n\t\treturn (\n\t\t\t<StyledAvatarGroup theme={theme} ref={ref} {...groupProps}>\n\t\t\t\t{visibleChildren.map((child, index) => {\n\t\t\t\t\tif (React.isValidElement(child)) {\n\t\t\t\t\t\tconst avatarProps = {\n\t\t\t\t\t\t\tsize,\n\t\t\t\t\t\t\tisBordered,\n\t\t\t\t\t\t\tradius,\n\t\t\t\t\t\t\t...child.props,\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<AvatarGroupItem key={index} spacing={spacing} index={index}>\n\t\t\t\t\t\t\t\t{React.cloneElement(child, avatarProps)}\n\t\t\t\t\t\t\t</AvatarGroupItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t\treturn child;\n\t\t\t\t})}\n\n\t\t\t\t{extraCount > 0 && (\n\t\t\t\t\t<AvatarGroupItem spacing={spacing} index={visibleChildren.length}>\n\t\t\t\t\t\t<ExtraAvatarsCount\n\t\t\t\t\t\t\ttheme={theme}\n\t\t\t\t\t\t\tsize={size}\n\t\t\t\t\t\t\tradius={radius}\n\t\t\t\t\t\t\tisBordered={isBordered}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t+{extraCount}\n\t\t\t\t\t\t</ExtraAvatarsCount>\n\t\t\t\t\t</AvatarGroupItem>\n\t\t\t\t)}\n\t\t\t</StyledAvatarGroup>\n\t\t);\n\t},\n);\n\nAvatarGroup.displayName = \"AvatarGroup\";\n"],"names":["getAvatarSizeStyles","props","theme","size","css","getAvatarRadiusStyles","radius","getAvatarColorStyles","color","isDisabled","getColorVariant","lightColor","darkColor","StyledAvatar","styled","AvatarImage","AvatarInitials","AvatarFallback","StatusIndicator","DefaultFallbackIcon","jsx","getInitials","name","word","Avatar","React","src","alt","isBordered","fallback","showStatus","statusColor","statusPlacement","className","onError","ref","useTheme","imageError","setImageError","useState","imageLoaded","setImageLoaded","useEffect","handleImageError","handleImageLoad","avatarProps","renderContent","jsxs","StyledAvatarGroup","AvatarGroupItem","ExtraAvatarsCount","AvatarGroup","children","max","spacing","childrenArray","visibleChildren","extraCount","groupProps","child","index"],"mappings":"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"}