@matbea-ui/matbea-ui 0.1.9 → 0.2.0

package/dist/matbea-ui.es28.js

@@ -1,20 +0,0 @@
-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.es29.js

@@ -1,13 +0,0 @@
-import { colors as m } from "./matbea-ui.es30.js";
-const e = {
-  colors: m,
-  media: {
-    maxWidth: {
-      mobile: "@media (max-width: 375px)",
-      tablet: "@media (max-width: 834px)"
-    }
-  }
-};
-export {
-  e as theme
-};

package/dist/matbea-ui.es3.js

@@ -1,24 +0,0 @@
-import { j as o } from "./matbea-ui.es31.js";
-import { useState as a } from "react";
-import { Wrapper as d, Trigger as l, Bubble as m } from "./matbea-ui.es33.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

@@ -1,41 +0,0 @@
-const r = {
-  primary: {
-    primaryBlue: "#2D58B6",
-    hoverBlue: "#3163F0",
-    activeBlue: "#244AB7",
-    lightBlue2: "#6D93FF",
-    darkBlue: "#202D52",
-    darkBlue2: "#1F2635",
-    darkBlue3: "#131A2A",
-    white: "#FFFFFF"
-  },
-  gray: {
-    lightGray2: "#D9D9D9",
-    lightGray3: "#D0D1D8",
-    darkGray: "#9296A5",
-    lightGray: "#F3F3F5",
-    darkGray2: "#5E6F8D",
-    lightBlueGray: "#EFF2FB",
-    lightBlueGray2: "#F1F4F9"
-  },
-  accent: {
-    red: "#F84545",
-    green: "#1CD850",
-    greenLight: "#A7FFC0",
-    green2: "#00BC9E",
-    green2Light: "#00D6B3",
-    green2Dark: "#009E85",
-    orange: "#FFA63E",
-    purple: "#843CF0"
-  },
-  icon: {
-    iconPrimary: "#202D52",
-    iconSecondary: "#202D52",
-    iconThirty: "#5E6F8D",
-    iconFourth: "#FFA63E",
-    iconFive: "#2D5B86"
-  }
-};
-export {
-  r as colors
-};

package/dist/matbea-ui.es31.js

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

package/dist/matbea-ui.es32.js

@@ -1,163 +0,0 @@
-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.es33.js

@@ -1,40 +0,0 @@
-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
-};

package/dist/matbea-ui.es34.js

