@ozen-ui/kit 0.0.1

package/__inner__/cjs/components/Avatar/Avatar.js

@@ -0,0 +1,60 @@
+"use strict";
+exports.__esModule = true;
+exports.Avatar = exports.cnAvatar = exports.avatarHueVariant = exports.avatarSizeVariant = void 0;
+var tslib_1 = require("tslib");
+require("./Avatar.css");
+var react_1 = tslib_1.__importStar(require("react"));
+var useBoolean_1 = require("../../hooks/useBoolean");
+var useThemeProps_1 = require("../../hooks/useThemeProps");
+var classname_1 = require("../../utils/classname");
+var Indicator_1 = require("../Indicator");
+var constants_1 = require("./constants");
+var get_hash_number_1 = require("./get-hash-number");
+exports.avatarSizeVariant = [
+    '4xs',
+    '3xs',
+    '2xs',
+    'xs',
+    's',
+    'm',
+    'l',
+    'xl',
+];
+exports.avatarHueVariant = [1, 2, 3];
+var avatarEl = 'div';
+exports.cnAvatar = (0, classname_1.cn)('Avatar');
+var getInitials = function (name) {
+    var _a, _b;
+    var parts = name.split(' ');
+    var initials;
+    if (parts.length === 1) {
+        initials = parts[0].charAt(0);
+    }
+    else {
+        initials = ((_a = parts.shift()) !== null && _a !== void 0 ? _a : '').charAt(0) + ((_b = parts.pop()) !== null && _b !== void 0 ? _b : '').charAt(0);
+    }
+    return initials.toUpperCase();
+};
+var matchSizeIndicatorToAvatar = {
+    '4xs': 'xs',
+    '3xs': 'xs',
+    '2xs': 'xs',
+    xs: 's',
+    s: 's',
+    m: 's',
+    l: 'm',
+    xl: 'm'
+};
+exports.Avatar = (0, react_1.forwardRef)(function (inProps, ref) {
+    var props = (0, useThemeProps_1.useThemeProps)({ props: inProps, name: 'Avatar' });
+    var _a = props.size, size = _a === void 0 ? constants_1.AVATAR_DEFAULT_SIZE : _a, _b = props.online, online = _b === void 0 ? constants_1.AVATAR_DEFAULT_ONLINE : _b, _c = props.hue, hue = _c === void 0 ? constants_1.AVATAR_DEFAULT_HUE : _c, src = props.src, name = props.name, className = props.className, indicatorProps = props.indicatorProps, other = tslib_1.__rest(props, ["size", "online", "hue", "src", "name", "className", "indicatorProps"]);
+    var _d = tslib_1.__read((0, useBoolean_1.useBoolean)(!!src), 2), showImage = _d[0], off = _d[1].off;
+    var indicatorSize = matchSizeIndicatorToAvatar[size];
+    var colorShades = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];
+    var color = "".concat(colorShades[(0, get_hash_number_1.getHashNumber)(name, colorShades.length)]).concat(hue);
+    var initials = getInitials(name);
+    return (react_1["default"].createElement("div", tslib_1.__assign({ className: (0, exports.cnAvatar)({ size: size, color: !showImage && color }, [className]) }, other, { ref: ref }),
+        src && showImage ? (react_1["default"].createElement("img", { src: src, alt: name, className: (0, exports.cnAvatar)('Image'), onError: off })) : (initials),
+        online && (react_1["default"].createElement(Indicator_1.Indicator, tslib_1.__assign({ variant: "success", size: indicatorSize, className: (0, exports.cnAvatar)('Online'), border: true }, indicatorProps)))));
+});
+exports.Avatar.displayName = 'Avatar';

package/__inner__/cjs/components/Avatar/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const AVATAR_DEFAULT_SIZE = "m";
+export declare const AVATAR_DEFAULT_ONLINE = false;
+export declare const AVATAR_DEFAULT_HUE = 1;

package/__inner__/cjs/components/Avatar/constants.js

