@e-burgos/tucu-ui 2.6.0 → 2.7.1

package/components/blockchain/live-price-feed.mjs

@@ -0,0 +1,165 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { ArrowUp as w } from "../icons/arrow-up.mjs";
+import { ResponsiveContainer as f, AreaChart as h, Area as u } from "recharts";
+import { Swiper as g, SwiperSlide as k } from "swiper/react";
+import { A11y as N } from "swiper/modules";
+import { useIsMounted as y } from "../../hooks/use-is-mounted.mjs";
+import p from "classnames";
+import { useBreakpoint as D } from "../../hooks/use-breakpoint.mjs";
+function o({
+  id: s,
+  name: l,
+  symbol: d,
+  icon: c,
+  balance: n,
+  usdBalance: a,
+  change: r,
+  isChangePositive: i,
+  prices: x,
+  isBorder: m
+}) {
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      className: p(
+        "flex items-center gap-4 w-full rounded-lg bg-white p-5 dark:bg-light-dark lg:flex-row",
+        {
+          "light:border light:border-slate-200": !m,
+          "shadow-card": !m
+        }
+      ),
+      children: [
+        /* @__PURE__ */ t("div", { className: "w-1/3 min-w-fit flex-col", children: [
+          /* @__PURE__ */ t("div", { className: "mb-3 flex items-center", children: [
+            c,
+            /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-gray-900 ltr:ml-3 rtl:mr-3 dark:text-white", children: l })
+          ] }),
+          /* @__PURE__ */ t("div", { className: "mb-2 text-sm font-medium tracking-tighter text-gray-900 dark:text-white lg:text-lg 2xl:text-xl min-[1780px]:text-2xl", children: [
+            n,
+            /* @__PURE__ */ e("span", { className: "ml-3", children: d })
+          ] }),
+          /* @__PURE__ */ t("div", { className: "flex items-center text-sm font-medium 2xl:text-sm", children: [
+            /* @__PURE__ */ t(
+              "span",
+              {
+                className: "truncate tracking-tighter text-gray-600 ltr:mr-5 rtl:ml-5 dark:text-gray-400 2xl:w-24 min-[1780px]:w-auto",
+                title: `${a} USD`,
+                children: [
+                  a,
+                  " USD"
+                ]
+              }
+            ),
+            /* @__PURE__ */ t(
+              "span",
+              {
+                className: `flex items-center  ${i ? "text-green-500" : "text-red-500"}`,
+                children: [
+                  /* @__PURE__ */ e(
+                    "span",
+                    {
+                      className: `ltr:mr-2 rtl:ml-2 ${i ? "" : "rotate-180"}`,
+                      children: /* @__PURE__ */ e(w, {})
+                    }
+                  ),
+                  r
+                ]
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ e(
+          "div",
+          {
+            className: "h-20 w-2/3",
+            "data-hello": i ? "#22c55e" : "#D6455D",
+            children: /* @__PURE__ */ e(f, { width: "100%", height: "100%", children: /* @__PURE__ */ t(h, { data: x, children: [
+              /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ t("linearGradient", { id: `${l}-${s}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+                /* @__PURE__ */ e(
+                  "stop",
+                  {
+                    offset: "0%",
+                    stopColor: i ? "#22c55e" : "#D6455D",
+                    stopOpacity: 0.5
+                  }
+                ),
+                /* @__PURE__ */ e(
+                  "stop",
+                  {
+                    offset: "100%",
+                    stopColor: i ? "#22c55e" : "#D6455D",
+                    stopOpacity: 0
+                  }
+                )
+              ] }) }),
+              /* @__PURE__ */ e(
+                u,
+                {
+                  type: "linear",
+                  dataKey: "value",
+                  stroke: i ? "#22c55e" : "#D6455D",
+                  strokeWidth: 2.5,
+                  fill: `url(#${`${l}-${s}`})`,
+                  dot: !1
+                }
+              )
+            ] }) })
+          }
+        )
+      ]
+    }
+  );
+}
+function O({
+  limit: s,
+  priceFeeds: l,
+  gridClassName: d
+}) {
+  const c = y(), n = D(), a = {
+    480: {
+      slidesPerView: 1,
+      spaceBetween: 20
+    },
+    640: {
+      slidesPerView: 1,
+      spaceBetween: 20
+    },
+    768: {
+      slidesPerView: 1,
+      spaceBetween: 20
+    },
+    1024: {
+      slidesPerView: 2,
+      spaceBetween: 24
+    },
+    1280: {
+      slidesPerView: 2,
+      spaceBetween: 24
+    },
+    1440: {
+      slidesPerView: 2,
+      spaceBetween: 24
+    },
+    1700: {
+      slidesPerView: 2.5,
+      spaceBetween: 24
+    }
+  };
+  return c && ["xs", "sm", "md", "lg", "xl", "2xl"].indexOf(n) !== -1 ? /* @__PURE__ */ e(
+    g,
+    {
+      modules: [N],
+      spaceBetween: 24,
+      slidesPerView: 1,
+      breakpoints: a,
+      observer: !0,
+      dir: "ltr",
+      children: l.map((r) => /* @__PURE__ */ e(k, { children: /* @__PURE__ */ e(o, { ...r }) }, r.id))
+    }
+  ) : /* @__PURE__ */ e("div", { className: p("grid", d), children: l.slice(0, s ?? 4).map((r) => /* @__PURE__ */ e(o, { ...r }, r.id)) });
+}
+export {
+  o as LivePriceFeed,
+  O as PriceFeedSlider,
+  O as default
+};

package/components/blockchain/nft-grid.mjs

@@ -0,0 +1,81 @@
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { Image as c } from "../utils/image.mjs";
+import { AnchorLink as t } from "../links/anchor-link.mjs";
+import { Verified as m } from "../icons/verified.mjs";
+import { Avatar as x } from "../common/avatar.mjs";
+function w({
+  author: i,
+  authorImage: l,
+  image: n,
+  name: s,
+  collection: o,
+  price: d,
+  profilePath: a
+}) {
+  return /* @__PURE__ */ r("div", { className: "w-full relative overflow-hidden rounded-xl bg-white shadow-card transition-all duration-200 hover:shadow-large hover:-translate-y-0.5 dark:bg-gray-900 dark:shadow-none dark:ring-1 dark:ring-gray-800", children: [
+    /* @__PURE__ */ e(t, { to: "/", className: "block w-full overflow-hidden", children: /* @__PURE__ */ e(
+      c,
+      {
+        src: n,
+        alt: s,
+        fill: !0,
+        aspectRatio: "4/3",
+        objectFit: "cover",
+        containerClassName: "w-full transition-transform duration-300 hover:scale-105"
+      }
+    ) }),
+    /* @__PURE__ */ r("div", { className: "px-4 pb-4 pt-2.5 space-y-2", children: [
+      /* @__PURE__ */ r(
+        t,
+        {
+          to: a || "/",
+          className: "flex items-center gap-2 text-sm font-medium text-gray-600 transition hover:text-gray-900 dark:text-gray-400 dark:hover:text-white",
+          children: [
+            /* @__PURE__ */ e(
+              x,
+              {
+                image: l,
+                alt: i,
+                size: "xs",
+                className: "ring-2 ring-white dark:ring-gray-800"
+              }
+            ),
+            /* @__PURE__ */ r("span", { className: "overflow-hidden text-ellipsis", children: [
+              "@",
+              i
+            ] })
+          ]
+        }
+      ),
+      /* @__PURE__ */ r("div", { children: [
+        /* @__PURE__ */ e(
+          t,
+          {
+            to: a || "/",
+            className: "text-sm font-semibold text-gray-900 dark:text-white hover:text-brand dark:hover:text-brand transition-colors",
+            children: s
+          }
+        ),
+        /* @__PURE__ */ e("div", { className: "mt-0.5 flex items-center", children: /* @__PURE__ */ r(
+          t,
+          {
+            to: a || "/",
+            className: "inline-flex items-center gap-1 text-xs text-gray-500 dark:text-gray-500",
+            children: [
+              o,
+              /* @__PURE__ */ e(m, { className: "h-3.5 w-3.5 text-blue-500" })
+            ]
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ r("div", { className: "flex items-center justify-between border-t border-[var(--color-border)] pt-2.5", children: [
+        /* @__PURE__ */ e("span", { className: "text-xs text-gray-500 dark:text-gray-500", children: "Price" }),
+        /* @__PURE__ */ e("span", { className: "text-sm font-bold text-gray-900 dark:text-white", children: d })
+      ] })
+    ] })
+  ] });
+}
+export {
+  w as NFTGrid,
+  w as default
+};

package/components/blockchain/transaction-info.mjs

@@ -0,0 +1,25 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import a from "classnames";
+function s({
+  label: d,
+  value: r,
+  className: n
+}) {
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      className: a(
+        "flex items-center justify-between w-full max-w-md dark:text-gray-300 border border-border dark:border-border dark:bg-light-dark bg-white rounded-lg py-3 px-4",
+        n
+      ),
+      children: [
+        /* @__PURE__ */ e("span", { className: "font-medium", children: d }),
+        /* @__PURE__ */ e("span", { children: r || "_ _" })
+      ]
+    }
+  );
+}
+export {
+  s as TransactionInfo,
+  s as default
+};

package/components/buttons/button/button-drip.mjs

@@ -0,0 +1,36 @@
+import { jsx as r } from "react/jsx-runtime";
+import { useRef as d, useEffect as u } from "react";
+import c from "classnames";
+function f({
+  x: t = 0,
+  y: n = 0,
+  color: a,
+  fullWidth: o,
+  onCompleted: i
+}) {
+  const e = d(null), s = Number.isNaN(+n) ? 0 : n - 10, l = Number.isNaN(+t) ? 0 : t - 10;
+  return u(() => {
+    if (e.current)
+      return e.current.addEventListener("animationend", i), () => {
+        e.current && e.current.removeEventListener("animationend", i);
+      };
+  }), /* @__PURE__ */ r("span", { ref: e, className: "drip absolute inset-0 block", children: /* @__PURE__ */ r(
+    "svg",
+    {
+      width: "20",
+      height: "20",
+      viewBox: "0 0 20 20",
+      className: c(
+        "absolute h-4 w-4",
+        o ? "animate-drip-expand-large" : "animate-drip-expand"
+      ),
+      style: { top: s, left: l },
+      children: /* @__PURE__ */ r("g", { stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd", children: /* @__PURE__ */ r("g", { fill: a, children: /* @__PURE__ */ r("rect", { width: "100%", height: "100%", rx: "10" }) }) })
+    }
+  ) });
+}
+f.displayName = "ButtonDrip";
+export {
+  f as ButtonDrip,
+  f as default
+};

package/components/buttons/button/button-loader.mjs

@@ -0,0 +1,20 @@
+import { jsx as e } from "react/jsx-runtime";
+import { Loader as o } from "../../loaders/loader.mjs";
+function a({
+  size: t,
+  variant: r
+}) {
+  return /* @__PURE__ */ e("span", { className: "inset-0 h-full w-full flex items-center justify-center", children: /* @__PURE__ */ e(
+    o,
+    {
+      tag: "span",
+      size: t,
+      variant: r,
+      showOnlyThreeDots: !0
+    }
+  ) });
+}
+a.displayName = "ButtonLoader";
+export {
+  a as default
+};

package/components/buttons/button/index.mjs

@@ -0,0 +1,149 @@
+import { jsx as t, jsxs as U } from "react/jsx-runtime";
+import { forwardRef as q, useState as g, useRef as A, useImperativeHandle as F } from "react";
+import b from "classnames";
+import { ButtonDrip as G } from "./button-drip.mjs";
+import J from "./button-loader.mjs";
+import { Tooltip as K } from "../../common/tooltip.mjs";
+const M = {
+  rounded: ["rounded-md sm:rounded-lg"],
+  pill: ["rounded-full"],
+  circle: ["rounded-full"]
+}, P = {
+  ghost: ["bg-transparent"],
+  solid: ["text-white"],
+  transparent: ["bg-transparent hover:bg-gray-100  dark:hover:bg-gray-800"]
+}, Q = {
+  primary: ["text-brand", "bg-brand", "border-brand"],
+  white: ["text-gray-900", "bg-white", "border-white"],
+  gray: ["text-gray-900", "bg-gray-500", "border-border"],
+  success: ["text-green-500", "bg-green-500", "border-green-500"],
+  info: ["text-blue-500", "bg-blue-500", "border-blue-500"],
+  warning: ["text-yellow-500", "bg-yellow-500", "border-yellow-500"],
+  danger: ["text-red-500", "bg-red-500", "border-red-500"]
+}, V = {
+  large: ["px-7 sm:px-9 h-11 sm:h-13", "w-11 h-11 sm:w-13 sm:h-13"],
+  medium: ["px-5 sm:px-8 h-10 sm:h-12", "h-10 w-10 sm:w-12 sm:h-12"],
+  small: ["px-7 h-10", "w-10 h-10"],
+  mini: ["px-4 h-8", "w-8 h-8"],
+  tiny: ["px-2 h-6", "w-6 h-6"]
+}, Z = q(
+  ({
+    children: C,
+    className: $,
+    isLoading: e,
+    disabled: a,
+    fullWidth: d,
+    shape: c = "rounded",
+    variant: o = "solid",
+    color: n = "primary",
+    size: m = "medium",
+    loaderSize: N = "small",
+    loaderVariant: B = "scaleUp",
+    tooltip: p,
+    tooltipPlacement: D = "top",
+    tooltipColor: j,
+    tooltipArrow: R = !0,
+    onClick: h,
+    "aria-label": z,
+    "aria-describedby": H,
+    ...S
+  }, X) => {
+    const [Y, f] = g(!1), [E, y] = g(0), [I, w] = g(0), r = Q[n], x = V[m], s = A(null);
+    F(X, () => s.current);
+    function O() {
+      f(!1), y(0), w(0);
+    }
+    const T = (u) => {
+      if (!e && s.current) {
+        const v = s.current.getBoundingClientRect();
+        f(!0), y(u.clientX - v.left), w(u.clientY - v.top);
+      }
+      h && h(u);
+    };
+    let l = "", i = "";
+    switch (o) {
+      case "ghost":
+        l = `border-2 border-solid ${r[0]} ${r[2]}`, i = "rgba(0, 0, 0, 0.1)";
+        break;
+      case "transparent":
+        l = `${r[0]} ${a || e ? "bg-gray-100 dark:bg-gray-800/25" : "hover:bg-gray-100 dark:hover:bg-gray-800 focus:bg-gray-100 dark:focus:bg-gray-800"} `, i = "rgba(0, 0, 0, 0.1)";
+        break;
+      default:
+        l = `${r[1]} ${r[2]}`, i = "rgba(255, 255, 255, 0.3)";
+        break;
+    }
+    const k = /* @__PURE__ */ t(
+      "div",
+      {
+        className: b(
+          "relative transition-all duration-300 transform",
+          d && "w-full"
+        ),
+        children: /* @__PURE__ */ U(
+          "button",
+          {
+            ref: s,
+            onClick: T,
+            "data-tucu": "button",
+            "data-variant": o,
+            "data-shape": c,
+            "data-size": m,
+            "aria-label": z,
+            "aria-describedby": H || void 0,
+            "aria-busy": e ? "true" : "false",
+            className: b(
+              "group inline-flex shrink-0 items-center justify-center overflow-hidden text-center text-sm font-medium tracking-wider outline-hidden transition-all sm:text-sm",
+              a ? "cursor-not-allowed dark:bg-gray-700 dark:text-gray-500 bg-gray-300 text-gray-600" : l,
+              a || e || o === "transparent" ? "bg-gray-100/25" : "hover:-translate-y-0.5 hover:shadow-large focus:-translate-y-0.5 focus:shadow-large focus:outline-hidden",
+              e && "pointer-events-auto cursor-default focus:outline-hidden",
+              d && "w-full",
+              n === "white" ? "text-gray-900" : n === "gray" ? "text-gray-900 dark:text-white" : P[o],
+              M[c],
+              c === "circle" ? `${x[1]}` : `${x[0]}`,
+              $
+            ),
+            disabled: a,
+            ...S,
+            children: [
+              /* @__PURE__ */ t(
+                "span",
+                {
+                  className: b(
+                    e ? "invisible opacity-0" : "flex items-center justify-center gap-1"
+                  ),
+                  children: C
+                }
+              ),
+              e && /* @__PURE__ */ t(J, { size: N, variant: B }),
+              Y && /* @__PURE__ */ t(
+                G,
+                {
+                  x: E,
+                  y: I,
+                  color: ["white", "gray"].indexOf(n) !== -1 ? "rgba(0, 0, 0, 0.1)" : i,
+                  fullWidth: d,
+                  onCompleted: O
+                }
+              )
+            ]
+          }
+        )
+      }
+    );
+    return p ? /* @__PURE__ */ t(
+      K,
+      {
+        content: p,
+        placement: D,
+        color: j,
+        arrow: R,
+        children: k
+      }
+    ) : k;
+  }
+);
+Z.displayName = "Button";
+export {
+  Z as Button,
+  Z as default
+};

package/components/buttons/hamburger.mjs

@@ -0,0 +1,68 @@
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { Button as s } from "./button/index.mjs";
+function n({ isOpen: r, ...a }) {
+  return /* @__PURE__ */ e(
+    s,
+    {
+      "aria-label": "Menu",
+      "aria-describedby": "Menu",
+      title: "Menu",
+      shape: "circle",
+      ...a,
+      children: /* @__PURE__ */ t(
+        "svg",
+        {
+          className: "sm:w-auo h-auto w-6",
+          width: "30",
+          height: "30",
+          viewBox: "0 0 100 100",
+          children: [
+            /* @__PURE__ */ e(
+              "path",
+              {
+                className: "ease-[cubic-bezier(0.4, 0, 0.2, 1)] transition-[stroke-dasharray,stroke-dashoffset] duration-600",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "6",
+                strokeLinecap: "round",
+                strokeDasharray: r ? "90 207" : "60 207",
+                strokeDashoffset: r ? "-134" : "0",
+                d: "M 20,29.000046 H 80.000231 C 80.000231,29.000046 94.498839,28.817352 94.532987,66.711331 94.543142,77.980673 90.966081,81.670246 85.259173,81.668997 79.552261,81.667751 75.000211,74.999942 75.000211,74.999942 L 25.000021,25.000058"
+              }
+            ),
+            /* @__PURE__ */ e(
+              "path",
+              {
+                className: "ease-[cubic-bezier(0.4, 0, 0.2, 1)] transition-[stroke-dasharray,stroke-dashoffset] duration-600",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "6",
+                strokeLinecap: "round",
+                strokeDasharray: r ? "1 60" : "60 60",
+                strokeDashoffset: r ? "-30" : "0",
+                d: "M 20,50 H 80"
+              }
+            ),
+            /* @__PURE__ */ e(
+              "path",
+              {
+                className: "ease-[cubic-bezier(0.4, 0, 0.2, 1)] transition-[stroke-dasharray,stroke-dashoffset] duration-600",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "6",
+                strokeLinecap: "round",
+                strokeDasharray: r ? "90 207" : "60 207",
+                strokeDashoffset: r ? "-134" : "0",
+                d: "M 20,70.999954 H 80.000231 C 80.000231,70.999954 94.498839,71.182648 94.532987,33.288669 94.543142,22.019327 90.966081,18.329754 85.259173,18.331003 79.552261,18.332249 75.000211,25.000058 75.000211,25.000058 L 25.000021,74.999942"
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+export {
+  n as Hamburger,
+  n as default
+};

package/components/buttons/topup-button.mjs

@@ -0,0 +1,33 @@
+import { jsxs as d, jsx as r } from "react/jsx-runtime";
+import s from "classnames";
+import { ChevronForward as l } from "../icons/chevron-forward.mjs";
+import { AnchorLink as h } from "../links/anchor-link.mjs";
+function u({
+  label: o,
+  icon: e,
+  href: t,
+  className: a,
+  onClick: n
+}) {
+  return /* @__PURE__ */ d(
+    "button",
+    {
+      "data-tucu": "topup-button",
+      className: s(
+        "flex h-10 w-full items-center whitespace-nowrap rounded-lg border-2 border-dashed border-border bg-gray-100 px-6 text-sm uppercase tracking-wider text-gray-900 dark:bg-gray-800 dark:text-white lg:h-12 min-[1780px]:h-13",
+        "hover:border-brand dark:hover:border-brand hover:cursor-pointer hover:transform-3d hover:shadow-lg",
+        a
+      ),
+      onClick: n,
+      children: [
+        e && /* @__PURE__ */ r("span", { className: "bg-brand p-1 mr-3.5 flex h-5 w-5 shrink-0 items-center justify-center rounded-full  text-white lg:h-6 lg:w-6", children: e }),
+        /* @__PURE__ */ r("span", { className: "mr-3.5 grow text-justify text-sm lg:text-sm", children: o }),
+        t && /* @__PURE__ */ r(h, { to: t, children: /* @__PURE__ */ r(l, { className: "rtl:rotate-180" }) })
+      ]
+    }
+  );
+}
+export {
+  u as TopupButton,
+  u as default
+};

package/components/cards/author-card.mjs

@@ -0,0 +1,33 @@
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import { Avatar as d } from "../common/avatar.mjs";
+function c({ image: n, name: r, authorRole: e }) {
+  const a = () => {
+    window.open("https://www.estebanburgos.com.ar/", "_blank", "noreferrer");
+  };
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      className: `flex items-center rounded-lg cursor-pointer  ${r ? "bg-gray-100  p-5  dark:bg-light-dark" : "ml-3 justify-center bg-none p-5 dark:mr-3 dark:bg-none"}`,
+      onClick: a,
+      onTouchStart: a,
+      children: [
+        /* @__PURE__ */ t(
+          d,
+          {
+            image: n,
+            alt: r || "",
+            className: "dark:border-gray-400"
+          }
+        ),
+        /* @__PURE__ */ s("div", { className: "ltr:pl-3 rtl:pr-3", children: [
+          /* @__PURE__ */ t("h3", { className: "text-sm font-medium uppercase tracking-wide text-gray-900 dark:text-white", children: r }),
+          e && /* @__PURE__ */ t("span", { className: "mt-1 block text-sm text-gray-600 dark:text-gray-400", children: e })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  c as AuthorCard,
+  c as default
+};

package/components/cards/card-container.mjs

@@ -0,0 +1,22 @@
+import { jsx as l } from "react/jsx-runtime";
+import e from "classnames";
+const p = ({
+  className: r,
+  children: a,
+  ...d
+}) => /* @__PURE__ */ l(
+  "div",
+  {
+    "data-tucu": "card",
+    ...d,
+    className: e(
+      "flex flex-col flex-wrap justify-start align-middle w-full h-full min-w-0 rounded-lg border border-border shadow-card bg-light-dark p-[16px] sm:p-[24px] 2xl:p-[32px]",
+      r
+    ),
+    children: a
+  }
+);
+export {
+  p as CardContainer,
+  p as default
+};

package/components/cards/card-title.mjs

@@ -0,0 +1,38 @@
+import { jsxs as p, jsx as d } from "react/jsx-runtime";
+import l from "classnames";
+const o = ({
+  border: t = !0,
+  title: e,
+  children: r,
+  className: s,
+  titleClassName: a
+}) => /* @__PURE__ */ p(
+  "fieldset",
+  {
+    "data-tucu": "card-title",
+    className: l(
+      "w-full min-w-0 relative rounded-lg flex flex-col justify-start",
+      t ? "border border-border sm:px-6 px-4 sm:pt-4 pt-3 sm:pb-6 pb-4" : "sm:p-6 p-4 sm:pt-[32px] pt-[24px]",
+      s
+    ),
+    children: [
+      e && /* @__PURE__ */ d(
+        "legend",
+        {
+          "data-tucu": "card-title-label",
+          className: l(
+            "font-bold sm:text-xl text-lg dark:text-white text-current px-2 w-fit",
+            t ? "ml-4" : "absolute -top-4 left-4 m-0",
+            a
+          ),
+          children: e
+        }
+      ),
+      r
+    ]
+  }
+);
+export {
+  o as CardTitle,
+  o as default
+};