@sproutsocial/seeds-react-profile 0.3.10 → 0.3.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8,14 +8,14 @@ $ tsup --dts
8
8
  CLI Cleaning output folder
9
9
  CJS Build start
10
10
  ESM Build start
11
- CJS dist/index.js 13.39 KB
12
- CJS dist/index.js.map 18.70 KB
13
- CJS ⚡️ Build success in 133ms
14
- ESM dist/esm/index.js 9.79 KB
15
- ESM dist/esm/index.js.map 18.56 KB
16
- ESM ⚡️ Build success in 131ms
11
+ CJS dist/index.js 13.36 KB
12
+ CJS dist/index.js.map 18.67 KB
13
+ CJS ⚡️ Build success in 95ms
14
+ ESM dist/esm/index.js 9.76 KB
15
+ ESM dist/esm/index.js.map 18.52 KB
16
+ ESM ⚡️ Build success in 97ms
17
17
  DTS Build start
18
- DTS ⚡️ Build success in 6479ms
18
+ DTS ⚡️ Build success in 8814ms
19
19
  DTS dist/index.d.ts 5.82 KB
20
20
  DTS dist/index.d.mts 5.82 KB
21
- Done in 9.02s.
21
+ Done in 11.26s.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,30 @@
1
1
  # @sproutsocial/seeds-react-profile
2
2
 
3
+ ## 0.3.13
4
+
5
+ ### Patch Changes
6
+
7
+ - f50b651: Remove lowercase css from inline profile component name, so that names are displayed with the correct casing.
8
+
9
+ ## 0.3.12
10
+
11
+ ### Patch Changes
12
+
13
+ - @sproutsocial/seeds-react-avatar@1.1.5
14
+ - @sproutsocial/seeds-react-card@1.1.24
15
+ - @sproutsocial/seeds-react-icon@2.2.4
16
+ - @sproutsocial/seeds-react-link@1.1.2
17
+ - @sproutsocial/seeds-react-partner-logo@1.7.2
18
+ - @sproutsocial/seeds-react-token@1.4.18
19
+
20
+ ## 0.3.11
21
+
22
+ ### Patch Changes
23
+
24
+ - @sproutsocial/seeds-react-icon@2.2.3
25
+ - @sproutsocial/seeds-react-card@1.1.23
26
+ - @sproutsocial/seeds-react-token@1.4.17
27
+
3
28
  ## 0.3.10
4
29
 
5
30
  ### Patch Changes
