profinansy-ui-lib 4.1.66 → 4.1.67

package/dist/api/banner/groupModal.d.ts

@@ -0,0 +1,5 @@
+import { IApiSettings } from '../api';
+import { IClickGroupModalPayload, IGroupModalClick, IGroupModalListResponse, IViewGroupModalPayload } from './groupModal.typed';
+export declare const getGroupModal: (settings: IApiSettings, code: string, language?: string) => Promise<IGroupModalListResponse>;
+export declare const viewGroupModal: (settings: IApiSettings, payload: IViewGroupModalPayload) => Promise<IGroupModalClick>;
+export declare const clickGroupModal: (settings: IApiSettings, payload: IClickGroupModalPayload) => Promise<IGroupModalClick>;

package/dist/api/banner/groupModal.typed.d.ts

@@ -0,0 +1,78 @@
+export interface IStoriesText {
+    text?: string | null;
+    font?: string | null;
+    font_size?: number;
+    font_color?: string | null;
+    font_weight?: string | null;
+    positioning_text?: string | null;
+}
+export interface IStoriesButton {
+    type_button?: string | null;
+    background_color?: string | null;
+    width?: number | null;
+    height?: number | null;
+    border_radius?: number | null;
+    positioning_button?: string | null;
+    href?: string | null;
+    text_button?: IStoriesText | null;
+}
+export interface IStoriesImg {
+    survey_id?: number | null;
+    fileId?: number | null;
+    fileType?: string | null;
+    fileUrl?: string | null;
+    videoUrl?: string | null;
+    title?: IStoriesText | null;
+    desc?: IStoriesText | null;
+    list_btn?: IStoriesButton[] | null;
+}
+export interface IStoriesOther {
+    title?: string | null;
+    btn_txt?: string | null;
+    description?: string | null;
+    img?: string | null;
+}
+export interface IStoriesUse {
+    id: number;
+    title: string;
+    is_primary?: boolean;
+    language?: string;
+    main_img?: number | null;
+    main_img_url?: string | null;
+    list_img?: IStoriesImg[] | string[] | null;
+    banner: boolean;
+    banner_modal?: boolean;
+    other?: IStoriesOther | null;
+    platform?: string[] | null;
+    count_like?: number;
+    count_view?: number;
+    ab_test?: boolean | null;
+    group_id?: number | null;
+    is_viewed?: boolean | null;
+    is_liked?: boolean | null;
+    is_clicked?: boolean | null;
+}
+export interface IGroupModalUse {
+    id: number;
+    name: string;
+    platform?: string[] | null;
+    rules?: unknown;
+    priority: number;
+    group_id?: number | null;
+    list_banner?: IStoriesUse[];
+}
+export interface IGroupModalListResponse {
+    data: IGroupModalUse[] | null;
+}
+export interface IGroupModalClick {
+    view_id?: number | null;
+    status?: boolean | null;
+}
+export interface IViewGroupModalPayload {
+    group_id: number;
+    group_modal_id: number;
+    stories_id?: number | null;
+}
+export interface IClickGroupModalPayload {
+    view_id: number;
+}

package/dist/components/banners/Banner/Banner.const.d.ts

@@ -0,0 +1,22 @@
+export declare const BANNER_MODAL_DELAY_MS = 10000;
+export declare const BANNER_MODAL_DRAG_THRESHOLD_PX = 8;
+export declare const BANNER_MODAL_SWIPE_PX = 48;
+/** max-width: 599px === viewport < 600 — mobile-модалка */
+export declare const BANNER_MODAL_MOBILE_MAX = 599;
+/** max-width: 959px === viewport < 960 — tablet-модалка; иначе desktop */
+export declare const BANNER_MODAL_TABLET_MAX = 959;
+export declare const BANNER_MODAL_DESKTOP_WIDTH = 1128;
+export declare const BANNER_MODAL_DESKTOP_HEIGHT = 352;
+export declare const BANNER_MODAL_TABLET_WIDTH = 600;
+export declare const BANNER_MODAL_TABLET_HEIGHT = 188;
+export declare const BANNER_MODAL_MOBILE_WIDTH = 328;
+export declare const BANNER_MODAL_MOBILE_HEIGHT = 474;
+export declare const BANNER_MODAL_DESKTOP_RADIUS = 20;
+export declare const BANNER_MODAL_DESKTOP_BORDER = "0.729px";
+export declare const BANNER_MODAL_TABLET_RADIUS = 10.594;
+export declare const BANNER_MODAL_TABLET_BORDER = "0.386px";
+export declare const BANNER_MODAL_MOBILE_RADIUS = 20;
+export declare const BANNER_MODAL_MOBILE_BORDER = "0.386px";
+export declare const BANNER_MODAL_DOTS_GAP = 18;
+export declare const BANNER_MODAL_DOTS_GAP_MOBILE = 16;
+export declare const BANNER_MODAL_PORTAL_ID = "banner-group-modal";

package/dist/components/banners/Banner/Banner.d.ts

