{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"post-card","type":"registry:component","title":"Post Card","description":"A post-card component.","dependencies":["react-icons","next"],"registryDependencies":[],"files":[{"path":"src/components/ui/post-card.tsx","content":"\"use client\";\n\nimport {\n  FaRegPaperPlane,\n  FaRegHeart,\n  FaHeart,\n  FaRegBookmark,\n  FaBookmark,\n} from \"react-icons/fa\";\nimport Image from \"next/image\";\nimport { useState } from \"react\";\n\nexport const PostCard: React.FC = () => {\n  const [liked, setLiked] = useState(false);\n  const [bookmarked, setBookmarked] = useState(false);\n\n  const handleLike = () => {\n    setLiked((prev) => !prev);\n  };\n\n  const handleBookmark = () => {\n    setBookmarked((prev) => !prev);\n  };\n\n  return (\n\n   <div className=\"m-4 max-w-[30rem] w-full rounded-4xl bg-background border border-primary/10 shadow-2xl/10 p-4\">\n      {/* Header */}\n      <div className=\"flex items-center justify-between gap-4 card-header\">\n        <div className=\"flex items-center gap-4\">\n          <img\n            src=\"https://i.imgur.com/MUjzWdu.png\"\n            alt=\"HextaStudio\"\n            width={35}\n            height={35}\n            className=\"rounded-full\"\n          />\n          <div>\n            <h3 className=\"flex flex-col\">\n              HextaStudio\n              <span className=\"flex items-center gap-2 opacity-70 text-sm\">\n                <small>@HextaStudio</small>\n                <span>·</span>\n                <small>7h</small>\n              </span>\n            </h3>\n          </div>\n        </div>\n      </div>\n\n      {/* Content */}\n      <div className=\"mt-4 flex flex-col gap-6\">\n        <p className=\"whitespace-pre-wrap\">\n          HextaUI – Gorgeous web components without any effort! ✨\n          <br />\n          <br />\n          🚀 HextaStudio launched their new product HextaUI, a collection of\n          beautiful web components.\n          <br />\n          <br />\n          🥳 Check it out now!\n        </p>\n        <Image\n          src=\"https://i.imgur.com/zU3m0eC.png\"\n          alt=\"HextaUI\"\n          width={1920}\n          height={1080}\n          className=\"max-w-full rounded-lg object-cover\"\n        />\n      </div>\n\n      {/* Actions */}\n      <div className=\"mt-4 flex justify-evenly gap-2\">\n        <button\n          onClick={handleLike}\n          className=\"flex grow items-center justify-center gap-3 rounded-xl px-4 py-2 transition hover:bg-secondary\"\n        >\n          {liked ? <FaHeart color=\"red\" /> : <FaRegHeart />}\n          <span className=\"inline font-medium opacity-90 text-[14px] transition hover:opacity-100 max-sm:hidden\">\n            {liked ? \"Liked\" : \"Like\"}\n          </span>\n        </button>\n\n        <button\n          onClick={handleBookmark}\n          className=\"flex grow items-center justify-center gap-3 rounded-xl px-4 py-2 transition hover:bg-secondary\"\n        >\n          {bookmarked ? <FaBookmark color=\"#00bfff\" /> : <FaRegBookmark />}\n          <span className=\"inline font-medium opacity-90 text-[14px] transition hover:opacity-100 max-sm:hidden\">\n            {bookmarked ? \"Saved\" : \"Save\"}\n          </span>\n        </button>\n\n        <button className=\"flex grow items-center justify-center gap-3 rounded-xl px-4 py-2 transition hover:bg-white/5\">\n          <FaRegPaperPlane />\n          <span className=\"inline font-medium opacity-90 text-[14px] transition hover:opacity-100 max-sm:hidden\">\n            Share\n          </span>\n        </button>\n      </div>\n    </div>\n  )\n}","type":"registry:component"}]}