@workday/canvas-kit-react
Version:
The parent module that contains all Workday Canvas Kit React components
21 lines (20 loc) • 1.48 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import { createComponent } from '@workday/canvas-kit-react/common';
import { Hyperlink } from '@workday/canvas-kit-react/button';
import { OverflowTooltip } from '@workday/canvas-kit-react/tooltip';
import { system } from '@workday/canvas-tokens-web';
import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
export const breadcrumbsLinkStencil = createStencil({
vars: {
maxWidth: '',
},
base: { name: "3yqhc5", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-normal);line-height:var(--cnvs-sys-line-height-subtext-large);font-size:var(--cnvs-sys-font-size-subtext-large);letter-spacing:var(--cnvs-base-letter-spacing-150);text-overflow:ellipsis;overflow:hidden;white-space:nowrap;max-width:var(--maxWidth-breadcrumbs-link-3d9ed7);" }
}, "breadcrumbs-link-3d9ed7");
export const BreadcrumbsLink = createComponent('a')({
displayName: 'Breadcrumbs.Link',
Component: ({ maxWidth = 350, href, tooltipProps = {}, children, ...elemProps }, ref, Element) => {
return (_jsx(OverflowTooltip, { ...tooltipProps, children: _jsx(Hyperlink, { href: href, ref: ref, as: Element, role: "link", variant: "standalone", ...handleCsProp(elemProps, breadcrumbsLinkStencil({
maxWidth: typeof maxWidth === 'number' ? px2rem(maxWidth) : maxWidth,
})), children: children }) }));
},
});