@matbea-ui/matbea-ui 0.1.1 → 0.1.2

package/dist/matbea-ui.es22.js

@@ -0,0 +1,16 @@
+import { j as e } from "./matbea-ui.es28.js";
+import { BalanceRowStyled as o, BalanceCell as l, BalanceCellActions as a } from "./matbea-ui.es57.js";
+const x = ({
+  valueLabel: n,
+  count: r,
+  amount: c,
+  actions: s
+}) => /* @__PURE__ */ e.jsxs(o, { children: [
+  /* @__PURE__ */ e.jsx(l, { children: n }),
+  /* @__PURE__ */ e.jsx(l, { children: r }),
+  /* @__PURE__ */ e.jsx(l, { children: c }),
+  /* @__PURE__ */ e.jsx(a, { children: s })
+] });
+export {
+  x as BalanceRow
+};

package/dist/matbea-ui.es23.js

@@ -0,0 +1,25 @@
+import { j as r } from "./matbea-ui.es28.js";
+import { CurrencyNameStyled as o, CurrencyNameLongname as s, CurrencyNameShortname as a, CurrencyNameNetwork as i } from "./matbea-ui.es58.js";
+const j = ({
+  icon: m,
+  network: e,
+  longName: c,
+  shortName: n
+}) => /* @__PURE__ */ r.jsxs(
+  o,
+  {
+    $icon: !!m,
+    $longname: !!c,
+    $shortname: !!n,
+    $network: !!e,
+    children: [
+      m,
+      /* @__PURE__ */ r.jsx(s, { children: c }),
+      n && /* @__PURE__ */ r.jsx(a, { children: n }),
+      e && /* @__PURE__ */ r.jsx(i, { children: e })
+    ]
+  }
+);
+export {
+  j as CurrencyName
+};

package/dist/matbea-ui.es24.js

@@ -0,0 +1,36 @@
+import { j as r } from "./matbea-ui.es28.js";
+import { CurrencyRateCard as h, CurrencyRateBody as C, CurrencyRateBox as c, CurrencyRatePriceLabel as s, CurrencyRateAmount as t } from "./matbea-ui.es59.js";
+import { CurrencyName as R } from "./matbea-ui.es23.js";
+const f = ({
+  longName: i,
+  shortName: x,
+  network: o,
+  icon: j,
+  buyLabel: d,
+  sellLabel: m,
+  buyValue: e,
+  sellValue: n
+}) => /* @__PURE__ */ r.jsxs(h, { children: [
+  /* @__PURE__ */ r.jsx(
+    R,
+    {
+      longName: i,
+      shortName: x,
+      network: o,
+      icon: j
+    }
+  ),
+  (e || n) && /* @__PURE__ */ r.jsxs(C, { children: [
+    e && /* @__PURE__ */ r.jsxs(c, { children: [
+      /* @__PURE__ */ r.jsx(s, { children: d }),
+      /* @__PURE__ */ r.jsx(t, { children: e })
+    ] }),
+    n && /* @__PURE__ */ r.jsxs(c, { children: [
+      /* @__PURE__ */ r.jsx(s, { children: m }),
+      /* @__PURE__ */ r.jsx(t, { children: n })
+    ] })
+  ] })
+] });
+export {
+  f as CurrencyRate
+};

package/dist/matbea-ui.es25.js

@@ -0,0 +1,29 @@
+import { j as s } from "./matbea-ui.es28.js";
+import { formatCardNumber as h } from "./matbea-ui.es27.js";
+import { RequisitesStyled as d, RequisitesItemLabel as i, RequisitesItemValue as t } from "./matbea-ui.es60.js";
+import { CopyButton as c } from "./matbea-ui.es61.js";
+const q = ({
+  cardHolderLabel: r,
+  cardHolderName: o,
+  cardNumberLabel: x,
+  cardNumber: e,
+  merchantLabel: n,
+  merchantName: j,
+  descriptionLabel: l,
+  description: m
+}) => /* @__PURE__ */ s.jsxs(d, { children: [
+  /* @__PURE__ */ s.jsx(i, { children: r }),
+  /* @__PURE__ */ s.jsx(t, { children: o }),
+  /* @__PURE__ */ s.jsx(i, { children: x }),
+  /* @__PURE__ */ s.jsxs(t, { children: [
+    e && h(e),
+    e && /* @__PURE__ */ s.jsx(c, { text: e.toString() })
+  ] }),
+  /* @__PURE__ */ s.jsx(i, { children: n }),
+  /* @__PURE__ */ s.jsx(t, { children: j }),
+  /* @__PURE__ */ s.jsx(i, { children: l }),
+  /* @__PURE__ */ s.jsx(t, { children: m })
+] });
+export {
+  q as Requisites
+};

