mayak-common-library 0.0.31 → 0.0.32

package/dist/index.css

@@ -60,6 +60,103 @@
   object-position: center;
   object-fit: cover;
 }
+@layer components {
+  .white-block-snack {
+    @apply bg-white px-[10px] py-[2px] w-fit font-extrabold text-12;
+  }
+  .black-block-snack {
+    @apply bg-dark py-[6px] px-[16px] w-fit text-white font-extrabold text-12;
+  }
+  .gray-block-snack {
+    @apply bg-gray-light px-[10px] w-fit text-12;
+  }
+  .border-block-snack {
+    @apply px-[10px] py-[2px] text-12 border-[1px] border-dark w-fit;
+  }
+  .border-gold-block-snack {
+    @apply w-fit px-[10px] py-[2px] text-gray border-[1px] border-gold font-extrabold text-12 group-hover/card:text-white group-hover/card:bg-gold;
+  }
+  .bg-gray-light {
+    background-color: #F5F5F5;
+  }
+  .bg-gray-medium {
+    background-color: #D0CED2;
+  }
+  .bg-gray {
+    background-color: #757575;
+  }
+  .bg-dark {
+    background-color: #343434;
+  }
+  .bg-light {
+    background-color: #fff;
+  }
+  .bg-gold {
+    background-color: #C8BCA1;
+  }
+  .border-custom-gray {
+    border-color: #757575;
+  }
+  .border-dark {
+    border-color: #343434;
+  }
+  .border-custom-dark {
+    border-color: #343434;
+  }
+  .border-gold {
+    border-color: #C8BCA1;
+  }
+  .border-gold2 {
+    border-color: #99835F;
+  }
+  .big-title {
+    @apply uppercase font-extrabold text-34;
+  }
+  .block-gold {
+    @apply bg-gold py-[30px] px-[40px] flex flex-col;
+  }
+  .block-simple-border {
+    @apply block border-[1px] py-[16px] px-[24px] text-14 w-fit border-dark;
+  }
+  .block-white-wrapper {
+    @apply text-32 bg-white py-[20px] px-[30px] block;
+  }
+  .block-white {
+    @apply bg-white py-[30px] px-[40px];
+  }
+  .block-center {
+    @apply block mx-auto w-fit;
+  }
+  .filter-gold2 {
+    filter: invert(64%) sepia(5%) saturate(2284%) hue-rotate(358deg) brightness(81%) contrast(87%);
+  }
+  .filter-gray {
+    filter: invert(50%) sepia(10%) saturate(17%) hue-rotate(354deg) brightness(89%) contrast(90%);
+  }
+  .filter-dark {
+    filter: invert(18%) sepia(13%) saturate(19%) hue-rotate(5deg) brightness(60%) contrast(90%);
+  }
+  .trim-2 {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    -webkit-line-clamp: 2;
+  }
+  .trim-4 {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    -webkit-line-clamp: 4;
+  }
+  .container-mini {
+    width: 100%;
+    margin-left: auto;
+    box-sizing: border-box;
+    margin-right: auto;
+    display: block;
+    max-width: 745px;
+  }
+}
 .richTextBlock {
   line-height: 24px;
 }

package/dist/index.d.mts

@@ -160,4 +160,11 @@ interface AutocompleteProps {
 }
 declare const Autocomplete: FC<AutocompleteProps & UseControllerProps<any>>;
 
-export { AppBar, ArticleCard, Autocomplete, CustomAvatar as Avatar, CustomBadge as Badge, Button, CategoryCard, CustomChip as Chip, FromToInput, Greet, IconButton, ImageContainer, CustomInput as Input, JobCard, CustomMenuItem as MenuItem, PhoneInput, Providers, CustomRadio as Radio, CustomRadioGroup as RadioGroup, RealtorCard, RealtyCard, CustomSelect as Select, SelectPro, CustomSlider as Slider, CustomSwitch as Switch, TeamPersonCard, Text };
+interface BigNumberProps {
+    slug?: string;
+    number?: number;
+    text?: string;
+}
+declare const BigNumber: FC<BigNumberProps>;
+
+export { AppBar, ArticleCard, Autocomplete, CustomAvatar as Avatar, CustomBadge as Badge, BigNumber, Button, CategoryCard, CustomChip as Chip, FromToInput, Greet, IconButton, ImageContainer, CustomInput as Input, JobCard, CustomMenuItem as MenuItem, PhoneInput, Providers, CustomRadio as Radio, CustomRadioGroup as RadioGroup, RealtorCard, RealtyCard, CustomSelect as Select, SelectPro, CustomSlider as Slider, CustomSwitch as Switch, TeamPersonCard, Text };

package/dist/index.d.ts

