@helpwave/hightide
Version:
helpwave's component and theming library
42 lines • 1.22 kB
JavaScript
// src/components/layout/Tile.tsx
import Image from "next/image";
import clsx from "clsx";
import { jsx, jsxs } from "react/jsx-runtime";
var Tile = ({
title,
description,
prefix,
suffix,
className
}) => {
return /* @__PURE__ */ jsxs("div", { className: clsx("row gap-x-4 w-full items-center", className), children: [
prefix,
/* @__PURE__ */ jsxs("div", { className: "col w-full", children: [
/* @__PURE__ */ jsx("span", { className: clsx(title.className), children: title.value }),
!!description && /* @__PURE__ */ jsx("span", { className: clsx(description.className ?? "textstyle-description"), children: description.value })
] }),
suffix
] });
};
var TileWithImage = ({
url,
imageLocation = "prefix",
imageSize = { width: 24, height: 24 },
imageClassName = "",
...tileProps
}) => {
const image = /* @__PURE__ */ jsx(Image, { src: url, alt: "", ...imageSize, className: clsx(imageClassName) });
return /* @__PURE__ */ jsx(
Tile,
{
...tileProps,
prefix: imageLocation === "prefix" ? image : void 0,
suffix: imageLocation === "suffix" ? image : void 0
}
);
};
export {
Tile,
TileWithImage
};
//# sourceMappingURL=Tile.mjs.map