@@ -1,3 +1,4 @@
-import { IBannerProps } from './Banner.typed';
-declare const Banner: ({ bannerCode, size, bannerMaxWidth, mb, mt, closeButtonHidden, yandexEvent, yandexEventView, rootStyles, target, withOutBorderRadius }: IBannerProps) => import("react/jsx-runtime").JSX.Element;
+import React from 'react';
+import { IBannerProps, IBannerRef } from './Banner.typed';
+declare const Banner: React.ForwardRefExoticComponent<IBannerProps & React.RefAttributes<IBannerRef>>;
 export { Banner };

package/dist/components/banners/Banner/Banner.typed.d.ts

@@ -1,4 +1,15 @@
 import { CSSProperties } from 'react';
+import { IBanner } from '../../../api/banner/banner.typed';
+import { IGroupModalUse } from '../../../api/banner/groupModal.typed';
+export type TBannerModalTrigger = 'auto' | 'manual';
+export interface IBannerRef {
+    /** Запускает таймер и открывает модалку, если бэкенд отдал group_modal */
+    openModal: (options?: {
+        delayMs?: number;
+    }) => void;
+    /** Отменяет ожидающий таймер открытия */
+    cancelModalOpen: () => void;
+}
 type BannerSize = '236x340' | '324x140' | '328x134' | '452x172' | '688x334' | '688x452' | '912x128' | '1052x688' | '1160x128' | '1300x1052';
 export interface IBannerProps {
     /** Код баннера */
@@ -23,5 +34,31 @@ export interface IBannerProps {
     target?: string;
     /** Не скруглять границу у баннера */
     withOutBorderRadius?: boolean;
+    /**
+     * Запрашивать и показывать модальный баннер (group_modal).
+     * @default true
+     */
+    modalEnabled?: boolean;
+    /**
+     * auto — открыть модалку самим, если бэкенд отдал набор.
+     * manual — только после openModal() на ref.
+     * @default 'auto'
+     */
+    modalTrigger?: TBannerModalTrigger;
+    /**
+     * Задержка перед открытием в manual-режиме, мс.
+     * @default 10000
+     */
+    modalDelayMs?: number;
+    /**
+     * Мок in-flow баннера для Storybook. Если задан (в том числе `null`) —
+     * `GET /modal/list` не вызывается.
+     */
+    previewBanner?: IBanner | null;
+    /**
+     * Мок набора модалки для Storybook. Если задан (в том числе `null`) —
+     * `GET /modal/group_modal/list` не вызывается.
+     */
+    previewGroupModal?: IGroupModalUse | null;
 }
 export {};

package/dist/components/banners/Banner/Banner.utils.d.ts

@@ -0,0 +1,5 @@
+import { IStoriesUse } from '../../../api/banner/groupModal.typed';
+export declare const getGroupModalSlideImageUrl: (slide?: IStoriesUse | null) => string;
+export declare const getGroupModalSlideHref: (slide?: IStoriesUse | null) => string;
+export declare const formatBannerImageUrl: (raw?: string) => string;
+export declare const getGroupModalDisplayImageUrl: (slide?: IStoriesUse | null) => string;

package/dist/components/banners/Banner/bannerStoryPreview.d.ts

@@ -0,0 +1,16 @@
+import { IGroupModalUse, IStoriesUse } from '../../../api/banner/groupModal.typed';
+export declare const makeBannerPreviewPlaceholder: (width: number, height: number) => string;
+export declare const makeBannerPreviewSlides: (width: number, height: number) => IStoriesUse[];
+export declare const makeBannerPreviewGroup: (width: number, height: number) => IGroupModalUse;
+export declare const useBannerPreviewFrame: () => {
+    width: number;
+    height: number;
+};
+export declare const useBannerPreviewGroup: () => {
+    frame: {
+        width: number;
+        height: number;
+    };
+    slides: IStoriesUse[];
+    group: IGroupModalUse;
+};

package/dist/components/banners/Banner/components/BannerModal/BannerModal.d.ts

@@ -0,0 +1,3 @@
+import { IBannerModalProps } from './BannerModal.typed';
+declare const BannerModal: ({ groupModal, slides, onClose, analyticsEnabled }: IBannerModalProps) => import("react/jsx-runtime").JSX.Element;
+export { BannerModal };

package/dist/components/banners/Banner/components/BannerModal/BannerModal.styled.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+export declare const Overlay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Stage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Frame: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ArtworkTrack: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $dragging: boolean;
+    $offset: number;
+}>> & string;
+export declare const ArtworkLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {
+    $clickable: boolean;
+    $dragging: boolean;
+}>> & string;
+export declare const Artwork: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, never>> & string;
+export declare const CloseButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
+export declare const ArrowSlot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $side: 'left' | 'right';
+}>> & string;
+export declare const Dots: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Dot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+    $active: boolean;
+}>> & string;

package/dist/components/banners/Banner/components/BannerModal/BannerModal.typed.d.ts