@@ -0,0 +1,6 @@
+"use strict";
+exports.__esModule = true;
+exports.AVATAR_DEFAULT_HUE = exports.AVATAR_DEFAULT_ONLINE = exports.AVATAR_DEFAULT_SIZE = void 0;
+exports.AVATAR_DEFAULT_SIZE = 'm';
+exports.AVATAR_DEFAULT_ONLINE = false;
+exports.AVATAR_DEFAULT_HUE = 1;

package/__inner__/cjs/components/Avatar/get-hash-number.d.ts

@@ -0,0 +1 @@
+export declare const getHashNumber: (value: string, maxNumber: number) => number;

package/__inner__/cjs/components/Avatar/get-hash-number.js

@@ -0,0 +1,19 @@
+"use strict";
+exports.__esModule = true;
+exports.getHashNumber = void 0;
+var cache = {};
+var getHashNumber = function (value, maxNumber) {
+    var cacheIndex = "".concat(value, "-").concat(maxNumber);
+    if (cache[cacheIndex]) {
+        return cache[cacheIndex];
+    }
+    var hash = 0;
+    for (var i = 0, len = value.length; i < len; i++) {
+        var chr = value.charCodeAt(i);
+        hash = (hash << 5) - hash + chr;
+        hash |= 0;
+    }
+    cache[cacheIndex] = Math.abs(hash) % maxNumber;
+    return cache[cacheIndex];
+};
+exports.getHashNumber = getHashNumber;

package/__inner__/cjs/components/Avatar/index.d.ts

@@ -0,0 +1 @@
+export * from './Avatar';

package/__inner__/cjs/components/Avatar/index.js

@@ -0,0 +1,4 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Avatar"), exports);

package/__inner__/cjs/components/Backdrop/Backdrop.css

@@ -0,0 +1,45 @@
+.Backdrop {
+  --backdrop-z-index: var(--z-index-absolute);
+  z-index: var(--backdrop-z-index);
+  background-color: var(--color-background-overlay);
+  position: fixed;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  inset: 0;
+}
+
+  .Backdrop_isInvisible {
+    background-color: transparent;
+  }
+
+  .Backdrop_animation-enter,
+    .Backdrop_animation-appear {
+      opacity: 0;
+    }
+
+  .Backdrop_animation-enter-active,
+    .Backdrop_animation-appear-active {
+      opacity: 1;
+      transition: opacity var(--transition-slow);
+    }
+
+  .Backdrop_animation-enter-done {
+      opacity: 1;
+    }
+
+  .Backdrop_animation-exit {
+      opacity: 1;
+      visibility: visible;
+    }
+
+  .Backdrop_animation-exit-active {
+      opacity: 0;
+      transition: opacity var(--transition-slow);
+      visibility: visible;
+    }
+
+  .Backdrop_animation-exit-done {
+      opacity: 0;
+      visibility: hidden;
+    }

package/__inner__/cjs/components/Backdrop/Backdrop.d.ts

@@ -0,0 +1,27 @@
+import './Backdrop.css';
+import type { CSSProperties, ElementType, ReactNode } from 'react';
+import { CSSTransitionProps } from 'react-transition-group/CSSTransition';
+import { PolymorphicComponentPropsWithRef } from '../../utils/polymorphicComponentWithRef';
+import { BACKDROP_DEFAULT_TAG } from './constants';
+export type BackdropBaseProps = {
+    /** Признак по которому компонент будет представлен */
+    open?: boolean;
+    /** Функция обратного вызова которая будет вызвана когда компонент запрашивает
+     *  закрытие (клик по подложке) */
+    onClose?: () => void;
+    /** Если {true} делает подложку невидимой */
+    isInvisible?: boolean;
+    /** Дополнительные CSS-классы */
+    className?: string;
+    /** Содержимое подложки */
+    children?: ReactNode;
+    /** Определяет положение позиционированного элемента по оси z */
+    zIndex?: CSSProperties['zIndex'];
+    /** Свойства по управлению анимацией перехода */
+    transitionProps?: Partial<CSSTransitionProps>;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+};
+export type BackdropProps<As extends ElementType = typeof BACKDROP_DEFAULT_TAG> = PolymorphicComponentPropsWithRef<BackdropBaseProps, As>;
+export declare const cnBackdrop: import("@bem-react/classname").ClassNameFormatter;
+export declare const Backdrop: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<BackdropBaseProps, "div">;