package/dist/esm/index.js CHANGED
@@ -225,7 +225,6 @@ var InlineProfileName = styled2.span`
225
225
  ${(props) => props.theme.typography[200]}
226
226
  font-family: ${(props) => props.theme.fontFamily};
227
227
  font-weight: ${(props) => props.theme.fontWeights.semibold};
228
- text-transform: lowercase;
229
228
  color: ${(props) => props.theme.colors.text.body};
230
229
  max-width: 100%;
231
230
  overflow: hidden;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/ProfileCard.tsx","../../src/VerifiedProfileIcon.tsx","../../src/InlineProfile.tsx","../../src/ProfileToken.tsx"],"sourcesContent":["import styled from \"styled-components\";\nimport { PartnerLogo } from \"@sproutsocial/seeds-react-partner-logo\";\nimport { Avatar } from \"@sproutsocial/seeds-react-avatar\";\nimport {\n Card,\n CardHeader,\n CardContent,\n CardFooter,\n} from \"@sproutsocial/seeds-react-card\";\nimport { Icon } from \"@sproutsocial/seeds-react-icon\";\nimport { Link } from \"@sproutsocial/seeds-react-link\";\nimport { Text } from \"@sproutsocial/seeds-react-text\";\nimport type { TypeProfileCardProps } from \"./types\";\nimport { VerifiedProfileIcon } from \"./VerifiedProfileIcon\";\n\n// Styled Components\nconst StyledProfileCard = styled(Card)`\n max-width: 300px;\n`;\n\nconst StyledCardHeader = styled(CardHeader)<{\n $bannerColor?: string;\n $partnerName?: string;\n}>`\n position: relative;\n height: 80px;\n padding: ${(props) => props.theme.space[400]}\n ${(props) => props.theme.space[400]} 0 ${(props) => props.theme.space[400]};\n margin-bottom: 0;\n color: ${(props) => props.theme.colors.text.inverse};\n border-radius: ${(props) => props.theme.radii[500]}\n ${(props) => props.theme.radii[500]} 0 0;\n ${(props) => {\n // Use explicit bannerColor if provided\n if (props.$bannerColor) {\n return `background: ${props.$bannerColor};`;\n }\n // Fall back to theme.colors.network[partnerName] if partnerName is available\n if (props.$partnerName && props.theme.colors.network) {\n const networkColor =\n props.theme.colors.network[\n props.$partnerName as keyof typeof props.theme.colors.network\n ];\n return networkColor ? `background: ${networkColor};` : \"\";\n }\n return \"\";\n }}\n`;\n\nconst BannerContent = styled.div`\n display: flex;\n justify-content: flex-end;\n width: 100%;\n`;\n\nconst ActionsSection = styled.div`\n display: flex;\n justify-content: flex-end;\n gap: ${(props) => props.theme.space[100]};\n padding: 0 ${(props) => props.theme.space[300]};\n\n &:empty {\n min-height: 44px;\n }\n`;\n\nconst StyledCardContent = styled(CardContent)`\n display: flex;\n flex-direction: column;\n gap: ${(props) => props.theme.space[300]};\n padding: 0 ${(props) => props.theme.space[400]}\n ${(props) => props.theme.space[400]};\n`;\n\nconst ProfileNameSection = styled.div`\n display: flex;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n`;\n\nconst InfoRow = styled.div`\n display: flex;\n align-items: center;\n gap: ${(props) => props.theme.space[300]};\n`;\n\n/**\n * A flexible profile component that can display user profiles in various formats\n * across different social networks with consistent styling and behavior.\n */\nexport const ProfileCard = ({\n partnerName,\n name,\n secondaryName,\n avatarUrl,\n subtext,\n description,\n verificationType,\n profileUrl,\n location,\n bannerColor,\n bannerContent,\n metadata,\n profileActions,\n footer,\n cardProps,\n}: TypeProfileCardProps) => {\n return (\n <StyledProfileCard role=\"presentation\" {...cardProps}>\n <StyledCardHeader $bannerColor={bannerColor} $partnerName={partnerName}>\n <Avatar src={avatarUrl} name={name} size=\"60px\" mt={450} />\n {bannerContent && <BannerContent>{bannerContent}</BannerContent>}\n </StyledCardHeader>\n\n <ActionsSection>{profileActions}</ActionsSection>\n\n <StyledCardContent>\n <ProfileNameSection>\n {partnerName && (\n <PartnerLogo\n partnerName={partnerName}\n aria-label={`${partnerName} profile`}\n size=\"small\"\n />\n )}\n <Text.SubHeadline as=\"h2\">{name}</Text.SubHeadline>\n </ProfileNameSection>\n\n {subtext && (\n <Text fontSize={200} color=\"text.subtext\">\n {subtext}\n </Text>\n )}\n\n {secondaryName && (\n <InfoRow>\n {profileUrl ? (\n <Link href={profileUrl} external>\n <Text fontSize={200}>{secondaryName}</Text>\n <Icon\n name=\"arrow-right-up-outline\"\n aria-hidden\n ml={100}\n size=\"small\"\n />\n </Link>\n ) : (\n <Text.SmallByline color=\"text.subtext\">\n {secondaryName}\n </Text.SmallByline>\n )}\n {verificationType && (\n <VerifiedProfileIcon\n partnerName={partnerName}\n verificationType={verificationType}\n />\n )}\n </InfoRow>\n )}\n\n {description && <Text fontSize={200}>{description}</Text>}\n\n {location && (\n <InfoRow>\n <Icon name=\"location-pin-outline\" aria-hidden size=\"small\" />\n <Text fontSize={200}>{location}</Text>\n </InfoRow>\n )}\n\n {metadata && metadata.length > 0 && (\n <InfoRow>\n {metadata.map((info, index) => (\n <Text fontSize={200} key={index}>\n {info}\n </Text>\n ))}\n </InfoRow>\n )}\n </StyledCardContent>\n\n {footer && <CardFooter>{footer}</CardFooter>}\n </StyledProfileCard>\n );\n};\n\nexport default ProfileCard;\n","import { Icon } from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeProfileNetwork, TypeProfileVerification } from \"./types\";\n\n// TODO: Move these to a more appropriate location\nconst VERIFICATION_COLORS = {\n twitter: \"#000000\",\n facebook: \"#1877F2\",\n x: \"#000000\",\n linkedin: \"#0A66C2\",\n instagram: \"#e4405f\",\n gray: \"#515e5f\",\n} as const;\n\n/**\n * Gets the verification color based on partnerName and verification type\n */\nexport const getVerificationColor = (\n partnerName?: TypeProfileNetwork,\n verificationType?: TypeProfileVerification\n): string => {\n if (!verificationType || verificationType === \"not_verified\") return \"\";\n\n switch (verificationType) {\n case \"blue_verified\":\n // Use partner-specific blue color\n return partnerName === \"facebook\"\n ? VERIFICATION_COLORS.facebook\n : VERIFICATION_COLORS.twitter;\n case \"gray_verified\":\n return VERIFICATION_COLORS.gray;\n case \"verified\":\n default:\n // Default to partner color or Twitter blue\n if (partnerName && partnerName in VERIFICATION_COLORS) {\n return VERIFICATION_COLORS[\n partnerName as keyof typeof VERIFICATION_COLORS\n ];\n }\n return VERIFICATION_COLORS.twitter;\n }\n};\n\nexport interface TypeVerifiedProfileIconProps {\n partnerName?: TypeProfileNetwork;\n verificationType: TypeProfileVerification;\n}\n\nexport const VerifiedProfileIcon = ({\n partnerName,\n verificationType,\n}: TypeVerifiedProfileIconProps) => {\n if (!verificationType || verificationType === \"not_verified\") return;\n\n const verificationColor = getVerificationColor(partnerName, verificationType);\n return (\n <Icon\n title=\"Verified\"\n aria-label=\"Verified account\"\n color={verificationColor}\n name=\"verified\"\n ml=\"150\"\n />\n );\n};\n","import styled from \"styled-components\";\nimport { PartnerLogo } from \"@sproutsocial/seeds-react-partner-logo\";\nimport { Avatar } from \"@sproutsocial/seeds-react-avatar\";\nimport type { TypeInlineProfileProps } from \"./types\";\nimport { VerifiedProfileIcon } from \"./VerifiedProfileIcon\";\n\nconst InlineProfileContainer = styled.span<{\n $size?: \"small\" | \"medium\" | \"large\";\n}>`\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n max-width: 100%;\n ${(props) => props.theme.typography[200]}\n color: ${(props) => props.theme.colors.text.subtext};\n text-align: inherit;\n`;\n\nconst InlineProfileAvatar = styled.span`\n display: inline-flex;\n flex-shrink: 0;\n`;\n\nconst InlineProfileContent = styled.span`\n display: inline-flex;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n min-width: 0;\n flex: 1;\n`;\n\nconst InlineProfileNetwork = styled.span`\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n`;\n\nconst InlineProfileText = styled.span`\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n min-width: 0;\n flex: 1;\n`;\n\nconst InlineProfileName = styled.span`\n display: inline-block;\n ${(props) => props.theme.typography[200]}\n font-family: ${(props) => props.theme.fontFamily};\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n text-transform: lowercase;\n color: ${(props) => props.theme.colors.text.body};\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nconst InlineProfileHandle = styled.span`\n display: inline-block;\n ${(props) => props.theme.typography[200]}\n font-family: ${(props) => props.theme.fontFamily};\n color: ${(props) => props.theme.colors.text.subtext};\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nconst avatarSizeMap = {\n small: \"16px\",\n medium: \"20px\",\n large: \"24px\",\n} as const;\n\n/**\n * A compact inline profile component that displays avatar, name/handle, and verification.\n * Perfect for use in post headers, comments, or other compact spaces.\n *\n * @param props - Profile props\n * @param props.name - Name of the profile\n * @param props.secondaryName - Secondary name of the profile\n * @param props.partnerName - Partner logo name\n * @param props.partnerLogoLabel - Aria-label for the partner logo\n * @param props.avatarSize - Size of the avatar\n * @param props.avatarUrl - Image URL for the avatar\n * @param props.children - Additional elements to render within the profile component\n * @returns JSX.Element representing a user profile\n *\n * @example\n * <InlineProfile\n * name=\"John Doe\"\n * secondaryName=\"johndoe123\"\n * partnerName=\"facebook\"\n * partnerLogoLabel=\"Facebook Logo\"\n * avatarSize=\"24px\"\n * avatarUrl=\"https://example.com/avatar.jpg\"\n * >\n * <Badge text=\"Moderator\" badgeColor=\"green\" />\n * </InlineProfile>\n */\nexport const InlineProfile = ({\n name,\n secondaryName,\n partnerName,\n partnerLogoLabel,\n size = \"medium\",\n avatarSize: avatarSizeOverride,\n avatarUrl,\n verificationType,\n className,\n}: TypeInlineProfileProps) => {\n const displayName = name || secondaryName || \"Unknown Profile\";\n const avatarSize = avatarSizeOverride || avatarSizeMap[size];\n\n return (\n <InlineProfileContainer className={className} $size={size}>\n {avatarUrl && (\n <InlineProfileAvatar>\n <Avatar src={avatarUrl} name={displayName} size={avatarSize} />\n </InlineProfileAvatar>\n )}\n\n <InlineProfileContent>\n {partnerName && (\n <InlineProfileNetwork>\n <PartnerLogo\n partnerName={partnerName}\n aria-label={partnerLogoLabel || `${partnerName} profile`}\n size=\"small\"\n />\n </InlineProfileNetwork>\n )}\n\n <InlineProfileText>\n {name && <InlineProfileName>{name}</InlineProfileName>}\n\n {secondaryName && (\n <InlineProfileHandle>{secondaryName}</InlineProfileHandle>\n )}\n </InlineProfileText>\n\n {verificationType && (\n <VerifiedProfileIcon\n partnerName={partnerName}\n verificationType={verificationType}\n />\n )}\n </InlineProfileContent>\n </InlineProfileContainer>\n );\n};\n","import styled from \"styled-components\";\nimport { Token } from \"@sproutsocial/seeds-react-token\";\nimport { InlineProfile } from \"./InlineProfile\";\nimport type { ProfileTokenProps } from \"./types\";\n\nconst StyledProfileToken = styled(Token)`\n box-sizing: border-box;\n display: inline-flex;\n max-width: 100%;\n vertical-align: middle;\n padding: ${(props) => props.theme.space[100]}\n ${(props) => props.theme.space[200]};\n margin: ${(props) => props.theme.space[100]} 0;\n`;\n\n/**\n * A ProfileToken component that wraps InlineProfile in a Seeds Token component.\n * This token is not closable and provides a compact way to display profile information inline.\n *\n * ProfileToken enforces design standards by only showing the profile name and network logo.\n * It does not support avatars, secondary names (handles), or custom avatar sizes.\n * Use InlineProfile directly if you need more flexibility.\n */\nexport const ProfileToken = ({\n className,\n onClick,\n tokenProps,\n ...props\n}: ProfileTokenProps) => (\n <StyledProfileToken\n className={className}\n closeable={false}\n onClick={onClick}\n {...tokenProps}\n >\n <InlineProfile size=\"small\" {...props} />\n </StyledProfileToken>\n);\n\nexport default ProfileToken;\n"],"mappings":"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","names":["Icon","jsx","Icon","styled","PartnerLogo","Avatar","jsx","jsxs","styled","Avatar","PartnerLogo","styled","jsx","styled"]}
1
+ {"version":3,"sources":["../../src/ProfileCard.tsx","../../src/VerifiedProfileIcon.tsx","../../src/InlineProfile.tsx","../../src/ProfileToken.tsx"],"sourcesContent":["import styled from \"styled-components\";\nimport { PartnerLogo } from \"@sproutsocial/seeds-react-partner-logo\";\nimport { Avatar } from \"@sproutsocial/seeds-react-avatar\";\nimport {\n Card,\n CardHeader,\n CardContent,\n CardFooter,\n} from \"@sproutsocial/seeds-react-card\";\nimport { Icon } from \"@sproutsocial/seeds-react-icon\";\nimport { Link } from \"@sproutsocial/seeds-react-link\";\nimport { Text } from \"@sproutsocial/seeds-react-text\";\nimport type { TypeProfileCardProps } from \"./types\";\nimport { VerifiedProfileIcon } from \"./VerifiedProfileIcon\";\n\n// Styled Components\nconst StyledProfileCard = styled(Card)`\n max-width: 300px;\n`;\n\nconst StyledCardHeader = styled(CardHeader)<{\n $bannerColor?: string;\n $partnerName?: string;\n}>`\n position: relative;\n height: 80px;\n padding: ${(props) => props.theme.space[400]}\n ${(props) => props.theme.space[400]} 0 ${(props) => props.theme.space[400]};\n margin-bottom: 0;\n color: ${(props) => props.theme.colors.text.inverse};\n border-radius: ${(props) => props.theme.radii[500]}\n ${(props) => props.theme.radii[500]} 0 0;\n ${(props) => {\n // Use explicit bannerColor if provided\n if (props.$bannerColor) {\n return `background: ${props.$bannerColor};`;\n }\n // Fall back to theme.colors.network[partnerName] if partnerName is available\n if (props.$partnerName && props.theme.colors.network) {\n const networkColor =\n props.theme.colors.network[\n props.$partnerName as keyof typeof props.theme.colors.network\n ];\n return networkColor ? `background: ${networkColor};` : \"\";\n }\n return \"\";\n }}\n`;\n\nconst BannerContent = styled.div`\n display: flex;\n justify-content: flex-end;\n width: 100%;\n`;\n\nconst ActionsSection = styled.div`\n display: flex;\n justify-content: flex-end;\n gap: ${(props) => props.theme.space[100]};\n padding: 0 ${(props) => props.theme.space[300]};\n\n &:empty {\n min-height: 44px;\n }\n`;\n\nconst StyledCardContent = styled(CardContent)`\n display: flex;\n flex-direction: column;\n gap: ${(props) => props.theme.space[300]};\n padding: 0 ${(props) => props.theme.space[400]}\n ${(props) => props.theme.space[400]};\n`;\n\nconst ProfileNameSection = styled.div`\n display: flex;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n`;\n\nconst InfoRow = styled.div`\n display: flex;\n align-items: center;\n gap: ${(props) => props.theme.space[300]};\n`;\n\n/**\n * A flexible profile component that can display user profiles in various formats\n * across different social networks with consistent styling and behavior.\n */\nexport const ProfileCard = ({\n partnerName,\n name,\n secondaryName,\n avatarUrl,\n subtext,\n description,\n verificationType,\n profileUrl,\n location,\n bannerColor,\n bannerContent,\n metadata,\n profileActions,\n footer,\n cardProps,\n}: TypeProfileCardProps) => {\n return (\n <StyledProfileCard role=\"presentation\" {...cardProps}>\n <StyledCardHeader $bannerColor={bannerColor} $partnerName={partnerName}>\n <Avatar src={avatarUrl} name={name} size=\"60px\" mt={450} />\n {bannerContent && <BannerContent>{bannerContent}</BannerContent>}\n </StyledCardHeader>\n\n <ActionsSection>{profileActions}</ActionsSection>\n\n <StyledCardContent>\n <ProfileNameSection>\n {partnerName && (\n <PartnerLogo\n partnerName={partnerName}\n aria-label={`${partnerName} profile`}\n size=\"small\"\n />\n )}\n <Text.SubHeadline as=\"h2\">{name}</Text.SubHeadline>\n </ProfileNameSection>\n\n {subtext && (\n <Text fontSize={200} color=\"text.subtext\">\n {subtext}\n </Text>\n )}\n\n {secondaryName && (\n <InfoRow>\n {profileUrl ? (\n <Link href={profileUrl} external>\n <Text fontSize={200}>{secondaryName}</Text>\n <Icon\n name=\"arrow-right-up-outline\"\n aria-hidden\n ml={100}\n size=\"small\"\n />\n </Link>\n ) : (\n <Text.SmallByline color=\"text.subtext\">\n {secondaryName}\n </Text.SmallByline>\n )}\n {verificationType && (\n <VerifiedProfileIcon\n partnerName={partnerName}\n verificationType={verificationType}\n />\n )}\n </InfoRow>\n )}\n\n {description && <Text fontSize={200}>{description}</Text>}\n\n {location && (\n <InfoRow>\n <Icon name=\"location-pin-outline\" aria-hidden size=\"small\" />\n <Text fontSize={200}>{location}</Text>\n </InfoRow>\n )}\n\n {metadata && metadata.length > 0 && (\n <InfoRow>\n {metadata.map((info, index) => (\n <Text fontSize={200} key={index}>\n {info}\n </Text>\n ))}\n </InfoRow>\n )}\n </StyledCardContent>\n\n {footer && <CardFooter>{footer}</CardFooter>}\n </StyledProfileCard>\n );\n};\n\nexport default ProfileCard;\n","import { Icon } from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeProfileNetwork, TypeProfileVerification } from \"./types\";\n\n// TODO: Move these to a more appropriate location\nconst VERIFICATION_COLORS = {\n twitter: \"#000000\",\n facebook: \"#1877F2\",\n x: \"#000000\",\n linkedin: \"#0A66C2\",\n instagram: \"#e4405f\",\n gray: \"#515e5f\",\n} as const;\n\n/**\n * Gets the verification color based on partnerName and verification type\n */\nexport const getVerificationColor = (\n partnerName?: TypeProfileNetwork,\n verificationType?: TypeProfileVerification\n): string => {\n if (!verificationType || verificationType === \"not_verified\") return \"\";\n\n switch (verificationType) {\n case \"blue_verified\":\n // Use partner-specific blue color\n return partnerName === \"facebook\"\n ? VERIFICATION_COLORS.facebook\n : VERIFICATION_COLORS.twitter;\n case \"gray_verified\":\n return VERIFICATION_COLORS.gray;\n case \"verified\":\n default:\n // Default to partner color or Twitter blue\n if (partnerName && partnerName in VERIFICATION_COLORS) {\n return VERIFICATION_COLORS[\n partnerName as keyof typeof VERIFICATION_COLORS\n ];\n }\n return VERIFICATION_COLORS.twitter;\n }\n};\n\nexport interface TypeVerifiedProfileIconProps {\n partnerName?: TypeProfileNetwork;\n verificationType: TypeProfileVerification;\n}\n\nexport const VerifiedProfileIcon = ({\n partnerName,\n verificationType,\n}: TypeVerifiedProfileIconProps) => {\n if (!verificationType || verificationType === \"not_verified\") return;\n\n const verificationColor = getVerificationColor(partnerName, verificationType);\n return (\n <Icon\n title=\"Verified\"\n aria-label=\"Verified account\"\n color={verificationColor}\n name=\"verified\"\n ml=\"150\"\n />\n );\n};\n","import styled from \"styled-components\";\nimport { PartnerLogo } from \"@sproutsocial/seeds-react-partner-logo\";\nimport { Avatar } from \"@sproutsocial/seeds-react-avatar\";\nimport type { TypeInlineProfileProps } from \"./types\";\nimport { VerifiedProfileIcon } from \"./VerifiedProfileIcon\";\n\nconst InlineProfileContainer = styled.span<{\n $size?: \"small\" | \"medium\" | \"large\";\n}>`\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n max-width: 100%;\n ${(props) => props.theme.typography[200]}\n color: ${(props) => props.theme.colors.text.subtext};\n text-align: inherit;\n`;\n\nconst InlineProfileAvatar = styled.span`\n display: inline-flex;\n flex-shrink: 0;\n`;\n\nconst InlineProfileContent = styled.span`\n display: inline-flex;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n min-width: 0;\n flex: 1;\n`;\n\nconst InlineProfileNetwork = styled.span`\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n`;\n\nconst InlineProfileText = styled.span`\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n min-width: 0;\n flex: 1;\n`;\n\nconst InlineProfileName = styled.span`\n display: inline-block;\n ${(props) => props.theme.typography[200]}\n font-family: ${(props) => props.theme.fontFamily};\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n color: ${(props) => props.theme.colors.text.body};\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nconst InlineProfileHandle = styled.span`\n display: inline-block;\n ${(props) => props.theme.typography[200]}\n font-family: ${(props) => props.theme.fontFamily};\n color: ${(props) => props.theme.colors.text.subtext};\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nconst avatarSizeMap = {\n small: \"16px\",\n medium: \"20px\",\n large: \"24px\",\n} as const;\n\n/**\n * A compact inline profile component that displays avatar, name/handle, and verification.\n * Perfect for use in post headers, comments, or other compact spaces.\n *\n * @param props - Profile props\n * @param props.name - Name of the profile\n * @param props.secondaryName - Secondary name of the profile\n * @param props.partnerName - Partner logo name\n * @param props.partnerLogoLabel - Aria-label for the partner logo\n * @param props.avatarSize - Size of the avatar\n * @param props.avatarUrl - Image URL for the avatar\n * @param props.children - Additional elements to render within the profile component\n * @returns JSX.Element representing a user profile\n *\n * @example\n * <InlineProfile\n * name=\"John Doe\"\n * secondaryName=\"johndoe123\"\n * partnerName=\"facebook\"\n * partnerLogoLabel=\"Facebook Logo\"\n * avatarSize=\"24px\"\n * avatarUrl=\"https://example.com/avatar.jpg\"\n * >\n * <Badge text=\"Moderator\" badgeColor=\"green\" />\n * </InlineProfile>\n */\nexport const InlineProfile = ({\n name,\n secondaryName,\n partnerName,\n partnerLogoLabel,\n size = \"medium\",\n avatarSize: avatarSizeOverride,\n avatarUrl,\n verificationType,\n className,\n}: TypeInlineProfileProps) => {\n const displayName = name || secondaryName || \"Unknown Profile\";\n const avatarSize = avatarSizeOverride || avatarSizeMap[size];\n\n return (\n <InlineProfileContainer className={className} $size={size}>\n {avatarUrl && (\n <InlineProfileAvatar>\n <Avatar src={avatarUrl} name={displayName} size={avatarSize} />\n </InlineProfileAvatar>\n )}\n\n <InlineProfileContent>\n {partnerName && (\n <InlineProfileNetwork>\n <PartnerLogo\n partnerName={partnerName}\n aria-label={partnerLogoLabel || `${partnerName} profile`}\n size=\"small\"\n />\n </InlineProfileNetwork>\n )}\n\n <InlineProfileText>\n {name && <InlineProfileName>{name}</InlineProfileName>}\n\n {secondaryName && (\n <InlineProfileHandle>{secondaryName}</InlineProfileHandle>\n )}\n </InlineProfileText>\n\n {verificationType && (\n <VerifiedProfileIcon\n partnerName={partnerName}\n verificationType={verificationType}\n />\n )}\n </InlineProfileContent>\n </InlineProfileContainer>\n );\n};\n","import styled from \"styled-components\";\nimport { Token } from \"@sproutsocial/seeds-react-token\";\nimport { InlineProfile } from \"./InlineProfile\";\nimport type { ProfileTokenProps } from \"./types\";\n\nconst StyledProfileToken = styled(Token)`\n box-sizing: border-box;\n display: inline-flex;\n max-width: 100%;\n vertical-align: middle;\n padding: ${(props) => props.theme.space[100]}\n ${(props) => props.theme.space[200]};\n margin: ${(props) => props.theme.space[100]} 0;\n`;\n\n/**\n * A ProfileToken component that wraps InlineProfile in a Seeds Token component.\n * This token is not closable and provides a compact way to display profile information inline.\n *\n * ProfileToken enforces design standards by only showing the profile name and network logo.\n * It does not support avatars, secondary names (handles), or custom avatar sizes.\n * Use InlineProfile directly if you need more flexibility.\n */\nexport const ProfileToken = ({\n className,\n onClick,\n tokenProps,\n ...props\n}: ProfileTokenProps) => (\n <StyledProfileToken\n className={className}\n closeable={false}\n onClick={onClick}\n {...tokenProps}\n >\n <InlineProfile size=\"small\" {...props} />\n </StyledProfileToken>\n);\n\nexport default ProfileToken;\n"],"mappings":";AAAA,OAAO,YAAY;AACnB,SAAS,mBAAmB;AAC5B,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,QAAAA,aAAY;AACrB,SAAS,YAAY;AACrB,SAAS,YAAY;;;ACXrB,SAAS,YAAY;AAuDjB;AAnDJ,IAAM,sBAAsB;AAAA,EAC1B,SAAS;AAAA,EACT,UAAU;AAAA,EACV,GAAG;AAAA,EACH,UAAU;AAAA,EACV,WAAW;AAAA,EACX,MAAM;AACR;AAKO,IAAM,uBAAuB,CAClC,aACA,qBACW;AACX,MAAI,CAAC,oBAAoB,qBAAqB,eAAgB,QAAO;AAErE,UAAQ,kBAAkB;AAAA,IACxB,KAAK;AAEH,aAAO,gBAAgB,aACnB,oBAAoB,WACpB,oBAAoB;AAAA,IAC1B,KAAK;AACH,aAAO,oBAAoB;AAAA,IAC7B,KAAK;AAAA,IACL;AAEE,UAAI,eAAe,eAAe,qBAAqB;AACrD,eAAO,oBACL,WACF;AAAA,MACF;AACA,aAAO,oBAAoB;AAAA,EAC/B;AACF;AAOO,IAAM,sBAAsB,CAAC;AAAA,EAClC;AAAA,EACA;AACF,MAAoC;AAClC,MAAI,CAAC,oBAAoB,qBAAqB,eAAgB;AAE9D,QAAM,oBAAoB,qBAAqB,aAAa,gBAAgB;AAC5E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,cAAW;AAAA,MACX,OAAO;AAAA,MACP,MAAK;AAAA,MACL,IAAG;AAAA;AAAA,EACL;AAEJ;;;AD8CM,SACE,OAAAC,MADF;AA7FN,IAAM,oBAAoB,OAAO,IAAI;AAAA;AAAA;AAIrC,IAAM,mBAAmB,OAAO,UAAU;AAAA;AAAA;AAAA,aAM7B,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,MACxC,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC,MAAM,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAAA,WAEnE,CAAC,UAAU,MAAM,MAAM,OAAO,KAAK,OAAO;AAAA,mBAClC,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,MAC9C,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,IACnC,CAAC,UAAU;AAEX,MAAI,MAAM,cAAc;AACtB,WAAO,eAAe,MAAM,YAAY;AAAA,EAC1C;AAEA,MAAI,MAAM,gBAAgB,MAAM,MAAM,OAAO,SAAS;AACpD,UAAM,eACJ,MAAM,MAAM,OAAO,QACjB,MAAM,YACR;AACF,WAAO,eAAe,eAAe,YAAY,MAAM;AAAA,EACzD;AACA,SAAO;AACT,CAAC;AAAA;AAGH,IAAM,gBAAgB,OAAO;AAAA;AAAA;AAAA;AAAA;AAM7B,IAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA,SAGrB,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,eAC3B,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOhD,IAAM,oBAAoB,OAAO,WAAW;AAAA;AAAA;AAAA,SAGnC,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,eAC3B,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,MAC1C,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAGvC,IAAM,qBAAqB,OAAO;AAAA;AAAA;AAAA,SAGzB,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAG1C,IAAM,UAAU,OAAO;AAAA;AAAA;AAAA,SAGd,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAOnC,IAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA4B;AAC1B,SACE,qBAAC,qBAAkB,MAAK,gBAAgB,GAAG,WACzC;AAAA,yBAAC,oBAAiB,cAAc,aAAa,cAAc,aACzD;AAAA,sBAAAA,KAAC,UAAO,KAAK,WAAW,MAAY,MAAK,QAAO,IAAI,KAAK;AAAA,MACxD,iBAAiB,gBAAAA,KAAC,iBAAe,yBAAc;AAAA,OAClD;AAAA,IAEA,gBAAAA,KAAC,kBAAgB,0BAAe;AAAA,IAEhC,qBAAC,qBACC;AAAA,2BAAC,sBACE;AAAA,uBACC,gBAAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,cAAY,GAAG,WAAW;AAAA,YAC1B,MAAK;AAAA;AAAA,QACP;AAAA,QAEF,gBAAAA,KAAC,KAAK,aAAL,EAAiB,IAAG,MAAM,gBAAK;AAAA,SAClC;AAAA,MAEC,WACC,gBAAAA,KAAC,QAAK,UAAU,KAAK,OAAM,gBACxB,mBACH;AAAA,MAGD,iBACC,qBAAC,WACE;AAAA,qBACC,qBAAC,QAAK,MAAM,YAAY,UAAQ,MAC9B;AAAA,0BAAAA,KAAC,QAAK,UAAU,KAAM,yBAAc;AAAA,UACpC,gBAAAA;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,eAAW;AAAA,cACX,IAAI;AAAA,cACJ,MAAK;AAAA;AAAA,UACP;AAAA,WACF,IAEA,gBAAAD,KAAC,KAAK,aAAL,EAAiB,OAAM,gBACrB,yBACH;AAAA,QAED,oBACC,gBAAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA;AAAA,QACF;AAAA,SAEJ;AAAA,MAGD,eAAe,gBAAAA,KAAC,QAAK,UAAU,KAAM,uBAAY;AAAA,MAEjD,YACC,qBAAC,WACC;AAAA,wBAAAA,KAACC,OAAA,EAAK,MAAK,wBAAuB,eAAW,MAAC,MAAK,SAAQ;AAAA,QAC3D,gBAAAD,KAAC,QAAK,UAAU,KAAM,oBAAS;AAAA,SACjC;AAAA,MAGD,YAAY,SAAS,SAAS,KAC7B,gBAAAA,KAAC,WACE,mBAAS,IAAI,CAAC,MAAM,UACnB,gBAAAA,KAAC,QAAK,UAAU,KACb,kBADuB,KAE1B,CACD,GACH;AAAA,OAEJ;AAAA,IAEC,UAAU,gBAAAA,KAAC,cAAY,kBAAO;AAAA,KACjC;AAEJ;;;AEvLA,OAAOE,aAAY;AACnB,SAAS,eAAAC,oBAAmB;AAC5B,SAAS,UAAAC,eAAc;AAsHb,gBAAAC,MAeF,QAAAC,aAfE;AAlHV,IAAM,yBAAyBC,QAAO;AAAA;AAAA;AAAA;AAAA,SAM7B,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAAA,IAEtC,CAAC,UAAU,MAAM,MAAM,WAAW,GAAG,CAAC;AAAA,WAC/B,CAAC,UAAU,MAAM,MAAM,OAAO,KAAK,OAAO;AAAA;AAAA;AAIrD,IAAM,sBAAsBA,QAAO;AAAA;AAAA;AAAA;AAKnC,IAAM,uBAAuBA,QAAO;AAAA;AAAA;AAAA,SAG3B,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAK1C,IAAM,uBAAuBA,QAAO;AAAA;AAAA;AAAA;AAAA;AAMpC,IAAM,oBAAoBA,QAAO;AAAA;AAAA;AAAA;AAAA,SAIxB,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAK1C,IAAM,oBAAoBA,QAAO;AAAA;AAAA,IAE7B,CAAC,UAAU,MAAM,MAAM,WAAW,GAAG,CAAC;AAAA,iBACzB,CAAC,UAAU,MAAM,MAAM,UAAU;AAAA,iBACjC,CAAC,UAAU,MAAM,MAAM,YAAY,QAAQ;AAAA,WACjD,CAAC,UAAU,MAAM,MAAM,OAAO,KAAK,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAOlD,IAAM,sBAAsBA,QAAO;AAAA;AAAA,IAE/B,CAAC,UAAU,MAAM,MAAM,WAAW,GAAG,CAAC;AAAA,iBACzB,CAAC,UAAU,MAAM,MAAM,UAAU;AAAA,WACvC,CAAC,UAAU,MAAM,MAAM,OAAO,KAAK,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOrD,IAAM,gBAAgB;AAAA,EACpB,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AACT;AA4BO,IAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AACF,MAA8B;AAC5B,QAAM,cAAc,QAAQ,iBAAiB;AAC7C,QAAM,aAAa,sBAAsB,cAAc,IAAI;AAE3D,SACE,gBAAAD,MAAC,0BAAuB,WAAsB,OAAO,MAClD;AAAA,iBACC,gBAAAD,KAAC,uBACC,0BAAAA,KAACG,SAAA,EAAO,KAAK,WAAW,MAAM,aAAa,MAAM,YAAY,GAC/D;AAAA,IAGF,gBAAAF,MAAC,wBACE;AAAA,qBACC,gBAAAD,KAAC,wBACC,0BAAAA;AAAA,QAACI;AAAA,QAAA;AAAA,UACC;AAAA,UACA,cAAY,oBAAoB,GAAG,WAAW;AAAA,UAC9C,MAAK;AAAA;AAAA,MACP,GACF;AAAA,MAGF,gBAAAH,MAAC,qBACE;AAAA,gBAAQ,gBAAAD,KAAC,qBAAmB,gBAAK;AAAA,QAEjC,iBACC,gBAAAA,KAAC,uBAAqB,yBAAc;AAAA,SAExC;AAAA,MAEC,oBACC,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA;AAAA,MACF;AAAA,OAEJ;AAAA,KACF;AAEJ;;;ACxJA,OAAOK,aAAY;AACnB,SAAS,aAAa;AAkClB,gBAAAC,YAAA;AA9BJ,IAAM,qBAAqBC,QAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,aAK1B,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,MACxC,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,YAC3B,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAWtC,IAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACE,gBAAAD;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACC,GAAG;AAAA,IAEJ,0BAAAA,KAAC,iBAAc,MAAK,SAAS,GAAG,OAAO;AAAA;AACzC;","names":["Icon","jsx","Icon","styled","PartnerLogo","Avatar","jsx","jsxs","styled","Avatar","PartnerLogo","styled","jsx","styled"]}
package/dist/index.js CHANGED
@@ -258,7 +258,6 @@ var InlineProfileName = import_styled_components2.default.span`
258
258
  ${(props) => props.theme.typography[200]}
259
259
  font-family: ${(props) => props.theme.fontFamily};
260
260
  font-weight: ${(props) => props.theme.fontWeights.semibold};
261
- text-transform: lowercase;
262
261
  color: ${(props) => props.theme.colors.text.body};
263
262
  max-width: 100%;
264
263
  overflow: hidden;
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/ProfileCard.tsx","../src/VerifiedProfileIcon.tsx","../src/InlineProfile.tsx","../src/ProfileToken.tsx"],"sourcesContent":["export * from \"./ProfileCard\";\nexport * from \"./InlineProfile\";\nexport * from \"./ProfileToken\";\nexport * from \"./types\";\n","import styled from \"styled-components\";\nimport { PartnerLogo } from \"@sproutsocial/seeds-react-partner-logo\";\nimport { Avatar } from \"@sproutsocial/seeds-react-avatar\";\nimport {\n Card,\n CardHeader,\n CardContent,\n CardFooter,\n} from \"@sproutsocial/seeds-react-card\";\nimport { Icon } from \"@sproutsocial/seeds-react-icon\";\nimport { Link } from \"@sproutsocial/seeds-react-link\";\nimport { Text } from \"@sproutsocial/seeds-react-text\";\nimport type { TypeProfileCardProps } from \"./types\";\nimport { VerifiedProfileIcon } from \"./VerifiedProfileIcon\";\n\n// Styled Components\nconst StyledProfileCard = styled(Card)`\n max-width: 300px;\n`;\n\nconst StyledCardHeader = styled(CardHeader)<{\n $bannerColor?: string;\n $partnerName?: string;\n}>`\n position: relative;\n height: 80px;\n padding: ${(props) => props.theme.space[400]}\n ${(props) => props.theme.space[400]} 0 ${(props) => props.theme.space[400]};\n margin-bottom: 0;\n color: ${(props) => props.theme.colors.text.inverse};\n border-radius: ${(props) => props.theme.radii[500]}\n ${(props) => props.theme.radii[500]} 0 0;\n ${(props) => {\n // Use explicit bannerColor if provided\n if (props.$bannerColor) {\n return `background: ${props.$bannerColor};`;\n }\n // Fall back to theme.colors.network[partnerName] if partnerName is available\n if (props.$partnerName && props.theme.colors.network) {\n const networkColor =\n props.theme.colors.network[\n props.$partnerName as keyof typeof props.theme.colors.network\n ];\n return networkColor ? `background: ${networkColor};` : \"\";\n }\n return \"\";\n }}\n`;\n\nconst BannerContent = styled.div`\n display: flex;\n justify-content: flex-end;\n width: 100%;\n`;\n\nconst ActionsSection = styled.div`\n display: flex;\n justify-content: flex-end;\n gap: ${(props) => props.theme.space[100]};\n padding: 0 ${(props) => props.theme.space[300]};\n\n &:empty {\n min-height: 44px;\n }\n`;\n\nconst StyledCardContent = styled(CardContent)`\n display: flex;\n flex-direction: column;\n gap: ${(props) => props.theme.space[300]};\n padding: 0 ${(props) => props.theme.space[400]}\n ${(props) => props.theme.space[400]};\n`;\n\nconst ProfileNameSection = styled.div`\n display: flex;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n`;\n\nconst InfoRow = styled.div`\n display: flex;\n align-items: center;\n gap: ${(props) => props.theme.space[300]};\n`;\n\n/**\n * A flexible profile component that can display user profiles in various formats\n * across different social networks with consistent styling and behavior.\n */\nexport const ProfileCard = ({\n partnerName,\n name,\n secondaryName,\n avatarUrl,\n subtext,\n description,\n verificationType,\n profileUrl,\n location,\n bannerColor,\n bannerContent,\n metadata,\n profileActions,\n footer,\n cardProps,\n}: TypeProfileCardProps) => {\n return (\n <StyledProfileCard role=\"presentation\" {...cardProps}>\n <StyledCardHeader $bannerColor={bannerColor} $partnerName={partnerName}>\n <Avatar src={avatarUrl} name={name} size=\"60px\" mt={450} />\n {bannerContent && <BannerContent>{bannerContent}</BannerContent>}\n </StyledCardHeader>\n\n <ActionsSection>{profileActions}</ActionsSection>\n\n <StyledCardContent>\n <ProfileNameSection>\n {partnerName && (\n <PartnerLogo\n partnerName={partnerName}\n aria-label={`${partnerName} profile`}\n size=\"small\"\n />\n )}\n <Text.SubHeadline as=\"h2\">{name}</Text.SubHeadline>\n </ProfileNameSection>\n\n {subtext && (\n <Text fontSize={200} color=\"text.subtext\">\n {subtext}\n </Text>\n )}\n\n {secondaryName && (\n <InfoRow>\n {profileUrl ? (\n <Link href={profileUrl} external>\n <Text fontSize={200}>{secondaryName}</Text>\n <Icon\n name=\"arrow-right-up-outline\"\n aria-hidden\n ml={100}\n size=\"small\"\n />\n </Link>\n ) : (\n <Text.SmallByline color=\"text.subtext\">\n {secondaryName}\n </Text.SmallByline>\n )}\n {verificationType && (\n <VerifiedProfileIcon\n partnerName={partnerName}\n verificationType={verificationType}\n />\n )}\n </InfoRow>\n )}\n\n {description && <Text fontSize={200}>{description}</Text>}\n\n {location && (\n <InfoRow>\n <Icon name=\"location-pin-outline\" aria-hidden size=\"small\" />\n <Text fontSize={200}>{location}</Text>\n </InfoRow>\n )}\n\n {metadata && metadata.length > 0 && (\n <InfoRow>\n {metadata.map((info, index) => (\n <Text fontSize={200} key={index}>\n {info}\n </Text>\n ))}\n </InfoRow>\n )}\n </StyledCardContent>\n\n {footer && <CardFooter>{footer}</CardFooter>}\n </StyledProfileCard>\n );\n};\n\nexport default ProfileCard;\n","import { Icon } from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeProfileNetwork, TypeProfileVerification } from \"./types\";\n\n// TODO: Move these to a more appropriate location\nconst VERIFICATION_COLORS = {\n twitter: \"#000000\",\n facebook: \"#1877F2\",\n x: \"#000000\",\n linkedin: \"#0A66C2\",\n instagram: \"#e4405f\",\n gray: \"#515e5f\",\n} as const;\n\n/**\n * Gets the verification color based on partnerName and verification type\n */\nexport const getVerificationColor = (\n partnerName?: TypeProfileNetwork,\n verificationType?: TypeProfileVerification\n): string => {\n if (!verificationType || verificationType === \"not_verified\") return \"\";\n\n switch (verificationType) {\n case \"blue_verified\":\n // Use partner-specific blue color\n return partnerName === \"facebook\"\n ? VERIFICATION_COLORS.facebook\n : VERIFICATION_COLORS.twitter;\n case \"gray_verified\":\n return VERIFICATION_COLORS.gray;\n case \"verified\":\n default:\n // Default to partner color or Twitter blue\n if (partnerName && partnerName in VERIFICATION_COLORS) {\n return VERIFICATION_COLORS[\n partnerName as keyof typeof VERIFICATION_COLORS\n ];\n }\n return VERIFICATION_COLORS.twitter;\n }\n};\n\nexport interface TypeVerifiedProfileIconProps {\n partnerName?: TypeProfileNetwork;\n verificationType: TypeProfileVerification;\n}\n\nexport const VerifiedProfileIcon = ({\n partnerName,\n verificationType,\n}: TypeVerifiedProfileIconProps) => {\n if (!verificationType || verificationType === \"not_verified\") return;\n\n const verificationColor = getVerificationColor(partnerName, verificationType);\n return (\n <Icon\n title=\"Verified\"\n aria-label=\"Verified account\"\n color={verificationColor}\n name=\"verified\"\n ml=\"150\"\n />\n );\n};\n","import styled from \"styled-components\";\nimport { PartnerLogo } from \"@sproutsocial/seeds-react-partner-logo\";\nimport { Avatar } from \"@sproutsocial/seeds-react-avatar\";\nimport type { TypeInlineProfileProps } from \"./types\";\nimport { VerifiedProfileIcon } from \"./VerifiedProfileIcon\";\n\nconst InlineProfileContainer = styled.span<{\n $size?: \"small\" | \"medium\" | \"large\";\n}>`\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n max-width: 100%;\n ${(props) => props.theme.typography[200]}\n color: ${(props) => props.theme.colors.text.subtext};\n text-align: inherit;\n`;\n\nconst InlineProfileAvatar = styled.span`\n display: inline-flex;\n flex-shrink: 0;\n`;\n\nconst InlineProfileContent = styled.span`\n display: inline-flex;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n min-width: 0;\n flex: 1;\n`;\n\nconst InlineProfileNetwork = styled.span`\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n`;\n\nconst InlineProfileText = styled.span`\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n min-width: 0;\n flex: 1;\n`;\n\nconst InlineProfileName = styled.span`\n display: inline-block;\n ${(props) => props.theme.typography[200]}\n font-family: ${(props) => props.theme.fontFamily};\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n text-transform: lowercase;\n color: ${(props) => props.theme.colors.text.body};\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nconst InlineProfileHandle = styled.span`\n display: inline-block;\n ${(props) => props.theme.typography[200]}\n font-family: ${(props) => props.theme.fontFamily};\n color: ${(props) => props.theme.colors.text.subtext};\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nconst avatarSizeMap = {\n small: \"16px\",\n medium: \"20px\",\n large: \"24px\",\n} as const;\n\n/**\n * A compact inline profile component that displays avatar, name/handle, and verification.\n * Perfect for use in post headers, comments, or other compact spaces.\n *\n * @param props - Profile props\n * @param props.name - Name of the profile\n * @param props.secondaryName - Secondary name of the profile\n * @param props.partnerName - Partner logo name\n * @param props.partnerLogoLabel - Aria-label for the partner logo\n * @param props.avatarSize - Size of the avatar\n * @param props.avatarUrl - Image URL for the avatar\n * @param props.children - Additional elements to render within the profile component\n * @returns JSX.Element representing a user profile\n *\n * @example\n * <InlineProfile\n * name=\"John Doe\"\n * secondaryName=\"johndoe123\"\n * partnerName=\"facebook\"\n * partnerLogoLabel=\"Facebook Logo\"\n * avatarSize=\"24px\"\n * avatarUrl=\"https://example.com/avatar.jpg\"\n * >\n * <Badge text=\"Moderator\" badgeColor=\"green\" />\n * </InlineProfile>\n */\nexport const InlineProfile = ({\n name,\n secondaryName,\n partnerName,\n partnerLogoLabel,\n size = \"medium\",\n avatarSize: avatarSizeOverride,\n avatarUrl,\n verificationType,\n className,\n}: TypeInlineProfileProps) => {\n const displayName = name || secondaryName || \"Unknown Profile\";\n const avatarSize = avatarSizeOverride || avatarSizeMap[size];\n\n return (\n <InlineProfileContainer className={className} $size={size}>\n {avatarUrl && (\n <InlineProfileAvatar>\n <Avatar src={avatarUrl} name={displayName} size={avatarSize} />\n </InlineProfileAvatar>\n )}\n\n <InlineProfileContent>\n {partnerName && (\n <InlineProfileNetwork>\n <PartnerLogo\n partnerName={partnerName}\n aria-label={partnerLogoLabel || `${partnerName} profile`}\n size=\"small\"\n />\n </InlineProfileNetwork>\n )}\n\n <InlineProfileText>\n {name && <InlineProfileName>{name}</InlineProfileName>}\n\n {secondaryName && (\n <InlineProfileHandle>{secondaryName}</InlineProfileHandle>\n )}\n </InlineProfileText>\n\n {verificationType && (\n <VerifiedProfileIcon\n partnerName={partnerName}\n verificationType={verificationType}\n />\n )}\n </InlineProfileContent>\n </InlineProfileContainer>\n );\n};\n","import styled from \"styled-components\";\nimport { Token } from \"@sproutsocial/seeds-react-token\";\nimport { InlineProfile } from \"./InlineProfile\";\nimport type { ProfileTokenProps } from \"./types\";\n\nconst StyledProfileToken = styled(Token)`\n box-sizing: border-box;\n display: inline-flex;\n max-width: 100%;\n vertical-align: middle;\n padding: ${(props) => props.theme.space[100]}\n ${(props) => props.theme.space[200]};\n margin: ${(props) => props.theme.space[100]} 0;\n`;\n\n/**\n * A ProfileToken component that wraps InlineProfile in a Seeds Token component.\n * This token is not closable and provides a compact way to display profile information inline.\n *\n * ProfileToken enforces design standards by only showing the profile name and network logo.\n * It does not support avatars, secondary names (handles), or custom avatar sizes.\n * Use InlineProfile directly if you need more flexibility.\n */\nexport const ProfileToken = ({\n className,\n onClick,\n tokenProps,\n ...props\n}: ProfileTokenProps) => (\n <StyledProfileToken\n className={className}\n closeable={false}\n onClick={onClick}\n {...tokenProps}\n >\n <InlineProfile size=\"small\" {...props} />\n </StyledProfileToken>\n);\n\nexport default ProfileToken;\n"],"mappings":"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","names":["import_seeds_react_icon","import_jsx_runtime","styled","import_styled_components","import_seeds_react_partner_logo","import_seeds_react_avatar","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","styled"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/ProfileCard.tsx","../src/VerifiedProfileIcon.tsx","../src/InlineProfile.tsx","../src/ProfileToken.tsx"],"sourcesContent":["export * from \"./ProfileCard\";\nexport * from \"./InlineProfile\";\nexport * from \"./ProfileToken\";\nexport * from \"./types\";\n","import styled from \"styled-components\";\nimport { PartnerLogo } from \"@sproutsocial/seeds-react-partner-logo\";\nimport { Avatar } from \"@sproutsocial/seeds-react-avatar\";\nimport {\n Card,\n CardHeader,\n CardContent,\n CardFooter,\n} from \"@sproutsocial/seeds-react-card\";\nimport { Icon } from \"@sproutsocial/seeds-react-icon\";\nimport { Link } from \"@sproutsocial/seeds-react-link\";\nimport { Text } from \"@sproutsocial/seeds-react-text\";\nimport type { TypeProfileCardProps } from \"./types\";\nimport { VerifiedProfileIcon } from \"./VerifiedProfileIcon\";\n\n// Styled Components\nconst StyledProfileCard = styled(Card)`\n max-width: 300px;\n`;\n\nconst StyledCardHeader = styled(CardHeader)<{\n $bannerColor?: string;\n $partnerName?: string;\n}>`\n position: relative;\n height: 80px;\n padding: ${(props) => props.theme.space[400]}\n ${(props) => props.theme.space[400]} 0 ${(props) => props.theme.space[400]};\n margin-bottom: 0;\n color: ${(props) => props.theme.colors.text.inverse};\n border-radius: ${(props) => props.theme.radii[500]}\n ${(props) => props.theme.radii[500]} 0 0;\n ${(props) => {\n // Use explicit bannerColor if provided\n if (props.$bannerColor) {\n return `background: ${props.$bannerColor};`;\n }\n // Fall back to theme.colors.network[partnerName] if partnerName is available\n if (props.$partnerName && props.theme.colors.network) {\n const networkColor =\n props.theme.colors.network[\n props.$partnerName as keyof typeof props.theme.colors.network\n ];\n return networkColor ? `background: ${networkColor};` : \"\";\n }\n return \"\";\n }}\n`;\n\nconst BannerContent = styled.div`\n display: flex;\n justify-content: flex-end;\n width: 100%;\n`;\n\nconst ActionsSection = styled.div`\n display: flex;\n justify-content: flex-end;\n gap: ${(props) => props.theme.space[100]};\n padding: 0 ${(props) => props.theme.space[300]};\n\n &:empty {\n min-height: 44px;\n }\n`;\n\nconst StyledCardContent = styled(CardContent)`\n display: flex;\n flex-direction: column;\n gap: ${(props) => props.theme.space[300]};\n padding: 0 ${(props) => props.theme.space[400]}\n ${(props) => props.theme.space[400]};\n`;\n\nconst ProfileNameSection = styled.div`\n display: flex;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n`;\n\nconst InfoRow = styled.div`\n display: flex;\n align-items: center;\n gap: ${(props) => props.theme.space[300]};\n`;\n\n/**\n * A flexible profile component that can display user profiles in various formats\n * across different social networks with consistent styling and behavior.\n */\nexport const ProfileCard = ({\n partnerName,\n name,\n secondaryName,\n avatarUrl,\n subtext,\n description,\n verificationType,\n profileUrl,\n location,\n bannerColor,\n bannerContent,\n metadata,\n profileActions,\n footer,\n cardProps,\n}: TypeProfileCardProps) => {\n return (\n <StyledProfileCard role=\"presentation\" {...cardProps}>\n <StyledCardHeader $bannerColor={bannerColor} $partnerName={partnerName}>\n <Avatar src={avatarUrl} name={name} size=\"60px\" mt={450} />\n {bannerContent && <BannerContent>{bannerContent}</BannerContent>}\n </StyledCardHeader>\n\n <ActionsSection>{profileActions}</ActionsSection>\n\n <StyledCardContent>\n <ProfileNameSection>\n {partnerName && (\n <PartnerLogo\n partnerName={partnerName}\n aria-label={`${partnerName} profile`}\n size=\"small\"\n />\n )}\n <Text.SubHeadline as=\"h2\">{name}</Text.SubHeadline>\n </ProfileNameSection>\n\n {subtext && (\n <Text fontSize={200} color=\"text.subtext\">\n {subtext}\n </Text>\n )}\n\n {secondaryName && (\n <InfoRow>\n {profileUrl ? (\n <Link href={profileUrl} external>\n <Text fontSize={200}>{secondaryName}</Text>\n <Icon\n name=\"arrow-right-up-outline\"\n aria-hidden\n ml={100}\n size=\"small\"\n />\n </Link>\n ) : (\n <Text.SmallByline color=\"text.subtext\">\n {secondaryName}\n </Text.SmallByline>\n )}\n {verificationType && (\n <VerifiedProfileIcon\n partnerName={partnerName}\n verificationType={verificationType}\n />\n )}\n </InfoRow>\n )}\n\n {description && <Text fontSize={200}>{description}</Text>}\n\n {location && (\n <InfoRow>\n <Icon name=\"location-pin-outline\" aria-hidden size=\"small\" />\n <Text fontSize={200}>{location}</Text>\n </InfoRow>\n )}\n\n {metadata && metadata.length > 0 && (\n <InfoRow>\n {metadata.map((info, index) => (\n <Text fontSize={200} key={index}>\n {info}\n </Text>\n ))}\n </InfoRow>\n )}\n </StyledCardContent>\n\n {footer && <CardFooter>{footer}</CardFooter>}\n </StyledProfileCard>\n );\n};\n\nexport default ProfileCard;\n","import { Icon } from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeProfileNetwork, TypeProfileVerification } from \"./types\";\n\n// TODO: Move these to a more appropriate location\nconst VERIFICATION_COLORS = {\n twitter: \"#000000\",\n facebook: \"#1877F2\",\n x: \"#000000\",\n linkedin: \"#0A66C2\",\n instagram: \"#e4405f\",\n gray: \"#515e5f\",\n} as const;\n\n/**\n * Gets the verification color based on partnerName and verification type\n */\nexport const getVerificationColor = (\n partnerName?: TypeProfileNetwork,\n verificationType?: TypeProfileVerification\n): string => {\n if (!verificationType || verificationType === \"not_verified\") return \"\";\n\n switch (verificationType) {\n case \"blue_verified\":\n // Use partner-specific blue color\n return partnerName === \"facebook\"\n ? VERIFICATION_COLORS.facebook\n : VERIFICATION_COLORS.twitter;\n case \"gray_verified\":\n return VERIFICATION_COLORS.gray;\n case \"verified\":\n default:\n // Default to partner color or Twitter blue\n if (partnerName && partnerName in VERIFICATION_COLORS) {\n return VERIFICATION_COLORS[\n partnerName as keyof typeof VERIFICATION_COLORS\n ];\n }\n return VERIFICATION_COLORS.twitter;\n }\n};\n\nexport interface TypeVerifiedProfileIconProps {\n partnerName?: TypeProfileNetwork;\n verificationType: TypeProfileVerification;\n}\n\nexport const VerifiedProfileIcon = ({\n partnerName,\n verificationType,\n}: TypeVerifiedProfileIconProps) => {\n if (!verificationType || verificationType === \"not_verified\") return;\n\n const verificationColor = getVerificationColor(partnerName, verificationType);\n return (\n <Icon\n title=\"Verified\"\n aria-label=\"Verified account\"\n color={verificationColor}\n name=\"verified\"\n ml=\"150\"\n />\n );\n};\n","import styled from \"styled-components\";\nimport { PartnerLogo } from \"@sproutsocial/seeds-react-partner-logo\";\nimport { Avatar } from \"@sproutsocial/seeds-react-avatar\";\nimport type { TypeInlineProfileProps } from \"./types\";\nimport { VerifiedProfileIcon } from \"./VerifiedProfileIcon\";\n\nconst InlineProfileContainer = styled.span<{\n $size?: \"small\" | \"medium\" | \"large\";\n}>`\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n max-width: 100%;\n ${(props) => props.theme.typography[200]}\n color: ${(props) => props.theme.colors.text.subtext};\n text-align: inherit;\n`;\n\nconst InlineProfileAvatar = styled.span`\n display: inline-flex;\n flex-shrink: 0;\n`;\n\nconst InlineProfileContent = styled.span`\n display: inline-flex;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n min-width: 0;\n flex: 1;\n`;\n\nconst InlineProfileNetwork = styled.span`\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n`;\n\nconst InlineProfileText = styled.span`\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n gap: ${(props) => props.theme.space[200]};\n min-width: 0;\n flex: 1;\n`;\n\nconst InlineProfileName = styled.span`\n display: inline-block;\n ${(props) => props.theme.typography[200]}\n font-family: ${(props) => props.theme.fontFamily};\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n color: ${(props) => props.theme.colors.text.body};\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nconst InlineProfileHandle = styled.span`\n display: inline-block;\n ${(props) => props.theme.typography[200]}\n font-family: ${(props) => props.theme.fontFamily};\n color: ${(props) => props.theme.colors.text.subtext};\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nconst avatarSizeMap = {\n small: \"16px\",\n medium: \"20px\",\n large: \"24px\",\n} as const;\n\n/**\n * A compact inline profile component that displays avatar, name/handle, and verification.\n * Perfect for use in post headers, comments, or other compact spaces.\n *\n * @param props - Profile props\n * @param props.name - Name of the profile\n * @param props.secondaryName - Secondary name of the profile\n * @param props.partnerName - Partner logo name\n * @param props.partnerLogoLabel - Aria-label for the partner logo\n * @param props.avatarSize - Size of the avatar\n * @param props.avatarUrl - Image URL for the avatar\n * @param props.children - Additional elements to render within the profile component\n * @returns JSX.Element representing a user profile\n *\n * @example\n * <InlineProfile\n * name=\"John Doe\"\n * secondaryName=\"johndoe123\"\n * partnerName=\"facebook\"\n * partnerLogoLabel=\"Facebook Logo\"\n * avatarSize=\"24px\"\n * avatarUrl=\"https://example.com/avatar.jpg\"\n * >\n * <Badge text=\"Moderator\" badgeColor=\"green\" />\n * </InlineProfile>\n */\nexport const InlineProfile = ({\n name,\n secondaryName,\n partnerName,\n partnerLogoLabel,\n size = \"medium\",\n avatarSize: avatarSizeOverride,\n avatarUrl,\n verificationType,\n className,\n}: TypeInlineProfileProps) => {\n const displayName = name || secondaryName || \"Unknown Profile\";\n const avatarSize = avatarSizeOverride || avatarSizeMap[size];\n\n return (\n <InlineProfileContainer className={className} $size={size}>\n {avatarUrl && (\n <InlineProfileAvatar>\n <Avatar src={avatarUrl} name={displayName} size={avatarSize} />\n </InlineProfileAvatar>\n )}\n\n <InlineProfileContent>\n {partnerName && (\n <InlineProfileNetwork>\n <PartnerLogo\n partnerName={partnerName}\n aria-label={partnerLogoLabel || `${partnerName} profile`}\n size=\"small\"\n />\n </InlineProfileNetwork>\n )}\n\n <InlineProfileText>\n {name && <InlineProfileName>{name}</InlineProfileName>}\n\n {secondaryName && (\n <InlineProfileHandle>{secondaryName}</InlineProfileHandle>\n )}\n </InlineProfileText>\n\n {verificationType && (\n <VerifiedProfileIcon\n partnerName={partnerName}\n verificationType={verificationType}\n />\n )}\n </InlineProfileContent>\n </InlineProfileContainer>\n );\n};\n","import styled from \"styled-components\";\nimport { Token } from \"@sproutsocial/seeds-react-token\";\nimport { InlineProfile } from \"./InlineProfile\";\nimport type { ProfileTokenProps } from \"./types\";\n\nconst StyledProfileToken = styled(Token)`\n box-sizing: border-box;\n display: inline-flex;\n max-width: 100%;\n vertical-align: middle;\n padding: ${(props) => props.theme.space[100]}\n ${(props) => props.theme.space[200]};\n margin: ${(props) => props.theme.space[100]} 0;\n`;\n\n/**\n * A ProfileToken component that wraps InlineProfile in a Seeds Token component.\n * This token is not closable and provides a compact way to display profile information inline.\n *\n * ProfileToken enforces design standards by only showing the profile name and network logo.\n * It does not support avatars, secondary names (handles), or custom avatar sizes.\n * Use InlineProfile directly if you need more flexibility.\n */\nexport const ProfileToken = ({\n className,\n onClick,\n tokenProps,\n ...props\n}: ProfileTokenProps) => (\n <StyledProfileToken\n className={className}\n closeable={false}\n onClick={onClick}\n {...tokenProps}\n >\n <InlineProfile size=\"small\" {...props} />\n </StyledProfileToken>\n);\n\nexport default ProfileToken;\n"],"mappings":"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","names":["import_seeds_react_icon","import_jsx_runtime","styled","import_styled_components","import_seeds_react_partner_logo","import_seeds_react_avatar","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","styled"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sproutsocial/seeds-react-profile",
3
- "version": "0.3.10",
3
+ "version": "0.3.13",
4
4
  "description": "Seeds React Profile",
5
5
  "author": "Sprout Social, Inc.",
6
6
  "license": "MIT",
@@ -20,13 +20,13 @@
20
20
  "lint:fix": "eslint --fix"
21
21
  },
22
22
  "dependencies": {
23
- "@sproutsocial/seeds-react-avatar": "^1.1.4",
24
- "@sproutsocial/seeds-react-card": "^1.1.22",
25
- "@sproutsocial/seeds-react-icon": "^2.2.2",
26
- "@sproutsocial/seeds-react-link": "^1.1.1",
27
- "@sproutsocial/seeds-react-partner-logo": "^1.7.1",
23
+ "@sproutsocial/seeds-react-avatar": "^1.1.5",
24
+ "@sproutsocial/seeds-react-card": "^1.1.24",
25
+ "@sproutsocial/seeds-react-icon": "^2.2.4",
26
+ "@sproutsocial/seeds-react-link": "^1.1.2",
27
+ "@sproutsocial/seeds-react-partner-logo": "^1.7.2",
28
28
  "@sproutsocial/seeds-react-text": "^1.4.0",
29
- "@sproutsocial/seeds-react-token": "^1.4.16"
29
+ "@sproutsocial/seeds-react-token": "^1.4.18"
30
30
  },
31
31
  "devDependencies": {
32
32
  "@types/react": "^18.0.0",
@@ -50,7 +50,6 @@ const InlineProfileName = styled.span`
50
50
  ${(props) => props.theme.typography[200]}
51
51
  font-family: ${(props) => props.theme.fontFamily};
52
52
  font-weight: ${(props) => props.theme.fontWeights.semibold};
53
- text-transform: lowercase;
54
53
  color: ${(props) => props.theme.colors.text.body};
55
54
  max-width: 100%;
56
55
  overflow: hidden;