@konstructio/ui 0.1.2-alpha.4 → 0.1.2-alpha.40

package/dist/components/PhoneNumberInput/components/TruncateText/TruncateText.js

@@ -0,0 +1,45 @@
+import { jsxs as a, jsx as o } from "react/jsx-runtime";
+import { P as f, R as u, T as b, C as m } from "../../../../index-2hB40Iuc.js";
+import { d as h } from "../../../../debounce-BFejQm9P.js";
+import { useRef as p, useState as w, useCallback as g, useEffect as i } from "react";
+const C = ({ text: r, prefix: n }) => {
+  const s = p(null), [c, d] = w(!1), t = g(() => {
+    const e = s.current;
+    e && d(e.scrollWidth > e.clientWidth);
+  }, []);
+  return i(() => {
+    const e = new AbortController(), l = h(t, 300);
+    return window.addEventListener("resize", l, {
+      signal: e.signal
+    }), () => {
+      e.abort(), l.cancel();
+    };
+  }, [t]), i(() => {
+    t();
+  }, [r, t]), c ? /* @__PURE__ */ o(f, { delayDuration: 0, children: /* @__PURE__ */ a(u, { children: [
+    /* @__PURE__ */ o(b, { asChild: !0, children: /* @__PURE__ */ a("span", { ref: s, className: "w-full truncate cursor-pointer", children: [
+      r,
+      " ",
+      n
+    ] }) }),
+    /* @__PURE__ */ a(
+      m,
+      {
+        side: "top",
+        align: "center",
+        className: "animate-in fade-in-0 relative mb-1.5 overflow-visible bg-kubefirst-dark-blue-900 text-white px-3 py-2 rounded-lg shadow-sm after:content-[''] after:absolute after:left-1/2 after:-translate-x-1/2 after:bottom-0 after:translate-y-full after:border-l-8 after:border-l-transparent after:border-r-8 after:border-r-transparent after:border-t-8 after:border-kubefirst-dark-blue-900 z-999",
+        children: [
+          r,
+          " ",
+          n
+        ]
+      }
+    )
+  ] }) }) : /* @__PURE__ */ a("span", { ref: s, className: "w-full truncate", children: [
+    r,
+    /* @__PURE__ */ o("span", { className: "text-slate-500", children: n })
+  ] });
+};
+export {
+  C as TruncateText
+};