@payfit/unity-components
Version:
51 lines (50 loc) • 1.42 kB
JavaScript
import { Text as e } from "../../text/Text.js";
import { useDefinitionListContext as t } from "../DefinitionList.context.js";
import { forwardRef as n } from "react";
import { uyTv as r } from "@payfit/unity-themes";
import { jsx as i, jsxs as a } from "react/jsx-runtime";
//#region src/components/definition-list/parts/DefinitionItem.tsx
var o = r({
slots: {
base: "uy:flex",
term: "uy:items-center uy:flex uy:gap-25",
description: "uy:flex-1 uy:typography-body"
},
variants: {
layout: {
horizontal: { base: ["uy:grid uy:grid-cols-subgrid uy:col-span-2"] },
vertical: { base: "uy:flex-col uy:gap-25" }
},
verticalAlign: {
start: { base: "uy:items-start" },
center: { base: "uy:items-center" }
}
},
defaultVariants: { layout: "horizontal" }
}), s = n(({ term: n, termSuffix: r, description: s, verticalAlign: c, ...l }, u) => {
let { layout: d } = t(), { base: f, term: p, description: m } = o({
layout: d,
verticalAlign: c
});
return /* @__PURE__ */ a("div", {
ref: u,
className: f(),
...l,
children: [/* @__PURE__ */ a("dt", {
className: p(),
children: [/* @__PURE__ */ i(e, {
variant: "bodyStrong",
color: "inherit",
asElement: "span",
children: n
}), r]
}), /* @__PURE__ */ i("dd", {
className: m(),
"data-dd-privacy": "mask",
children: s
})]
});
});
s.displayName = "DefinitionItem";
//#endregion
export { s as DefinitionItem };