@photoroom/ui 0.1.1

package/index140.mjs

@@ -0,0 +1,94 @@
+import { jsxs as u, jsx as t } from "react/jsx-runtime";
+import { CrossIcon as c } from "@photoroom/icons/lib/monochromes";
+import { cva as o } from "./index302.mjs";
+import { clsx as b } from "./index296.mjs";
+import { useMemo as m, cloneElement as f } from "react";
+import { cn as p } from "./index7.mjs";
+const v = o(
+  [
+    "min-h-full min-w-full p-1.5 py-2",
+    "duration-200 active:bg-neutral-4 disabled:cursor-not-allowed disabled:opacity-50"
+  ],
+  {
+    variants: {
+      invalid: {
+        true: [
+          "hover:bg-background-negative-subdued-hover active:bg-background-negative-subdued-down"
+        ],
+        false: ["hover:bg-background-subdued-hover active:bg-background-subdued-down"]
+      }
+    },
+    defaultVariants: {
+      invalid: !1
+    }
+  }
+), g = o(
+  "inline-flex h-full cursor-pointer items-center overflow-hidden rounded-250 text-500 font-500 transition-all disabled:opacity-50",
+  {
+    variants: {
+      hasRemoveButton: {
+        true: "pl-1.5",
+        false: "px-1.5"
+      },
+      invalid: {
+        true: "bg-background-negative-subdued text-content-negative",
+        false: "bg-background/subdued bg-background-subdued text-content-primary focus-visible:bg-background-subdued-hover"
+      },
+      disabled: {
+        true: "disabled:cursor-not-allowed",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      hasRemoveButton: !1,
+      invalid: !1,
+      disabled: !1
+    }
+  }
+), B = ({
+  avatar: e,
+  children: r,
+  invalid: n,
+  disabled: s,
+  className: l,
+  onRemove: a,
+  ...i
+}) => {
+  const d = m(() => e ? f(e, {
+    ...e.props,
+    className: b("pointer-events-none pr-1", e.props.className),
+    size: 16
+  }) : null, [e]);
+  return /* @__PURE__ */ u(
+    "span",
+    {
+      className: p(
+        g({
+          hasRemoveButton: !!a,
+          invalid: n,
+          disabled: s
+        }),
+        l
+      ),
+      ...i,
+      children: [
+        d,
+        /* @__PURE__ */ t("span", { className: "flex-1 truncate py-0.5", children: r }),
+        a && /* @__PURE__ */ t("div", { className: "relative inset-y-0 right-0 flex h-5 items-center", children: /* @__PURE__ */ t(
+          "button",
+          {
+            type: "button",
+            disabled: s,
+            className: v({ invalid: n }),
+            onClick: a,
+            children: /* @__PURE__ */ t(c, { className: "h-3 w-3 text-black", "aria-hidden": "true" })
+          }
+        ) })
+      ]
+    }
+  );
+};
+export {
+  B as TextFieldLabel
+};
+//# sourceMappingURL=index140.mjs.map

package/index141.mjs

@@ -0,0 +1,136 @@
+import { jsxs as b, jsx as o } from "react/jsx-runtime";
+import { CrossIcon as x, ExclamationCircleIcon as h } from "@photoroom/icons/lib/monochromes";
+import { clsx as l } from "./index296.mjs";
+import { forwardRef as y, useRef as v, useImperativeHandle as g, useEffect as N, useMemo as w, useCallback as k } from "react";
+import { twMerge as R } from "./index297.mjs";
+function T({
+  density: e,
+  isClearable: t,
+  hasLeadingIcon: u,
+  isInvalid: r,
+  isEmpty: c
+}) {
+  let n = [];
+  return e === "compact" ? n = [
+    "py-1 h-8",
+    u ? "pl-9" : "pl-2.5",
+    r && t && "pr-16",
+    (r || t) && !c ? "pr-9 box-border" : "pr-2.5",
+    !r && !t && "pr-3"
+  ] : n = [
+    "py-2 h-10",
+    u ? "pl-9" : "pl-3",
+    r && t && "pr-16",
+    (r || t) && !c ? "pr-9 box-border" : "pr-2.5",
+    !r && !t && "pr-4"
+  ], n;
+}
+const j = {
+  default: "pr-[10px]",
+  compact: "pr-[7.5px]"
+}, D = ({
+  invalid: e = !1,
+  type: t = "text",
+  autoSelect: u = !1,
+  borderLess: r = !1,
+  density: c = "default",
+  leadingIcon: n,
+  onClear: a,
+  wrapperClassName: d,
+  ...s
+}, p) => {
+  const i = v(null);
+  g(p, () => i.current, []), N(() => {
+    u && i.current && i.current.select();
+  }, [u]);
+  const m = w(
+    () => T({
+      density: c,
+      isClearable: !!a,
+      hasLeadingIcon: !!n,
+      isInvalid: !!e,
+      isEmpty: !s.value
+    }),
+    [c, a, n, e, s.value]
+  ), f = k(() => {
+    !a || !i.current || (a(), i.current.focus());
+  }, [a]);
+  return /* @__PURE__ */ b("div", { className: l("relative", d), children: [
+    n && /* @__PURE__ */ o(
+      "div",
+      {
+        className: l(
+          "pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3",
+          s.disabled && "opacity-50"
+        ),
+        children: /* @__PURE__ */ o(n, { className: "h-5 w-5 text-neutral-6", "aria-hidden": "true" })
+      }
+    ),
+    /* @__PURE__ */ o(
+      "input",
+      {
+        type: t,
+        ref: i,
+        ...s,
+        className: R([
+          "w-full appearance-none rounded-500 bg-surface-high text-500 font-medium text-content-primary placeholder-neutral-6 outline-none transition duration-200 disabled:cursor-not-allowed disabled:opacity-50",
+          "focus-visible:misc-border-size-focus-ring",
+          e ? [
+            "border border-content-negative caret-content-primary",
+            "focus-visible:border-content-negative focus-visible:ring-background-negative-subdued-down"
+          ] : [
+            "border caret-content-accent",
+            "hover:border-neutral-4",
+            "focus-visible:border-content-accent focus-visible:ring-misc-focus-indicator-subdued",
+            r ? "border-transparent" : "border-misc-border"
+          ],
+          m,
+          s.className
+        ])
+      }
+    ),
+    !!s.value && a && /* @__PURE__ */ o(
+      "div",
+      {
+        className: l(
+          "absolute inset-y-0 right-0 flex items-center",
+          e ? "pr-10" : "pr-3"
+        ),
+        children: /* @__PURE__ */ o(
+          "button",
+          {
+            type: "button",
+            className: l(
+              "rounded-full p-0.5",
+              "disabled:cursor-not-allowed disabled:opacity-50"
+            ),
+            onClick: f,
+            disabled: s.disabled,
+            children: /* @__PURE__ */ o(x, { className: "h-3 w-3 text-content-primary", "aria-hidden": "true" })
+          }
+        )
+      }
+    ),
+    e && /* @__PURE__ */ o(
+      "div",
+      {
+        className: l(
+          "pointer-events-none absolute inset-y-0 right-0 flex items-center",
+          j[c]
+        ),
+        children: /* @__PURE__ */ o(
+          h,
+          {
+            className: l("h-5 w-5", e ? "text-content-negative" : "text-neutral-6"),
+            "aria-hidden": "true"
+          }
+        )
+      }
+    )
+  ] });
+}, E = y(D);
+E.displayName = "TextInput";
+export {
+  E as TextInput
+};
+//# sourceMappingURL=index141.mjs.map

package/index142.mjs

@@ -0,0 +1,27 @@
+import { jsx as a, jsxs as e } from "react/jsx-runtime";
+import { cva as c } from "./index302.mjs";
+const r = c("w-full flex-1 shrink-0 font-600", {
+  variants: {
+    size: {
+      small: "component-600",
+      default: "component-700"
+    }
+  },
+  defaultVariants: {
+    size: "default"
+  }
+}), m = ({ title: n, detail: t, action: s, size: l = "default" }) => /* @__PURE__ */ a("div", { className: "pb-2", children: /* @__PURE__ */ e("div", { className: "flex w-full items-center gap-2", children: [
+  /* @__PURE__ */ e("div", { className: r({ size: l }), children: [
+    /* @__PURE__ */ a("span", { className: "text-content-primary", children: n }),
+    !!t && /* @__PURE__ */ e("span", { className: "ml-1 text-content-secondary", children: [
+      "(",
+      t,
+      ")"
+    ] })
+  ] }),
+  s
+] }) });
+export {
+  m as ActionHeader
+};
+//# sourceMappingURL=index142.mjs.map

package/index143.mjs

@@ -0,0 +1,31 @@
+import { jsxs as t, jsx as s } from "react/jsx-runtime";
+import { ChevronRightShortIcon as n } from "@photoroom/icons/lib/monochromes";
+import { clsx as c } from "./index296.mjs";
+import { forwardRef as m } from "react";
+const a = m(
+  ({ children: r, className: e, ...i }, o) => /* @__PURE__ */ t(
+    "div",
+    {
+      ref: o,
+      ...i,
+      className: c(
+        "relative flex items-center justify-between",
+        "rounded-500 p-2.5 pr-3",
+        "cursor-pointer outline-none",
+        "hover:bg-background-subdued-hover active:bg-background-subdued-down",
+        "focus-visble:border-size-ring-3 focus-visible:ring-misc-focus-indicator focus-visible:misc-border-size-focus-ring",
+        "[&>img]:h-[20px] [&>img]:object-cover [&>img]:py-[3.5px] [&>img]:[filter:var(--font-thumbnail-filter)]",
+        e
+      ),
+      children: [
+        r,
+        /* @__PURE__ */ s(n, { className: "shrink-0 text-content-tertiary icon-size-500" })
+      ]
+    }
+  )
+);
+a.displayName = "FontFamilyRow";
+export {
+  a as FontFamilyRow
+};
+//# sourceMappingURL=index143.mjs.map

package/index144.mjs

@@ -0,0 +1,42 @@
+import { jsxs as n, jsx as s } from "react/jsx-runtime";
+import { clsx as m } from "./index296.mjs";
+import { useMemo as p, cloneElement as a } from "react";
+import { cn as d } from "./index7.mjs";
+const N = ({
+  label: t,
+  description: o,
+  avatar: e,
+  trailingElement: l,
+  className: r,
+  ...c
+}) => {
+  const i = p(() => e ? a(e, {
+    ...e.props,
+    className: m("pointer-events-none ml-auto shrink-0", e.props.className),
+    size: 20
+  }) : null, [e]);
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      ...c,
+      className: d(
+        "group flex items-center justify-between gap-3 overflow-hidden py-1.5",
+        r
+      ),
+      children: [
+        /* @__PURE__ */ n("div", { className: "flex flex-shrink gap-3 overflow-hidden", children: [
+          i,
+          /* @__PURE__ */ n("div", { className: "flex flex-auto flex-col overflow-hidden", children: [
+            /* @__PURE__ */ s("span", { className: "component-500 block truncate text-content-primary", children: t }),
+            !!o && /* @__PURE__ */ s("span", { className: "component-400 truncate text-content-secondary", children: o })
+          ] })
+        ] }),
+        !!l && /* @__PURE__ */ s("div", { className: "flex h-[40px] shrink-0 items-center gap-x-1", children: l })
+      ]
+    }
+  );
+};
+export {
+  N as PeopleListItem
+};
+//# sourceMappingURL=index144.mjs.map

