mayak-common-library 0.0.32 → 0.0.34

package/dist/index.js

@@ -74,6 +74,8 @@ __export(src_exports, {
   ImageContainer: () => ImageContainer_default,
   Input: () => Input_default,
   JobCard: () => JobCard_default,
+  List: () => List_default,
+  ListItem: () => ListItem_default,
   MapIcon: () => map_search_default,
   MenuItem: () => MenuItem_default,
   PhoneInput: () => PhoneInput_default,
@@ -87,7 +89,10 @@ __export(src_exports, {
   Slider: () => Slider_default,
   Switch: () => Switch_default,
   TeamPersonCard: () => TeamPersonCard_default,
-  Text: () => Text_default
+  Text: () => Text_default,
+  TextBlock: () => TextBlock_default,
+  TitleBlock: () => TitleBlock_default,
+  ToggleButton: () => ToggleButton_default
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -113,7 +118,7 @@ var StyledButton = (0, import_material.styled)(import_Button.default)(() => ({
   "&:hover": {
     backgroundColor: "unset",
     svg: {
-      filter: "brightness(0) saturate(100%) invert(95%) sepia(10%) saturate(806%) hue-rotate(339deg) brightness(83%) contrast(85%)"
+      filter: "brightness(0) saturate(100%) invert(0%) sepia(95%) saturate(0%) hue-rotate(155deg) brightness(95%) contrast(105%)"
     }
   },
   transition: "transform 0.1s ease-in-out",
@@ -124,15 +129,16 @@ var StyledButton = (0, import_material.styled)(import_Button.default)(() => ({
   }
 }));
 var Button = (props) => {
-  const _a = props, { children, base, bolt, border, small, large } = _a, rest = __objRest(_a, ["children", "base", "bolt", "border", "small", "large"]);
+  const _a = props, { children, base, bolt, border, medium, small, large } = _a, rest = __objRest(_a, ["children", "base", "bolt", "border", "medium", "small", "large"]);
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     StyledButton,
     __spreadProps(__spreadValues({}, rest), {
       disableRipple: true,
       className: `${base ? "bg-accent-dark rounded-none text-white hover:bg-accent-beige text-base" : ""}
 ${small ? "py-1.5 px-4" : ""}
-      ${large ? "py-5 px-10" : ""}   
-        ${border ? "border-b border-solid rounded-none" : ""}`,
+${medium ? "py-3.5 px-4" : ""}
+      ${large ? "h-[38px] py-3.5 px-10" : ""}   
+        ${border ? "text-accent-silver-3 border-b border-solid rounded-none border-accent-silver-3 hover:text-accent-black hover:border-b-2 hover:border-accent-black" : ""}`,
       children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
         import_Typography.default,
         {
@@ -250,7 +256,7 @@ var CustomSelect = (props) => {
         id: uniqueId,
         PaperProps: {
           classes: {
-            root: `menu ${open ? "menu--open" : "menu--close"}`
+            root: `select ${open ? "select--open" : "select--close"}`
           }
         }
       },
@@ -290,7 +296,9 @@ var SelectPro = ({
   clickComponent,
   fullContainerWidth = false,
   overButton = false,
-  small = false
+  small = false,
+  fullWidth = false,
+  freeChildWidth = false
 }) => {
   const [btn, setAnchorEl] = (0, import_react2.useState)(null);
   const [open, setOpen] = (0, import_react2.useState)(false);
@@ -312,15 +320,11 @@ var SelectPro = ({
   const childrenWithHandleChange = (0, import_react2.isValidElement)(children) ? (0, import_react2.cloneElement)(children, {
     collapseParent: handleClose
   }) : children;
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_material4.ClickAwayListener, { onClickAway: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_material4.Box, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_material4.ClickAwayListener, { onClickAway: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_material4.Box, { width: fullWidth ? "100%" : "inherit", children: [
     clickComponent ? (0, import_react2.cloneElement)(clickComponent, {
       ref: btn,
-      onClick: handleClick
-      // onClick: (e) => {
-      //   clickComponent.props.onClick(e);
-      //   // e.preventDefault();
-      //   handleClick(e);
-      // },
+      onClick: handleClick,
+      collapse: open
     }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
       import_material4.Button,
       {
@@ -332,7 +336,7 @@ var SelectPro = ({
         disableRipple: true,
         fullWidth: true,
         sx: {
-          height: small ? "34px" : "49px",
+          height: small ? "34px" : "38px",
           padding: small ? "0 10px 0 6px" : "0 20px 0 19px"
         },
         className: `border rounded-none border-solid normal-case text-accent-dark hover:bg-white ${open ? "!border-transparent bg-white" : ""} ${colorBorder ? "border-accent-beige flex-row-reverse justify-end gap-x-2" : "justify-between border-accent-dark"}`,
@@ -340,8 +344,9 @@ var SelectPro = ({
           /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             import_material4.Typography,
             {
-              className: "text-sm leading-4",
-              children: `${placeholder}`
+              width: "200px",
+              className: "text-sm leading-4 truncate text-left",
+              children: placeholder
             }
           ),
           colorBorder ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(search_default, {}) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
@@ -361,13 +366,17 @@ var SelectPro = ({
       {
         sx: {
           position: "absolute",
-          width: !fullContainerWidth && btn ? btn.offsetWidth : "100%",
+          // width: "min-content",
+          width: freeChildWidth ? "fit-content" : !fullContainerWidth && btn ? (
+            // ? "fit-content" //(btn as HTMLButtonElement).offsetWidth
+            btn.offsetWidth
+          ) : "100%",
           left: fullContainerWidth ? 0 : "initial",
           right: fullContainerWidth ? 0 : "initial",
           top: overButton ? 0 : "initial"
         },
-        className: `menu ${open ? "menu--open" : "menu--close"} z-50 rounded-none  shadow-sm`,
-        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_material4.Box, { className: `flex flex-col p-3 gap-3`, children: [
+        className: `select ${open ? "select--open" : "select--close"} z-50 rounded-none  shadow-sm`,
+        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_material4.Box, { className: `flex flex-col py-3 px-4 gap-2`, children: [
           overButton ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             IconButton_default,
             {
@@ -395,20 +404,22 @@ var SelectPro_default = SelectPro;
 var import_material5 = require("@mui/material");
 var import_jsx_runtime9 = require("react/jsx-runtime");
 var StyledChip = (0, import_material5.styled)(import_material5.Chip)(({ theme: theme2 }) => ({
-  borderRadius: theme2.shape.borderRadius
+  borderRadius: theme2.shape.borderRadius,
+  ".MuiChip-label": { padding: 0 },
+  ".MuiChip-icon": { margin: "0 6px 0 0" }
 }));
 var ChipViews = {
   black: "bg-accent-dark text-accent-white py-1.5 px-4",
   line: "border border-solid border-accent-dark bg-accent-white",
   white: "bg-accent-white text-accent-dark",
-  silver: "bg-accent-silver"
+  silver: "bg-accent-silver text-accent-dark "
 };
 var CustomChip = (props) => {
   const _a = props, { view } = _a, rest = __objRest(_a, ["view"]);
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     StyledChip,
     __spreadValues({
-      className: `rounded-none w-fit h-fit px-2.5 py-0 ${ChipViews[view]}`
+      className: `rounded-none w-fit h-fit px-2.5 py-0 text-14 ${ChipViews[view]}`
     }, rest)
   );
 };
@@ -557,10 +568,14 @@ var StyledInput = (0, import_material10.styled)(import_Input.default)(() => ({
   },
   "& input[type=number]": {
     MozAppearance: "textfield"
+  },
+  input: {
+    padding: "0",
+    height: "auto"
   }
 }));
 var CustomInput = (props) => {
-  const _a = props, { type, adornmentText, value } = _a, rest = __objRest(_a, ["type", "adornmentText", "value"]);
+  const _a = props, { type, adornmentText, value, big } = _a, rest = __objRest(_a, ["type", "adornmentText", "value", "big"]);
   const handleKeyDown = (event) => {
     if (type === "number" && !/[0-9]/.test(event.key) && event.key !== "Backspace") {
       event.preventDefault();
@@ -576,7 +591,7 @@ var CustomInput = (props) => {
       value,
       componentsProps: {
         root: {
-          className: "border border-black rounded-none border-solid py-1.5 px-2.5 h-8"
+          className: big ? "border-0 border-b border-accent-dark border-solid  px-[30px] py-[19px] text-16 text-accent-dark" : "border border-black rounded-none border-solid py-1.5 px-2.5 h-8"
         }
       },
       type: type || "string"
@@ -639,6 +654,7 @@ var import_CssBaseline = __toESM(require("@mui/material/CssBaseline"));
 var import_stylis = require("stylis");
 
 // src/styles/assets.ts
+var CONTAINER_WIDTH = "lg";
 var WINDOW_SIZE = {
   xs: 0,
   sm: 400,
@@ -740,36 +756,22 @@ var import_jsx_runtime23 = require("react/jsx-runtime");
 var AppBar = ({ links }) => {
   const [activeIndex, setActiveIndex] = (0, import_react6.useState)(0);
   const navItemsRef = (0, import_react6.useRef)([]);
-  (0, import_react6.useEffect)(() => {
-    const indicator = document.querySelector(".nav-indicator");
-    const navItem = navItemsRef.current[activeIndex];
-    const navItemWidth = navItem.offsetWidth;
-    const navItemLeft = navItem.offsetLeft + navItemWidth / 2 - indicator.offsetWidth / 2;
-    const navItemTop = navItem.offsetTop - 5;
-    indicator == null ? void 0 : indicator.setAttribute(
-      "style",
-      `transform: translate(${navItemLeft}px, ${navItemTop}px);`
-    );
-  }, [activeIndex]);
   const handleClick = (index) => {
     setActiveIndex(index);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_material12.Stack, { direction: "row", spacing: 1, position: "relative", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_material12.Box, { className: "nav-indicator" }),
-    links.map((link, index) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-      import_link.default,
-      {
-        ref: (el) => {
-          navItemsRef.current[index] = el;
-        },
-        href: link.path,
-        className: `nav-item ${index === activeIndex ? "active" : ""} hover:text-accent-beige`,
-        onClick: () => handleClick(index),
-        children: link.title
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_material12.Stack, { direction: "row", spacing: 1, position: "relative", children: links.map((link, index) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    import_link.default,
+    {
+      ref: (el) => {
+        navItemsRef.current[index] = el;
       },
-      index
-    ))
-  ] });
+      href: link.path,
+      className: `nav-item ${index === activeIndex ? "active" : ""} hover:text-accent-beige`,
+      onClick: () => handleClick(index),
+      children: link.title
+    },
+    index
+  )) });
 };
 var AppBar_default = AppBar;
 
@@ -786,20 +788,28 @@ var ImageContainer = (props) => {
     contentful = true,
     priority = false,
     loading = "lazy",
-    objectFit = "object-cover"
+    objectFit = "object-cover",
+    classesWrapper,
+    classesImg
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_material13.Box, { className: `relative ${width} ${height}`, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-    import_image.default,
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    import_material13.Box,
     {
-      className: `${objectFit} object-center`,
-      src: contentful ? `https:${src}` : src,
-      alt,
-      fill: true,
-      loading,
-      sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw",
-      priority
+      className: `relative ${width} ${height}${classesWrapper ? " " + classesWrapper : ""}`,
+      children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        import_image.default,
+        {
+          className: `${objectFit} object-center${classesImg ? " " + classesImg : ""}`,
+          src: contentful ? `https:${src}` : src,
+          alt,
+          fill: true,
+          loading,
+          sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw",
+          priority
+        }
+      )
     }
-  ) });
+  );
 };
 var ImageContainer_default = ImageContainer;
 
@@ -843,37 +853,43 @@ var import_material15 = require("@mui/material");
 var import_Typography5 = __toESM(require("@mui/material/Typography"));
 var import_jsx_runtime27 = require("react/jsx-runtime");
 var ArticleCard = (props) => {
-  const { image_src = NO_IMAGE } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_link3.default, { href: "/", className: "group/card bg-gray-light", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-      ImageContainer_default,
-      {
-        src: image_src,
-        alt: "test",
-        contentful: false,
-        height: "h-[220px]"
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_material15.Box, { className: "pt-[24px] pl-[16px] pr-[50px] pb-[10px] flex flex-col gap-[6px]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-        import_Typography5.default,
-        {
-          component: "span",
-          className: "text-16 font-extrabold group-hover/card:text-gold2",
-          children: "\u041E\u0441\u043E\u0431\u043B\u0438\u0432\u043E\u0441\u0442\u0456 \u043A\u0443\u043F\u0456\u0432\u043B\u0456 \u0433\u043E\u0442\u0435\u043B\u044E"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-        import_Typography5.default,
-        {
-          component: "span",
-          className: "text-gray group-hover/card:text-gold2",
-          children: "We have built a strong network in Dubai since 2009, which allows us to source the best deal for"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_Typography5.default, { component: "span", className: "border-gold-block-snack", children: "\u0422\u0435\u0433-\u043D\u0430\u0437\u0432\u0430" })
-    ] })
-  ] });
+  const { imageUrl = NO_IMAGE, classes, title, text, href } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+    import_link3.default,
+    {
+      href,
+      className: `group/card bg-gray-light${classes ? " " + classes : ""}`,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+          ImageContainer_default,
+          {
+            src: imageUrl,
+            alt: "test",
+            contentful: false,
+            height: "h-[220px]"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_material15.Box, { className: "pt-[24px] pl-[16px] pr-[50px] pb-[10px] flex flex-col gap-[6px]", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+            import_Typography5.default,
+            {
+              component: "span",
+              className: "text-16 font-extrabold group-hover/card:text-gold2 trim-2",
+              children: title
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+            import_Typography5.default,
+            {
+              component: "span",
+              className: "text-gray group-hover/card:text-gold2 trim-4",
+              children: text
+            }
+          )
+        ] })
+      ]
+    }
+  );
 };
 var ArticleCard_default = ArticleCard;
 
@@ -894,14 +910,18 @@ var RealtorCard_default = RealtorCard;
 // src/components/Card/RealtyCard.tsx
 var import_material16 = require("@mui/material");
 var import_link4 = __toESM(require("next/link"));
+
+// src/icons/metro.svg
+var React5 = __toESM(require("react"));
 var import_jsx_runtime30 = require("react/jsx-runtime");
+var SvgMetro = (props) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("svg", __spreadProps(__spreadValues({ width: 12, height: 10, viewBox: "0 0 12 10", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("path", { d: "M3.23128 0L0 9.41H2.99687L4.12109 6.14551L6.00093 10L7.87891 6.14551L9.0068 9.41H12L8.76874 0L6.00093 4.83041L3.23128 0Z", fill: "#757575" }) }));
+var metro_default = SvgMetro;
+
+// src/components/Card/RealtyCard.tsx
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var RealtyCard = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_link4.default, { href: "/", className: "relative", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_material16.Box, { className: "absolute left-[16px] top-[16px] flex flex-col gap-[9px] z-[1]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Chip_default, { view: "white", label: "id: 00154" }),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Chip_default, { view: "white", label: "\u0416\u041A: \u0421\u0443\u0447\u0430\u0441\u043D\u0438\u0439 \u043A\u0432\u0430\u0440\u0442\u0430\u043B4" })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_link4.default, { href: "/", className: "relative", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
       ImageContainer_default,
       {
         src: "/images/test.png",
@@ -910,24 +930,20 @@ var RealtyCard = () => {
         contentful: false
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_material16.Box, { className: "bg-white py-[20px] px-[16px] flex flex-col gap-[6px]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Chip_default, { view: "black", label: "120 000 \u20B4/\u043C\u0456\u0441\u044F\u0446\u044C" }),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_material16.Typography, { component: "span", className: "font-extrabold", children: "\u0432\u0443\u043B. \u0414\u0440\u0430\u0433\u043E\u043C\u0438\u0440\u043E\u0432\u0430 25" }),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_material16.Typography, { component: "span", className: "text-12", children: "\u041F\u0435\u0447\u0435\u0440\u0441\u044C\u043A\u0438\u0439 \u0440-\u043D" }),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
-        Chip_default,
-        {
-          view: "silver",
-          label: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_material16.Stack, { direction: "row", spacing: 1, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_material16.Typography, { children: "\u043C\u0435\u0442\u0440\u043E:" }),
-            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_material16.Typography, { className: "font-extrabold", children: "\u041B\u0438\u0431\u0456\u0434\u0441\u044C\u043A\u0430" })
-          ] })
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_material16.Box, { className: "flex flex-wrap gap-[6px] mt-[6px]", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Chip_default, { view: "line", label: "2 \u043A\u0456\u043C\u043D" }),
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Chip_default, { view: "line", label: "60 \u043C\xB2" }),
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Chip_default, { view: "line", label: "\u043F\u043E\u0432\u0435\u0440\u0445: 3/24" })
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_material16.Box, { className: "bg-white py-[20px] px-[16px] flex flex-col gap-[6px]", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_material16.Typography, { component: "span", className: "text-14", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_material16.Typography, { component: "span", className: "font-extrabold", children: "120 000 \u20B4" }),
+        "/\u043C\u0456\u0441\u044F\u0446\u044C"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_material16.Typography, { component: "span", className: "font-extrabold", children: "\u0432\u0443\u043B. \u0414\u0440\u0430\u0433\u043E\u043C\u0438\u0440\u043E\u0432\u0430 25" }),
+      /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_material16.Box, { className: "flex items-center gap-[10px]", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_material16.Typography, { component: "span", className: "text-12", children: "\u041F\u0435\u0447\u0435\u0440\u0441\u044C\u043A\u0438\u0439 \u0440-\u043D" }),
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Chip_default, { icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(metro_default, {}), view: "silver", label: "\u041B\u0438\u0431\u0456\u0434\u0441\u044C\u043A\u0430" })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_material16.Box, { className: "flex flex-wrap gap-[6px] mt-[6px]", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Chip_default, { view: "line", label: "2 \u043A\u0456\u043C\u043D" }),
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Chip_default, { view: "line", label: "60 \u043C\xB2" }),
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Chip_default, { view: "line", label: "\u043F\u043E\u0432\u0435\u0440\u0445: 3/24" })
       ] })
     ] })
   ] });
@@ -936,12 +952,12 @@ var RealtyCard_default = RealtyCard;
 
 // src/components/Card/TeamPersonCard.tsx
 var import_material17 = require("@mui/material");
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var TeamPersonCard = (props) => {
   const { image_url = NO_IMAGE, name, position, text } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_material17.Box, { className: "group/card", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_material17.Box, { className: "relative h-[300px]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_material17.Box, { className: "w-full h-full bg-gray-medium group-hover/card:brightness-[50%]", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_material17.Box, { className: "group/card", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_material17.Box, { className: "relative h-[300px]", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_material17.Box, { className: "w-full h-full bg-gray-medium group-hover/card:brightness-[50%]", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         ImageContainer_default,
         {
           contentful: false,
@@ -950,10 +966,10 @@ var TeamPersonCard = (props) => {
           objectFit: "object-contain"
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_material17.Box, { className: "hidden absolute top-[110px] left-[30px] right-[30px] group-hover/card:flex flex-col text-white", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_material17.Typography, { component: "span", className: "text-16 font-extrabold", children: position }),
-        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_material17.Typography, { component: "span", className: "mt-[4px]", children: name }),
-        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_material17.Box, { className: "hidden absolute top-[110px] left-[30px] right-[30px] group-hover/card:flex flex-col text-white", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_material17.Typography, { component: "span", className: "text-16 font-extrabold", children: position }),
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_material17.Typography, { component: "span", className: "mt-[4px]", children: name }),
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
           import_material17.Typography,
           {
             component: "span",
@@ -963,9 +979,9 @@ var TeamPersonCard = (props) => {
         )
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_material17.Box, { className: "mt-[20px] text-center mx-auto flex flex-col w-10/12", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_material17.Typography, { component: "span", className: "text-16 font-extrabold", children: position }),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_material17.Typography, { component: "span", className: "text-gray", children: name })
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_material17.Box, { className: "mt-[20px] text-center mx-auto flex flex-col w-10/12", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_material17.Typography, { component: "span", className: "text-16 font-extrabold", children: position }),
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_material17.Typography, { component: "span", className: "text-gray", children: name })
     ] })
   ] });
 };
@@ -975,7 +991,7 @@ var TeamPersonCard_default = TeamPersonCard;
 var import_react7 = require("react");
 var import_material18 = require("@mui/material");
 var import_react_hook_form = require("react-hook-form");
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var RenderInputAutocomplete = (_a) => {
   var _b = _a, {
     InputProps: InputProps2,
@@ -984,14 +1000,14 @@ var RenderInputAutocomplete = (_a) => {
     "InputProps",
     "InputLabelProps"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_material18.Box, { ref: InputProps2.ref, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_material18.Box, { ref: InputProps2.ref, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
     import_material18.Input,
     __spreadProps(__spreadValues(__spreadValues({}, InputProps2), other), {
-      startAdornment: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_material18.Stack, { direction: "row", alignItems: "center", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_material18.InputAdornment, { position: "start", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(search_default, {}) }),
+      startAdornment: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_material18.Stack, { direction: "row", alignItems: "center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_material18.InputAdornment, { position: "start", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(search_default, {}) }),
         InputProps2.startAdornment
       ] }),
-      endAdornment: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_jsx_runtime32.Fragment, {}),
+      endAdornment: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_jsx_runtime33.Fragment, {}),
       ref: InputProps2.ref,
       disableUnderline: true,
       placeholder: "\u041F\u043E\u0448\u0443\u043A \u043F\u043E \u0440\u0430\u0439\u043E\u043D\u0443, \u0432\u0443\u043B\u0438\u0446\u0456, \u0416\u041A",
@@ -1007,7 +1023,7 @@ var RenderInputAutocomplete = (_a) => {
   ) });
 };
 var CustomPaperComponent = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_material18.Paper, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_material18.Paper, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { children: [
     "helllooo",
     props.children
   ] }, "click-away-wrapper") }));
@@ -1025,7 +1041,7 @@ var Autocomplete = (props) => {
     else setAnchorEl(event.currentTarget);
     setOpen(!open);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
     import_material18.Autocomplete,
     {
       multiple: true,
@@ -1041,12 +1057,12 @@ var Autocomplete = (props) => {
       PaperComponent: CustomPaperComponent,
       renderTags: (value, getTagProps) => value.map((option, index) => {
         const _a = getTagProps({ index }), { key } = _a, tagProps = __objRest(_a, ["key"]);
-        return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
           import_material18.Chip,
           __spreadProps(__spreadValues({
             label: option
           }, tagProps), {
-            deleteIcon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(IconButton_default, { className: "rounded-none bg-accent-silver p-1", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(close_default, {}) }),
+            deleteIcon: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(IconButton_default, { className: "rounded-none bg-accent-silver p-1", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(close_default, {}) }),
             className: "rounded-none w-fit h-fit bg-transparent p-0"
           }),
           key
@@ -1055,10 +1071,10 @@ var Autocomplete = (props) => {
       slotProps: {
         paper: {
           sx: {},
-          className: `menu ${open ? "menu--open" : "menu--close"} z-50 rounded-none  shadow-sm`
+          className: `select ${open ? "select--open" : "select--close"} z-50 rounded-none  shadow-sm`
         }
       },
-      renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
         RenderInputAutocomplete,
         __spreadValues({}, params)
       )
@@ -1077,11 +1093,11 @@ var thousandFormatter = (num) => {
 var thousandFormatter_default = thousandFormatter;
 
 // src/components/BigNumber/BigNumber.tsx
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime34 = 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)(
+  const { text, number } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_material19.Box, { className: "flex flex-col", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
       import_material19.Typography,
       {
         component: "span",
@@ -1089,10 +1105,197 @@ var BigNumber = (props) => {
         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);
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_material19.Typography, { component: "span", className: "text-base text-gray mt-[-20px]", children: text })
+  ] });
 };
 var BigNumber_default = BigNumber;
+
+// src/blocks/TextBlock.tsx
+var import_material20 = require("@mui/material");
+var import_jsx_runtime35 = require("react/jsx-runtime");
+var TextBlock = ({ classes, text, title }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_material20.Box, { className: `mt-[80px]${classes ? " " + classes : ""}`, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_material20.Container, { maxWidth: CONTAINER_WIDTH, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_material20.Box, { className: "flex flex-col items-center gap-[16px] text-center max-w-[950px] w-full mx-auto", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_material20.Typography, { component: "span", className: "text-32", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_material20.Typography, { component: "span", className: "text-gray text-14", children: text })
+  ] }) }) });
+};
+var TextBlock_default = TextBlock;
+
+// src/blocks/TitleBlock.tsx
+var import_Typography6 = __toESM(require("@mui/material/Typography"));
+var import_jsx_runtime36 = require("react/jsx-runtime");
+var TitleBlock = ({ titlePosition, title, classes }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+    import_Typography6.default,
+    {
+      component: "span",
+      className: `text-32 uppercase font-extrabold text-${titlePosition} block${classes ? " " + classes : ""}`,
+      children: title
+    }
+  );
+};
+var TitleBlock_default = TitleBlock;
+
+// src/blocks/TeamWorkerBlock.tsx
+var import_material21 = require("@mui/material");
+
+// src/icons/qoutes.svg
+var React6 = __toESM(require("react"));
+var import_jsx_runtime37 = require("react/jsx-runtime");
+
+// src/blocks/TeamWorkerBlock.tsx
+var import_link5 = __toESM(require("next/link"));
+var import_jsx_runtime38 = require("react/jsx-runtime");
+
+// src/blocks/AnyLevelBlock.tsx
+var import_material22 = require("@mui/material");
+var import_jsx_runtime39 = require("react/jsx-runtime");
+
+// src/blocks/RichTextBlock.tsx
+var import_material23 = require("@mui/material");
+var import_rich_text_react_renderer = require("@contentful/rich-text-react-renderer");
+var import_jsx_runtime40 = require("react/jsx-runtime");
+
+// src/blocks/ArticleContentBlock.tsx
+var import_material24 = require("@mui/material");
+
+// src/utils/formatDate.ts
+var import_date_fns = require("date-fns");
+
+// src/blocks/ArticleContentBlock.tsx
+var import_jsx_runtime41 = require("react/jsx-runtime");
+
+// src/components/List/List.tsx
+var import_material25 = require("@mui/material");
+var import_jsx_runtime42 = require("react/jsx-runtime");
+var List = (props) => {
+  const { children } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_material25.List, __spreadProps(__spreadValues({ disablePadding: true }, props), { children }));
+};
+var List_default = List;
+
+// src/components/List/ListItem.tsx
+var import_material26 = require("@mui/material");
+var import_ListItemButton = __toESM(require("@mui/material/ListItemButton"));
+var import_ListItemIcon = __toESM(require("@mui/material/ListItemIcon"));
+var import_ListItemText = __toESM(require("@mui/material/ListItemText"));
+var import_Typography7 = __toESM(require("@mui/material/Typography"));
+var import_jsx_runtime43 = require("react/jsx-runtime");
+var ListItem = ({ icon, title, bold, onClick }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_material26.ListItem, { disablePadding: true, disableGutters: true, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
+    import_ListItemButton.default,
+    {
+      sx: { padding: 0, "&:hover": { backgroundColor: "unset" } },
+      onClick: () => onClick && onClick(title),
+      disableRipple: true,
+      children: [
+        icon ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_ListItemIcon.default, { sx: { minWidth: "24px" }, children: icon }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_ListItemText.default, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+          import_Typography7.default,
+          {
+            className: `text-xs ${bold ? "font-extrabold" : "font-normal"}`,
+            children: title
+          }
+        ) })
+      ]
+    }
+  ) });
+};
+var ListItem_default = ListItem;
+
+// src/components/ToggleButton/ToggleButton.tsx
+var import_ToggleButton = __toESM(require("@mui/material/ToggleButton"));
+var import_material27 = require("@mui/material");
+var import_react_hook_form2 = require("react-hook-form");
+var import_Typography8 = __toESM(require("@mui/material/Typography"));
+var import_ToggleButtonGroup = __toESM(require("@mui/material/ToggleButtonGroup"));
+var import_jsx_runtime44 = require("react/jsx-runtime");
+var StyledToggleButtonGroup = (0, import_material27.styled)(
+  import_ToggleButtonGroup.default
+)(({ theme: theme2, flexDirection }) => ({
+  [`& .${import_ToggleButtonGroup.toggleButtonGroupClasses.grouped}`]: {
+    // marginRight: theme.spacing(1.3),
+    marginRight: flexDirection === "col" ? "unset" : theme2.spacing(1),
+    marginBottom: flexDirection === "col" ? theme2.spacing(1) : "unset",
+    // marginBottom: theme.spacing(1.3),
+    // spacing: theme.spacing(1.3),
+    width: "fit-content"
+    // border: 0,
+    // borderRadius: theme.shape.borderRadius,
+    // [`&.${toggleButtonGroupClasses.disabled}`]: {
+    //   border: 0,
+    // },
+  },
+  [`& .${import_ToggleButtonGroup.toggleButtonGroupClasses.lastButton}`]: {
+    marginBottom: "unset",
+    marginRight: "unset"
+  },
+  [`& .${import_ToggleButtonGroup.toggleButtonGroupClasses.middleButton},& .${import_ToggleButtonGroup.toggleButtonGroupClasses.lastButton}`]: {
+    // marginLeft: -1,
+    // borderLeft: "1px solid transparent",
+    marginLeft: "unset",
+    borderLeft: "unset"
+  }
+}));
+var ToggleButton = (0, import_material27.styled)(import_ToggleButton.default)(() => ({
+  "&.Mui-selected, &.Mui-selected:hover": {
+    backgroundColor: "#C8BCA1 !important"
+    // marginLeft: "-1px !important",
+    // borderLeft: "1px solid transparent !important",
+  }
+}));
+var CustomToggleButton = (props) => {
+  const _a = props, { children, textView } = _a, rest = __objRest(_a, ["children", "textView"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    ToggleButton,
+    __spreadProps(__spreadValues({}, rest), {
+      disableRipple: true,
+      className: `rounded-none border-none min-w-10 h-9 normal-case py-1.5 px-2.5 ${textView ? "justify-start bg-transparent hover:bg-transparent h-6 p-0" : " bg-accent-silver "}`,
+      children
+    })
+  );
+};
+var ToggleButtonsMultiple = (props) => {
+  const {
+    values,
+    textView = false,
+    exclusive,
+    collapseOnClick = false,
+    label,
+    collapseParent,
+    flexDirection = "row"
+  } = props;
+  const { field } = (0, import_react_hook_form2.useController)(props);
+  const handleFormat = (_event, newFormats) => {
+    console.log(newFormats);
+    if (newFormats !== null) field.onChange(newFormats);
+    if (collapseOnClick && collapseParent) collapseParent();
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_material27.Stack, { children: [
+    label ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_Typography8.default, { className: "text-accent-silver-2 text-sm", children: label }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+      StyledToggleButtonGroup,
+      __spreadProps(__spreadValues({}, field), {
+        flexDirection,
+        exclusive,
+        value: field.value,
+        onChange: handleFormat,
+        "aria-label": "text formatting",
+        className: `flex flex-${flexDirection} ${textView ? "gap-1 flex-nowrap flex-col" : " flex-wrap"}`,
+        children: values.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+          CustomToggleButton,
+          {
+            value: option.value,
+            textView,
+            children: option.title
+          },
+          index
+        ))
+      })
+    )
+  ] });
+};
+var ToggleButton_default = ToggleButtonsMultiple;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AppBar,
@@ -1110,6 +1313,8 @@ var BigNumber_default = BigNumber;
   ImageContainer,
   Input,
   JobCard,
+  List,
+  ListItem,
   MapIcon,
   MenuItem,
   PhoneInput,
@@ -1123,5 +1328,8 @@ var BigNumber_default = BigNumber;
   Slider,
   Switch,
   TeamPersonCard,
-  Text
+  Text,
+  TextBlock,
+  TitleBlock,
+  ToggleButton
 });