package/__inner__/cjs/components/Backdrop/Backdrop.js

@@ -0,0 +1,19 @@
+"use strict";
+exports.__esModule = true;
+exports.Backdrop = exports.cnBackdrop = void 0;
+var tslib_1 = require("tslib");
+require("./Backdrop.css");
+var react_1 = tslib_1.__importDefault(require("react"));
+var react_transition_group_1 = require("react-transition-group");
+var useThemeProps_1 = require("../../hooks/useThemeProps");
+var classname_1 = require("../../utils/classname");
+var polymorphicComponentWithRef_1 = require("../../utils/polymorphicComponentWithRef");
+var constants_1 = require("./constants");
+exports.cnBackdrop = (0, classname_1.cn)('Backdrop');
+exports.Backdrop = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (inProps, ref) {
+    var props = (0, useThemeProps_1.useThemeProps)({ props: inProps, name: 'Backdrop' });
+    var _a = props.as, Tag = _a === void 0 ? constants_1.BACKDROP_DEFAULT_TAG : _a, open = props.open, onClose = props.onClose, isInvisible = props.isInvisible, className = props.className, children = props.children, zIndex = props.zIndex, transitionProps = props.transitionProps, styleProp = props.style, other = tslib_1.__rest(props, ["as", "open", "onClose", "isInvisible", "className", "children", "zIndex", "transitionProps", "style"]);
+    return (react_1["default"].createElement(react_transition_group_1.CSSTransition, tslib_1.__assign({}, transitionProps, { classNames: (0, exports.cnBackdrop)({ animation: true }), timeout: 300, "in": open, unmountOnExit: true, appear: true }),
+        react_1["default"].createElement(Tag, tslib_1.__assign({ "aria-hidden": true, className: (0, exports.cnBackdrop)({ isInvisible: isInvisible }, [className]), onClick: onClose, style: tslib_1.__assign({ '--backdrop-z-index': zIndex }, styleProp) }, other, { ref: ref }), children)));
+});
+exports.Backdrop.displayName = 'Backdrop';

package/__inner__/cjs/components/Backdrop/constants.d.ts

@@ -0,0 +1 @@
+export declare const BACKDROP_DEFAULT_TAG = "div";

package/__inner__/cjs/components/Backdrop/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+exports.__esModule = true;
+exports.BACKDROP_DEFAULT_TAG = void 0;
+exports.BACKDROP_DEFAULT_TAG = 'div';

package/__inner__/cjs/components/Backdrop/index.d.ts

@@ -0,0 +1 @@
+export * from './Backdrop';

package/__inner__/cjs/components/Backdrop/index.js

@@ -0,0 +1,4 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Backdrop"), exports);

package/__inner__/cjs/components/Badge/Badge.css

