@consta/uikit 3.12.2 → 3.14.0

package/Responses404/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Responses404",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Responses500/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Responses500",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Responses503/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Responses503",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesConnectionError/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesConnectionError",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesDeleted/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesDeleted",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesEmptyBox/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesEmptyBox",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesEmptyPockets/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesEmptyPockets",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesImage/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesImage",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesImage403/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesImage403",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesImage404/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesImage404",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesImage500/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesImage500",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesImage503/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesImage503",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesImageConnectionError/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesImageConnectionError",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesImageDeleted/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesImageDeleted",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesImageEmptyBox/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesImageEmptyBox",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesImageEmptyPockets/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesImageEmptyPockets",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesImageNothingFound/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesImageNothingFound",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesImageSuccess/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesImageSuccess",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesNothingFound/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesNothingFound",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ResponsesSuccess/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ResponsesSuccess",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Select/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Select",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Sidebar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Sidebar",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Skeleton/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Skeleton",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/SliderCanary/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/SliderCanary",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/SnackBar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/SnackBar",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Steps/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Steps",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Switch/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Switch",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/SwitchGroup/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/SwitchGroup",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Table/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Table",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Tabs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Tabs",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Tag/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Tag",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/TagBase/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/TagBase",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Text/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Text",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/TextField/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/TextField",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Theme/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Theme",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/ThemeToggler/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/ThemeToggler",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Timer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Timer",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/Tooltip/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/Tooltip",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/User/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/User",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/UserSelect/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/UserSelect",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/UserSelectDeprecated/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@consta/uikit/UserSelectDeprecated",
-  "version": "3.12.2",
+  "version": "3.14.0",
   "main": "index.js",
   "module": "es.js",
   "sideEffects": [

package/__internal__/cjs-src/components/BreadcrumbsCanary/Breadcrumbs.css

@@ -0,0 +1,75 @@
+.Breadcrumbs {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  color: var(--color-typo-secondary);
+  -ms-flex-wrap: wrap;
+      flex-wrap: wrap;
+}
+
+  .Breadcrumbs_size_xs {
+      --delimiter-space: var(--space-xs);
+      font-size: var(--control-text-size-xs);
+    }
+
+  .Breadcrumbs_size_s {
+      --delimiter-space: var(--space-s);
+      font-size: var(--control-text-size-s);
+    }
+
+  .Breadcrumbs_size_m {
+      --delimiter-space: var(--space-m);
+      font-size: var(--control-text-size-m);
+    }
+
+  .Breadcrumbs_size_l {
+      --delimiter-space: var(--space-l);
+      font-size: var(--control-text-size-l);
+    }
+
+  .Breadcrumbs-Item {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+  }
+
+  .Breadcrumbs-Link {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    color: var(--color-typo-secondary);
+    text-decoration: none;
+    -webkit-transition: color 0.2s;
+    transition: color 0.2s;
+  }
+
+  .Breadcrumbs-Link_active {
+      color: var(--color-typo-primary);
+      pointer-events: none;
+    }
+
+  .Breadcrumbs-Link:hover {
+      color: var(--color-typo-link-hover);
+    }
+
+  .Breadcrumbs-Icon {
+    margin-right: var(--space-xs);
+  }
+
+  .Breadcrumbs-Delimiter {
+    margin: 0 var(--delimiter-space);
+    color: var(--color-typo-ghost);
+  }
+
+  .Breadcrumbs-More {
+    color: var(--color-control-typo-clear);
+  }

package/__internal__/cjs-src/components/BreadcrumbsCanary/BreadcrumbsCanary.d.ts

@@ -0,0 +1,5 @@
+import './Breadcrumbs.css';
+import { BreadcrumbsComponent } from './types';
+export declare const cnBreadcrumbs: import("@bem-react/classname").ClassNameFormatter;
+export declare const Breadcrumbs: BreadcrumbsComponent;
+export * from './types';

package/__internal__/cjs-src/components/BreadcrumbsCanary/BreadcrumbsCanary.js

@@ -0,0 +1,57 @@
+"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 IconArrowRight_1 = require("../../icons/IconArrowRight/IconArrowRight");
+var bem_1 = require("../../utils/bem");
+var getByMap_1 = require("../../utils/getByMap");
+var Button_1 = require("../Button/Button");
+var helpers_1 = require("./helpers");
+var types_1 = require("./types");
+exports.cnBreadcrumbs = bem_1.cn('Breadcrumbs');
+var sizeMap = {
+    xs: 'xs',
+    s: 'xs',
+    m: 'xs',
+    l: 'm'
+};
+var BreadcrumbsRender = function (props, ref) {
+    var _a = helpers_1.withDefaultGetters(props), items = _a.items, getItemHref = _a.getItemHref, getItemLabel = _a.getItemLabel, getItemActive = _a.getItemActive, getItemIcon = _a.getItemIcon, getItemOnClick = _a.getItemOnClick, onItemClick = _a.onItemClick, _b = _a.size, size = _b === void 0 ? types_1.breadcrumbPropSizeDefault : _b, _c = _a.maxCount, maxCount = _c === void 0 ? 0 : _c, _d = _a.onlyIconRoot, onlyIconRoot = _d === void 0 ? false : _d, className = _a.className, restProps = tslib_1.__rest(_a, ["items", "getItemHref", "getItemLabel", "getItemActive", "getItemIcon", "getItemOnClick", "onItemClick", "size", "maxCount", "onlyIconRoot", "className"]);
+    var iconSize = getByMap_1.getByMap(sizeMap, size);
+    var _e = react_1.useMemo(function () {
+        var rest = items.slice();
+        var head = rest.splice(0, 1);
+        var tail = rest.splice(2 - maxCount);
+        return {
+            head: head,
+            tail: tail,
+            rest: rest
+        };
+    }, [items, maxCount]), head = _e.head, tail = _e.tail, rest = _e.rest;
+    var renderPages = function (items, isFirst) {
+        if (isFirst === void 0) { isFirst = false; }
+        return items.map(function (item, index) {
+            var Icon = getItemIcon(item);
+            var label = getItemLabel(item);
+            var href = getItemHref(item);
+            var active = getItemActive(item);
+            var onClick = helpers_1.getItemClick(item, getItemOnClick, onItemClick);
+            return (react_1["default"].createElement("li", { className: exports.cnBreadcrumbs('Item'), key: exports.cnBreadcrumbs('Item', { index: index, href: href }) },
+                !isFirst && react_1["default"].createElement(IconArrowRight_1.IconArrowRight, { className: exports.cnBreadcrumbs('Delimiter'), size: iconSize }),
+                react_1["default"].createElement("a", { className: exports.cnBreadcrumbs('Link', { active: active }), onClick: onClick, href: href },
+                    Icon &&
+                        (onlyIconRoot && isFirst ? (react_1["default"].createElement(Button_1.Button, { view: "clear", onlyIcon: true, iconLeft: Icon, size: iconSize })) : (react_1["default"].createElement(Icon, { className: exports.cnBreadcrumbs('Icon'), size: iconSize }))),
+                    (!isFirst || !onlyIconRoot) && react_1["default"].createElement("span", { className: exports.cnBreadcrumbs('Label') }, label))));
+        });
+    };
+    return (react_1["default"].createElement("ul", tslib_1.__assign({ className: exports.cnBreadcrumbs({ size: size }, [className]), ref: ref }, restProps),
+        renderPages(head, true),
+        maxCount && rest.length > 1 ? (react_1["default"].createElement("li", { className: exports.cnBreadcrumbs('Item') },
+            react_1["default"].createElement(IconArrowRight_1.IconArrowRight, { className: exports.cnBreadcrumbs('Delimiter'), size: iconSize }),
+            react_1["default"].createElement("span", { className: exports.cnBreadcrumbs('More') }, "..."))) : (renderPages(rest)),
+        renderPages(tail)));
+};
+exports.Breadcrumbs = react_1.forwardRef(BreadcrumbsRender);
+tslib_1.__exportStar(require("./types"), exports);

package/__internal__/cjs-src/components/BreadcrumbsCanary/helpers.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { BreadcrumbsPropGetItemActive, BreadcrumbsPropGetItemHref, BreadcrumbsPropGetItemIcon, BreadcrumbsPropGetItemLabel, BreadcrumbsPropGetItemOnClick, BreadcrumbsPropOnItemClick, BreadcrumbsProps, DefaultItem } from './types';
+export declare function withDefaultGetters<ITEM>(props: BreadcrumbsProps<ITEM>): {
+    getItemLabel: BreadcrumbsPropGetItemLabel<DefaultItem> | BreadcrumbsPropGetItemLabel<ITEM>;
+    getItemActive: BreadcrumbsPropGetItemActive<DefaultItem> | BreadcrumbsPropGetItemActive<ITEM>;
+    getItemHref: BreadcrumbsPropGetItemHref<DefaultItem> | BreadcrumbsPropGetItemHref<ITEM>;
+    getItemOnClick: BreadcrumbsPropGetItemOnClick<DefaultItem> | BreadcrumbsPropGetItemOnClick<ITEM>;
+    getItemIcon: BreadcrumbsPropGetItemIcon<DefaultItem> | BreadcrumbsPropGetItemIcon<ITEM>;
+    items: ITEM[];
+    onItemClick?: BreadcrumbsPropOnItemClick<ITEM> | undefined;
+    size?: "xs" | "s" | "m" | "l" | undefined;
+    maxCount?: number | undefined;
+    onlyIconRoot?: boolean | undefined;
+    className?: string | undefined;
+};
+export declare function getItemClick<ITEM>(item: ITEM, getItemOnClick: BreadcrumbsPropGetItemOnClick<ITEM>, onItemClick?: BreadcrumbsPropOnItemClick<ITEM>): React.MouseEventHandler;

package/__internal__/cjs-src/components/BreadcrumbsCanary/helpers.js

@@ -0,0 +1,21 @@
+"use strict";
+exports.__esModule = true;
+exports.getItemClick = exports.withDefaultGetters = void 0;
+var tslib_1 = require("tslib");
+var defaultGetItemLabel = function (item) { return item.label; };
+var defaultGetItemIcon = function (item) { return item.icon; };
+var defaultGetItemActive = function (item) { return item.active; };
+var defaultGetItemHref = function (item) { return item.href; };
+var defaultGetItemOnClick = function (item) { return item.onClick; };
+function withDefaultGetters(props) {
+    return tslib_1.__assign(tslib_1.__assign({}, props), { getItemLabel: props.getItemLabel || defaultGetItemLabel, getItemActive: props.getItemActive || defaultGetItemActive, getItemHref: props.getItemHref || defaultGetItemHref, getItemOnClick: props.getItemOnClick || defaultGetItemOnClick, getItemIcon: props.getItemIcon || defaultGetItemIcon });
+}
+exports.withDefaultGetters = withDefaultGetters;
+function getItemClick(item, getItemOnClick, onItemClick) {
+    return function (e) {
+        var _a;
+        onItemClick === null || onItemClick === void 0 ? void 0 : onItemClick({ e: e, item: item });
+        (_a = getItemOnClick(item)) === null || _a === void 0 ? void 0 : _a(e);
+    };
+}
+exports.getItemClick = getItemClick;

package/__internal__/cjs-src/components/BreadcrumbsCanary/types.d.ts

@@ -0,0 +1,36 @@
+/// <reference types="react" />
+import { IconComponent } from '../../icons/Icon/Icon';
+import { PropsWithHTMLAttributesAndRef } from '../../utils/types/PropsWithHTMLAttributes';
+export declare const breadcrumbPropSize: readonly ["m", "xs", "s", "l"];
+export declare type BreadcrumbPropSize = typeof breadcrumbPropSize[number];
+export declare const breadcrumbPropSizeDefault: "m";
+export declare type BreadcrumbsPropGetItemLabel<ITEM> = (item: ITEM) => string | React.ReactNode;
+export declare type BreadcrumbsPropGetItemActive<ITEM> = (item: ITEM) => boolean | undefined;
+export declare type BreadcrumbsPropGetItemHref<ITEM> = (item: ITEM) => string | undefined;
+export declare type BreadcrumbsPropGetItemIcon<ITEM> = (item: ITEM) => IconComponent | undefined;
+export declare type BreadcrumbsPropGetItemOnClick<ITEM> = (item: ITEM) => React.MouseEventHandler | undefined;
+export declare type BreadcrumbsPropOnItemClick<ITEM> = (props: {
+    item: ITEM;
+    e: React.MouseEvent;
+}) => void;
+export declare type DefaultItem = {
+    label: string;
+    active?: boolean;
+    icon?: IconComponent;
+    href?: string;
+    onClick?: React.MouseEventHandler<HTMLAnchorElement>;
+};
+export declare type BreadcrumbsProps<ITEM = DefaultItem> = {
+    items: ITEM[];
+    getItemLabel?: BreadcrumbsPropGetItemLabel<ITEM>;
+    getItemActive?: BreadcrumbsPropGetItemActive<ITEM>;
+    getItemHref?: BreadcrumbsPropGetItemHref<ITEM>;
+    getItemIcon?: BreadcrumbsPropGetItemIcon<ITEM>;
+    getItemOnClick?: BreadcrumbsPropGetItemOnClick<ITEM>;
+    onItemClick?: BreadcrumbsPropOnItemClick<ITEM>;
+    size?: BreadcrumbPropSize;
+    maxCount?: number;
+    onlyIconRoot?: boolean;
+    className?: string;
+};
+export declare type BreadcrumbsComponent = <ITEM>(props: PropsWithHTMLAttributesAndRef<BreadcrumbsProps<ITEM>, HTMLUListElement>) => React.ReactElement | null;

package/__internal__/cjs-src/components/BreadcrumbsCanary/types.js

@@ -0,0 +1,5 @@
+"use strict";
+exports.__esModule = true;
+exports.breadcrumbPropSizeDefault = exports.breadcrumbPropSize = void 0;
+exports.breadcrumbPropSize = ['m', 'xs', 's', 'l'];
+exports.breadcrumbPropSizeDefault = exports.breadcrumbPropSize[0];