package/index145.mjs

@@ -0,0 +1,61 @@
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { CheckIcon as f, DashMediumIcon as b } from "@photoroom/icons/lib/monochromes";
+import { clsx as o } from "./index296.mjs";
+import { forwardRef as p, cloneElement as h } from "react";
+import { cn as x } from "./index7.mjs";
+const g = ({ selectionState: t }) => t === "selected" ? /* @__PURE__ */ e("div", { className: "flex shrink-0 items-center justify-center", children: /* @__PURE__ */ e(f, { className: "h-5 w-5 text-content-accent" }) }) : t === "mixed" ? /* @__PURE__ */ e("div", { className: "flex shrink-0 items-center justify-center", children: /* @__PURE__ */ e(b, { className: "h-5 w-5 text-content-accent" }) }) : null, v = p(
+  ({
+    label: t,
+    subtitle: n,
+    leading: s,
+    selectionState: r = "unselected",
+    disabled: a = !1,
+    className: l,
+    ...d
+  }, u) => {
+    var c;
+    const m = r === "selected" || r === "mixed";
+    return /* @__PURE__ */ i(
+      "button",
+      {
+        ref: u,
+        type: "button",
+        disabled: a,
+        className: x(
+          "group flex w-full items-center justify-between gap-3 overflow-hidden rounded-500 p-2",
+          "bg-surface-high hover:bg-background-subdued-hover focus-visible:bg-background-subdued active:bg-background-subdued-down",
+          "transition-colors duration-150 ease-out",
+          "focus:outline-none focus-visible:ring-2 focus-visible:ring-misc-focus-indicator focus-visible:ring-offset-2",
+          "disabled:pointer-events-none disabled:opacity-30",
+          "cursor-pointer",
+          l
+        ),
+        ...d,
+        children: [
+          /* @__PURE__ */ e(
+            "div",
+            {
+              className: o(
+                "flex shrink-0 items-center justify-center rounded-200 border border-misc-border bg-surface-high p-2",
+                m && "border-2 border-content-accent"
+              ),
+              children: h(s, {
+                className: o("h-5 w-5 text-content-primary", (c = s.props) == null ? void 0 : c.className)
+              })
+            }
+          ),
+          /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 flex-col items-start justify-center gap-1", children: [
+            /* @__PURE__ */ e("span", { className: "component-500 w-full truncate text-left text-content-primary", children: t }),
+            n && /* @__PURE__ */ e("span", { className: "component-400 w-full truncate text-left text-content-secondary", children: n })
+          ] }),
+          /* @__PURE__ */ e(g, { selectionState: r })
+        ]
+      }
+    );
+  }
+);
+v.displayName = "SizeListItem";
+export {
+  v as SizeListItem
+};
+//# sourceMappingURL=index145.mjs.map

