@konstructio/ui 0.1.2-alpha.5 → 0.1.2-alpha.50

package/dist/components/PhoneNumberInput/components/FlagSelectorWrapper/FlagSelectorWrapper.js

@@ -0,0 +1,60 @@
+import { jsxs as s, jsx as r } from "react/jsx-runtime";
+import { useCallback as c } from "react";
+import { Input as d } from "../../../Input/Input.js";
+import { FlagSelectorList as p } from "../FlagSelectorList/FlagSelectorList.js";
+import { cn as u } from "../../../../utils/index.js";
+import { usePhoneNumberContext as h } from "../../contexts/phone-number.hook.js";
+const C = ({
+  placeholder: e = "Search",
+  showFlagOnSearch: o,
+  showInputFilter: t,
+  showNameOnSearch: a,
+  showPlaceHolder: m = !0
+}) => {
+  const { onChangeTermOfSearch: l } = h(), n = c((i) => {
+    l(i.target.value);
+  }, []);
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      className: u(
+        "absolute",
+        "top-full",
+        "mt-1.5",
+        "animate-in",
+        "fade-in-0",
+        "zoom-in-95",
+        "w-full",
+        "border",
+        "border-gray-100",
+        "bg-white",
+        "shadow-sm",
+        "py-2",
+        "z-10",
+        "rounded-sm",
+        "dark:bg-metal-800",
+        "dark:border-metal-700"
+      ),
+      children: [
+        t && /* @__PURE__ */ r("div", { className: "px-6 py-2.5", children: /* @__PURE__ */ r(
+          d,
+          {
+            isSearch: !0,
+            placeholder: m ? e : void 0,
+            onChange: n
+          }
+        ) }),
+        /* @__PURE__ */ r(
+          p,
+          {
+            showFlagOnSearch: o,
+            showNameOnSearch: a
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  C as FlagSelectorWrapper
+};

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-Byr10W8m.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
+};