@dss-kit/ui-kit 0.1.7 → 0.1.8

package/dist/components/builders/Box/Box.d.ts

@@ -1,4 +1,4 @@
-import { ComponentProps } from 'react';
+import { ComponentProps } from "react";
 /**
  * Тип для описания отступов и размеров
  */
@@ -7,79 +7,80 @@ type Spacing = number | string;
  * Интерфейс для всех свойств стилизации Box компонента
  */
 type BoxSpacers = {
-    /** Высота элемента. Может быть числом, строкой, "auto", "full" (100%) или "screen" (100vh) */
-    h?: number | string | "auto" | "full" | "screen";
-    /** Ширина элемента. Может быть числом, строкой, "auto", "full" (100%) или "screen" (100vw) */
-    w?: number | string | "auto" | "full" | "screen";
-    /** Внешний отступ со всех сторон */
-    m?: Spacing;
-    /** Внешний отступ по горизонтали (слева и справа) */
-    mx?: Spacing;
-    /** Внешний отступ по вертикали (сверху и снизу) */
-    my?: Spacing;
-    /** Внешний отступ сверху */
-    mt?: Spacing;
-    /** Внешний отступ справа */
-    mr?: Spacing;
-    /** Внешний отступ снизу */
-    mb?: Spacing;
-    /** Внешний отступ слева */
-    ml?: Spacing;
-    /** Внутренний отступ со всех сторон */
-    p?: Spacing;
-    /** Внутренний отступ по горизонтали (слева и справа) */
-    px?: Spacing;
-    /** Внутренний отступ по вертикали (сверху и снизу) */
-    py?: Spacing;
-    /** Внутренний отступ сверху */
-    pt?: Spacing;
-    /** Внутренний отступ справа */
-    pr?: Spacing;
-    /** Внутренний отступ снизу */
-    pb?: Spacing;
-    /** Внутренний отступ слева */
-    pl?: Spacing;
-    gap?: Spacing;
-    /** Расстояние между колонками в flex-контейнере */
-    xGap?: Spacing;
-    /** Расстояние между строками в flex-контейнере */
-    yGap?: Spacing;
-    /** Если true, flex-direction будет row, иначе column */
-    row?: boolean;
-    /** Значение flex свойства. true эквивалентно 1 */
-    flex?: true | number | string;
-    /** Абсолютное позиционирование на весь контейнер */
-    absoluteFill?: boolean;
-    /** Центрирование по горизонтали и вертикали */
-    center?: boolean;
-    justifyContent?: React.CSSProperties["justifyContent"];
-    alignItems?: React.CSSProperties["alignItems"];
-    alignSelf?: React.CSSProperties["alignSelf"];
-    borderWidth?: Spacing;
-    borderBottomWidth?: Spacing;
-    borderColor?: string;
-    borderRadius?: Spacing;
-    zIndex?: number;
-    overflow?: React.CSSProperties["overflow"];
-    minWidth?: Spacing;
-    minHeight?: Spacing;
-    maxWidth?: Spacing;
-    maxHeight?: Spacing;
-    flexWrap?: React.CSSProperties["flexWrap"];
-    flexGrow?: number;
-    flexShrink?: number;
-    flexBasis?: Spacing;
-    backgroundColor?: string;
-    relative?: boolean;
-    absolute?: boolean;
-    display?: React.CSSProperties["display"];
+  /** Высота элемента. Может быть числом, строкой, "auto", "full" (100%) или "screen" (100vh) */
+  h?: number | string | "auto" | "full" | "screen";
+  /** Ширина элемента. Может быть числом, строкой, "auto", "full" (100%) или "screen" (100vw) */
+  w?: number | string | "auto" | "full" | "screen";
+  /** Внешний отступ со всех сторон */
+  m?: Spacing;
+  /** Внешний отступ по горизонтали (слева и справа) */
+  mx?: Spacing;
+  /** Внешний отступ по вертикали (сверху и снизу) */
+  my?: Spacing;
+  /** Внешний отступ сверху */
+  mt?: Spacing;
+  /** Внешний отступ справа */
+  mr?: Spacing;
+  /** Внешний отступ снизу */
+  mb?: Spacing;
+  /** Внешний отступ слева */
+  ml?: Spacing;
+  /** Внутренний отступ со всех сторон */
+  p?: Spacing;
+  /** Внутренний отступ по горизонтали (слева и справа) */
+  px?: Spacing;
+  /** Внутренний отступ по вертикали (сверху и снизу) */
+  py?: Spacing;
+  /** Внутренний отступ сверху */
+  pt?: Spacing;
+  /** Внутренний отступ справа */
+  pr?: Spacing;
+  /** Внутренний отступ снизу */
+  pb?: Spacing;
+  /** Внутренний отступ слева */
+  pl?: Spacing;
+  gap?: Spacing;
+  /** Расстояние между колонками в flex-контейнере */
+  xGap?: Spacing;
+  /** Расстояние между строками в flex-контейнере */
+  yGap?: Spacing;
+  /** Если true, flex-direction будет row, иначе column */
+  row?: boolean;
+  /** Значение flex свойства. true эквивалентно 1 */
+  flex?: true | number | string;
+  /** Абсолютное позиционирование на весь контейнер */
+  absoluteFill?: boolean;
+  /** Центрирование по горизонтали и вертикали */
+  center?: boolean;
+  justifyContent?: React.CSSProperties["justifyContent"];
+  alignItems?: React.CSSProperties["alignItems"];
+  alignSelf?: React.CSSProperties["alignSelf"];
+  borderWidth?: Spacing;
+  borderBottomWidth?: Spacing;
+  borderColor?: string;
+  borderRadius?: Spacing;
+  zIndex?: number;
+  overflow?: React.CSSProperties["overflow"];
+  minWidth?: Spacing;
+  minHeight?: Spacing;
+  maxWidth?: Spacing;
+  maxHeight?: Spacing;
+  flexWrap?: React.CSSProperties["flexWrap"];
+  flexGrow?: number;
+  flexShrink?: number;
+  flexBasis?: Spacing;
+  backgroundColor?: string;
+  relative?: boolean;
+  absolute?: boolean;
+  display?: React.CSSProperties["display"];
 };
 /**
  * Пропсы для компонента Box
  * Наследует все BoxSpacers свойства и стандартные HTML div атрибуты
  */