package/index146.mjs

@@ -0,0 +1,7 @@
+import { jsx as r } from "react/jsx-runtime";
+import { Root as i } from "./index386.mjs";
+const s = ({ children: t, className: o }) => /* @__PURE__ */ r(i, { type: "multiple", className: o, children: t });
+export {
+  s as VariantsList
+};
+//# sourceMappingURL=index146.mjs.map

package/index147.mjs

@@ -0,0 +1,25 @@
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { Item as o, Content as m } from "./index386.mjs";
+import { VariantsHeaderItem as s } from "./index387.mjs";
+import { VariantsListItemLeading as d } from "./index388.mjs";
+import { VariantsListItemTrailing as c } from "./index389.mjs";
+import { VariantsValueItem as l } from "./index390.mjs";
+const a = ({ value: t, header: i, children: r }) => /* @__PURE__ */ n(
+  o,
+  {
+    value: t,
+    className: "mb-1 rounded-450 data-[state=open]:bg-background-subdued",
+    children: [
+      i,
+      /* @__PURE__ */ e(m, { className: "data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up overflow-hidden", children: /* @__PURE__ */ e("div", { className: "flex flex-col py-1 misc-hairline-spacing", children: r }) })
+    ]
+  }
+);
+a.HeaderItem = s;
+a.ValueItem = l;
+a.Trailing = c;
+a.Leading = d;
+export {
+  a as VariantsListItem
+};
+//# sourceMappingURL=index147.mjs.map