@@ -1,330 +0,0 @@
-import { css as i, styled as g } from "styled-components";
-const e = {
-  regular: 400,
-  semibold: 600,
-  bold: 700
-}, h = {
-  h1: {
-    mobile: {
-      fontSize: "26px",
-      lineHeight: "32px",
-      fontWeight: e.semibold
-    },
-    tablet: {
-      fontSize: "34px",
-      lineHeight: "42px",
-      fontWeight: e.semibold
-    },
-    desktop: {
-      fontSize: "44px",
-      lineHeight: "54px",
-      fontWeight: e.semibold,
-      textTransform: "uppercase"
-    }
-  },
-  h2: {
-    mobile: {
-      fontSize: "22px",
-      lineHeight: "28px",
-      fontWeight: e.semibold
-    },
-    tablet: {
-      fontSize: "30px",
-      lineHeight: "37px",
-      fontWeight: e.semibold
-    },
-    desktop: {
-      fontSize: "32px",
-      lineHeight: "40px",
-      fontWeight: e.semibold
-    }
-  },
-  h3: {
-    mobile: {
-      fontSize: "20px",
-      lineHeight: "24px",
-      fontWeight: e.semibold
-    },
-    tablet: {
-      fontSize: "28px",
-      lineHeight: "34px",
-      fontWeight: e.semibold
-    },
-    desktop: {
-      fontSize: "30px",
-      lineHeight: "38px",
-      fontWeight: e.semibold
-    }
-  },
-  h4: {
-    mobile: {
-      fontSize: "18px",
-      lineHeight: "22px",
-      fontWeight: e.semibold
-    },
-    tablet: {
-      fontSize: "24px",
-      lineHeight: "30px",
-      fontWeight: e.semibold
-    },
-    desktop: {
-      fontSize: "24px",
-      lineHeight: "30px",
-      fontWeight: e.semibold
-    }
-  },
-  h5: {
-    mobile: {
-      fontSize: "16px",
-      lineHeight: "20px",
-      fontWeight: e.semibold
-    },
-    tablet: {
-      fontSize: "20px",
-      lineHeight: "24px",
-      fontWeight: e.semibold
-    },
-    desktop: {
-      fontSize: "20px",
-      lineHeight: "24px",
-      fontWeight: e.semibold
-    }
-  },
-  "body-xl-semibold": {
-    mobile: {
-      fontSize: "18px",
-      lineHeight: "22px",
-      fontWeight: e.semibold
-    },
-    tablet: {
-      fontSize: "22px",
-      lineHeight: "28px",
-      fontWeight: e.semibold
-    },
-    desktop: {
-      fontSize: "24px",
-      lineHeight: "30px",
-      fontWeight: e.semibold
-    }
-  },
-  "body-xl": {
-    mobile: {
-      fontSize: "18px",
-      lineHeight: "22px",
-      fontWeight: e.regular
-    },
-    tablet: {
-      fontSize: "22px",
-      lineHeight: "28px",
-      fontWeight: e.regular
-    },
-    desktop: {
-      fontSize: "24px",
-      lineHeight: "30px",
-      fontWeight: e.regular
-    }
-  },
-  "body-l-semibold": {
-    mobile: {
-      fontSize: "16px",
-      lineHeight: "19px",
-      fontWeight: e.semibold
-    },
-    tablet: {
-      fontSize: "18px",
-      lineHeight: "22px",
-      fontWeight: e.semibold
-    },
-    desktop: {
-      fontSize: "18px",
-      lineHeight: "22px",
-      fontWeight: e.semibold
-    }
-  },
-  "body-l": {
-    mobile: {
-      fontSize: "16px",
-      lineHeight: "19px",
-      fontWeight: e.regular
-    },
-    tablet: {
-      fontSize: "18px",
-      lineHeight: "22px",
-      fontWeight: e.regular
-    },
-    desktop: {
-      fontSize: "18px",
-      lineHeight: "22px",
-      fontWeight: e.regular
-    }
-  },
-  "body-m-bold": {
-    mobile: {
-      fontSize: "14px",
-      lineHeight: "17px",
-      fontWeight: e.bold
-    },
-    tablet: {
-      fontSize: "16px",
-      lineHeight: "20px",
-      fontWeight: e.bold
-    },
-    desktop: {
-      fontSize: "16px",
-      lineHeight: "20px",
-      fontWeight: e.bold
-    }
-  },
-  "body-m-semibold": {
-    mobile: {
-      fontSize: "14px",
-      lineHeight: "17px",
-      fontWeight: e.semibold
-    },
-    tablet: {
-      fontSize: "16px",
-      lineHeight: "20px",
-      fontWeight: e.semibold
-    },
-    desktop: {
-      fontSize: "16px",
-      lineHeight: "20px",
-      fontWeight: e.semibold
-    }
-  },
-  "body-m": {
-    mobile: {
-      fontSize: "14px",
-      lineHeight: "17px",
-      fontWeight: e.regular
-    },
-    tablet: {
-      fontSize: "16px",
-      lineHeight: "20px",
-      fontWeight: e.regular
-    },
-    desktop: {
-      fontSize: "16px",
-      lineHeight: "20px",
-      fontWeight: e.regular
-    }
-  },
-  "body-s-semibold": {
-    mobile: {
-      fontSize: "12px",
-      lineHeight: "15px",
-      fontWeight: e.semibold
-    },
-    tablet: {
-      fontSize: "14px",
-      lineHeight: "17px",
-      fontWeight: e.semibold
-    },
-    desktop: {
-      fontSize: "14px",
-      lineHeight: "17px",
-      fontWeight: e.semibold
-    }
-  },
-  "body-s": {
-    mobile: {
-      fontSize: "12px",
-      lineHeight: "15px",
-      fontWeight: e.regular
-    },
-    tablet: {
-      fontSize: "14px",
-      lineHeight: "17px",
-      fontWeight: e.regular
-    },
-    desktop: {
-      fontSize: "14px",
-      lineHeight: "17px",
-      fontWeight: e.regular
-    }
-  },
-  button: {
-    desktop: {
-      fontSize: "15px",
-      lineHeight: "18px",
-      fontWeight: e.semibold
-    }
-  },
-  "form-input": {
-    desktop: {
-      fontSize: "15px",
-      lineHeight: "18px",
-      fontWeight: e.regular
-    }
-  },
-  "avatar-basic": {
-    desktop: {
-      fontSize: "16px",
-      lineHeight: "18px",
-      fontWeight: e.semibold
-    }
-  },
-  "avatar-m": {
-    desktop: {
-      fontSize: "14px",
-      lineHeight: "16px",
-      fontWeight: e.semibold
-    }
-  },
-  "avatar-s": {
-    desktop: {
-      fontSize: "12px",
-      lineHeight: "14px",
-      fontWeight: e.semibold
-    }
-  }
-}, f = (t) => {
-  const { mobile: o, tablet: n, desktop: l } = h[t];
-  return i`
-    ${({ theme: p }) => i`
-      ${i`
-        font-size: ${l.fontSize};
-        font-weight: ${l.fontWeight};
-        line-height: ${l.lineHeight};
-      `}
-
-      ${n && i`
-        ${p.media.maxWidth.tablet} {
-          font-size: ${n.fontSize};
-          font-weight: ${n.fontWeight};
-          line-height: ${n.lineHeight};
-        }
-      `}
-
-    ${o && i`
-        ${p.media.maxWidth.mobile} {
-          font-size: ${o.fontSize};
-          font-weight: ${o.fontWeight};
-          line-height: ${o.lineHeight};
-        }
-      `}
-    `}
-  `;
-}, b = g.span`
-  margin: 0;
-  color: ${({ $color: t }) => t ?? "inherit"};
-  ${({ $variant: t }) => f(t)};
-  text-align: ${({ $align: t }) => t ?? "inherit"};
-  ${({ $inline: t }) => t ? i`
-          display: inline;
-        ` : i`
-          display: block;
-        `};
-  ${({ $uppercase: t }) => t && i`
-      text-transform: uppercase;
-      letter-spacing: 0.04em;
-    `}
-  ${({ $truncate: t }) => t && i`
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    `}
-`;
-export {
-  b as StyledTypography
-};

