UNPKG

@react-spectrum/s2

Version:
1 lines 3.96 kB
{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA4BD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBC,MAAM,0DAAgB,CAAA,GAAA,oBAAY,EAAqE;AAKvG,MAAM,0DAAS,CAAA,GAAA,iBAAS,EAAE,SAAS,OAAO,KAAkB,EAAE,GAA6B;IAChG,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,OACF,MAAM,SACN,GAAG,gBACH,YAAY,oBACZ,mBAAmB,UACnB,OAAO,sBACP,gBAAgB,QAChB,OAAO,UACP,GAAG,YACJ,GAAG;IACJ,MAAM,WAAW,CAAA,GAAA,qBAAa,EAAE;IAEhC,IAAI,UAAU,OAAO,KAAK;IAC1B,IAAI,UAAU,QAAQ;IACtB,qBACE,gBAAC,CAAA,GAAA,yCAAI;QACF,GAAG,QAAQ;QACZ,KAAK;QACL,MAAM;QACN,KAAK;QACL,cAAc;YACZ,GAAG,YAAY;YACf,OAAO;YACP,QAAQ;QACV;QACA,kBAAkB;QAClB,QAAQ,kCAAY;8BAAC;qBAAkB;QAAO,GAAG,MAAM,MAAM;QAC7D,KAAK;;AAEX","sources":["packages/@react-spectrum/s2/src/Avatar.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<Partial<AvatarProps>, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.mjs.map"}