package/index148.mjs

@@ -0,0 +1,126 @@
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import { clsx as t } from "./index296.mjs";
+import { useState as h, useId as x } from "react";
+import { Avatar as w } from "./index151.mjs";
+const I = ({
+  variant: r,
+  accountType: p,
+  title: m,
+  description: l,
+  thumbnail: n,
+  time: i,
+  avatar: a,
+  unread: b = !1,
+  stacked: d = !1,
+  selectable: c = !0,
+  showUnread: f = !0
+}) => {
+  const [u, g] = h(!1), s = x();
+  return /* @__PURE__ */ o(
+    "div",
+    {
+      className: t("group flex cursor-pointer gap-3 bg-surface-high p-2 pr-4", {
+        "hover:bg-background-subdued-hover active:bg-background-subdued-down": c && r === "event"
+      }),
+      children: [
+        /* @__PURE__ */ o("div", { className: "w-full pb-2", children: [
+          /* @__PURE__ */ o(
+            "div",
+            {
+              className: t("flex gap-2", {
+                "items-center": r === "event",
+                "items-start": r === "message"
+              }),
+              children: [
+                /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
+                  f && /* @__PURE__ */ e(
+                    "div",
+                    {
+                      className: t("h-2 w-2 shrink-0 rounded-full", {
+                        "bg-content-negative": b
+                      })
+                    }
+                  ),
+                  /* @__PURE__ */ e("div", { className: "shrink-0", children: /* @__PURE__ */ e(
+                    w,
+                    {
+                      size: 24,
+                      customColor: a.background,
+                      imageSrc: a.imageSrc,
+                      displayName: a.displayName,
+                      accountType: p
+                    }
+                  ) })
+                ] }),
+                /* @__PURE__ */ o(
+                  "div",
+                  {
+                    className: t({
+                      "flex max-w-[220px] flex-col overflow-hidden rounded-[12px] bg-background-subdued px-3 pb-[10px] pt-2": r === "message",
+                      "group-hover:bg-background-subdued-hover group-active:bg-background-subdued-down": r === "message" && c
+                    }),
+                    children: [
+                      /* @__PURE__ */ o(
+                        "div",
+                        {
+                          className: t("flex flex-row items-center gap-2", {
+                            "max-w-[220px]": r === "event"
+                          }),
+                          children: [
+                            /* @__PURE__ */ e("p", { className: "component-500 overflow-hidden overflow-ellipsis whitespace-nowrap font-600 text-content-primary", children: m }),
+                            i && /* @__PURE__ */ e("span", { className: "component-500 whitespace-nowrap text-content-tertiary", children: i })
+                          ]
+                        }
+                      ),
+                      r === "message" && /* @__PURE__ */ e(
+                        "p",
+                        {
+                          id: s,
+                          className: "component-500 col-start-2 line-clamp-3 max-w-[196px] self-start overflow-hidden text-ellipsis whitespace-pre-wrap break-words text-content-subdued-primary",
+                          children: l
+                        }
+                      )
+                    ]
+                  }
+                )
+              ]
+            }
+          ),
+          r === "event" && /* @__PURE__ */ e(
+            "p",
+            {
+              id: s,
+              className: t(
+                "component-500 col-start-2 line-clamp-3 self-start overflow-hidden text-ellipsis whitespace-pre-wrap break-words text-content-subdued-primary",
+                f ? "pl-12" : "pl-8"
+              ),
+              children: l
+            }
+          )
+        ] }),
+        !u && n && /* @__PURE__ */ e(
+          "figure",
+          {
+            className: t("relative shrink-0 self-start", {
+              "before:absolute before:bottom-0 before:left-0 before:h-[90%] before:w-1/2 before:origin-bottom-left before:-rotate-[5deg] before:rounded-150 before:bg-neutral-4 before:content-['']": d,
+              "after:absolute after:bottom-0 after:right-0 after:h-[90%] after:w-1/2 after:origin-bottom-right after:rotate-[5deg] after:rounded-150 after:bg-neutral-4 after:content-['']": d
+            }),
+            children: /* @__PURE__ */ e("div", { className: "relative after:pointer-events-none after:absolute after:left-0 after:top-0 after:z-10 after:h-full after:w-full after:rounded-[3px] after:border-misc-border after:content-[''] after:misc-border-size-hairline", children: /* @__PURE__ */ e(
+              "img",
+              {
+                onError: () => g(!0),
+                className: "relative z-[1] block max-h-[60px] w-12 rounded-150 object-cover",
+                src: n,
+                "aria-labelledby": s
+              }
+            ) })
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  I as ActivityRow
+};
+//# sourceMappingURL=index148.mjs.map

package/index149.mjs

@@ -0,0 +1,55 @@
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import { clsx as f } from "./index296.mjs";
+import { cn as t } from "./index7.mjs";
+import { Avatar as h } from "./index151.mjs";
+const w = ({
+  name: a,
+  message: l,
+  info: n,
+  avatar: p,
+  className: d,
+  status: i,
+  overlayButton: o,
+  isHighlighted: s = !1,
+  largeText: c = !1,
+  ...m
+}) => /* @__PURE__ */ e("div", { ...m, className: t("group relative flex gap-3 bg-surface-high px-4 py-2", d), children: /* @__PURE__ */ r("div", { className: "grid w-full grid-cols-[auto_1fr] grid-rows-none gap-x-2 gap-y-1", children: [
+  /* @__PURE__ */ e("div", { className: "shrink-0", children: /* @__PURE__ */ e(h, { size: 24, ...p }) }),
+  /* @__PURE__ */ r("div", { className: "relative w-fit", children: [
+    /* @__PURE__ */ r(
+      "div",
+      {
+        className: f(
+          "space-y-1 overflow-hidden overflow-ellipsis rounded-[12px] px-3 pb-[10px] pt-2 transition-colors",
+          {
+            "animate-spotlight-fade-subdued bg-background-spotlight": s,
+            "bg-background-subdued": !s,
+            "group-hover:bg-background-subdued-hover": o
+          }
+        ),
+        children: [
+          /* @__PURE__ */ r("div", { className: "flex flex-row gap-1 overflow-hidden overflow-ellipsis", children: [
+            /* @__PURE__ */ e("p", { className: "overflow-hidden overflow-ellipsis text-[15px] font-600 text-content-primary", children: a }),
+            /* @__PURE__ */ e("span", { className: "text-[15px] font-500 text-content-tertiary", children: n })
+          ] }),
+          /* @__PURE__ */ e(
+            "p",
+            {
+              className: t(
+                "min-w-0 overflow-hidden whitespace-pre-wrap break-words text-content-subdued-primary",
+                c ? "component-900" : "component-500"
+              ),
+              children: l
+            }
+          )
+        ]
+      }
+    ),
+    !!o && /* @__PURE__ */ e("div", { className: "pointer-events-none absolute right-[-8px] top-[-8px] z-20 opacity-0 transition-opacity group-hover:pointer-events-auto group-hover:opacity-100", children: o })
+  ] }),
+  !!i && /* @__PURE__ */ e("div", { className: "col-start-2 flex items-start pl-3", children: i })
+] }) });
+export {
+  w as CommentRow
+};
+//# sourceMappingURL=index149.mjs.map

package/index15.mjs

@@ -0,0 +1,24 @@
+import { jsx as o } from "react/jsx-runtime";
+import { HelpChatIcon as t } from "@photoroom/icons/lib/monochromes";
+import { clsx as r } from "./index296.mjs";
+const s = ({ ...e }) => /* @__PURE__ */ o(
+  "button",
+  {
+    ...e,
+    type: "button",
+    className: r(
+      "h-12 w-12 rounded-full outline-none",
+      "bg-background-default text-content-white-primary-inverted shadow-500",
+      "flex items-center justify-center",
+      "hover:bg-background-hover",
+      "focus-visible:bg-background-hover focus-visible:ring-misc-focus-indicator focus-visible:misc-border-size-focus-ring",
+      "active:bg-background-down",
+      e.className
+    ),
+    children: /* @__PURE__ */ o(t, { className: "h-6 w-6" })
+  }
+);
+export {
+  s as HelpButton
+};
+//# sourceMappingURL=index15.mjs.map

package/index150.mjs

@@ -0,0 +1,38 @@
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import { useId as d, useState as f } from "react";
+import { Avatar as m } from "./index151.mjs";
+const v = ({ avatar: a, title: l, message: s, time: i, thumbnail: o }) => {
+  const t = d(), [n, c] = f(!1);
+  return /* @__PURE__ */ e("div", { className: "relative flex px-4 py-2", children: /* @__PURE__ */ r("div", { className: "flex w-full items-center gap-5", children: [
+    /* @__PURE__ */ r("div", { className: "flex-basis-0 flex flex-shrink flex-grow gap-5 overflow-hidden", children: [
+      /* @__PURE__ */ e(m, { size: 24, ...a }),
+      /* @__PURE__ */ r("div", { className: "component-500 flex-col overflow-hidden", children: [
+        /* @__PURE__ */ r("div", { className: "flex gap-1", children: [
+          /* @__PURE__ */ e("div", { className: "overflow-hidden text-ellipsis whitespace-nowrap font-600 text-content-primary", children: l }),
+          /* @__PURE__ */ e("div", { className: "whitespace-nowrap text-content-tertiary", children: i })
+        ] }),
+        /* @__PURE__ */ e(
+          "div",
+          {
+            id: t,
+            className: "overflow-hidden text-ellipsis whitespace-nowrap text-content-secondary",
+            children: s
+          }
+        )
+      ] })
+    ] }),
+    !n && /* @__PURE__ */ e("div", { className: "relative flex-shrink-0 after:pointer-events-none after:absolute after:left-0 after:top-0 after:z-10 after:h-full after:w-full after:rounded-[3px] after:border-misc-border after:content-[''] after:misc-border-size-hairline", children: /* @__PURE__ */ e(
+      "img",
+      {
+        onError: () => c(!0),
+        className: "relative z-[1] block max-h-[60px] w-12 rounded-150 object-cover",
+        src: o,
+        "aria-labelledby": t
+      }
+    ) })
+  ] }) });
+};
+export {
+  v as EventRow
+};
+//# sourceMappingURL=index150.mjs.map