@@ -0,0 +1,115 @@
+/* stylelint-disable */
+.Badge {
+  display: inline-flex;
+  position: relative;
+  vertical-align: middle;
+  flex-shrink: 0;
+}
+.Badge-Content {
+  --badge-content-scale: 1;
+  display: inline-flex;
+  flex-shrink: 0;
+  justify-content: center;
+  position: absolute;
+  transform: scale(var(--badge-content-scale))
+    translate(var(--badge-content-translate));
+  transform-origin: var(--badge-content-transform-origin);
+  transition: transform var(--transition-default),
+    color var(--transition-default), background-color var(--transition-default);
+}
+.Badge-Content_horizontalOrigin_left.Badge-Content_verticalOrigin_top {
+    --badge-content-translate: -50%, -50%;
+    --badge-content-transform-origin: 0% 0%;
+    inset-inline-start: 0;
+    inset-block-start: 0;
+  }
+.Badge-Content_horizontalOrigin_right.Badge-Content_verticalOrigin_top {
+    --badge-content-translate: 50%, -50%;
+    --badge-content-transform-origin: 100% 0%;
+    inset-inline-end: 0;
+    inset-block-start: 0;
+  }
+.Badge-Content_horizontalOrigin_left.Badge-Content_verticalOrigin_bottom {
+    --badge-content-translate: -50%, 50%;
+    --badge-content-transform-origin: 0% 100%;
+    inset-inline-start: 0;
+    inset-block-end: 0;
+  }
+.Badge-Content_horizontalOrigin_right.Badge-Content_verticalOrigin_bottom {
+    --badge-content-translate: 50%, 50%;
+    --badge-content-transform-origin: 100% 100%;
+    inset-inline-end: 0;
+    inset-block-end: 0;
+  }
+.Badge-Content_size_s {
+      border-radius: 16px;
+      padding: 0 8px;
+
+      font: var(--typography-text-s_1-font);
+
+      letter-spacing: var(--typography-text-s_1-letter_spacing, 0);
+
+      text-transform: var(--typography-text-s_1-text_transform, none);
+    }
+.Badge-Content_size_xs {
+      min-inline-size: 8px;
+      border-radius: 8px;
+      padding: 0 4px;
+
+      font: var(--typography-text-3xs_1-font);
+
+      letter-spacing: var(--typography-text-3xs_1-letter_spacing, 0);
+
+      text-transform: var(--typography-text-3xs_1-text_transform, none);
+    }
+.Badge-Content_color_neutralDark {
+      color: var(--color-content-action-on);
+      background-color: var(--color-space-space-95);
+    }
+.Badge-Content_color_neutralLight {
+      color: var(--color-content-primary);
+      background-color: var(--color-background-secondary);
+    }
+.Badge-Content_color_actionDark {
+      color: var(--color-content-action-on);
+      background-color: var(--color-background-success);
+    }
+.Badge-Content_color_actionLight {
+      color: var(--color-content-success);
+      background-color: var(--color-background-success-light);
+    }
+.Badge-Content_color_errorDark {
+      color: var(--color-content-action-on);
+      background-color: var(--color-background-error);
+    }
+.Badge-Content_color_errorLight {
+      color: var(--color-content-error);
+      background-color: var(--color-background-error-light);
+    }
+.Badge-Content_color_disabled {
+      color: var(--color-content-disabled);
+      background-color: var(--color-background-disabled);
+    }
+.Badge-Content_variant_dot {
+    border-radius: 50%;
+    padding: 0;
+  }
+.Badge-Content_variant_dot.Badge-Content_size_s {
+    inline-size: 8px;
+    block-size: 8px;
+  }
+.Badge-Content_variant_dot.Badge-Content_size_xs {
+    min-inline-size: auto;
+    inline-size: 6px;
+    block-size: 6px;
+  }
+.Badge-Content_invisible {
+    --badge-content-scale: 0;
+  }
+.Badge-Content_invisible.Badge-Content_variant_dot {
+      visibility: hidden;
+    }
+.Badge-Content_onlyBadge {
+    position: static;
+    transform: scale(var(--badge-content-scale));
+  }

package/__inner__/cjs/components/Badge/Badge.d.ts

@@ -0,0 +1,38 @@
+import './Badge.css';
+import React, { type HTMLAttributes } from 'react';
+export declare const badgeColorVariant: readonly ["neutralDark", "neutralLight", "actionDark", "actionLight", "errorDark", "errorLight", "disabled"];
+export declare const badgeVariant: readonly ["dot", "standard"];
+export declare const badgeSizeVariant: readonly ["xs", "s"];
+export declare const badgeAsVariant: readonly ["div", "span"];
+export declare const badgeHorizontalOriginVariant: readonly ["left", "right"];
+export declare const badgeVerticalOriginVariant: readonly ["top", "bottom"];
+export type BadgeColorVariant = (typeof badgeColorVariant)[number];
+export type BadgeVariant = (typeof badgeVariant)[number];
+export type BadgeSizeVariant = (typeof badgeSizeVariant)[number];
+export type BadgeAsVariant = (typeof badgeAsVariant)[number];
+export type BadgeHorizontalOriginVariant = (typeof badgeHorizontalOriginVariant)[number];
+export type BadgeVerticalOriginVariant = (typeof badgeVerticalOriginVariant)[number];
+export declare const cnBadge: import("@bem-react/classname").ClassNameFormatter;
+export type BadgeProps = {
+    /** Размер */
+    size?: BadgeSizeVariant;
+    /** Вариант представления */
+    variant?: BadgeVariant;
+    /** Цвет */
+    color?: BadgeColorVariant;
+    /** Отображаемое значение */
+    content?: React.ReactChild | null;
+    /** HTML-атрибуты элемента отображающего content баджа */
+    contentProps?: HTMLAttributes<HTMLSpanElement>;
+    /** Максимальное число для отображаемого значения */
+    max?: number;
+    /** Расположение по горизонтали */
+    horizontalOrigin?: BadgeHorizontalOriginVariant;
+    /** Расположение по вертикали */
+    verticalOrigin?: BadgeVerticalOriginVariant;
+    /** Если {true} отображает нулевое значение */
+    showZero?: boolean;
+    /** Если {true} компонент будет скрыт */
+    invisible?: boolean;
+};
+export declare const Badge: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<BadgeProps, "div">;