package/dist/matbea-ui.es26.js

@@ -0,0 +1,30 @@
+import { j as s } from "./matbea-ui.es28.js";
+import { useMemo as a } from "react";
+import { ClockIcon as c } from "./matbea-ui.es53.js";
+import { SuccessfullSmallIcon as e } from "./matbea-ui.es54.js";
+import { TransactionStatusStyled as i, TransactionStatusLabel as u, TransactionStatusContent as l, TransactionStatusValue as m } from "./matbea-ui.es62.js";
+const p = ({
+  label: n,
+  statusValue: r,
+  type: t
+}) => {
+  const o = a(() => {
+    switch (t) {
+      case "success":
+        return /* @__PURE__ */ s.jsx(e, { size: 18 });
+      case "pending":
+      default:
+        return /* @__PURE__ */ s.jsx(c, { size: 18 });
+    }
+  }, [t]);
+  return /* @__PURE__ */ s.jsxs(i, { children: [
+    /* @__PURE__ */ s.jsx(u, { children: n }),
+    /* @__PURE__ */ s.jsxs(l, { children: [
+      o,
+      /* @__PURE__ */ s.jsx(m, { children: r })
+    ] })
+  ] });
+};
+export {
+  p as TransactionStatus
+};

package/dist/matbea-ui.es27.js

@@ -0,0 +1,20 @@
+const l = (r, e = 4, c = 7) => {
+  const t = r.trim();
+  if (!t) return t;
+  const o = t.lastIndexOf(".");
+  if (o <= 0 || o === t.length - 1)
+    return t;
+  const s = t.slice(o + 1), n = t.slice(0, o).replace(/[@.]/g, "").slice(0, e), a = "*".repeat(c);
+  return `${n}${a}${s}`;
+}, d = (r) => r.toString().padStart(16, "0").replace(/(\d{4})(?=\d)/g, "$1 "), g = async (r) => {
+  try {
+    await navigator.clipboard.writeText(r), console.log("Скопировано в буфер обмена");
+  } catch (e) {
+    console.error("Ошибка копирования:", e);
+  }
+};
+export {
+  g as copyToClipboard,
+  d as formatCardNumber,
+  l as maskEmail
+};

package/dist/matbea-ui.es28.js

@@ -0,0 +1,5 @@
+import { __require as r } from "./matbea-ui.es63.js";
+var i = r();
+export {
+  i as j
+};

package/dist/matbea-ui.es29.js

