@flanksource/clicky-ui
Version:
Flanksource Clicky UI — React component library built on shadcn/ui with light/dark and density theming.
34 lines (33 loc) • 1.15 kB
JavaScript
import { jsx, jsxs } from "react/jsx-runtime";
import { cn } from "../lib/utils.js";
function KeyValueList({
items,
className,
rowClassName,
labelClassName,
valueClassName,
emptyMessage = "No details"
}) {
const visible = items.filter((item) => !item.hidden);
if (visible.length === 0) {
return /* @__PURE__ */ jsx("div", { className: "text-sm text-muted-foreground", children: emptyMessage });
}
return /* @__PURE__ */ jsx("dl", { className: cn("divide-y divide-border rounded-md border border-border", className), children: visible.map((item) => /* @__PURE__ */ jsxs(
"div",
{
className: cn(
"grid grid-cols-[minmax(7rem,12rem)_minmax(0,1fr)] gap-density-3 px-density-3 py-density-2",
rowClassName
),
children: [
/* @__PURE__ */ jsx("dt", { className: cn("text-xs font-medium text-muted-foreground", labelClassName), children: item.label }),
/* @__PURE__ */ jsx("dd", { className: cn("min-w-0 text-sm text-foreground", valueClassName), children: item.value })
]
},
item.key
)) });
}
export {
KeyValueList
};
//# sourceMappingURL=KeyValueList.js.map