@payfit/unity-components
Version:
44 lines (43 loc) • 1.67 kB
JavaScript
import { forwardRef as e } from "react";
import { uyTv as t } from "@payfit/unity-themes";
import { jsx as n } from "react/jsx-runtime";
//#region src/components/badge/parts/BadgeDot.tsx
var r = t({
slots: {
root: "uy:inline-flex uy:shrink-0 uy:items-center uy:justify-center",
dot: "uy:size-125 uy:rounded-full"
},
variants: { color: {
primary: { dot: "uy:bg-surface-primary" },
"primary.low": { dot: "uy:bg-surface-primary-low" },
"neutral.lowest": { dot: "uy:bg-surface-neutral-low" },
"neutral.highest": { dot: "uy:bg-surface-neutral-highest" },
danger: { dot: "uy:bg-surface-danger" },
"danger.low": { dot: "uy:bg-surface-danger-low" },
warning: { dot: "uy:bg-surface-warning" },
"warning.low": { dot: "uy:bg-surface-warning-low" },
success: { dot: "uy:bg-surface-success" },
"success.low": { dot: "uy:bg-surface-success-low" },
info: { dot: "uy:bg-surface-info" },
"info.low": { dot: "uy:bg-surface-info-low" },
"decorative-teal": { dot: "uy:bg-surface-decorative-teal" },
"decorative-purple": { dot: "uy:bg-surface-decorative-purple" },
"decorative-plum": { dot: "uy:bg-surface-decorative-plum" },
"decorative-orange": { dot: "uy:bg-surface-decorative-orange" }
} },
defaultVariants: { color: "decorative-teal" }
}), i = e(({ color: e, className: t, ...i }, a) => {
let { root: o, dot: s } = r({ color: e });
return /* @__PURE__ */ n("span", {
...i,
"aria-hidden": "true",
className: o({ className: t }),
"data-dd-privacy": "allow",
"data-unity-component": "BadgeDot",
ref: a,
children: /* @__PURE__ */ n("span", { className: s() })
});
});
i.displayName = "BadgeDot";
//#endregion
export { i as BadgeDot };