package/dist/matbea-ui.es35.js

@@ -1,15 +0,0 @@
-import { j as i } from "./matbea-ui.es31.js";
-import { Icon as c } from "./matbea-ui.es53.js";
-const r = (l) => /* @__PURE__ */ i.jsxs(c, { ...l, viewBox: "0 0 18 18", children: [
-  /* @__PURE__ */ i.jsx("g", { "clip-path": "url(#clip0_309_1899)", children: /* @__PURE__ */ i.jsx(
-    "path",
-    {
-      d: "M9 16.5C4.85786 16.5 1.5 13.1421 1.5 9C1.5 4.85786 4.85786 1.5 9 1.5C13.1421 1.5 16.5 4.85786 16.5 9C16.4955 13.1403 13.1403 16.4955 9 16.5ZM3 9.129C3.03549 12.4299 5.73083 15.0822 9.0319 15.0645C12.333 15.0467 14.9997 12.3656 14.9997 9.0645C14.9997 5.76338 12.333 3.08233 9.0319 3.0645C5.73083 3.04684 3.03549 5.69907 3 9V9.129ZM10.5 12.75H8.25V9.75H7.5V8.25H9.75V11.25H10.5V12.75ZM9.75 6.75H8.25V5.25H9.75V6.75Z",
-      fill: l.color || "#9296A5"
-    }
-  ) }),
-  /* @__PURE__ */ i.jsx("defs", { children: /* @__PURE__ */ i.jsx("clipPath", { id: "clip0_309_1899", children: /* @__PURE__ */ i.jsx("rect", { width: "18", height: "18", fill: "white" }) }) })
-] });
-export {
-  r as InfoIcon
-};

package/dist/matbea-ui.es36.js

@@ -1,26 +0,0 @@
-import { styled as o } from "styled-components";
-const t = o.div`
-  display: grid;
-  align-items: center;
-  grid-template-columns: ${({ $icon: e }) => e ? "auto 1fr" : "1fr"};
-  gap: 12px;
-  width: 458px;
-  height: auto;
-  border-radius: 12px;
-  padding: 24px;
-  background-color: ${({ $type: e, theme: r }) => {
-  switch (e) {
-    case "success":
-      return r.colors.accent.green2Light;
-    case "error":
-      return r.colors.accent.red;
-    case "info":
-      return r.colors.primary.lightBlue2;
-    case "warning":
-      return r.colors.accent.orange;
-  }
-}};
-`;
-export {
-  t as InformerStyled
-};