@photoroom/ui 0.1.311 → 0.1.312

package/index.mjs

@@ -56961,79 +56961,88 @@ var gxe = ({ titleBlock: e, children: r, ...i }) => /* @__PURE__ */ n("div", {
 			children: r
 		})]
 	})
-}), u9 = ({ isFeatured: e, label: r }) => /* @__PURE__ */ n("span", { children: [e ? /* @__PURE__ */ t(u, {
-	className: "text-content-primary icon-size-500",
-	"aria-hidden": "true"
-}) : /* @__PURE__ */ t(g, {
-	className: "text-content-secondary icon-size-500",
-	"aria-hidden": "true"
-}), /* @__PURE__ */ t("span", {
-	className: "sr-only",
-	children: r
-})] }), xxe = ({ title: e, otherAppName: r, photoroomIcon: i, otherAppIcon: a, features: o, includedLabel: s, excludedLabel: c, className: l, ...u }) => /* @__PURE__ */ n("div", {
+}), u9 = ({ isFeatured: e, label: r }) => /* @__PURE__ */ n("span", {
+	className: "flex items-center justify-center",
+	children: [e ? /* @__PURE__ */ t(u, {
+		className: "text-content-primary icon-size-500",
+		"aria-hidden": "true"
+	}) : /* @__PURE__ */ t(g, {
+		className: "text-content-secondary icon-size-500",
+		"aria-hidden": "true"
+	}), /* @__PURE__ */ t("span", {
+		className: "sr-only",
+		children: r
+	})]
+}), xxe = ({ title: e, otherAppName: r, photoroomIcon: i, otherAppIcon: a, features: o, includedLabel: s, excludedLabel: c, className: l, ...u }) => /* @__PURE__ */ t("div", {
 	...u,
 	className: W("rounded-500 bg-background-subdued w-full p-4 sm:p-6", l),
-	role: "table",
-	"aria-label": e,
-	children: [/* @__PURE__ */ t("div", {
-		role: "rowgroup",
-		children: /* @__PURE__ */ n("div", {
-			className: "flex items-end",
-			role: "row",
-			children: [
-				/* @__PURE__ */ t("div", {
-					role: "columnheader",
-					className: "component-600 text-content-primary min-h-12 flex-1 py-[13px] text-balance",
-					children: e
-				}),
-				/* @__PURE__ */ t("div", {
-					role: "columnheader",
-					"aria-label": r,
-					className: "flex w-12 shrink-0 items-end justify-center pb-3",
-					children: a
-				}),
-				/* @__PURE__ */ t("div", {
-					role: "columnheader",
-					"aria-label": "Photoroom",
-					className: "flex w-12 shrink-0 items-end justify-center pb-3",
-					children: i
-				})
-			]
-		})
-	}), /* @__PURE__ */ n("div", {
+	children: /* @__PURE__ */ n("div", {
 		className: "relative",
-		role: "rowgroup",
-		children: [o.map((e) => /* @__PURE__ */ n("div", {
-			className: "border-misc-divider flex items-center border-t",
-			role: "row",
-			children: [
-				/* @__PURE__ */ t("div", {
-					className: "component-light-600 text-content-secondary flex-1 py-[13px] text-balance",
-					role: "rowheader",
-					children: e.featureName
+		children: [/* @__PURE__ */ n("table", {
+			className: "w-full border-collapse",
+			"aria-label": e,
+			children: [/* @__PURE__ */ t("thead", { children: /* @__PURE__ */ n("tr", { children: [
+				/* @__PURE__ */ t("th", {
+					className: "component-600 text-content-primary min-h-12 py-[13px] text-start align-bottom text-balance",
+					children: e
 				}),
-				/* @__PURE__ */ t("div", {
-					className: "flex w-12 shrink-0 items-center justify-center self-stretch",
-					role: "cell",
-					children: /* @__PURE__ */ t(u9, {
-						isFeatured: e.isOtherAppFeature,
-						label: e.isOtherAppFeature ? s : c
+				/* @__PURE__ */ t("th", {
+					scope: "col",
+					className: "w-12 pb-3 align-bottom",
+					children: /* @__PURE__ */ n("span", {
+						className: "flex justify-center",
+						children: [/* @__PURE__ */ t("span", {
+							"aria-hidden": "true",
+							children: a
+						}), /* @__PURE__ */ t("span", {
+							className: "sr-only",
+							children: r
+						})]
 					})
 				}),
-				/* @__PURE__ */ t("div", {
-					className: "flex w-12 shrink-0 items-center justify-center self-stretch",
-					role: "cell",
-					children: /* @__PURE__ */ t(u9, {
-						isFeatured: e.isPhotoroomFeature,
-						label: e.isPhotoroomFeature ? s : c
+				/* @__PURE__ */ t("th", {
+					scope: "col",
+					className: "w-12 pb-3 align-bottom",
+					children: /* @__PURE__ */ n("span", {
+						className: "flex justify-center",
+						children: [/* @__PURE__ */ t("span", {
+							"aria-hidden": "true",
+							children: i
+						}), /* @__PURE__ */ t("span", {
+							className: "sr-only",
+							children: "Photoroom"
+						})]
 					})
 				})
-			]
-		}, e.featureName)), /* @__PURE__ */ t("div", {
+			] }) }), /* @__PURE__ */ t("tbody", { children: o.map((e) => /* @__PURE__ */ n("tr", {
+				className: "border-misc-divider border-t",
+				children: [
+					/* @__PURE__ */ t("th", {
+						scope: "row",
+						className: "component-light-600 text-content-secondary py-[13px] text-start align-middle text-balance",
+						children: e.featureName
+					}),
+					/* @__PURE__ */ t("td", {
+						className: "w-12 align-middle",
+						children: /* @__PURE__ */ t(u9, {
+							isFeatured: e.isOtherAppFeature,
+							label: e.isOtherAppFeature ? s : c
+						})
+					}),
+					/* @__PURE__ */ t("td", {
+						className: "w-12 align-middle",
+						children: /* @__PURE__ */ t(u9, {
+							isFeatured: e.isPhotoroomFeature,
+							label: e.isPhotoroomFeature ? s : c
+						})
+					})
+				]
+			}, e.featureName)) })]
+		}), /* @__PURE__ */ t("div", {
 			"aria-hidden": "true",
-			className: "rounded-400 border-content-primary pointer-events-none absolute end-0 -top-12 bottom-0 w-12 border-2"
+			className: "rounded-400 border-content-primary pointer-events-none absolute end-0 top-0 bottom-0 w-12 border-2"
 		})]
-	})]
+	})
 }), Sxe = ({ title: e, cards: r, cta: i, ...a }) => /* @__PURE__ */ t("div", {
 	className: U("pt-e700 pb-e1000", "px-4 sm:px-6 md:px-8 xl:px-10"),
 	...a,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@photoroom/ui",
-  "version": "0.1.311",
+  "version": "0.1.312",
   "private": false,
   "description": "Photoroom design system components",
   "sideEffects": [