package/__inner__/cjs/components/Badge/Badge.js

@@ -0,0 +1,56 @@
+"use strict";
+exports.__esModule = true;
+exports.Badge = exports.cnBadge = exports.badgeVerticalOriginVariant = exports.badgeHorizontalOriginVariant = exports.badgeAsVariant = exports.badgeSizeVariant = exports.badgeVariant = exports.badgeColorVariant = void 0;
+var tslib_1 = require("tslib");
+require("./Badge.css");
+var react_1 = tslib_1.__importStar(require("react"));
+var usePrevious_1 = require("../../hooks/usePrevious");
+var useThemeProps_1 = require("../../hooks/useThemeProps");
+var classname_1 = require("../../utils/classname");
+var polymorphicComponentWithRef_1 = require("../../utils/polymorphicComponentWithRef");
+var constants_1 = require("./constants");
+exports.badgeColorVariant = [
+    'neutralDark',
+    'neutralLight',
+    'actionDark',
+    'actionLight',
+    'errorDark',
+    'errorLight',
+    'disabled',
+];
+exports.badgeVariant = ['dot', 'standard'];
+exports.badgeSizeVariant = ['xs', 's'];
+exports.badgeAsVariant = ['div', 'span'];
+exports.badgeHorizontalOriginVariant = ['left', 'right'];
+exports.badgeVerticalOriginVariant = ['top', 'bottom'];
+exports.cnBadge = (0, classname_1.cn)('Badge');
+exports.Badge = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (inProps, ref) {
+    var props = (0, useThemeProps_1.useThemeProps)({ props: inProps, name: 'Badge' });
+    var _a = props.size, size = _a === void 0 ? constants_1.BADGE_DEFAULT_SIZE : _a, _b = props.as, Tag = _b === void 0 ? constants_1.BADGE_DEFAULT_TAG : _b, _c = props.variant, variant = _c === void 0 ? constants_1.BADGE_DEFAULT_VARIANT : _c, _d = props.color, color = _d === void 0 ? constants_1.BADGE_DEFAULT_COLOR : _d, _e = props.horizontalOrigin, horizontalOrigin = _e === void 0 ? constants_1.BADGE_DEFAULT_HORIZONTAL_ORIGIN : _e, _f = props.verticalOrigin, verticalOrigin = _f === void 0 ? constants_1.BADGE_DEFAULT_VERTICAL_ORIGIN : _f, children = props.children, max = props.max, contentProp = props.content, contentProps = props.contentProps, showZero = props.showZero, invisibleProp = props.invisible, className = props.className, other = tslib_1.__rest(props, ["size", "as", "variant", "color", "horizontalOrigin", "verticalOrigin", "children", "max", "content", "contentProps", "showZero", "invisible", "className"]);
+    var prevContentProp = (0, usePrevious_1.usePrevious)(contentProp);
+    var invisible = (0, react_1.useMemo)(function () {
+        if (contentProp === 0 && !showZero) {
+            return true;
+        }
+        return invisibleProp;
+    }, [invisibleProp, contentProp, showZero]);
+    var content = invisible ? prevContentProp : contentProp;
+    var displayedContent = (0, react_1.useMemo)(function () {
+        if (variant !== 'dot') {
+            return max && Number(content) > max ? "".concat(max, "+") : content;
+        }
+        return null;
+    }, [max, content, variant]);
+    return (react_1["default"].createElement(Tag, tslib_1.__assign({ className: (0, exports.cnBadge)({}, [className]) }, other, { ref: ref }),
+        children,
+        react_1["default"].createElement("span", tslib_1.__assign({}, contentProps, { className: (0, exports.cnBadge)('Content', {
+                variant: variant,
+                size: size,
+                color: color,
+                horizontalOrigin: !!children && horizontalOrigin,
+                verticalOrigin: !!children && verticalOrigin,
+                invisible: invisible,
+                onlyBadge: !children
+            }, [contentProps === null || contentProps === void 0 ? void 0 : contentProps.className]) }), displayedContent)));
+});
+exports.Badge.displayName = 'Badge';

