mayak-common-library 0.0.108 → 0.0.110

package/dist/index.css

@@ -65,7 +65,7 @@
   animation: fadeInReverse 0.5s;
 }
 
-/* src/styles/globals.scss */
+/* src/lib/styles/globals.scss */
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
@@ -95,7 +95,13 @@
 }
 @layer components {
   .white-block-snack {
-    @apply bg-white px-[10px] py-[2px] w-fit font-extrabold text-12;
+    @apply bg-white px-[10px] py-[2px] w-fit text-12;
+  }
+  .white-block-snack-border {
+    @apply bg-white border-solid px-[10px] py-[2px] w-fit text-14 border-[1px] border-dark;
+  }
+  .gold-block-snack-border {
+    @apply bg-gold border-solid px-[10px] py-[2px] w-fit text-14 border-[1px] border-gold;
   }
   .black-block-snack {
     @apply bg-dark py-[6px] px-[16px] w-fit text-white font-extrabold text-12;
@@ -104,10 +110,10 @@
     @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;
+    @apply px-[10px] py-[2px] text-12 border-[1px] border-custom-gray-medium w-fit;
   }
-  .button-text-size {
-    @apply sm:text-14;
+  .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;
   }
   .text-gold2 {
     color: #99835F;
@@ -126,19 +132,18 @@
   .text-32 {
     font-size: 32px;
     line-height: 35px;
-    @apply uppercase font-extrabold;
   }
   .text-100 {
-    font-size: 100px !important;
-    line-height: 110px !important;
+    font-size: 100px;
+    line-height: 110px;
   }
   .text-50 {
     font-size: 50px;
     line-height: 55px;
   }
-  .text-40 {
-    font-size: 40px;
-    line-height: 48px;
+  .text-60 {
+    font-size: 60px;
+    line-height: 66px;
   }
   .text-10 {
     font-size: 10px;
@@ -150,16 +155,16 @@
   }
   .text-14 {
     font-size: 14px;
-    line-height: 20px;
+    line-height: 22px;
   }
   .text-14-gray {
     font-size: 14px;
-    line-height: 20px;
+    line-height: 22px;
     color: #757575;
   }
   .text-14-bold {
     font-size: 14px;
-    line-height: 20px;
+    line-height: 22px;
     @apply font-extrabold;
   }
   .text-16 {
@@ -173,7 +178,14 @@
   .text-20 {
     font-size: 20px;
     line-height: 22px;
-    @apply font-extrabold uppercase;
+  }
+  .text-22 {
+    font-size: 22px;
+    line-height: 26px;
+  }
+  .text-24 {
+    font-size: 24px;
+    line-height: 30px;
   }
   .text-26 {
     font-size: 26px;
@@ -210,6 +222,9 @@
   .bg-gray {
     background-color: #757575;
   }
+  .bg-gray2 {
+    background-color: #FBFBFB;
+  }
   .bg-dark {
     background-color: #343434;
   }
@@ -222,12 +237,18 @@
   .border-custom-gray {
     border-color: #757575;
   }
-  .border-dark {
-    border-color: #343434;
+  .border-custom-gray-medium {
+    border-color: #D0CED2;
+  }
+  .border-custom-gray-light {
+    border-color: #F5F5F5;
   }
   .border-custom-dark {
     border-color: #343434;
   }
+  .border-dark {
+    border-color: #343434;
+  }
   .border-gold {
     border-color: #C8BCA1;
   }
@@ -237,14 +258,17 @@
   .big-title {
     @apply uppercase font-extrabold text-34;
   }
+  .wrapper-gold {
+    @apply bg-gold py-[6px] px-[16px] w-fit md:py-[2px] md:px-[6px];
+  }
   .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;
+    @apply block border-[1px] py-[16px] px-[24px] text-14 w-fit border-dark border-solid;
   }
   .block-white-wrapper {
-    @apply text-32 bg-white py-[20px] px-[30px] block;
+    @apply text-32 bg-white py-[20px] px-[30px] block md:pt-[10px] md:pb-[6px] md:px-[10px];
   }
   .block-white {
     @apply bg-white py-[30px] px-[40px];
@@ -255,6 +279,9 @@
   .filter-gold2 {
     filter: invert(64%) sepia(5%) saturate(2284%) hue-rotate(358deg) brightness(81%) contrast(87%);
   }
+  .filter-gold {
+    filter: invert(87%) sepia(15%) saturate(382%) hue-rotate(4deg) brightness(85%) contrast(91%);
+  }
   .filter-gray {
     filter: invert(50%) sepia(10%) saturate(17%) hue-rotate(354deg) brightness(89%) contrast(90%);
   }
@@ -279,20 +306,75 @@
     box-sizing: border-box;
     margin-right: auto;
     display: block;
-    max-width: 745px;
+    max-width: 790px !important;
+  }
+  .dot-slider {
+    border: none;
+    width: 10px;
+    height: 10px;
+    background: #343434;
+    border-radius: 50%;
+    cursor: pointer;
+  }
+  .dot-slider_big {
+    width: 14px;
+    height: 14px;
+  }
+  @media screen and (max-width: 1100px) {
+    .dot-slider_big {
+      width: 10px;
+      height: 10px;
+    }
+  }
+  .dot:focus {
+    outline: none;
+  }
+  .dot-slider_active {
+    background: #C8BCA1;
+  }
+  .trim-text-1 {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    -webkit-line-clamp: 1;
+  }
+  .simpleZoomImgHover {
+    @apply opacity-90 transform scale-110 transition duration-300 ease-out;
+  }
+  .simpleZoomImg {
+    -webkit-transform: scale(1);
+    -ms-transform: scale(1);
+    transform: scale(1);
+    -webkit-transition: 0.3s ease-out;
+    transition: 0.3s ease-out;
+  }
+  .bg-gold-gradient {
+    @apply bg-gradient-to-r from-[#99835F] to-[#C8BCA1];
   }
 }
 .richTextBlock {
+  font-family: RockStar, sans-serif;
   line-height: 24px;
 }
 .richTextBlock p {
-  color: #757575;
+  color: #343434 !important;
+  margin: 10px 0;
+}
+@media screen and (max-width: 1100px) {
+  .richTextBlock p {
+    margin: 6px 0;
+  }
 }
 .richTextBlock ul {
   margin: 16px 0;
-  padding-left: 40px;
+  padding-left: 20px;
   list-style: disc;
 }
+@media screen and (max-width: 1100px) {
+  .richTextBlock ul {
+    margin: 10px 0;
+  }
+}
 .richTextBlock h2 {
   font-size: 20px;
   line-height: 22px;
@@ -307,76 +389,132 @@
   margin-top: 20px;
   margin-bottom: 6px;
 }
-@layer components {
-  .nav-item.active {
-    @apply text-accent-beige;
-  }
-  .nav-item {
-    @apply p-2 text-accent-dark;
-    text-decoration: none;
-    cursor: pointer;
-    font-weight: 800;
-    font-size: 12px;
-    text-transform: uppercase;
-  }
-  .nav-indicator {
-    @apply absolute top-0 rounded-full bg-accent-beige;
-    width: 7px;
-    height: 7px;
-    transition: transform 0.3s ease-out;
+.input-form::placeholder {
+  color: #343434;
+  opacity: 1;
+}
+.fader {
+  height: 738px;
+  position: relative;
+  overflow: hidden;
+}
+@media screen and (max-width: 800px) {
+  .fader {
+    height: 950px;
   }
 }
+.fader__slide {
+  cursor: pointer;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+}
+.homeLocaleSwitcher p {
+  color: white !important;
+}
+.homeLocaleSwitcher svg {
+  filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(103%) contrast(103%);
+}
+.homeLocaleSwitcher:hover p {
+  color: #343434 !important;
+}
+.homeLocaleSwitcher:hover svg {
+  filter: none;
+}
+.placeholder-style::placeholder {
+  position: relative;
+  left: 2px;
+}
+.placeholder-style-2::placeholder {
+  position: relative;
+  left: 2px;
+  color: #939393 !important;
+}
+.placeholder-style-phone::placeholder {
+  color: #343434;
+  opacity: 1;
+}
 @font-face {
   font-family: RockStar;
-  src: url("./Rock Star_Regular_Web-VMOWTS6V.woff2");
+  src: url(fonts/RockStar/Rock\ Star_Regular_Web.woff2);
   font-weight: 400;
 }
 @font-face {
   font-family: RockStar;
-  src: url("./Rock Star_Extra Bold_Web-B3PLEFIF.woff2");
+  src: url("fonts/RockStar/Rock Star_Extra Bold_Web.woff2");
   font-weight: 800;
 }
 body {
   max-width: 100vw;
-  overflow-x: hidden;
   margin: 0;
   display: flex;
   flex-direction: column;
   min-height: 100vh;
   color: #343434;
-  background-color: #F5F5F5;
+  background-color: #F5F5F5 !important;
   font-size: 14px;
-  line-height: 20px;
+  line-height: 22px;
   font-weight: 400;
   font-family: RockStar, sans-serif;
 }
+div {
+  box-sizing: border-box;
+}
+html {
+  overflow-x: hidden;
+}
 main {
   flex-grow: 1;
 }
 a {
   color: inherit;
   text-decoration: none;
+  transition: all 0.3s ease-out;
+}
+a:not(.noHover):hover {
+  color: #99835F;
 }
 *:focus-visible {
   outline: none;
 }
-@media screen and (min-width: 1200px) {
+.MuiContainer-root {
+  padding-left: 0 !important;
+  padding-right: 0 !important;
+}
+@media screen and (max-width: 1270px) {
   .MuiContainer-root {
-    padding-left: 0;
-    padding-right: 0;
+    padding-left: 40px !important;
+    padding-right: 40px !important;
   }
 }
-@media screen and (max-width: 1200px) {
+@media screen and (max-width: 1100px) {
   .MuiContainer-root {
-    padding-left: 40px;
-    padding-right: 40px;
+    padding-left: 60px !important;
+    padding-right: 60px !important;
   }
 }
-@media screen and (max-width: 700px) {
+@media screen and (max-width: 800px) {
   .MuiContainer-root {
-    padding-left: 20px;
-    padding-right: 20px;
+    padding-left: 25px !important;
+    padding-right: 25px !important;
   }
 }
+:root {
+  --map-tiles-filter: grayscale(0.5) saturate(0) ;
+}
+.map-tiles {
+  filter: var(--map-tiles-filter, none);
+}
+::-webkit-input-placeholder {
+  opacity: 1 !important;
+}
+input,
+textarea,
+button,
+select,
+a {
+  -webkit-tap-highlight-color: transparent;
+}
 
 /* src/components/AppBar/styles.css */

package/dist/index.d.mts

@@ -0,0 +1,301 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ButtonProps } from '@mui/material/Button';
+import * as React from 'react';
+import React__default, { FC, PropsWithChildren, ReactElement, MouseEvent, ReactNode } from 'react';
+import { IconButtonProps } from '@mui/material/IconButton/IconButton';
+import { SelectProps } from '@mui/material/Select/Select';
+import { SystemStyleObject } from '@mui/system/styleFunctionSx/styleFunctionSx';
+import { ChipProps, ToggleButtonGroupProps as ToggleButtonGroupProps$1, ToggleButtonProps } from '@mui/material';
+import { BadgeProps } from '@mui/material/Badge/Badge';
+import { AvatarProps } from '@mui/material/Avatar/Avatar';
+import { TypographyOwnProps } from '@mui/material/Typography';
+import { RadioProps } from '@mui/material/Radio';
+import { FormControlLabelProps } from '@mui/material/FormControlLabel';
+import { RadioGroupProps } from '@mui/material/RadioGroup';
+import { SwitchProps } from '@mui/material/Switch/Switch';
+import { SliderProps } from '@mui/material/Slider/Slider';
+import { MenuItemProps } from '@mui/material/MenuItem/MenuItem';
+import { InputProps } from '@mui/material/Input';
+import { PatternFormatProps } from 'react-number-format/types/types';
+import { UseControllerProps, FieldValues } from 'react-hook-form';
+export { default as MapIcon } from '@/icons/map-search.svg';
+import { ListProps } from '@mui/material/List/List';
+import { CheckboxProps } from '@mui/material/Checkbox';
+import { FormControlLabelProps as FormControlLabelProps$1 } from '@mui/material/FormControlLabel/FormControlLabel';
+export { NextIntlClientProvider } from 'next-intl';
+
+declare function Greet(props: {
+    name: string;
+}): react_jsx_runtime.JSX.Element;
+
+interface CustomButtonProps extends ButtonProps, PropsWithChildren {
+    bolt?: boolean;
+    border?: boolean;
+    base?: boolean;
+    small?: boolean;
+    large?: boolean;
+    medium?: boolean;
+}
+declare const Button: FC<CustomButtonProps>;
+
+interface CustomIconButtonProps extends IconButtonProps, PropsWithChildren {
+}
+declare const IconButton: FC<CustomIconButtonProps>;
+
+declare const CustomSelect: FC<SelectProps & PropsWithChildren>;
+
+interface SelectProProps {
+    placeholder?: string;
+    childTitle?: ReactElement;
+    colorBorder?: boolean;
+    clickComponent?: ReactElement;
+    fullContainerWidth?: boolean;
+    overButton?: boolean;
+    small?: boolean;
+    fullWidth?: boolean;
+    freeChildWidth?: boolean;
+    disableCloseButton?: boolean;
+    openUp?: boolean;
+    intermediateChild?: ReactElement;
+    actionsComponent?: ReactElement;
+    accentBgColor?: true;
+    paperSx?: SystemStyleObject;
+    childContainerSx?: SystemStyleObject;
+    reverseAnimation?: boolean;
+    containerSx?: SystemStyleObject;
+}
+declare const SelectPro: FC<PropsWithChildren & SelectProProps>;
+
+interface CustomChipProps {
+    view: "black" | "line" | "white" | "silver";
+}
+declare const Chip: FC<ChipProps & CustomChipProps>;
+
+declare const CustomBadge: (props: BadgeProps) => react_jsx_runtime.JSX.Element;
+
+declare const CustomAvatar: (props: AvatarProps) => react_jsx_runtime.JSX.Element;
+
+declare const Text: FC<TypographyOwnProps & PropsWithChildren>;
+
+interface CustomRadioProps {
+    labelProps?: FormControlLabelProps;
+    radioProps?: RadioProps;
+    label?: string;
+    value?: string;
+}
+declare const CustomRadio: React__default.FC<CustomRadioProps>;
+
+declare const CustomRadioGroup: React__default.FC<RadioGroupProps & PropsWithChildren>;
+
+interface CustomSwitchProps {
+    beforeText?: string;
+    afterText?: string;
+}
+declare const CustomSwitch: FC<CustomSwitchProps & SwitchProps>;
+
+declare const CustomSlider: FC<SliderProps>;
+
+declare const CustomMenuItem: FC<MenuItemProps & PropsWithChildren>;
+
+interface CustomInputProps {
+    type?: "number" | "string";
+    adornmentText?: string;
+    big?: boolean;
+}
+declare const CustomInput: FC<CustomInputProps & InputProps>;
+
+interface PhoneInputProps {
+    onChange: (event: {
+        target: {
+            name: string;
+            value: string;
+        };
+    }) => void;
+    name: string;
+}
+declare const PhoneInput: React.ForwardRefExoticComponent<PhoneInputProps & React.RefAttributes<PatternFormatProps>>;
+
+interface FromToInputProps {
+    label?: string;
+}
+declare const FromToInput: FC<FromToInputProps>;
+
+interface SearchInputProps {
+    onClick?: (event: MouseEvent<HTMLDivElement>) => void;
+    collapse?: boolean;
+}
+declare const SearchInput: <T extends object>(props: SearchInputProps & UseControllerProps<T>) => react_jsx_runtime.JSX.Element;
+
+declare const Providers: FC<PropsWithChildren>;
+
+interface AppBarProps {
+    links: {
+        path: string;
+        title: string;
+    }[];
+}
+declare const AppBar: FC<AppBarProps>;
+
+interface ImageContainerProps {
+    src: any;
+    alt: string;
+    contentful?: boolean;
+    priority?: boolean;
+    loading?: "lazy" | "eager" | undefined;
+    width?: string;
+    height?: string;
+    objectFit?: string;
+    classesWrapper?: string;
+    classesImg?: string;
+}
+declare const ImageContainer: FC<ImageContainerProps>;
+
+interface CategoryCardProps {
+    image_url?: string;
+    title: string;
+    text: string;
+    link: string;
+}
+declare const CategoryCard: FC<CategoryCardProps>;
+
+interface ArticleCardProps {
+    imageUrl: string;
+    title: string;
+    text: string;
+    classes?: string;
+    href: string;
+}
+declare const ArticleCard: FC<ArticleCardProps>;
+
+interface JobCardProps {
+}
+declare const JobCard: FC<JobCardProps>;
+
+declare const RealtorCard: () => react_jsx_runtime.JSX.Element;
+
+declare const RealtyCard: FC;
+
+interface TeamPersonCardProps {
+    image_url?: string;
+    name: string;
+    position: string;
+    text: string;
+}
+declare const TeamPersonCard: FC<TeamPersonCardProps>;
+
+interface AutocompleteProps {
+    values: string[];
+}
+declare const Autocomplete: FC<AutocompleteProps & UseControllerProps<any>>;
+
+interface BigNumberProps {
+    number?: number;
+    text?: string;
+}
+declare const BigNumber: FC<BigNumberProps>;
+
+interface TextBlockProps {
+    classes?: string;
+    title: string;
+    text: string;
+}
+declare const TextBlock: FC<TextBlockProps>;
+
+type TitlePosition = "center" | "left";
+
+interface TitleBlockProps {
+    title: string;
+    titlePosition?: TitlePosition;
+    classes?: string;
+}
+declare const TitleBlock: FC<TitleBlockProps>;
+
+declare const List: FC<ListProps>;
+
+interface ListItemProps {
+    icon?: ReactElement;
+    title: string;
+    bold?: boolean;
+    onClick?: (value: string) => void;
+    value?: string;
+}
+declare const ListItem: FC<ListItemProps>;
+
+type Values = {
+    value: string | number[];
+    title: string;
+}[];
+
+interface ToggleButtonsMultipleProps extends ToggleButtonGroupProps$1 {
+    values: Values;
+    textView?: boolean;
+    collapseOnClick?: boolean;
+    collapseParent?: () => void;
+    label?: string;
+    flexDirection?: "row" | "col";
+    fixWidth?: boolean;
+    arrayValueFormat?: boolean;
+}
+declare const ToggleButtonsWithLabel: <T extends FieldValues>(props: ToggleButtonsMultipleProps & UseControllerProps<T>) => react_jsx_runtime.JSX.Element;
+
+declare const ToggleButton: FC<ToggleButtonProps & {
+    textView?: boolean;
+}>;
+
+interface ToggleButtonGroupProps extends ToggleButtonGroupProps$1 {
+    textView?: boolean;
+    flexDirection?: "row" | "col";
+    onChange: (event: MouseEvent<HTMLElement>, value: any) => void;
+    value: any;
+}
+declare const ToggleButtonGroup: FC<ToggleButtonGroupProps & PropsWithChildren>;
+
+interface CustomCheckboxProps {
+    labelProps?: FormControlLabelProps$1;
+    checkboxProps?: CheckboxProps;
+    className?: string;
+    label?: string;
+    toggleView?: boolean;
+}
+declare const CustomCheckbox: FC<CustomCheckboxProps>;
+
+interface IBannerBlock {
+    videoLink?: string;
+    bigText?: string;
+    smallText?: string;
+    classes?: string;
+}
+declare function BannerBlock({ bigText, smallText, classes, videoLink, }: IBannerBlock): react_jsx_runtime.JSX.Element;
+
+type MenuItem = {
+    path: string;
+    title: string;
+};
+interface HeaderProps {
+    menuItems: MenuItem[];
+    mainPhone?: string;
+}
+
+declare const Header: FC<HeaderProps>;
+
+interface LogoBlockProps {
+    classes?: string;
+    small?: boolean;
+    locale: string;
+}
+declare const LogoBlock: FC<LogoBlockProps>;
+
+type outLinkType = 'viber' | 'telegram' | 'tel' | 'googleMaps' | 'mail' | 'link' | 'whatsapp';
+
+interface LinkOutProps {
+    data?: string;
+    type: outLinkType;
+    title: string | ReactNode;
+    classes?: string;
+    blank?: boolean;
+}
+declare const LinkOut: FC<LinkOutProps>;
+
+declare const LocaleSwitcherToggle: () => react_jsx_runtime.JSX.Element;
+
+export { AppBar, ArticleCard, Autocomplete, CustomAvatar as Avatar, CustomBadge as Badge, BannerBlock, BigNumber, Button, CategoryCard, CustomCheckbox as Checkbox, Chip, FromToInput, Greet, Header, IconButton, ImageContainer, CustomInput as Input, JobCard, LinkOut, List, ListItem, LocaleSwitcherToggle, LogoBlock, CustomMenuItem as MenuItem, PhoneInput, Providers, CustomRadio as Radio, CustomRadioGroup as RadioGroup, RealtorCard, RealtyCard, SearchInput, CustomSelect as Select, SelectPro, CustomSlider as Slider, CustomSwitch as Switch, TeamPersonCard, Text, TextBlock, TitleBlock, ToggleButton, ToggleButtonGroup, ToggleButtonsWithLabel };