-export interface BoxProps extends BoxSpacers, Omit<ComponentProps<"div">, keyof BoxSpacers> {
-}
+export interface BoxProps
+  extends BoxSpacers,
+    Omit<ComponentProps<"div">, keyof BoxSpacers> {}
 /**
  * Универсальный Box (display="flex") компонент для создания flex-контейнеров с удобными пропсами для стилизации.
  *
@@ -109,6 +110,7 @@ export interface BoxProps extends BoxSpacers, Omit<ComponentProps<"div">, keyof
  * </Box>
  * ```
  */
-export declare const Box: import('react').ForwardRefExoticComponent<Omit<BoxProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-export {};
-//# sourceMappingURL=Box.d.ts.map
+export declare const Box: import("react").ForwardRefExoticComponent<
+  Omit<BoxProps, "ref"> & import("react").RefAttributes<HTMLDivElement>
+>;
+//# sourceMappingURL=Box.d.ts.map

package/dist/components/builders/Box/index.d.ts

@@ -1,2 +1,2 @@
-export * from './Box';
-//# sourceMappingURL=index.d.ts.map
+export * from "./Box";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/builders/Box/type.d.ts

@@ -0,0 +1,58 @@
+declare const colorTokens: {
+  readonly fill: {
+    readonly accent: readonly ["primary", "secondary", "hover", "inverse"];
+    readonly positive: readonly ["primary", "secondary", "hover", "inverse"];
+    readonly negative: readonly ["primary", "secondary", "hover", "inverse"];
+    readonly warning: readonly ["primary", "secondary", "hover", "inverse"];
+    readonly neutral: readonly ["primary", "secondary", "hover", "inverse"];
+  };
+  readonly "fill-bg": {
+    readonly bg: readonly [
+      "primary",
+      "primary-inverse",
+      "secondary",
+      "secondary-inverse",
+      "tertiary",
+      "tertiary-inverse",
+      "tint",
+      "tint-low",
+      "elevation-primary",
+      "elevation-secondary",
+      "elevation-tertiary",
+    ];
+  };
+  readonly border: {
+    readonly accent: readonly ["primary", "secondary", "hover", "inverse"];
+    readonly positive: readonly ["primary", "secondary", "hover", "inverse"];
+    readonly negative: readonly ["primary", "secondary", "hover", "inverse"];
+    readonly warning: readonly ["primary", "secondary", "hover", "inverse"];
+    readonly neutral: readonly ["primary", "secondary", "hover", "inverse"];
+  };
+  readonly text: {
+    readonly primary: readonly [];
+    readonly secondary: readonly [];
+    readonly tertiary: readonly [];
+    readonly inverse: readonly [];
+    readonly positive: readonly [];
+    readonly negative: readonly [];
+    readonly warning: readonly [];
+  };
+  readonly icon: {
+    readonly primary: readonly [];
+    readonly secondary: readonly [];
+    readonly tertiary: readonly [];
+    readonly inverse: readonly [];
+    readonly positive: readonly [];
+    readonly negative: readonly [];
+    readonly warning: readonly [];
+  };
+};
+type TokenMap = typeof colorTokens;
+export type TokenForRole<R extends keyof TokenMap> = {
+  [P in keyof TokenMap[R]]: TokenMap[R][P] extends readonly string[]
+    ? TokenMap[R][P] extends []
+      ? `${Extract<P, string>}`
+      : `${Extract<P, string>}-${TokenMap[R][P][number]}`
+    : never;
+}[keyof TokenMap[R]];
+//# sourceMappingURL=type.d.ts.map