package/__inner__/cjs/components/Badge/constants.d.ts

@@ -0,0 +1,6 @@
+export declare const BADGE_DEFAULT_SIZE = "s";
+export declare const BADGE_DEFAULT_TAG = "div";
+export declare const BADGE_DEFAULT_VARIANT = "standard";
+export declare const BADGE_DEFAULT_COLOR = "defaultDark";
+export declare const BADGE_DEFAULT_HORIZONTAL_ORIGIN = "right";
+export declare const BADGE_DEFAULT_VERTICAL_ORIGIN = "top";

package/__inner__/cjs/components/Badge/constants.js

@@ -0,0 +1,9 @@
+"use strict";
+exports.__esModule = true;
+exports.BADGE_DEFAULT_VERTICAL_ORIGIN = exports.BADGE_DEFAULT_HORIZONTAL_ORIGIN = exports.BADGE_DEFAULT_COLOR = exports.BADGE_DEFAULT_VARIANT = exports.BADGE_DEFAULT_TAG = exports.BADGE_DEFAULT_SIZE = void 0;
+exports.BADGE_DEFAULT_SIZE = 's';
+exports.BADGE_DEFAULT_TAG = 'div';
+exports.BADGE_DEFAULT_VARIANT = 'standard';
+exports.BADGE_DEFAULT_COLOR = 'defaultDark';
+exports.BADGE_DEFAULT_HORIZONTAL_ORIGIN = 'right';
+exports.BADGE_DEFAULT_VERTICAL_ORIGIN = 'top';

package/__inner__/cjs/components/Badge/index.d.ts

@@ -0,0 +1 @@
+export * from './Badge';

package/__inner__/cjs/components/Badge/index.js

@@ -0,0 +1,4 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Badge"), exports);

package/__inner__/cjs/components/Breadcrumbs/Breadcrumbs.css

