@workday/canvas-kit-labs-react
Version:
Canvas Kit Labs is an incubator for new and experimental components. Since we have a rather rigorous process for getting components in at a production level, it can be valuable to make them available earlier while we continuously iterate on the API/functi
16 lines (15 loc) • 932 B
JavaScript
import React from 'react';
import { createComponent } from '@workday/canvas-kit-react/common';
import { Avatar } from '@workday/canvas-kit-react/avatar';
import { system } from '@workday/canvas-tokens-web';
import { createStyles } from '@workday/canvas-kit-styling';
const expandableAvatarStyles = createStyles({ name: "eg4m2", styles: "margin-right:var(--cnvs-sys-space-x2);flex-shrink:0;" });
// When the component is created, it needs to be a button element to match AvatarProps.
// Once Avatar becomes a `createComponent` we can default the element type to a `div`
// and the types should be properly extracted
export const ExpandableAvatar = createComponent('div')({
displayName: 'Expandable.Avatar',
Component: ({ altText, ...elemProps }, ref, Element) => {
return (React.createElement(Avatar, { cs: expandableAvatarStyles, as: Element, altText: altText, ref: ref, size: "medium", ...elemProps }));
},
});