skillgrid 0.0.42-dev-43812.1262745 → 0.0.43

package/dist/components/Button/Button.type.d.ts

@@ -1,5 +1,13 @@
 export type LinkSize = 'l' | 'm' | 's';
 export type ButtonSize = 'l' | 'm' | 's' | 'xs';
+/**
+ * Button style types - all available styles including gray
+ */
+export type ButtonStyle = 'neutral' | 'accent' | 'positive' | 'negative' | 'contrast' | 'gray' | 'warning' | 'dreamy' | 'special' | 'lovely' | 'vivid' | 'blue';
+/**
+ * Button style types without gray variant
+ */
+export type ButtonStyleWithoutGray = Exclude<ButtonStyle, 'gray'>;
 /**
  * Base properties common to all button and link variants
  */
@@ -90,7 +98,7 @@ type CommonProps = (Omit<ButtonBaseProps, 'mode'> & {
      * Button style type (gray is not available for this variant)
      * @default 'neutral'
      */
-    buttonStyle?: 'neutral' | 'accent' | 'positive' | 'negative' | 'contrast';
+    buttonStyle?: ButtonStyleWithoutGray;
     /**
      * Button variant - supports both primary and secondary modes
      * @default 'primary'
@@ -133,7 +141,7 @@ type CommonProps = (Omit<ButtonBaseProps, 'mode'> & {
      * When 'gray' is used, mode must be 'primary' only
      * @default 'neutral'
      */
-    buttonStyle?: 'neutral' | 'accent' | 'positive' | 'negative' | 'contrast' | 'gray';
+    buttonStyle?: ButtonStyle;
     /**
      * Button variant - when buttonStyle includes 'gray', only 'primary' is allowed
      * For other buttonStyle values, both 'primary' and 'secondary' are allowed
@@ -176,7 +184,7 @@ type CommonProps = (Omit<ButtonBaseProps, 'mode'> & {
      * Button style type (gray is not available for secondary/tertiary)
      * @default 'neutral'
      */
-    buttonStyle?: 'neutral' | 'accent' | 'positive' | 'negative' | 'contrast';
+    buttonStyle?: ButtonStyleWithoutGray;
     /**
      * Button variant
      * @default 'primary'

package/dist/components/Button/lib/get-safe-rel.d.ts

@@ -0,0 +1,11 @@
+import { HTMLAttributeAnchorTarget } from 'react';
+type GetSafeRelParams = {
+    rel?: string;
+    target?: HTMLAttributeAnchorTarget;
+};
+/**
+ * Гарантирует, что ссылки, открывающиеся в новой вкладке, содержат rel-атрибуты,
+ * блокирующие доступ к объекту `window.opener`.
+ */
+export declare const getSafeRel: ({ rel, target }: GetSafeRelParams) => string | undefined;
+export {};

package/dist/components/Button/lib/get-safe-rel.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/Drop/Drop.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+import { DropCommonProps } from './Drop.type';
+/**
+ * Дроп компонент
+ */
+export declare const Drop: FC<DropCommonProps>;

package/dist/components/Drop/Drop.type.d.ts

@@ -0,0 +1,151 @@
+import { Placement } from '@floating-ui/react';
+import { ReactNode, CSSProperties } from 'react';
+export type PositionDrop = Exclude<Placement, 'top' | 'bottom' | 'left' | 'right'>;
+export type DividerBehavior = 'auto' | 'always' | 'never';
+export type PaddingToken = 'none' | 'sm' | 'md' | 'lg' | 'xl';
+export type ButtonsContainerPadding = {
+    padding: PaddingToken;
+    paddingType: 'all' | 'block' | 'inline';
+};
+export interface DropCommonProps {
+    /**
+     * Элемент, по клику на который открывается дроп
+     */
+    children: ReactNode;
+    /**
+     * Флаг, указывающий, открыт ли дроп
+     * @default false
+     */
+    open?: boolean;
+    /**
+     * Функция для управления состоянием видимости дропа
+     */
+    onOpenChange: (open: boolean) => void;
+    /**
+     * Контент дропа
+     */
+    content: ReactNode;
+    /**
+     * Позиция открытия дропа относительно toggleа
+     * @default 'left-start'
+     */
+    position?: PositionDrop;
+    /**
+     * Контент футера
+     */
+    footerContent?: ReactNode;
+    /**
+     * Поведение разделителя
+     * * auto - автоматическое поведение (скрывается при прокрутке контента до конца)
+     * * always - всегда показывать разделитель
+     * * never - никогда не показывать разделитель
+     * @default 'auto'
+     */
+    dividerBehavior?: DividerBehavior;
+    /**
+     * Закрывать дроп при клике вне его области
+     * @default true
+     */
+    closeOnOutsideClick?: boolean;
+    /**
+     * Закрывать дроп при нажатии клавиши ESC
+     * @default true
+     */
+    closeOnEscape?: boolean;
+    /**
+     * Режим открытия дропа
+     * @default 'click'
+     */
+    toggleMode?: 'click' | 'hover';
+    /**
+     * Отступы контента дропа
+     * * xl - 24px
+     * * lg - 16px
+     * * md - 12px
+     * * sm - 8px
+     * @default xl
+     */
+    padding?: PaddingToken;
+    /**
+     * Отступы футера с кнопками
+     * @default: { padding: 24, paddingType: 'all' }
+     */
+    footerPadding?: ButtonsContainerPadding;
+    /**
+     * Дополнительные классы для:
+     * @wrapper для обертки
+     * @toggle для контейнера тоггла
+     * @drop для контейнера контента
+     * @content для контейнера контента
+     * @footer для контейнера футера
+     */
+    classNames?: {
+        wrapper?: string;
+        toggle?: string;
+        drop?: string;
+        content?: string;
+        footer?: string;
+    };
+    /**
+     * Дополнительные стили для:
+     * @wrapper для обертки
+     * @toggle для контейнера тоггла
+     * @drop для контейнера контента
+     * @content для контейнера контента
+     * @footer для контейнера футера
+     */
+    styles?: {
+        wrapper?: CSSProperties;
+        toggle?: CSSProperties;
+        drop?: CSSProperties;
+        content?: CSSProperties;
+        footer?: CSSProperties;
+    };
+}
+export interface ContentCommonProps {
+    /**
+     * Дочерние элементы контента дропа
+     */
+    children: ReactNode;
+    /**
+     * Размер внутренних отступов контента (в пикселях)
+     */
+    padding: PaddingToken;
+    /**
+     * Флаг, указывающий наличие футера с кнопками
+     * Влияет на применяемые стили отступов
+     */
+    hasFooter: boolean;
+    /**
+     * Дополнительный CSS-класс для контейнера контента
+     */
+    className?: string;
+    /**
+     * Дополнительные inline-стили для контейнера контента
+     */
+    style?: CSSProperties;
+    /**
+     * Поведение разделителя
+     * @default 'auto'
+     */
+    dividerBehavior: DividerBehavior;
+}
+export interface FooterCommonProps {
+    /**
+     * Контент футера
+     */
+    children?: ReactNode;
+    /**
+     * Настройки отступов футера
+     * @default: { padding: 'xl', paddingType: 'all' }
+     */
+    footerPadding: ButtonsContainerPadding;
+    /**
+     * Дополнительный CSS-класс для контейнера футера
+     */
+    className?: string;
+    /**
+     * Дополнительные inline-стили для контейнера футера
+     */
+    style?: CSSProperties;
+}

package/dist/components/Drop/constants.d.ts

@@ -0,0 +1,12 @@
+/** Дефолтная высота дропа в пикселях */
+export declare const DROP_HEIGHT_DEFAULT = 460;
+/** Отступ между toggle-ом и выпадающим меню (drop) в пикселях */
+export declare const DROP_TOGGLE_MARGIN = 8;
+/** Минимальный отступ между drop и границами viewport (окна браузера) в пикселях. */
+export declare const MIN_DROP_VIEWPORT_GAP = 24;
+/** Допустимая погрешность в пикселях при определении достижения конца скролла
+ * Необходима из-за особенностей рендеринга браузеров и дробных значений
+ */
+export declare const SCROLL_BOTTOM_TOLERANCE_PX = 1;
+export declare const SEMANTIC_ANIMATION_EASE_IN_OUT_200 = "200ms ease-in-out";
+export declare const SEMANTIC_ANIMATION_EASE_IN_OUT_100 = "100ms ease-in-out";

package/dist/components/Drop/index.d.ts

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

package/dist/components/Icon/Icon.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+import { IconProps } from './Icon.type';
+/**
+ * Компонент Icon для отображения SVG иконок из assets
+ * Поддерживает только React элементы (SVG), не поддерживает emoji и строки
+ */
+type IconComponent = {
+    <E extends React.ElementType = 'button'>(props: IconProps<E>): React.ReactElement | null;
+    displayName?: string;
+};
+export declare const Icon: IconComponent;
+export {};

package/dist/components/Icon/Icon.type.d.ts

@@ -0,0 +1,156 @@
+export type IconModeBase = 'primary' | 'secondary';
+export type IconMode = IconModeBase | 'tertiary';
+export type IconStyleNonNeutral = 'accent' | 'positive' | 'negative' | 'warning' | 'special' | 'dreamy' | 'lovely' | 'vivid' | 'constant' | 'inverse' | 'custom' | 'none';
+export type IconStyle = 'neutral' | IconStyleNonNeutral;
+export type BorderStyle = 'neutral' | 'phantom' | 'overlay' | 'accent' | 'positive' | 'negative' | 'warning' | 'special' | 'dreamy' | 'lovely' | 'vivid';
+export type BackgroundStyle = 'primary' | 'secondary' | 'tertiary' | 'transparent' | 'overlay' | 'constant' | 'inverse' | 'constant-secondary' | 'inverse-secondary' | 'positive' | 'warning' | 'negative' | 'accent' | 'positive-secondary' | 'warning-secondary' | 'negative-secondary' | 'accent-secondary' | 'special' | 'dreamy' | 'lovely' | 'vivid' | 'special-secondary' | 'dreamy-secondary' | 'lovely-secondary' | 'vivid-secondary';
+export type IconSize = number;
+export type ShadowMode = false | 'permanent' | 'increases-when-pressed';
+export type BadgeSize = 'extra-small' | 'small';
+export type BadgeSizeNumeric = 8 | 16 | 20;
+export interface BadgeConfig {
+    show: boolean;
+    size?: BadgeSize;
+    value?: number | string;
+}
+type AsProp<E extends React.ElementType> = {
+    /**
+     * Элемент для рендера
+     * @default 'button'
+     */
+    as?: E;
+};
+type PropsToOmit<E extends React.ElementType, P> = keyof (AsProp<E> & P);
+type PolymorphicComponentProps<E extends React.ElementType, Props = object> = Props & AsProp<E> & Omit<React.ComponentPropsWithoutRef<E>, PropsToOmit<E, Props>>;
+type PolymorphicRef<E extends React.ElementType> = React.ComponentPropsWithRef<E>['ref'];
+export type PolymorphicComponentPropsWithRef<E extends React.ElementType, Props = object> = PolymorphicComponentProps<E, Props> & {
+    ref?: PolymorphicRef<E>;
+};
+interface BaseIconProps {
+    /**
+     * Иконка (только React элементы - SVG)
+     * Используйте Icon.Category.Name компоненты для доступа к иконкам из assets
+     */
+    icon?: React.ReactElement;
+    /**
+     * Размер иконки в пикселях
+     * @default 24
+     */
+    iconSize?: IconSize;
+    /**
+     * Кастомный цвет для режима 'custom'
+     */
+    customColor?: string;
+    /**
+     * Стиль иконки при hover
+     * Позволяет задать любой цвет из набора для состояния hover
+     */
+    hoverStyle?: IconStyle;
+    /**
+     * Кастомный цвет для hover при hoverStyle='custom'
+     */
+    hoverCustomColor?: string;
+    /**
+     * Стиль иконки при pressed
+     * Позволяет задать любой цвет из набора для состояния pressed
+     */
+    pressedStyle?: IconStyle;
+    /**
+     * Кастомный цвет для pressed при pressedStyle='custom'
+     */
+    pressedCustomColor?: string;
+    /**
+     * Внутренние отступы
+     * @default false
+     */
+    padding?: false | number;
+    /**
+     * Фон иконки
+     * @default false
+     */
+    background?: false | BackgroundStyle;
+    /**
+     * Тень
+     * @default false
+     */
+    shadow?: ShadowMode;
+    /**
+     * Показывать рамку
+     * @default false
+     */
+    showBorder?: boolean;
+    /**
+     * Стиль рамки
+     * @default 'neutral'
+     */
+    borderStyle?: BorderStyle;
+    /**
+     * Радиус скругления углов
+     */
+    borderRadius?: number | '50%';
+    /**
+     * Конфигурация бейджа
+     */
+    badge?: BadgeConfig;
+    /**
+     * Состояние checked (для переключаемых иконок)
+     * @default false
+     */
+    checked?: false | React.ReactNode;
+    /**
+     * Состояние disabled
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Состояние loading
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Дополнительный CSS класс
+     */
+    className?: string;
+    /**
+     * Inline стили
+     */
+    styles?: React.CSSProperties;
+    /**
+     * Test ID для тестирования
+     */
+    'data-testid'?: string;
+    /**
+     * ARIA label для доступности
+     */
+    'aria-label'?: string;
+    /**
+     * ARIA описание
+     */
+    'aria-describedby'?: string;
+}
+interface NeutralIconProps extends BaseIconProps {
+    /**
+     * Стиль иконки
+     * @default 'neutral'
+     */
+    style?: 'neutral';
+    /**
+     * Режим отображения иконки (для neutral доступны primary, secondary и tertiary)
+     * @default 'primary'
+     */
+    mode?: IconMode;
+}
+interface NonNeutralIconProps extends BaseIconProps {
+    /**
+     * Стиль иконки
+     */
+    style?: IconStyleNonNeutral;
+    /**
+     * Режим отображения иконки (только primary и secondary)
+     * @default 'primary'
+     */
+    mode?: IconModeBase;
+}
+type BaseIconPropsUnion = NeutralIconProps | NonNeutralIconProps;
+export type IconProps<E extends React.ElementType = 'div'> = PolymorphicComponentPropsWithRef<E, BaseIconPropsUnion>;
+export {};