@@ -0,0 +1,14 @@
+.Breadcrumbs-List {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.Breadcrumbs-Item,
+.Breadcrumbs-Separator {
+  display: flex;
+  align-items: center;
+}

package/__inner__/cjs/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +1,7 @@
+import './Breadcrumbs.css';
+import React from 'react';
+export declare const cnBreadcrumbs: import("@bem-react/classname").ClassNameFormatter;
+export declare const Breadcrumbs: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLElement>, "onClick"> & {
+    separator?: import("./types").BreadcrumbsSeparatorComponent | undefined;
+    size?: "s" | "xs" | undefined;
+} & React.RefAttributes<HTMLElement>>;

package/__inner__/cjs/components/Breadcrumbs/Breadcrumbs.js

@@ -0,0 +1,34 @@
+"use strict";
+exports.__esModule = true;
+exports.Breadcrumbs = exports.cnBreadcrumbs = void 0;
+var tslib_1 = require("tslib");
+require("./Breadcrumbs.css");
+var react_1 = tslib_1.__importStar(require("react"));
+var icons_1 = require("@ozen-ui/icons");
+var react_is_1 = require("react-is");
+var classname_1 = require("../../utils/classname");
+var BreadcrumbsContext_1 = require("./BreadcrumbsContext");
+var constants_1 = require("./constants");
+exports.cnBreadcrumbs = (0, classname_1.cn)('Breadcrumbs');
+exports.Breadcrumbs = (0, react_1.forwardRef)(function (_a, ref) {
+    var _b = _a.size, size = _b === void 0 ? constants_1.BREADCRUMBS_DEFAULT_SIZE : _b, _c = _a.separator, Separator = _c === void 0 ? icons_1.ChevronSmallRightIcon : _c, children = _a.children, className = _a.className, other = tslib_1.__rest(_a, ["size", "separator", "children", "className"]);
+    var resolvedChildren = (0, react_is_1.isFragment)(children)
+        ? children.props.children
+        : children;
+    return (
+    // TODO: Подумать о возможности выбора рутового компонента
+    react_1["default"].createElement(BreadcrumbsContext_1.BreadcrumbsContext.Provider, { value: { size: size } },
+        react_1["default"].createElement("nav", tslib_1.__assign({ className: (0, exports.cnBreadcrumbs)({
+                size: size
+            }, [className]), "aria-label": "\u041D\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044F" }, other, { ref: ref }),
+            react_1["default"].createElement("ol", { className: (0, exports.cnBreadcrumbs)('List') }, react_1.Children.toArray(resolvedChildren).map(function (child, index, arr) {
+                if (!(0, react_1.isValidElement)(child))
+                    return null;
+                var isLast = index === arr.length - 1;
+                return (react_1["default"].createElement(react_1.Fragment, { key: child.key || index },
+                    react_1["default"].createElement("li", { className: (0, exports.cnBreadcrumbs)('Item') }, child),
+                    !!Separator && !isLast && (react_1["default"].createElement("li", { className: (0, exports.cnBreadcrumbs)('Separator'), "aria-hidden": true },
+                        react_1["default"].createElement(Separator, { color: "var(--color-content-disabled)", size: "s" })))));
+            })))));
+});
+exports.Breadcrumbs.displayName = 'Breadcrumbs';

package/__inner__/cjs/components/Breadcrumbs/BreadcrumbsContext.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { BreadcrumbsContextValue } from './types';
+export declare const BreadcrumbsContext: React.Context<BreadcrumbsContextValue>;
+export declare const useBreadcrumbsContext: () => BreadcrumbsContextValue;

package/__inner__/cjs/components/Breadcrumbs/BreadcrumbsContext.js

@@ -0,0 +1,15 @@
+"use strict";
+exports.__esModule = true;
+exports.useBreadcrumbsContext = exports.BreadcrumbsContext = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var constants_1 = require("./constants");
+exports.BreadcrumbsContext = react_1["default"].createContext({
+    size: constants_1.BREADCRUMBS_DEFAULT_SIZE
+});
+var useBreadcrumbsContext = function () { return (0, react_1.useContext)(exports.BreadcrumbsContext); };
+exports.useBreadcrumbsContext = useBreadcrumbsContext;
+// Именованный провайдер
+if (process.env.NODE_ENV !== 'production') {
+    exports.BreadcrumbsContext.displayName = 'BreadcrumbsContext';
+}

package/__inner__/cjs/components/Breadcrumbs/components/BreadcrumbItem.d.ts

@@ -0,0 +1,9 @@
+import type { ElementType } from 'react';
+import type { PolymorphicComponentPropsWithoutRef } from '../../../utils/polymorphicComponentWithRef';
+import type { ButtonProps } from '../../Button';
+import { BREADCRUMB_ITEM_DEFAULT_TAG } from '../constants';
+export declare const cnBreadcrumbItem: import("@bem-react/classname").ClassNameFormatter;
+type BreadcrumbItemBaseProps = Pick<ButtonProps, 'disabled' | 'iconLeft' | 'iconRight'>;
+export type BreadcrumbItemProps<As extends ElementType = typeof BREADCRUMB_ITEM_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<BreadcrumbItemBaseProps, As>;
+export declare const BreadcrumbItem: import("../../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<BreadcrumbItemBaseProps, "a">;
+export {};

package/__inner__/cjs/components/Breadcrumbs/components/BreadcrumbItem.js

@@ -0,0 +1,17 @@
+"use strict";
+exports.__esModule = true;
+exports.BreadcrumbItem = exports.cnBreadcrumbItem = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var classname_1 = require("../../../utils/classname");
+var polymorphicComponentWithRef_1 = require("../../../utils/polymorphicComponentWithRef");
+var Button_1 = require("../../Button");
+var BreadcrumbsContext_1 = require("../BreadcrumbsContext");
+var constants_1 = require("../constants");
+exports.cnBreadcrumbItem = (0, classname_1.cn)('BreadcrumbItem');
+exports.BreadcrumbItem = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (_a, ref) {
+    var _b = _a.as, as = _b === void 0 ? constants_1.BREADCRUMB_ITEM_DEFAULT_TAG : _b, disabled = _a.disabled, IconLeftProp = _a.iconLeft, IconRightProp = _a.iconRight, children = _a.children, className = _a.className, other = tslib_1.__rest(_a, ["as", "disabled", "iconLeft", "iconRight", "children", "className"]);
+    var size = (0, BreadcrumbsContext_1.useBreadcrumbsContext)().size;
+    return (react_1["default"].createElement(Button_1.Button, tslib_1.__assign({}, other, { className: (0, exports.cnBreadcrumbItem)({}, [className]), as: as, variant: "function", disabled: disabled, size: size, iconLeft: IconLeftProp, iconRight: IconRightProp, ref: ref }), children));
+});
+exports.BreadcrumbItem.displayName = 'BreadcrumbItem';

package/__inner__/cjs/components/Breadcrumbs/components/index.d.ts

@@ -0,0 +1 @@
+export * from './BreadcrumbItem';

package/__inner__/cjs/components/Breadcrumbs/components/index.js

@@ -0,0 +1,4 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./BreadcrumbItem"), exports);

package/__inner__/cjs/components/Breadcrumbs/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const BREADCRUMBS_DEFAULT_SIZE = "s";
+export declare const BREADCRUMB_ITEM_DEFAULT_TAG = "a";

package/__inner__/cjs/components/Breadcrumbs/constants.js

@@ -0,0 +1,5 @@
+"use strict";
+exports.__esModule = true;
+exports.BREADCRUMB_ITEM_DEFAULT_TAG = exports.BREADCRUMBS_DEFAULT_SIZE = void 0;
+exports.BREADCRUMBS_DEFAULT_SIZE = 's';
+exports.BREADCRUMB_ITEM_DEFAULT_TAG = 'a';

package/__inner__/cjs/components/Breadcrumbs/index.d.ts

@@ -0,0 +1,3 @@
+export * from './components';
+export * from './Breadcrumbs';
+export * from './types';

package/__inner__/cjs/components/Breadcrumbs/index.js

@@ -0,0 +1,6 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./components"), exports);
+tslib_1.__exportStar(require("./Breadcrumbs"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/Breadcrumbs/types.d.ts

@@ -0,0 +1,15 @@
+import React, { HTMLAttributes } from 'react';
+import type { IconProps } from '@ozen-ui/icons';
+export declare const breadcrumbsSizeVariant: readonly ["xs", "s"];
+export type BreadcrumbsSizeVariant = (typeof breadcrumbsSizeVariant)[number];
+export type BreadcrumbsSeparatorComponent = React.FC<IconProps>;
+export type BreadcrumbsContextValue = {
+    /** Размер */
+    size: BreadcrumbsSizeVariant;
+};
+export type BreadcrumbsProps = Omit<HTMLAttributes<HTMLElement>, 'onClick'> & {
+    /** Разделитель */
+    separator?: BreadcrumbsSeparatorComponent;
+    /** Размер */
+    size?: BreadcrumbsSizeVariant;
+};

package/__inner__/cjs/components/Breadcrumbs/types.js

@@ -0,0 +1,4 @@
+"use strict";
+exports.__esModule = true;
+exports.breadcrumbsSizeVariant = void 0;
+exports.breadcrumbsSizeVariant = ['xs', 's'];