@@ -0,0 +1,163 @@
+import l, { css as i } from "styled-components";
+const a = {
+  default: {
+    padding: "15px 22px",
+    minHeight: "48px",
+    fontSize: "15px",
+    lineHeight: "18px",
+    gap: "10px",
+    iconGap: "6px"
+  },
+  medium: {
+    padding: "12px 16px",
+    minHeight: "42px",
+    fontSize: "15px",
+    lineHeight: "18px",
+    gap: "10px",
+    iconGap: "6px"
+  },
+  small: {
+    padding: "10px",
+    minHeight: "36px",
+    fontSize: "14px",
+    lineHeight: "17px",
+    gap: "4px",
+    iconGap: "4px"
+  }
+}, p = (e) => ({ theme: t }) => {
+  const r = t.colors, o = {
+    primary: {
+      default: {
+        bg: r.primary.primaryBlue,
+        color: r.primary.white,
+        border: r.primary.primaryBlue
+      },
+      hover: {
+        bg: r.primary.hoverBlue,
+        color: r.primary.white,
+        border: r.primary.hoverBlue
+      },
+      active: {
+        bg: r.primary.activeBlue,
+        color: r.primary.white,
+        border: r.primary.activeBlue
+      },
+      disabled: {
+        bg: r.gray.lightGray2,
+        color: r.gray.darkGray,
+        border: r.gray.lightGray2
+      }
+    },
+    secondary: {
+      default: {
+        bg: "transparent",
+        color: r.primary.primaryBlue,
+        border: r.primary.primaryBlue
+      },
+      hover: {
+        bg: r.primary.primaryBlue,
+        color: r.primary.white,
+        border: r.primary.primaryBlue
+      },
+      active: {
+        bg: r.primary.activeBlue,
+        color: r.primary.white,
+        border: r.primary.activeBlue
+      },
+      disabled: {
+        bg: "transparent",
+        color: r.gray.darkGray,
+        border: r.gray.lightGray2
+      }
+    },
+    tertiary: {
+      default: {
+        bg: "transparent",
+        color: r.primary.primaryBlue,
+        border: "transparent"
+      },
+      hover: {
+        bg: r.gray.lightBlueGray,
+        color: r.primary.primaryBlue,
+        border: "transparent"
+      },
+      active: {
+        bg: r.gray.lightBlueGray2,
+        color: r.primary.primaryBlue,
+        border: "transparent"
+      },
+      disabled: {
+        bg: "transparent",
+        color: r.gray.darkGray,
+        border: "transparent"
+      }
+    }
+  }[e];
+  return i`
+      background-color: ${o.default.bg};
+      color: ${o.default.color};
+      border-color: ${o.default.border};
+
+      &:hover:not(:disabled) {
+        background-color: ${o.hover.bg};
+        color: ${o.hover.color};
+        border-color: ${o.hover.border};
+      }
+
+      &:active:not(:disabled) {
+        background-color: ${o.active.bg};
+        color: ${o.active.color};
+        border-color: ${o.active.border};
+      }
+
+      &:disabled {
+        background-color: ${o.disabled.bg};
+        color: ${o.disabled.color};
+        border-color: ${o.disabled.border};
+      }
+    `;
+}, c = l.button`
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid transparent;
+  border-radius: ${({ $form: e }) => e === "brick-right" ? "0 5px 5px 0" : "5px"};
+  cursor: pointer;
+  transition: background-color 0.15s ease, border-color 0.15s ease,
+    color 0.15s ease, opacity 0.15s ease;
+  font-weight: 600;
+
+  ${({ $size: e }) => i`
+    padding: ${a[e].padding};
+    min-height: ${a[e].minHeight};
+    font-size: ${a[e].fontSize};
+    line-height: ${a[e].lineHeight};
+  `}
+
+  ${({ $hasIcon: e, $iconOnly: t, $size: r }) => i`
+    gap: ${t ? "0" : e ? a[r].iconGap : a[r].gap};
+  `}
+
+  ${({ $fullWidth: e }) => e && i`
+      width: 100%;
+    `}
+
+  ${({ $variant: e }) => p(e)}
+
+  &:disabled {
+    cursor: not-allowed;
+  }
+`, g = l.span`
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  line-height: 0;
+  ${({ $iconOnly: e }) => e && i`
+      width: 18px;
+      height: 18px;
+    `}
+`;
+export {
+  g as IconSlot,
+  c as StyledButton
+};

package/dist/matbea-ui.es3.js

@@ -0,0 +1,24 @@
+import { j as o } from "./matbea-ui.es28.js";
+import { useState as a } from "react";
+import { Wrapper as d, Trigger as l, Bubble as m } from "./matbea-ui.es30.js";
+const y = ({
+  label: r,
+  children: e,
+  copiedText: i = "Скопировано!",
+  copyDuration: s = 1500
+}) => {
+  const [p, t] = a(!1), n = async () => {
+    try {
+      await navigator.clipboard.writeText(r), t(!0), setTimeout(() => t(!1), s);
+    } catch (c) {
+      console.error("Copy failed", c);
+    }
+  };
+  return /* @__PURE__ */ o.jsxs(d, { onClick: n, children: [
+    e ?? /* @__PURE__ */ o.jsx(l, { type: "button", children: r }),
+    /* @__PURE__ */ o.jsx(m, { children: p ? i : r })
+  ] });
+};
+export {
+  y as CopyTooltip
+};

package/dist/matbea-ui.es30.js

@@ -0,0 +1,40 @@
+import { styled as o } from "styled-components";
+const t = o.div`
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  cursor: pointer;
+`, n = o.button`
+  border: none;
+  background: transparent;
+  padding: 4px 8px;
+  font: inherit;
+  color: inherit;
+  cursor: pointer;
+`, e = o.span`
+  position: absolute;
+  bottom: 100%;
+  left: 50%;
+  transform: translate(-50%, -6px);
+  white-space: nowrap;
+  background: rgba(0, 0, 0, 0.85);
+  color: #fff;
+  font-size: 12px;
+  padding: 4px 8px;
+  border-radius: 4px;
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 0.15s ease, transform 0.15s ease;
+
+  ${t}:hover &,
+  ${t}:focus-within &,
+  ${t}:active & {
+    opacity: 1;
+    transform: translate(-50%, -10px);
+  }
+`;
+export {
+  e as Bubble,
+  n as Trigger,
+  t as Wrapper
+};