@@ -0,0 +1,8 @@
+import { IGroupModalUse, IStoriesUse } from '../../../../../api/banner/groupModal.typed';
+export interface IBannerModalProps {
+    groupModal: IGroupModalUse;
+    slides: IStoriesUse[];
+    onClose: () => void;
+    /** Выключает PUT view/click. Нужен Storybook, чтобы не ходить в боевой API */
+    analyticsEnabled?: boolean;
+}

package/dist/components/banners/Banner/components/BannerModal/index.d.ts

@@ -0,0 +1 @@
+export { BannerModal } from './BannerModal';

package/dist/components/banners/Banner/hooks/useBannerModalAnalytics.d.ts

@@ -0,0 +1,11 @@
+import { IGroupModalUse, IStoriesUse } from '../../../../api/banner/groupModal.typed';
+interface IProps {
+    groupModal: IGroupModalUse;
+    slides: IStoriesUse[];
+    index: number;
+    enabled?: boolean;
+}
+export declare const useBannerModalAnalytics: ({ groupModal, slides, index, enabled }: IProps) => {
+    trackClick: (slideId: number) => Promise<void>;
+};
+export {};

package/dist/components/banners/Banner/hooks/useBannerModalNavigation.d.ts

@@ -0,0 +1,18 @@
+import { IStoriesUse } from '../../../../api/banner/groupModal.typed';
+interface IProps {
+    slides: IStoriesUse[];
+}
+export declare const useBannerModalNavigation: ({ slides }: IProps) => {
+    index: number;
+    dragX: number;
+    isDragging: boolean;
+    canNavigate: boolean;
+    goTo: (next: number) => void;
+    goNext: () => void;
+    goPrev: () => void;
+    onPointerDown: (clientX: number) => void;
+    onPointerMove: (clientX: number) => void;
+    onPointerUp: () => void;
+    consumeClick: () => boolean;
+};
+export {};

package/dist/components/banners/Banner/hooks/useBannerModalOpen.d.ts

@@ -0,0 +1,18 @@
+import { TBannerModalTrigger } from '../Banner.typed';
+interface IProps {
+    hasGroupModal: boolean;
+    firstImageUrl: string;
+    modalEnabled: boolean;
+    modalTrigger: TBannerModalTrigger;
+    modalDelayMs: number;
+}
+export declare const useBannerModalOpen: ({ hasGroupModal, firstImageUrl, modalEnabled, modalTrigger, modalDelayMs }: IProps) => {
+    isModalOpen: boolean;
+    isFirstImageReady: boolean;
+    openModal: (options?: {
+        delayMs?: number;
+    }) => void;
+    cancelModalOpen: () => void;
+    closeModal: () => void;
+};
+export {};

package/dist/components/banners/Banner/hooks/useGetBanner.d.ts

@@ -1,8 +1,9 @@
 import { IBanner } from '../../../../api/banner/banner.typed';
 interface IProps {
     bannerCode: string;
+    enabled?: boolean;
 }
-export declare const useGetBanner: ({ bannerCode }: IProps) => {
+export declare const useGetBanner: ({ bannerCode, enabled }: IProps) => {
     bannerData: IBanner;
 };
 export {};

package/dist/components/banners/Banner/hooks/useGetGroupModal.d.ts

@@ -0,0 +1,10 @@
+import { IGroupModalUse } from '../../../../api/banner/groupModal.typed';
+interface IProps {
+    bannerCode: string;
+    enabled?: boolean;
+}
+export declare const useGetGroupModal: ({ bannerCode, enabled }: IProps) => {
+    groupModal: IGroupModalUse;
+    hasGroupModal: boolean;
+};
+export {};

package/dist/components/banners/Banner/hooks/useGroupModalSlides.d.ts

@@ -0,0 +1,8 @@
+import { IStoriesUse } from '../../../../api/banner/groupModal.typed';
+interface IProps {
+    listBanner?: IStoriesUse[] | null;
+}
+export declare const useGroupModalSlides: ({ listBanner }: IProps) => {
+    slides: IStoriesUse[];
+};
+export {};

package/dist/components/banners/Banner/index.d.ts

@@ -1 +1,2 @@
 export { Banner } from './Banner';
+export type { IBannerProps, IBannerRef, TBannerModalTrigger } from './Banner.typed';

package/dist/index.d.ts

@@ -31,6 +31,7 @@ export { useMediaQuery, breakpoint } from './hooks/useMediaQuery';
 export { PremiumBanner } from './components/banners/HeaderBanners/PremiumBanner';
 export { CommonBanner } from './components/banners/HeaderBanners/CommonBanner';
 export { Banner } from './components/banners/Banner';
+export type { IBannerProps, IBannerRef, TBannerModalTrigger } from './components/banners/Banner';
 export { SuccessModal } from './components/modals/SuccessModal';
 export { Alert } from './components/uikit/Alert';
 export { AvatarCompany } from './components/uikit/AvatarCompany';