package/dist/components/builders/Box/type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/components/builders/Box/type.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgDP,CAAC;AAEX,KAAK,QAAQ,GAAG,OAAO,WAAW,CAAC;AAEnC,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,MAAM,QAAQ,IAAI;KAClD,CAAC,IAAI,MAAM,QAAQ,CAAC,CAAC,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,SAAS,MAAM,EAAE,GAC9D,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,EAAE,GACvB,GAAG,OAAO,CAAC,CAAC,EAAE,MAAM,CAAC,EAAE,GACvB,GAAG,OAAO,CAAC,CAAC,EAAE,MAAM,CAAC,IAAI,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,GACnD,KAAK;CACV,CAAC,MAAM,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC"}

package/dist/components/builders/Loader/Loader.d.ts

@@ -1,7 +1,7 @@
-import { default as React } from 'react';
+import { default as React } from "react";
 interface LoaderProps {
-    color?: string;
+  color?: string;
 }
 declare const Loader: React.FC<LoaderProps>;
 export default Loader;
-//# sourceMappingURL=Loader.d.ts.map
+//# sourceMappingURL=Loader.d.ts.map

package/dist/components/builders/Loader/index.d.ts

@@ -1,2 +1,2 @@
-export * from './Loader';
-//# sourceMappingURL=index.d.ts.map
+export * from "./Loader";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/builders/Modal/Modal.d.ts