@@ -160,4 +160,11 @@ interface AutocompleteProps {
 }
 declare const Autocomplete: FC<AutocompleteProps & UseControllerProps<any>>;
 
-export { AppBar, ArticleCard, Autocomplete, CustomAvatar as Avatar, CustomBadge as Badge, Button, CategoryCard, CustomChip as Chip, FromToInput, Greet, IconButton, ImageContainer, CustomInput as Input, JobCard, CustomMenuItem as MenuItem, PhoneInput, Providers, CustomRadio as Radio, CustomRadioGroup as RadioGroup, RealtorCard, RealtyCard, CustomSelect as Select, SelectPro, CustomSlider as Slider, CustomSwitch as Switch, TeamPersonCard, Text };
+interface BigNumberProps {
+    slug?: string;
+    number?: number;
+    text?: string;
+}
+declare const BigNumber: FC<BigNumberProps>;
+
+export { AppBar, ArticleCard, Autocomplete, CustomAvatar as Avatar, CustomBadge as Badge, BigNumber, Button, CategoryCard, CustomChip as Chip, FromToInput, Greet, IconButton, ImageContainer, CustomInput as Input, JobCard, CustomMenuItem as MenuItem, PhoneInput, Providers, CustomRadio as Radio, CustomRadioGroup as RadioGroup, RealtorCard, RealtyCard, CustomSelect as Select, SelectPro, CustomSlider as Slider, CustomSwitch as Switch, TeamPersonCard, Text };

package/dist/index.js

@@ -64,6 +64,7 @@ __export(src_exports, {
   Autocomplete: () => Autocomplete_default,
   Avatar: () => Avatar_default,
   Badge: () => Badge_default,
+  BigNumber: () => BigNumber_default,
   Button: () => Button_default,
   CategoryCard: () => CategoryCard_default,
   Chip: () => Chip_default,
@@ -1065,6 +1066,33 @@ var Autocomplete = (props) => {
   );
 };
 var Autocomplete_default = Autocomplete;
+
+// src/components/BigNumber/BigNumber.tsx
+var import_material19 = require("@mui/material");
+
+// src/utils/thousandFormatter.ts
+var thousandFormatter = (num) => {
+  return Number(num).toLocaleString("uk-UA");
+};
+var thousandFormatter_default = thousandFormatter;
+
+// src/components/BigNumber/BigNumber.tsx
+var import_jsx_runtime33 = require("react/jsx-runtime");
+var BigNumber = (props) => {
+  const { slug, text, number } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_material19.Box, { className: "flex flex-col", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+      import_material19.Typography,
+      {
+        component: "span",
+        className: "text-gold text-100 font-extrabold",
+        children: thousandFormatter_default(number)
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_material19.Typography, { component: "span", className: "text-base text-gray mt-[-20px]", children: text })
+  ] }, slug);
+};
+var BigNumber_default = BigNumber;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AppBar,
@@ -1072,6 +1100,7 @@ var Autocomplete_default = Autocomplete;
   Autocomplete,
   Avatar,
   Badge,
+  BigNumber,
   Button,
   CategoryCard,
   Chip,

package/dist/index.mjs

@@ -1023,12 +1023,40 @@ var Autocomplete = (props) => {
   );
 };
 var Autocomplete_default = Autocomplete;
+
+// src/components/BigNumber/BigNumber.tsx
+import { Box as Box9, Typography as Typography10 } from "@mui/material";
+
+// src/utils/thousandFormatter.ts
+var thousandFormatter = (num) => {
+  return Number(num).toLocaleString("uk-UA");
+};
+var thousandFormatter_default = thousandFormatter;
+
+// src/components/BigNumber/BigNumber.tsx
+import { jsx as jsx32, jsxs as jsxs13 } from "react/jsx-runtime";
+var BigNumber = (props) => {
+  const { slug, text, number } = props;
+  return /* @__PURE__ */ jsxs13(Box9, { className: "flex flex-col", children: [
+    /* @__PURE__ */ jsx32(
+      Typography10,
+      {
+        component: "span",
+        className: "text-gold text-100 font-extrabold",
+        children: thousandFormatter_default(number)
+      }
+    ),
+    /* @__PURE__ */ jsx32(Typography10, { component: "span", className: "text-base text-gray mt-[-20px]", children: text })
+  ] }, slug);
+};
+var BigNumber_default = BigNumber;
 export {
   AppBar_default as AppBar,
   ArticleCard_default as ArticleCard,
   Autocomplete_default as Autocomplete,
   Avatar_default as Avatar,
   Badge_default as Badge,
+  BigNumber_default as BigNumber,
   Button_default as Button,
   CategoryCard_default as CategoryCard,
   Chip_default as Chip,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mayak-common-library",
-  "version": "0.0.31",
+  "version": "0.0.32",
   "private": false,
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",