@alfalab/core-components-gallery 5.2.13 → 5.3.1

package/src/types.ts

@@ -0,0 +1,13 @@
+export type GalleryImage = {
+    src: string;
+    name?: string;
+    previewSrc?: string;
+    alt?: string;
+    canDownload?: boolean;
+};
+
+export type ImageMeta = {
+    width: number;
+    height: number;
+    broken?: boolean;
+};

package/src/utils/constants.ts

@@ -0,0 +1,10 @@
+export const TestIds = {
+    ACTIVE_IMAGE: 'active-image',
+    PREV_SLIDE_BUTTON: 'prev-slide-button',
+    NEXT_SLIDE_BUTTON: 'next-slide-button',
+    CLOSE_BUTTON: 'close-button',
+    FULLSCREEN_BUTTON: 'fullscreen-button',
+    EXIT_FULLSCREEN_BUTTON: 'exit-fullscreen-button',
+    DOWNLOAD_BUTTON: 'download-button',
+    NAVIGATION_BAR: 'navigation-bar',
+};

package/src/utils/index.ts

@@ -0,0 +1,3 @@
+export * from './split-filename';
+export * from './utils';
+export * from './constants';

package/src/utils/split-filename.ts

@@ -0,0 +1,17 @@
+const SEPARATION_POSITION_SHIFT = 3;
+
+export function splitFilename(filename: string): [string, string] {
+    const dotPosition = filename.lastIndexOf('.');
+
+    let head = filename;
+    let tail = '';
+
+    const splitPosition = dotPosition - SEPARATION_POSITION_SHIFT;
+
+    if (splitPosition > 0) {
+        head = filename.slice(0, splitPosition);
+        tail = filename.slice(splitPosition);
+    }
+
+    return [head, tail];
+}

package/src/utils/utils.ts

@@ -0,0 +1,18 @@
+import { GalleryImage, ImageMeta } from '../types';
+
+export const PLACEHOLDER_WIDTH = 400;
+export const PLACEHOLDER_HEIGHT = 300;
+
+export const getImageKey = ({ name = '', src }: GalleryImage, index: number): string =>
+    `${name}-${index}-${src}`;
+
+export const getImageAlt = ({ alt, name }: GalleryImage, index: number): string =>
+    alt || name || `Изображение ${index + 1}`;
+
+export const isSmallImage = (meta?: ImageMeta) => {
+    if (!meta) {
+        return false;
+    }
+
+    return meta.width < PLACEHOLDER_WIDTH && meta.height < PLACEHOLDER_HEIGHT;
+};

package/types-83e2bd9e.d.ts

@@ -0,0 +1,113 @@
+/// <reference types="react" />
+import React from 'react';
+import { ReactNode } from "react";
+import { CloserProps } from "./index-ebda875c";
+type NavigationBarProps = {
+    /**
+     * Контент шапки
+     */
+    children?: ReactNode;
+    /**
+     * Заголовок шапки
+     */
+    title?: string;
+    /**
+     * Подзаголовок (доступен только в мобильной версии)
+     */
+    subtitle?: string;
+    /**
+     * Размер заголовка (compact доступен только в мобильной версии)
+     */
+    titleSize?: 'default' | 'compact';
+    /**
+     * Доп. класс для аддонов
+     */
+    addonClassName?: string;
+    /**
+     * Слот слева
+     */
+    leftAddons?: ReactNode;
+    /**
+     * Слот справа
+     */
+    rightAddons?: ReactNode;
+    /**
+     * Дополнительный класс для closer
+     */
+    closerClassName?: string;
+    /**
+     * Слот снизу
+     */
+    bottomAddons?: ReactNode;
+    /**
+     * Наличие компонента крестика
+     */
+    hasCloser?: boolean;
+    /**
+     * Наличие кнопки "Назад"
+     */
+    hasBackButton?: boolean;
+    /**
+     * Дополнительный класс для правого аддона
+     */
+    backButtonClassName?: string;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Дополнительный класс для контента
+     */
+    contentClassName?: string;
+    /**
+     * Дополнительный класс для нижнего аддона
+     */
+    bottomAddonsClassName?: string;
+    /**
+     * Выравнивание заголовка
+     */
+    align?: 'left' | 'center';
+    /**
+     * Обрезать ли заголовок
+     */
+    trim?: boolean;
+    /**
+     * Фиксирует шапку
+     */
+    sticky?: boolean;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Фоновое изображение
+     */
+    imageUrl?: string;
+    /**
+     * Иконка closer.
+     */
+    closerIcon?: React.ElementType;
+    /**
+     * Обработчик закрытия
+     */
+    onClose?: CloserProps['onClose'];
+    /**
+     * обработчик клика по кнопке "назад"
+     */
+    onBack?: () => void;
+    /**
+     * Вид шапки - мобильный или десктоп
+     */
+    view: 'desktop' | 'mobile';
+    /**
+     * Ссылка на родительскую ноду overflow: auto
+     */
+    scrollableParentRef?: React.RefObject<HTMLDivElement>;
+};
+type ContentParams = {
+    extraClassName?: string;
+    wrapperRef?: React.RefObject<HTMLDivElement>;
+    style?: React.CSSProperties;
+    hidden?: boolean;
+};
+export { NavigationBarProps, ContentParams };