@@ -1,33 +1,35 @@
-import { default as React, PropsWithChildren } from 'react';
-import { Size } from '../../../types/tokens.types';
+import { default as React, PropsWithChildren } from "react";
+import { Size } from "../../../types/tokens.types";
 export interface ModalProps extends PropsWithChildren {
-    /** Показывать ли модальное окно */
-    isOpen?: boolean;
-    /** Callback при закрытии модального окна */
-    /** @default undefined */
-    onClose?: () => void;
-    /** Размер модального окна */
-    /** @default "md" */
-    size?: Exclude<Size, "xl" | "xs">;
-    /** Закрывать ли при клике на backdrop */
-    /** @default true */
-    closeOnBackdropClick?: boolean;
-    /** Закрывать ли при нажатии ESC */
-    /** @default true */
-    closeOnEsc?: boolean;
-    /** Кастомный класс для overlay */
-    /** @default undefined */
-    overlayClassName?: string;
-    /** Кастомный класс для модального окна */
-    /** @default undefined */
-    modalClassName?: string;
-    /** Отключать прокрутку body при открытии */
-    /** @default false */
-    disableBodyScroll?: boolean;
-    /** Показывать ли кнопку закрытия c абсолютным позиционированием внутри модального окна */
-    /** @default false */
-    showAbsoluteCloseButton?: boolean;
+  /** Показывать ли модальное окно */
+  isOpen?: boolean;
+  /** Callback при закрытии модального окна */
+  /** @default undefined */
+  onClose?: () => void;
+  /** Размер модального окна */
+  /** @default "md" */
+  size?: Exclude<Size, "xl" | "xs">;
+  /** Закрывать ли при клике на backdrop */
+  /** @default true */
+  closeOnBackdropClick?: boolean;
+  /** Закрывать ли при нажатии ESC */
+  /** @default true */
+  closeOnEsc?: boolean;
+  /** Кастомный класс для overlay */
+  /** @default undefined */
+  overlayClassName?: string;
+  /** Кастомный класс для модального окна */
+  /** @default undefined */
+  modalClassName?: string;
+  /** Отключать прокрутку body при открытии */
+  /** @default false */
+  disableBodyScroll?: boolean;
+  /** Показывать ли кнопку закрытия c абсолютным позиционированием внутри модального окна */
+  /** @default false */
+  showAbsoluteCloseButton?: boolean;
 }
-declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>>;
+declare const Modal: React.ForwardRefExoticComponent<
+  ModalProps & React.RefAttributes<HTMLDivElement>
+>;
 export { Modal };
-//# sourceMappingURL=Modal.d.ts.map
+//# sourceMappingURL=Modal.d.ts.map

package/dist/components/builders/Modal/Modal.stories.d.ts

@@ -1,9 +1,9 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { Modal } from './index';
+import { Meta, StoryObj } from "@storybook/react";
+import { Modal } from "./index";
 declare const meta: Meta<typeof Modal>;
 export default meta;
 type Story = StoryObj<typeof Modal>;
 export declare const Default: Story;
 export declare const WithVirtualize: Story;
 export declare const WithReactPortal: Story;
-//# sourceMappingURL=Modal.stories.d.ts.map
+//# sourceMappingURL=Modal.stories.d.ts.map

package/dist/components/builders/Modal/ModalFooter/ModalFooter.d.ts

@@ -1,4 +1,6 @@
-import { BoxProps } from '../../Box';
-declare const ModalFooter: import('react').ForwardRefExoticComponent<Omit<BoxProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+import { BoxProps } from "../../Box";
+declare const ModalFooter: import("react").ForwardRefExoticComponent<
+  Omit<BoxProps, "ref"> & import("react").RefAttributes<HTMLDivElement>
+>;
 export { ModalFooter };
-//# sourceMappingURL=ModalFooter.d.ts.map
+//# sourceMappingURL=ModalFooter.d.ts.map

package/dist/components/builders/Modal/ModalFooter/index.d.ts

@@ -1,2 +1,2 @@
-export { ModalFooter } from './ModalFooter';
-//# sourceMappingURL=index.d.ts.map
+export { ModalFooter } from "./ModalFooter";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/builders/Modal/ModalHeader/ModalHeader.d.ts

