@payfit/unity-components
Version:
50 lines (49 loc) • 1.34 kB
JavaScript
import { AvatarProvider as e, useAvatarContext as t } from "../Avatar.context.js";
import { avatarBase as n } from "../Avatar.variants.js";
import * as r from "react";
import { uyTv as i } from "@payfit/unity-themes";
import { jsx as a } from "react/jsx-runtime";
import * as o from "@radix-ui/react-avatar";
//#region src/components/avatar/parts/AvatarPair.tsx
var s = i({
extend: n,
base: "uy:absolute uy:overflow-hidden uy:leading-[0] uy:border uy:border-solid uy:border-content-inverted uy:-bottom-[var(--pair-offset)] uy:-right-[var(--pair-offset)] uy:transition-transform uy:origin-center",
variants: {
size: {
xs: "uy:size-200",
sm: "uy:size-300"
},
isHidden: {
true: "uy:scale-0",
false: "uy:scale-100"
}
},
defaultVariants: {
size: "sm",
variant: "circle",
isHidden: !1
}
}), c = r.forwardRef(({ variant: n, isHidden: r, children: i, ...c }, l) => {
let { size: u } = t(), d = u === "xl", f = d ? "sm" : "xs", p = d ? 0 : 4, m = s({
variant: n,
size: f,
isHidden: r
});
return /* @__PURE__ */ a(e, {
variant: n,
size: f,
hasPair: !0,
children: /* @__PURE__ */ a(o.Root, {
ref: l,
role: "img",
className: m,
"aria-hidden": r,
style: { "--pair-offset": `${p}px` },
...c,
children: i
})
});
});
c.displayName = "AvatarPair";
//#endregion
export { c as AvatarPair };