package/typings-9211a437.d.ts

@@ -0,0 +1,95 @@
+import { AnchorHTMLAttributes, ButtonHTMLAttributes, ElementType, ReactNode } from 'react';
+type StyleColors = {
+    default: {
+        [key: string]: string;
+    };
+    inverted: {
+        [key: string]: string;
+    };
+};
+type ComponentProps = {
+    /**
+     * Тип кнопки
+     * @default secondary
+     */
+    view?: 'accent' | 'primary' | 'secondary' | 'tertiary' | 'outlined' | 'filled' | 'transparent' | 'link' | 'ghost';
+    /**
+     * Слот слева
+     */
+    leftAddons?: ReactNode;
+    /**
+     * Слот справа
+     */
+    rightAddons?: ReactNode;
+    /**
+     * Размер компонента
+     * @default m
+     */
+    size?: 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
+    /**
+     * Растягивает компонент на ширину контейнера
+     * @default false
+     */
+    block?: boolean;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Дополнительный класс для спиннера
+     */
+    spinnerClassName?: string;
+    /**
+     * Выводит ссылку в виде кнопки
+     */
+    href?: string;
+    /**
+     * Позволяет использовать кастомный компонент для кнопки (например Link из роутера)
+     */
+    Component?: ElementType;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Показать лоадер
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Не переносить текст кнопки на новую строку
+     * @default false
+     */
+    nowrap?: boolean;
+    /**
+     * Набор цветов для компонента
+     */
+    colors?: 'default' | 'inverted';
+    /**
+     * Дочерние элементы.
+     */
+    children?: ReactNode;
+    /**
+     * Основные стили компонента.
+     */
+    styles: {
+        [key: string]: string;
+    };
+    /**
+     * Стили компонента для default и inverted режима.
+     */
+    colorStylesMap: StyleColors;
+};
+type AnchorBaseButtonProps = ComponentProps & AnchorHTMLAttributes<HTMLAnchorElement>;
+type NativeBaseButtonProps = ComponentProps & ButtonHTMLAttributes<HTMLButtonElement>;
+type BaseButtonProps = Partial<AnchorBaseButtonProps | NativeBaseButtonProps>;
+type AnchorButtonProps = Omit<BaseButtonProps, 'styles' | 'colorStylesMap'> & AnchorHTMLAttributes<HTMLAnchorElement>;
+type NativeButtonProps = Omit<BaseButtonProps, 'styles' | 'colorStylesMap'> & ButtonHTMLAttributes<HTMLButtonElement>;
+type ButtonProps = Partial<AnchorButtonProps | NativeButtonProps> & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+};
+export { StyleColors, ComponentProps, AnchorBaseButtonProps, NativeBaseButtonProps, BaseButtonProps, AnchorButtonProps, NativeButtonProps, ButtonProps };

package/buttons-a0cf7676.d.ts

@@ -1,11 +0,0 @@
-import { FC, MutableRefObject } from 'react';
-import { IconButtonProps } from "@alfalab/core-components-icon-button";
-type Props = Omit<IconButtonProps, 'icon' | 'colors'> & {
-    buttonRef?: MutableRefObject<HTMLButtonElement | null>;
-    download?: string | boolean;
-};
-declare const Fullscreen: FC<Props>;
-declare const ExitFullscreen: FC<Props>;
-declare const Download: FC<Props>;
-declare const Exit: FC<Props>;
-export { Fullscreen, ExitFullscreen, Download, Exit };

package/esm/buttons-8138e150.d.ts

@@ -1,11 +0,0 @@
-import { FC, MutableRefObject } from 'react';
-import { IconButtonProps } from "@alfalab/core-components-icon-button";
-type Props = Omit<IconButtonProps, 'icon' | 'colors'> & {
-    buttonRef?: MutableRefObject<HTMLButtonElement | null>;
-    download?: string | boolean;
-};
-declare const Fullscreen: FC<Props>;
-declare const ExitFullscreen: FC<Props>;
-declare const Download: FC<Props>;
-declare const Exit: FC<Props>;
-export { Fullscreen, ExitFullscreen, Download, Exit };

package/modern/buttons-c69fcb71.d.ts

@@ -1,11 +0,0 @@
-import { FC, MutableRefObject } from 'react';
-import { IconButtonProps } from "@alfalab/core-components-icon-button";
-type Props = Omit<IconButtonProps, 'icon' | 'colors'> & {
-    buttonRef?: MutableRefObject<HTMLButtonElement | null>;
-    download?: string | boolean;
-};
-declare const Fullscreen: FC<Props>;
-declare const ExitFullscreen: FC<Props>;
-declare const Download: FC<Props>;
-declare const Exit: FC<Props>;
-export { Fullscreen, ExitFullscreen, Download, Exit };