@hybridcore/ui 1.5.89 → 1.6.0

package/dist/components/metric-card/index.js

@@ -1,128 +1,107 @@
-import { jsx as e, jsxs as t } from "react/jsx-runtime";
-import { useTheme as k, Stack as c, Skeleton as s } from "@mui/material";
-import * as L from "react";
-import { Widget as I } from "../widget/styled.js";
-import { useMetricCardLogic as O } from "./logic.js";
-import { MetricChart as V } from "./MetricChart.js";
-import { MetricCardRoot as W, MetricCardCornerIconContainer as A, MetricCardIconContainer as S, MetricCardContent as D, MetricCardLabel as J, MetricCardValue as N, MetricCardTrendContainer as P, MetricCardDescription as q, MetricCardChartContainer as B } from "./styled.js";
-const U = L.forwardRef(
-  (b, l) => {
-    const {
-      label: h,
-      value: m,
-      calculatedValue: p,
-      calculatedChange: d,
-      description: C,
-      variant: o,
-      loading: T,
-      showChange: f,
-      showTrend: x,
-      Icon: i,
-      iconPosition: g,
-      showChart: w,
-      chartType: u,
-      sx: M,
-      other: v,
-      ownerState: r,
-      TrendIcon: z,
-      showCornerIcon: R,
-      showSideIcon: y,
-      asOf: j
-    } = O(b), n = k();
-    let a = n.palette.text.secondary;
-    return o === "primary" && (a = n.palette.primary.main), o === "success" && (a = n.palette.success.main), o === "warning" && (a = n.palette.warning.main), o === "danger" && (a = n.palette.error.main), T ? /* @__PURE__ */ e(W, { ref: l, ownerState: r, sx: M, ...v, children: /* @__PURE__ */ t(c, { spacing: 1, children: [
-      /* @__PURE__ */ e(s, { variant: "text", width: "60%" }),
-      /* @__PURE__ */ e(s, { variant: "rectangular", height: 40, width: "40%" }),
-      /* @__PURE__ */ e(s, { variant: "text", width: "80%" }),
-      w && /* @__PURE__ */ e(
-        s,
-        {
-          variant: "rectangular",
-          height: 40,
-          width: "100%",
-          sx: { mt: 2 }
-        }
-      )
-    ] }) }) : /* @__PURE__ */ e(
-      I.Root,
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import { Stack as a, Skeleton as c } from "@mui/material";
+import { Widget as l } from "../widget/styled.js";
+import { MetricChart as u } from "./MetricChart.js";
+import { useMetricCardLogic as M } from "./logic.js";
+import { MetricCardRoot as v, MetricCardCornerIconContainer as I, MetricCardIconContainer as s, MetricCardContent as y, MetricCardLabel as S, MetricCardValue as T, MetricCardTrendContainer as b, MetricCardDescription as z, MetricCardChartContainer as j } from "./styled.js";
+const A = (t) => {
+  const { state: C } = M(t), {
+    ownerState: r,
+    calculatedValue: x,
+    calculatedChange: o,
+    TrendIcon: m,
+    Icon: i,
+    showCornerIcon: g,
+    showSideIcon: d,
+    chartColor: w,
+    iconPosition: h,
+    snapshotPayload: f
+  } = C;
+  return t.loading ? /* @__PURE__ */ e(v, { ownerState: r, sx: t.sx, children: /* @__PURE__ */ n(a, { spacing: 1, children: [
+    /* @__PURE__ */ e(c, { variant: "text", width: "60%" }),
+    /* @__PURE__ */ e(c, { variant: "rectangular", height: 40, width: "40%" }),
+    /* @__PURE__ */ e(c, { variant: "text", width: "80%" }),
+    t.showChart && /* @__PURE__ */ e(
+      c,
       {
-        ref: l,
-        sx: M,
-        ...v,
-        "data-snapshot": JSON.stringify({
-          metric: h,
-          value: p,
-          change: d,
-          asOf: j
-        }),
-        children: /* @__PURE__ */ t(
-          I.Content,
+        variant: "rectangular",
+        height: 40,
+        width: "100%",
+        sx: { mt: 2 }
+      }
+    )
+  ] }) }) : /* @__PURE__ */ e(l.Root, { sx: t.sx, "data-snapshot": f, children: /* @__PURE__ */ n(
+    l.Content,
+    {
+      sx: {
+        py: { xs: 1, md: 1.5 },
+        px: { xs: 1, md: 2 }
+      },
+      children: [
+        g && i && /* @__PURE__ */ e(I, { ownerState: r, children: /* @__PURE__ */ e(i, { size: 24 }) }),
+        /* @__PURE__ */ n(
+          a,
           {
-            sx: {
-              py: { xs: 1, md: 1.5 },
-              px: { xs: 1, md: 2 }
-            },
+            direction: "row",
+            justifyContent: "space-between",
+            alignItems: "flex-start",
+            sx: { flex: 1 },
             children: [
-              R && i && /* @__PURE__ */ e(A, { ownerState: r, children: /* @__PURE__ */ e(i, { size: 24 }) }),
-              /* @__PURE__ */ t(
-                c,
+              d && i && h === "left" && /* @__PURE__ */ e(s, { ownerState: r, children: /* @__PURE__ */ e(i, { sx: { fontSize: 24 } }) }),
+              /* @__PURE__ */ n(y, { ownerState: r, children: [
+                /* @__PURE__ */ e(S, { variant: "body2", ownerState: r, children: t.label }),
+                /* @__PURE__ */ n(
+                  a,
+                  {
+                    direction: "row",
+                    alignItems: "baseline",
+                    spacing: 1,
+                    flexWrap: "wrap",
+                    children: [
+                      /* @__PURE__ */ e(T, { variant: "h4", ownerState: r, children: x }),
+                      (t.showChange || t.showTrend) && o !== "—" && /* @__PURE__ */ n(b, { ownerState: r, children: [
+                        t.showTrend && /* @__PURE__ */ e(m, { size: 16 }),
+                        t.showChange && o
+                      ] })
+                    ]
+                  }
+                )
+              ] }),
+              d && i && h === "right" && /* @__PURE__ */ e(s, { ownerState: r, children: /* @__PURE__ */ e(i, { sx: { fontSize: 24 } }) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ n(
+          a,
+          {
+            direction: { xs: "column-reverse", sm: "column" },
+            spacing: 1,
+            sx: { width: "100%", mt: 2 },
+            children: [
+              t.description && /* @__PURE__ */ e(
+                z,
                 {
-                  direction: "row",
-                  justifyContent: "space-between",
-                  alignItems: "flex-start",
-                  sx: { flex: 1 },
-                  children: [
-                    y && i && g === "left" && /* @__PURE__ */ e(S, { ownerState: r, children: /* @__PURE__ */ e(i, { sx: { fontSize: 24 } }) }),
-                    /* @__PURE__ */ t(D, { ownerState: r, children: [
-                      /* @__PURE__ */ e(J, { variant: "body2", ownerState: r, children: h }),
-                      /* @__PURE__ */ t(
-                        c,
-                        {
-                          direction: "row",
-                          alignItems: "baseline",
-                          spacing: 1,
-                          flexWrap: "wrap",
-                          children: [
-                            /* @__PURE__ */ e(N, { variant: "h4", ownerState: r, children: p }),
-                            (f || x) && d !== "—" && /* @__PURE__ */ t(P, { ownerState: r, children: [
-                              x && /* @__PURE__ */ e(z, { size: 16 }),
-                              f && d
-                            ] })
-                          ]
-                        }
-                      )
-                    ] }),
-                    y && i && g === "right" && /* @__PURE__ */ e(S, { ownerState: r, children: /* @__PURE__ */ e(i, { sx: { fontSize: 24 } }) })
-                  ]
+                  variant: "caption",
+                  ownerState: r,
+                  sx: { textAlign: { xs: "center", sm: "left" } },
+                  children: t.description
                 }
               ),
-              /* @__PURE__ */ t(
-                c,
+              t.showChart && t.chartType && (t.value ?? []).length >= 2 && /* @__PURE__ */ e(j, { ownerState: r, children: /* @__PURE__ */ e(
+                u,
                 {
-                  direction: { xs: "column-reverse", sm: "column" },
-                  spacing: 1,
-                  sx: { width: "100%", mt: 2 },
-                  children: [
-                    C && /* @__PURE__ */ e(
-                      q,
-                      {
-                        variant: "caption",
-                        ownerState: r,
-                        sx: { textAlign: { xs: "center", sm: "left" } },
-                        children: C
-                      }
-                    ),
-                    w && u && m.length >= 2 && /* @__PURE__ */ e(B, { ownerState: r, children: /* @__PURE__ */ e(V, { type: u, data: m, color: a }) })
-                  ]
+                  type: t.chartType,
+                  data: t.value,
+                  color: w
                 }
-              )
+              ) })
             ]
           }
         )
-      }
-    );
-  }
-);
+      ]
+    }
+  ) });
+};
 export {
-  U as MetricCard
+  A as MetricCard
 };

package/dist/components/metric-card/logic.js

@@ -1,168 +1,107 @@
-import { useThemeProps as D } from "@mui/material";
-import { forwardRef as R, createElement as y } from "react";
+import { useThemeProps as k, useTheme as _ } from "@mui/material";
+import { c as N } from "../../createReactComponent-C7L-DMHj.js";
 /**
  * @license @tabler/icons-react v3.44.0 - MIT
  *
  * This source code is licensed under the MIT license.
  * See the LICENSE file in the root directory of this source tree.
  */
-var F = {
-  outline: {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: 2,
-    strokeLinecap: "round",
-    strokeLinejoin: "round"
-  },
-  filled: {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    fill: "currentColor",
-    stroke: "none"
-  }
-};
-/**
- * @license @tabler/icons-react v3.44.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-const C = (w, g, m, e) => {
-  const h = R(
-    ({ color: d = "currentColor", size: u = 24, stroke: p = 2, title: o, className: f, children: r, ...a }, i) => y(
-      "svg",
-      {
-        ref: i,
-        ...F[w],
-        width: u,
-        height: u,
-        className: ["tabler-icon", `tabler-icon-${g}`, f].join(" "),
-        strokeWidth: p,
-        stroke: d,
-        ...a
-      },
-      [
-        o && y("title", { key: "svg-title" }, o),
-        ...e.map(([v, N]) => y(v, N)),
-        ...Array.isArray(r) ? r : [r]
-      ]
-    )
-  );
-  return h.displayName = `${m}`, h;
-};
-/**
- * @license @tabler/icons-react v3.44.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-const L = [["path", { d: "M5 12l14 0", key: "svg-0" }], ["path", { d: "M13 18l6 -6", key: "svg-1" }], ["path", { d: "M13 6l6 6", key: "svg-2" }]], S = C("outline", "arrow-right", "ArrowRight", L);
+const D = [["path", { d: "M5 12l14 0", key: "svg-0" }], ["path", { d: "M13 18l6 -6", key: "svg-1" }], ["path", { d: "M13 6l6 6", key: "svg-2" }]], $ = N("outline", "arrow-right", "ArrowRight", D);
 /**
  * @license @tabler/icons-react v3.44.0 - MIT
  *
  * This source code is licensed under the MIT license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const U = [["path", { d: "M3 7l6 6l4 -4l8 8", key: "svg-0" }], ["path", { d: "M21 10l0 7l-7 0", key: "svg-1" }]], j = C("outline", "trending-down", "TrendingDown", U);
+const x = [["path", { d: "M3 7l6 6l4 -4l8 8", key: "svg-0" }], ["path", { d: "M21 10l0 7l-7 0", key: "svg-1" }]], S = N("outline", "trending-down", "TrendingDown", x);
 /**
  * @license @tabler/icons-react v3.44.0 - MIT
  *
  * This source code is licensed under the MIT license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const B = [["path", { d: "M3 17l6 -6l4 4l8 -8", key: "svg-0" }], ["path", { d: "M14 7l7 0l0 7", key: "svg-1" }]], P = C("outline", "trending-up", "TrendingUp", B), H = (w) => {
-  const g = D({ props: w, name: "HCMetricCard" }), {
-    label: m,
+const F = [["path", { d: "M3 17l6 -6l4 4l8 -8", key: "svg-0" }], ["path", { d: "M14 7l7 0l0 7", key: "svg-1" }]], P = N("outline", "trending-up", "TrendingUp", F), O = (w) => {
+  const p = k({ props: w, name: "HCMetricCard" }), {
     value: e = [],
-    description: h,
-    variant: d = "default",
-    loading: u = !1,
-    showChange: p = !1,
-    changeType: o = "percentage",
-    showTrend: f = !1,
-    showIcon: r = !1,
-    icon: a,
-    iconPosition: i = "right",
-    showChart: v = !1,
-    chartType: N,
-    sx: I,
-    ...x
-  } = g, M = e.length > 0;
-  let k = "—", T = "";
-  if (M) {
+    variant: s = "default",
+    showChange: y = !1,
+    changeType: i = "percentage",
+    showTrend: b = !1,
+    showIcon: v = !1,
+    icon: d,
+    iconPosition: g = "right"
+  } = p, r = _(), u = e.length > 0;
+  let h = "—", f = "";
+  if (u) {
     const n = e[e.length - 1], t = Number(n.v);
-    isNaN(t) || (k = new Intl.NumberFormat("en-US", {
+    isNaN(t) || (h = new Intl.NumberFormat("en-US", {
       maximumFractionDigits: 2
-    }).format(t), T = n.t);
+    }).format(t), f = n.t);
   }
-  let l;
-  if (p)
+  let o;
+  if (y)
     if (e.length >= 2) {
       const n = Number(e[e.length - 1].v), t = Number(e[e.length - 2].v);
       if (isNaN(n) || isNaN(t))
-        l = "—";
-      else if (t === 0 && o === "percentage")
-        l = "—";
+        o = "—";
+      else if (t === 0 && i === "percentage")
+        o = "—";
       else {
         let c = 0;
-        o === "absolute" ? c = n - t : c = (n - t) / t * 100, l = `${c > 0 ? "+" : c < 0 ? "−" : ""}${Math.abs(c).toFixed(
-          o === "percentage" ? 1 : 2
-        )}${o === "percentage" ? "%" : ""}`;
+        i === "absolute" ? c = n - t : c = (n - t) / t * 100, o = `${c > 0 ? "+" : c < 0 ? "−" : ""}${Math.abs(c).toFixed(
+          i === "percentage" ? 1 : 2
+        )}${i === "percentage" ? "%" : ""}`;
       }
     } else
-      l = "—";
-  let s;
-  if (f && e.length >= 2) {
+      o = "—";
+  let a;
+  if (b && e.length >= 2) {
     const n = Number(e[e.length - 1].v), t = Number(e[e.length - 2].v);
-    !isNaN(n) && !isNaN(t) && (n > t ? s = "up" : n < t ? s = "down" : s = "neutral");
+    !isNaN(n) && !isNaN(t) && (n > t ? a = "up" : n < t ? a = "down" : a = "neutral");
   }
-  const $ = {
-    ...g,
-    calculatedValue: k,
-    calculatedChange: l,
-    calculatedTrend: s,
-    hasData: M,
-    changeType: o,
-    iconPosition: i,
-    variant: d
+  let m = $;
+  a === "up" ? m = P : a === "down" && (m = S);
+  const M = v && !!d && ["top-left", "top-right", "bottom-left", "bottom-right"].includes(
+    g
+  ), T = v && !!d && ["left", "right"].includes(g);
+  let l = r.palette.text.secondary;
+  s === "primary" && (l = r.palette.primary.main), s === "success" && (l = r.palette.success.main), s === "warning" && (l = r.palette.warning.main), s === "danger" && (l = r.palette.error.main);
+  const I = JSON.stringify({
+    metric: p.label,
+    value: h,
+    change: o,
+    asOf: f
+  }), C = {
+    ...p,
+    calculatedValue: h,
+    calculatedChange: o,
+    calculatedTrend: a,
+    hasData: u,
+    changeType: i,
+    iconPosition: g,
+    variant: s
   };
-  let b = S;
-  s === "up" ? b = P : s === "down" && (b = j);
-  const _ = r && !!a && ["top-left", "top-right", "bottom-left", "bottom-right"].includes(
-    i || ""
-  ), A = r && !!a && ["left", "right"].includes(i || "");
   return {
-    label: m,
-    value: e,
-    calculatedValue: k,
-    calculatedChange: l,
-    calculatedTrend: s,
-    description: h,
-    variant: d,
-    loading: u,
-    showChange: p,
-    changeType: o,
-    showTrend: f,
-    showIcon: r,
-    Icon: a,
-    iconPosition: i,
-    showChart: v,
-    chartType: N,
-    sx: I,
-    other: x,
-    ownerState: $,
-    TrendIcon: b,
-    showCornerIcon: _,
-    showSideIcon: A,
-    asOf: T
+    refs: {},
+    state: {
+      ownerState: C,
+      calculatedValue: h,
+      calculatedChange: o,
+      calculatedTrend: a,
+      hasData: u,
+      asOf: f,
+      TrendIcon: m,
+      Icon: d,
+      showCornerIcon: M,
+      showSideIcon: T,
+      chartColor: l,
+      variant: s,
+      iconPosition: g,
+      snapshotPayload: I
+    },
+    actions: {}
   };
 };
 export {
-  H as useMetricCardLogic
+  O as useMetricCardLogic
 };

package/dist/components/object-profile-card/components/avatar/index.js

@@ -0,0 +1,44 @@
+import { jsxs as i, jsx as t } from "react/jsx-runtime";
+import { Loading as h } from "../../../loading/index.js";
+import { useObjectProfileCardAvatarLogic as g } from "./logic.js";
+import { AvatarContainer as f, AvatarButton as m, AvatarCaption as v } from "./styled.js";
+import { c as u } from "../../../../createReactComponent-C7L-DMHj.js";
+/**
+ * @license @tabler/icons-react v3.44.0 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const y = [["path", { d: "M15 8h.01", key: "svg-0" }], ["path", { d: "M3 6a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3v-12", key: "svg-1" }], ["path", { d: "M3 16l5 -5c.928 -.893 2.072 -.893 3 0l5 5", key: "svg-2" }], ["path", { d: "M14 14l1 -1c.928 -.893 2.072 -.893 3 0l3 3", key: "svg-3" }]], C = u("outline", "photo", "Photo", y);
+function M(e) {
+  const { imageUrl: a, loading: r, onUpload: l, accept: c = ".jpg, .jpeg, .png", sx: d } = e, { fileInputRef: p, handleStartUpload: n, handleFileChange: s } = g(e), o = !!l;
+  return /* @__PURE__ */ i(f, { sx: d, children: [
+    a ? /* @__PURE__ */ t(
+      "img",
+      {
+        src: a,
+        width: 150,
+        height: 150,
+        onClick: o ? n : void 0,
+        style: { cursor: o ? "pointer" : "default" }
+      }
+    ) : /* @__PURE__ */ i(m, { onClick: n, disabled: !o, children: [
+      /* @__PURE__ */ t(C, { size: 24 }),
+      o && /* @__PURE__ */ t(v, { variant: "body2", children: "click here to upload" })
+    ] }),
+    o && /* @__PURE__ */ t(
+      "input",
+      {
+        ref: p,
+        type: "file",
+        accept: c,
+        style: { display: "none" },
+        onChange: s
+      }
+    ),
+    /* @__PURE__ */ t(h, { show: !!r, position: "absolute" })
+  ] });
+}
+export {
+  M as ObjectProfileCardAvatar
+};

package/dist/components/object-profile-card/components/avatar/logic.js

@@ -0,0 +1,19 @@
+import { useRef as c } from "react";
+const u = (e) => {
+  const t = c(null);
+  return {
+    fileInputRef: t,
+    handleStartUpload: () => {
+      var n;
+      e.onUpload && ((n = t.current) == null || n.click());
+    },
+    handleFileChange: (n) => {
+      var a, r;
+      const l = (a = n.target.files) == null ? void 0 : a[0];
+      l && ((r = e.onUpload) == null || r.call(e, l)), t.current && (t.current.value = "");
+    }
+  };
+};
+export {
+  u as useObjectProfileCardAvatarLogic
+};

package/dist/components/object-profile-card/components/avatar/styled.js

@@ -0,0 +1,41 @@
+import { styled as t, Box as a, ButtonBase as e, Typography as r } from "@mui/material";
+const i = t(a, {
+  name: "HCObjectProfileCardAvatar",
+  slot: "Root"
+})(({ theme: o }) => ({
+  position: "relative",
+  display: "flex",
+  flexDirection: "column",
+  width: 150,
+  height: 150,
+  alignItems: "center",
+  justifyContent: "center",
+  backgroundColor: o.palette.background.default,
+  overflow: "hidden",
+  borderRadius: "50%",
+  "& .MuiSvgIcon-root": {
+    fontSize: "50px",
+    color: o.palette.text.secondary
+  }
+})), l = t(e, {
+  name: "HCObjectProfileCardAvatar",
+  slot: "Button"
+})({
+  display: "flex",
+  flexDirection: "column",
+  flex: 1,
+  width: "100%"
+}), d = t(r, {
+  name: "HCObjectProfileCardAvatar",
+  slot: "Caption"
+})(({ theme: o }) => ({
+  background: o.palette.secondary.main,
+  color: o.palette.background.paper,
+  padding: o.spacing(0, 0.5),
+  borderRadius: o.shape.borderRadius
+}));
+export {
+  l as AvatarButton,
+  d as AvatarCaption,
+  i as AvatarContainer
+};

package/dist/components/object-profile-card/index.js

@@ -0,0 +1,90 @@
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { useTheme as y, Typography as o, Box as a, Divider as C } from "@mui/material";
+import j from "lodash";
+import { A as x } from "../../index.es-CHNMhaMi.js";
+import { FlexRow as P } from "../flex-row/index.js";
+import { InstanceVariableList as u } from "../instance-variable-list/index.js";
+import { ObjectProfileCardAvatar as O } from "./components/avatar/index.js";
+import { useObjectProfileCardLogic as A } from "./logic.js";
+import { ObjectProfileCardRoot as R, ObjectProfileCardContent as U, ObjectProfileCardHeader as H, ObjectProfileCardHierarchy as D, ObjectProfileCardVariables as I } from "./styled.js";
+import { c as T } from "../../createReactComponent-C7L-DMHj.js";
+/**
+ * @license @tabler/icons-react v3.44.0 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const _ = [["path", { d: "M9 6l6 6l-6 6", key: "svg-0" }]], d = T("outline", "chevron-right", "ChevronRight", _);
+function S(m) {
+  const l = y(), {
+    data: r,
+    template: p,
+    templateHierarchy: s,
+    icon: n,
+    avatarUploading: h,
+    onAvatarUpload: f,
+    ownerState: t,
+    sx: g,
+    other: v
+  } = A(m);
+  return j.isEmpty(r) ? null : /* @__PURE__ */ e(R, { ownerState: t, sx: g, ...v, children: /* @__PURE__ */ i(U, { ownerState: t, children: [
+    /* @__PURE__ */ i(H, { ownerState: t, children: [
+      /* @__PURE__ */ e(
+        O,
+        {
+          imageUrl: r.profileImageUrl,
+          loading: h,
+          onUpload: f
+        }
+      ),
+      /* @__PURE__ */ i(P, { gap: 1, mt: 1, children: [
+        n && /* @__PURE__ */ e("img", { src: n, height: 24 }),
+        /* @__PURE__ */ e(o, { variant: "h2", children: r.title })
+      ] }),
+      /* @__PURE__ */ i(D, { ownerState: t, children: [
+        s.map((b, c) => /* @__PURE__ */ i(a, { display: "inline", children: [
+          c > 0 && /* @__PURE__ */ e(
+            d,
+            {
+              size: 20,
+              style: { verticalAlign: "middle" },
+              color: l.palette.action.disabled
+            }
+          ),
+          /* @__PURE__ */ e(o, { variant: "caption", color: "text.secondary", children: b.name })
+        ] }, c)),
+        /* @__PURE__ */ i(a, { display: "inline", children: [
+          /* @__PURE__ */ e(
+            d,
+            {
+              size: 20,
+              style: { verticalAlign: "middle" },
+              color: l.palette.action.disabled
+            }
+          ),
+          /* @__PURE__ */ e(o, { variant: "caption", color: "text.secondary", children: r.template.name })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ i(a, { flex: 1, minHeight: 0, children: [
+      /* @__PURE__ */ e(C, {}),
+      /* @__PURE__ */ e(x, { heightRelativeToParent: "100%", children: /* @__PURE__ */ e(I, { ownerState: t, children: /* @__PURE__ */ e(
+        u,
+        {
+          variables: r.variables,
+          template: p,
+          extraData: r.description ? [
+            {
+              title: "Details",
+              type: "string",
+              value: r.description
+            }
+          ] : []
+        }
+      ) }) })
+    ] })
+  ] }) });
+}
+export {
+  S as ObjectProfileCard
+};