Muse owns muse-shaped files now

src/render/html/component/item.ts

@@ -0,0 +1,51 @@
+import type { Item } from "@proscenium/playbill";
+import { capitalize } from "lodash-es";
+import { html, renderMarkdown } from "#lib";
+import { Section } from "./base/section";
+
+export async function ItemCard(item: Item): Promise<string> {
+  const renderedMarkdown = await renderMarkdown(item.description);
+
+  let itemTypeDescriptor = "";
+
+  switch (item.type) {
+    case "wielded":
+      itemTypeDescriptor = `Wielded (${item.hands} ${item.hands === 1 ? "Hand" : "Hands"})`;
+      break;
+    case "worn":
+      itemTypeDescriptor = `Worn (${item.slot})`;
+      break;
+    case "trinket":
+      itemTypeDescriptor = "Trinket";
+      break;
+  }
+
+  const affinity =
+    item.affinity !== "none"
+      ? html`<p class="item-affinity ${item.affinity}">${item.affinity} Affinity</p>`
+      : "";
+
+  const damageType = item.damage?.type === "arc" ? "Arcane" : "Physical";
+  const damageAmount = item.damage?.amount ?? 0;
+  const damageRating =
+    damageAmount > 0
+      ? html`<p class="item-damage ${damageType}">${damageAmount} ${damageType} Damage</p>`
+      : "";
+
+  const info = html`
+    <div class="item-info">
+      ${affinity}
+      ${damageRating}
+    </div>
+  `;
+
+  return Section({
+    type: "item",
+    componentId: item.id,
+    title: item.name,
+    content: renderedMarkdown,
+    info,
+    rightCornerTag: capitalize(item.rarity),
+    leftCornerTag: itemTypeDescriptor,
+  });
+}