'use strict';
import { jsxs, jsx } from 'react/jsx-runtime';
import { Image } from '../../../fd-component-toolbox/image/Image.js';
import { imgAvatarPath } from '../status-board-constants.js';
import { Avatar, AvatarImage, AvatarFallback } from '../../../fd-component-toolbox/avatar/Avatar.js';

var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", {
  value,
  configurable: true
});
function StatusBoardItemComponent({
  item
}) {
  return /* @__PURE__ */jsxs("div", {
    className: "border-foreground/10 bg-background group flex w-72 max-w-md cursor-pointer flex-col gap-3 rounded-lg border p-4 shadow-sm transition-shadow duration-300 hover:shadow-md",
    children: [/* @__PURE__ */jsx("div", {
      className: "text-foreground/70 text-sm font-semibold",
      children: item.content
    }), /* @__PURE__ */jsx("div", {
      className: "text-muted flex items-center justify-between text-xs",
      children: /* @__PURE__ */jsxs(Avatar, {
        className: "ml-auto size-7",
        children: [/* @__PURE__ */jsx(AvatarImage, {}), /* @__PURE__ */jsx(AvatarFallback, {
          children: /* @__PURE__ */jsx(Image, {
            className: "rounded-full object-cover",
            src: imgAvatarPath,
            alt: "logo",
            width: 50,
            height: 50
          })
        })]
      })
    })]
  });
}
__name(StatusBoardItemComponent, "StatusBoardItemComponent");

export { StatusBoardItemComponent };