@@ -1,14 +1,20 @@
-import { BoxProps } from '../../Box';
-interface ModalHeaderProps extends Pick<BoxProps, "p" | "px" | "py" | "pt" | "pb" | "row" | "justifyContent" | "w"> {
-    /** @default undefined */
-    title?: string;
-    /** @default undefined */
-    subtitle?: string;
-    /** @default undefined */
-    onClose?: () => void;
-    /** @default undefined */
-    showCloseButton?: boolean;
+import { BoxProps } from "../../Box";
+interface ModalHeaderProps
+  extends Pick<
+    BoxProps,
+    "p" | "px" | "py" | "pt" | "pb" | "row" | "justifyContent" | "w"
+  > {
+  /** @default undefined */
+  title?: string;
+  /** @default undefined */
+  subtitle?: string;
+  /** @default undefined */
+  onClose?: () => void;
+  /** @default undefined */
+  showCloseButton?: boolean;
 }
-declare const ModalHeader: import('react').ForwardRefExoticComponent<ModalHeaderProps & import('react').RefAttributes<HTMLDivElement>>;
+declare const ModalHeader: import("react").ForwardRefExoticComponent<
+  ModalHeaderProps & import("react").RefAttributes<HTMLDivElement>
+>;
 export { ModalHeader };
-//# sourceMappingURL=ModalHeader.d.ts.map
+//# sourceMappingURL=ModalHeader.d.ts.map

package/dist/components/builders/Modal/ModalHeader/index.d.ts

@@ -1,2 +1,2 @@
-export { ModalHeader } from './ModalHeader';
-//# sourceMappingURL=index.d.ts.map
+export { ModalHeader } from "./ModalHeader";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/builders/Modal/ModalMain/ModalMain.d.ts

@@ -1,34 +1,36 @@
-import { ScrollToOptions } from '@tanstack/react-virtual';
-import { PropsWithChildren } from 'react';
+import { ScrollToOptions } from "@tanstack/react-virtual";
+import { PropsWithChildren } from "react";
 interface ModalMainRef {
-    /** Скролл к началу списка */
-    scrollToTop: () => void;
-    /** Скролл к концу списка */
-    scrollToBottom: () => void;
-    /** Скролл к элементу по индексу */
-    scrollToIndex: (index: number, options?: ScrollToOptions) => void;
-    /** Скролл к определенной позиции в пикселях */
-    scrollToOffset: (offset: number, options?: ScrollToOptions) => void;
-    /** Скролл на определенное количество пикселей относительно текущей позиции */
-    scrollBy: (delta: number) => void;
-    /** Получить DOM элемент */
-    getElement: () => HTMLDivElement | null;
-    /** Получить текущую позицию скролла */
-    getScrollOffset: () => number;
-    /** Получить общую высоту контента */
-    getTotalSize: () => number;
+  /** Скролл к началу списка */
+  scrollToTop: () => void;
+  /** Скролл к концу списка */
+  scrollToBottom: () => void;
+  /** Скролл к элементу по индексу */
+  scrollToIndex: (index: number, options?: ScrollToOptions) => void;
+  /** Скролл к определенной позиции в пикселях */
+  scrollToOffset: (offset: number, options?: ScrollToOptions) => void;
+  /** Скролл на определенное количество пикселей относительно текущей позиции */
+  scrollBy: (delta: number) => void;
+  /** Получить DOM элемент */
+  getElement: () => HTMLDivElement | null;
+  /** Получить текущую позицию скролла */
+  getScrollOffset: () => number;
+  /** Получить общую высоту контента */
+  getTotalSize: () => number;
 }
 interface ModalMainProps extends PropsWithChildren {
-    /** Если true, flex-direction будет row, иначе column */
-    row?: boolean;
-    /** Кастомный класс */
-    className?: string;
-    /** Примерная высота элемента для виртуализации */
-    estimatedItemHeight?: number;
-    /** Включить виртуализацию для больших списков */
-    virtualize?: boolean;
+  /** Если true, flex-direction будет row, иначе column */
+  row?: boolean;
+  /** Кастомный класс */
+  className?: string;
+  /** Примерная высота элемента для виртуализации */
+  estimatedItemHeight?: number;
+  /** Включить виртуализацию для больших списков */
+  virtualize?: boolean;
 }
-declare const ModalMain: import('react').ForwardRefExoticComponent<ModalMainProps & import('react').RefAttributes<ModalMainRef>>;
+declare const ModalMain: import("react").ForwardRefExoticComponent<
+  ModalMainProps & import("react").RefAttributes<ModalMainRef>
+>;
 export { ModalMain };
 export type { ModalMainRef };
-//# sourceMappingURL=ModalMain.d.ts.map
+//# sourceMappingURL=ModalMain.d.ts.map

package/dist/components/builders/Modal/ModalMain/index.d.ts

@@ -1,3 +1,3 @@
-export { ModalMain } from './ModalMain';
-export type { ModalMainRef } from './ModalMain';
-//# sourceMappingURL=index.d.ts.map
+export { ModalMain } from "./ModalMain";
+export type { ModalMainRef } from "./ModalMain";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/builders/Modal/index.d.ts

@@ -1,13 +1,16 @@
-import { ModalProps } from './Modal';
-import { ModalHeader } from './ModalHeader';
-import { ModalFooter } from './ModalFooter';
-import { ModalMain } from './ModalMain';
-interface ModalCompoundComponent extends React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>> {
-    Header: typeof ModalHeader;
-    Main: typeof ModalMain;
-    Footer: typeof ModalFooter;
+import { ModalProps } from "./Modal";
+import { ModalHeader } from "./ModalHeader";
+import { ModalFooter } from "./ModalFooter";
+import { ModalMain } from "./ModalMain";
+interface ModalCompoundComponent
+  extends React.ForwardRefExoticComponent<
+    ModalProps & React.RefAttributes<HTMLDivElement>
+  > {
+  Header: typeof ModalHeader;
+  Main: typeof ModalMain;
+  Footer: typeof ModalFooter;
 }
 declare const ModalWithSubComponents: ModalCompoundComponent;
 export { ModalWithSubComponents as Modal };
 export type { ModalCompoundComponent as ModalProps };
-//# sourceMappingURL=index.d.ts.map
+//# sourceMappingURL=index.d.ts.map

package/dist/components/builders/Ripple/Ripple.d.ts

@@ -3,18 +3,14 @@
  * Позволяет программно запускать эффект ripple.
  */
 type RippleHandle = {
-    /**
-     * Запускает эффект ripple.
-     * @param opts - Опции для запуска.
-     * @param opts.center - Если true, эффект запускается из центра элемента (по умолчанию true).
-     * @param opts.x - Координата X для центра ripple (игнорируется, если center=true).
-     * @param opts.y - Координата Y для центра ripple (игнорируется, если center=true).
-     */
-    trigger: (opts?: {
-        center?: boolean;
-        x?: number;
-        y?: number;
-    }) => void;
+  /**
+   * Запускает эффект ripple.
+   * @param opts - Опции для запуска.
+   * @param opts.center - Если true, эффект запускается из центра элемента (по умолчанию true).
+   * @param opts.x - Координата X для центра ripple (игнорируется, если center=true).
+   * @param opts.y - Координата Y для центра ripple (игнорируется, если center=true).
+   */
+  trigger: (opts?: { center?: boolean; x?: number; y?: number }) => void;
 };
 /**
  * Компонент Ripple для создания эффекта "волны" на интерактивных элементах.
@@ -29,11 +25,12 @@ type RippleHandle = {
  * @param ref - Ref для доступа к методу trigger.
  * @returns JSX.Element - Overlay с ripple-элементами.
  */
-export declare const Ripple: import('react').ForwardRefExoticComponent<{
+export declare const Ripple: import("react").ForwardRefExoticComponent<
+  {
     color?: string;
     duration?: number;
     radius?: number | "auto";
     className?: string;
-} & import('react').RefAttributes<RippleHandle>>;
-export {};
-//# sourceMappingURL=Ripple.d.ts.map
+  } & import("react").RefAttributes<RippleHandle>
+>;
+//# sourceMappingURL=Ripple.d.ts.map

package/dist/components/builders/Ripple/index.d.ts

@@ -1,2 +1,2 @@
-export * from './Ripple';
-//# sourceMappingURL=index.d.ts.map
+export * from "./Ripple";
+//# sourceMappingURL=index.d.ts.map