@alfalab/core-components 45.6.0-beta.1 → 45.6.0-beta.2

package/sortable-list/cssm/components/item/Components.js

@@ -1,50 +1,40 @@
-Object.defineProperty(exports, '__esModule', { value: true });
+import React from 'react';
+import { useSortable } from '@dnd-kit/sortable';
+import { CSS } from '@dnd-kit/utilities';
+import cn from 'classnames';
+import { getDataTestId } from '../../../../shared/cssm';
+import { DragMIcon } from '@alfalab/icons-glyph/DragMIcon';
 
-var tslib = require('tslib');
-var React = require('react');
-var sortable = require('@dnd-kit/sortable');
-var utilities = require('@dnd-kit/utilities');
-var cn = require('classnames');
-var coreComponentsShared = require('../../../../shared/cssm');
-var DragMIcon = require('@alfalab/icons-glyph/DragMIcon');
-var styles = require('./index.module.css');
+const styles = {"component":"component","icon":"icon","activator-cell":"activator-cell","disabled":"disabled","dragOverlay":"dragOverlay","activator-control":"activator-control","content":"content","dragging":"dragging","pop":"pop","control-left-padding-3xs":"control-left-padding-3xs","control-right-padding-3xs":"control-right-padding-3xs","control-left-padding-2xs":"control-left-padding-2xs","control-right-padding-2xs":"control-right-padding-2xs","control-left-padding-xs":"control-left-padding-xs","control-right-padding-xs":"control-right-padding-xs","control-left-padding-s":"control-left-padding-s","control-right-padding-s":"control-right-padding-s","control-left-padding-m":"control-left-padding-m","control-right-padding-m":"control-right-padding-m","control-left-padding-l":"control-left-padding-l","control-right-padding-l":"control-right-padding-l"};
+require('./index.css');
 
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
-var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
-
-var SortableItem = function (_a) {
-    var _b;
-    var activatorNode = _a.activatorNode, controlPosition = _a.controlPosition, controlPadding = _a.controlPadding, children = _a.children, className = _a.className, contentClassName = _a.contentClassName, id = _a.id, isDragOverlay = _a.isDragOverlay, disabled = _a.disabled, dataTestId = _a.dataTestId;
-    var _c = sortable.useSortable({
-        id: id,
-        disabled: disabled,
-    }), attributes = _c.attributes, listeners = _c.listeners, setNodeRef = _c.setNodeRef, setActivatorNodeRef = _c.setActivatorNodeRef, transform = _c.transform, transition = _c.transition, isDragging = _c.isDragging;
-    var isCellActivator = !isDragOverlay && activatorNode === 'cell';
-    var isControlActivator = !isDragOverlay && activatorNode === 'control';
-    var renderControl = function () {
-        var _a;
-        var hasRightPadding = controlPadding && controlPosition === 'right';
-        var hasLeftPadding = controlPadding && controlPosition === 'left';
-        return (React__default.default.createElement("div", tslib.__assign({ className: cn__default.default(styles__default.default.icon, (_a = {},
-                _a[styles__default.default["control-right-padding-".concat(controlPadding)]] = hasRightPadding,
-                _a[styles__default.default["control-left-padding-".concat(controlPadding)]] = hasLeftPadding,
-                _a)), ref: isControlActivator ? setActivatorNodeRef : undefined }, (isControlActivator ? listeners : null), (isControlActivator ? attributes : null)),
-            React__default.default.createElement(DragMIcon.DragMIcon, { "aria-label": 'drag control' })));
+const SortableItem = ({ activatorNode, controlPosition, controlPadding, children, className, contentClassName, id, isDragOverlay, disabled, dataTestId, }) => {
+    const { attributes, listeners, setNodeRef, setActivatorNodeRef, transform, transition, isDragging, } = useSortable({
+        id,
+        disabled,
+    });
+    const isCellActivator = !isDragOverlay && activatorNode === 'cell';
+    const isControlActivator = !isDragOverlay && activatorNode === 'control';
+    const renderControl = () => {
+        const hasRightPadding = controlPadding && controlPosition === 'right';
+        const hasLeftPadding = controlPadding && controlPosition === 'left';
+        return (React.createElement("div", { className: cn(styles.icon, {
+                [styles[`control-right-padding-${controlPadding}`]]: hasRightPadding,
+                [styles[`control-left-padding-${controlPadding}`]]: hasLeftPadding,
+            }), ref: isControlActivator ? setActivatorNodeRef : undefined, ...(isControlActivator ? listeners : null), ...(isControlActivator ? attributes : null) },
+            React.createElement(DragMIcon, { "aria-label": 'drag control' })));
     };
-    return (React__default.default.createElement("div", tslib.__assign({}, (isCellActivator ? listeners : null), (isCellActivator ? attributes : null), { style: {
-            transform: utilities.CSS.Transform.toString(transform),
-            transition: transition,
-        }, className: cn__default.default(styles__default.default.component, styles__default.default["activator-".concat(activatorNode)], className, (_b = {},
-            _b[styles__default.default.disabled] = disabled,
-            _b[styles__default.default.dragging] = isDragging,
-            _b[styles__default.default.dragOverlay] = isDragOverlay,
-            _b)), ref: setNodeRef, "data-test-id": coreComponentsShared.getDataTestId(dataTestId, "item_".concat(id)) }),
+    return (React.createElement("div", { ...(isCellActivator ? listeners : null), ...(isCellActivator ? attributes : null), style: {
+            transform: CSS.Transform.toString(transform),
+            transition,
+        }, className: cn(styles.component, styles[`activator-${activatorNode}`], className, {
+            [styles.disabled]: disabled,
+            [styles.dragging]: isDragging,
+            [styles.dragOverlay]: isDragOverlay,
+        }), ref: setNodeRef, "data-test-id": getDataTestId(dataTestId, `item_${id}`) },
         controlPosition === 'left' && renderControl(),
-        React__default.default.createElement("div", { className: cn__default.default(styles__default.default.content, contentClassName) }, children),
+        React.createElement("div", { className: cn(styles.content, contentClassName) }, children),
         controlPosition === 'right' && renderControl()));
 };
 
-exports.SortableItem = SortableItem;
+export { SortableItem };

package/sortable-list/cssm/index.js

@@ -1,7 +1,11 @@
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var Component = require('./Component.js');
-
-
-
-exports.SortableList = Component.SortableList;
+export { SortableList } from './Component.js';
+import 'react';
+import '@dnd-kit/core';
+import '@dnd-kit/sortable';
+import 'classnames';
+import '../../portal/cssm';
+import '../../shared/cssm';
+import './components/item/Components.js';
+import '@dnd-kit/utilities';
+import '@alfalab/icons-glyph/DragMIcon';
+import './utils.js';

package/sortable-list/cssm/shared/index.js

@@ -1,7 +1,2 @@
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var utils = require('../utils.js');
-
-
-
-exports.getSortableListTestIds = utils.getSortableListTestIds;
+export { getSortableListTestIds } from '../utils.js';
+import '../../../shared/cssm';

package/sortable-list/cssm/utils.js

@@ -1,17 +1,15 @@
-Object.defineProperty(exports, '__esModule', { value: true });
+import { getDataTestId } from '../../shared/cssm';
 
-var tslib = require('tslib');
-var coreComponentsShared = require('../../shared/cssm');
-
-var restrictToParentElement = function (_a) {
-    var containerNodeRect = _a.containerNodeRect, draggingNodeRect = _a.draggingNodeRect, transform = _a.transform;
+const restrictToParentElement = ({ containerNodeRect, draggingNodeRect, transform, }) => {
     if (!draggingNodeRect || !containerNodeRect) {
         return transform;
     }
     return restrictToBoundingRect(transform, draggingNodeRect, containerNodeRect);
 };
 function restrictToBoundingRect(transform, rect, boundingRect) {
-    var value = tslib.__assign({}, transform);
+    const value = {
+        ...transform,
+    };
     if (rect.top + transform.y <= boundingRect.top) {
         value.y = boundingRect.top - rect.top;
     }
@@ -26,18 +24,15 @@ function restrictToBoundingRect(transform, rect, boundingRect) {
     }
     return value;
 }
-var restrictToVerticalAxis = function (_a) {
-    var transform = _a.transform;
-    return (tslib.__assign(tslib.__assign({}, transform), { x: 0 }));
-};
+const restrictToVerticalAxis = ({ transform }) => ({
+    ...transform,
+    x: 0,
+});
 function getSortableListTestIds(dataTestId, index) {
     return {
-        sortableList: coreComponentsShared.getDataTestId(dataTestId, 'container'),
-        item: coreComponentsShared.getDataTestId(dataTestId, "item_".concat(index)),
+        sortableList: getDataTestId(dataTestId, 'container'),
+        item: getDataTestId(dataTestId, `item_${index}`),
     };
 }
 
-exports.getSortableListTestIds = getSortableListTestIds;
-exports.restrictToBoundingRect = restrictToBoundingRect;
-exports.restrictToParentElement = restrictToParentElement;
-exports.restrictToVerticalAxis = restrictToVerticalAxis;
+export { getSortableListTestIds, restrictToBoundingRect, restrictToParentElement, restrictToVerticalAxis };

package/space/cssm/Component.js

@@ -1,58 +1,49 @@
-Object.defineProperty(exports, '__esModule', { value: true });
+import React__default, { forwardRef, Children } from 'react';
+import cn from 'classnames';
+import Item from './Item.js';
 
-var tslib = require('tslib');
-var React = require('react');
-var cn = require('classnames');
-var Item = require('./Item.js');
-var styles = require('./index.module.css');
+const styles = {"spaceContainer":"spaceContainer","spaceContainerFullWidth":"spaceContainerFullWidth","vertical":"vertical","center":"center","start":"start","end":"end","spaceItemFullWidth":"spaceItemFullWidth","spaceItem":"spaceItem","wrap":"wrap","divider":"divider"};
+require('./index.css');
 
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
-var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
-
-var SpaceSizes = {
+const SpaceSizes = {
     s: 12,
     m: 16,
     l: 20,
 };
-var getNumberSize = function (size) { return (typeof size === 'string' ? SpaceSizes[size] : size || 0); };
+const getNumberSize = (size) => (typeof size === 'string' ? SpaceSizes[size] : size || 0);
 /**
  * Позаимствовано с благодарностью из Ant Design
  */
-var Space = React.forwardRef(function (props, ref) {
-    var _a, _b, _c;
-    var children = props.children, className = props.className, _d = props.align, align = _d === void 0 ? 'start' : _d, _e = props.direction, direction = _e === void 0 ? 'vertical' : _e, _f = props.size, size = _f === void 0 ? 'm' : _f, _g = props.wrap, wrap = _g === void 0 ? false : _g, _h = props.divider, divider = _h === void 0 ? false : _h, _j = props.fullWidth, fullWidth = _j === void 0 ? false : _j, dataTestId = props.dataTestId, _k = props.useCssGaps, useCssGaps = _k === void 0 ? false : _k;
-    var _l = React__default.default.useMemo(function () {
-        return (Array.isArray(size) ? size : [size, size]).map(function (item) {
-            return getNumberSize(item);
-        });
-    }, [size]), horizontalSize = _l[0], verticalSize = _l[1];
-    var childNodes = React.Children.toArray(children);
+const Space = forwardRef((props, ref) => {
+    const { children, className, align = 'start', direction = 'vertical', size = 'm', wrap = false, divider = false, fullWidth = false, dataTestId, useCssGaps = false, } = props;
+    const [horizontalSize, verticalSize] = React__default.useMemo(() => (Array.isArray(size) ? size : [size, size]).map((item) => getNumberSize(item)), [size]);
+    const childNodes = Children.toArray(children);
     if (childNodes.length === 0) {
         return null;
     }
-    var directionClassName = styles__default.default[direction];
-    var alignClassName = styles__default.default[align];
-    var containerClassName = cn__default.default(styles__default.default.spaceContainer, directionClassName, (_a = {},
-        _a[alignClassName] = align,
-        _a[styles__default.default.spaceContainerFullWidth] = fullWidth,
-        _a), className);
-    var itemClassName = cn__default.default(styles__default.default.spaceItem, (_b = {},
-        _b[styles__default.default.spaceItemFullWidth] = fullWidth,
-        _b));
-    var nodes = childNodes.map(function (child, i) { return (
+    const directionClassName = styles[direction];
+    const alignClassName = styles[align];
+    const containerClassName = cn(styles.spaceContainer, directionClassName, {
+        [alignClassName]: align,
+        [styles.spaceContainerFullWidth]: fullWidth,
+    }, className);
+    const itemClassName = cn(styles.spaceItem, {
+        [styles.spaceItemFullWidth]: fullWidth,
+    });
+    const nodes = childNodes.map((child, i) => (
     /* eslint-disable react/no-array-index-key */
-    React__default.default.createElement(Item, { className: itemClassName, dividerClassName: styles__default.default.divider, key: "".concat(itemClassName, "-").concat(i), direction: direction, horizontalSize: horizontalSize, verticalSize: verticalSize, length: childNodes.length, index: i, wrap: wrap, divider: divider, useCssGaps: useCssGaps }, child)
+    React__default.createElement(Item, { className: itemClassName, dividerClassName: styles.divider, key: `${itemClassName}-${i}`, direction: direction, horizontalSize: horizontalSize, verticalSize: verticalSize, length: childNodes.length, index: i, wrap: wrap, divider: divider, useCssGaps: useCssGaps }, child)
     /* eslint-enable */
-    ); });
-    return (React__default.default.createElement("div", { "data-test-id": dataTestId, className: cn__default.default(containerClassName, (_c = {},
-            _c[styles__default.default.wrap] = useCssGaps && wrap,
-            _c)), style: tslib.__assign(tslib.__assign({}, (useCssGaps && {
-            columnGap: horizontalSize / (divider ? 2 : 1),
-            rowGap: verticalSize / (divider ? 2 : 1),
-        })), (wrap && !useCssGaps && { flexWrap: 'wrap', marginBottom: -verticalSize })), ref: ref }, nodes));
+    ));
+    return (React__default.createElement("div", { "data-test-id": dataTestId, className: cn(containerClassName, {
+            [styles.wrap]: useCssGaps && wrap,
+        }), style: {
+            ...(useCssGaps && {
+                columnGap: horizontalSize / (divider ? 2 : 1),
+                rowGap: verticalSize / (divider ? 2 : 1),
+            }),
+            ...(wrap && !useCssGaps && { flexWrap: 'wrap', marginBottom: -verticalSize }),
+        }, ref: ref }, nodes));
 });
 
-exports.Space = Space;
+export { Space };

package/space/cssm/Item.js

@@ -1,29 +1,8 @@
-var tslib = require('tslib');
-var React = require('react');
+import * as React from 'react';
 
-function _interopNamespaceCompat(e) {
-    if (e && typeof e === 'object' && 'default' in e) return e;
-    var n = Object.create(null);
-    if (e) {
-        Object.keys(e).forEach(function (k) {
-            if (k !== 'default') {
-                var d = Object.getOwnPropertyDescriptor(e, k);
-                Object.defineProperty(n, k, d.get ? d : {
-                    enumerable: true,
-                    get: function () { return e[k]; }
-                });
-            }
-        });
-    }
-    n.default = e;
-    return Object.freeze(n);
-}
-
-var React__namespace = /*#__PURE__*/_interopNamespaceCompat(React);
-
-var Item = function (props) {
-    var className = props.className, dividerClassName = props.dividerClassName, horizontalSize = props.horizontalSize, verticalSize = props.verticalSize, length = props.length, direction = props.direction, index = props.index, children = props.children, divider = props.divider, wrap = props.wrap, useCssGaps = props.useCssGaps;
-    var style;
+const Item = (props) => {
+    const { className, dividerClassName, horizontalSize, verticalSize, length, direction, index, children, divider, wrap, useCssGaps, } = props;
+    let style;
     if (!useCssGaps) {
         if (direction === 'vertical') {
             if (index < length - 1) {
@@ -31,15 +10,18 @@ var Item = function (props) {
             }
         }
         else {
-            style = tslib.__assign(tslib.__assign({}, (index < length - 1 && { marginRight: horizontalSize / (divider ? 2 : 1) })), (wrap && { paddingBottom: verticalSize }));
+            style = {
+                ...(index < length - 1 && { marginRight: horizontalSize / (divider ? 2 : 1) }),
+                ...(wrap && { paddingBottom: verticalSize }),
+            };
         }
     }
     if (children === null || children === undefined) {
         return null;
     }
-    return (React__namespace.createElement(React__namespace.Fragment, null,
-        React__namespace.createElement("div", { className: className, style: style }, children),
-        index < length - 1 && divider && (React__namespace.createElement("span", { className: dividerClassName, style: style }, divider))));
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: className, style: style }, children),
+        index < length - 1 && divider && (React.createElement("span", { className: dividerClassName, style: style }, divider))));
 };
 
-module.exports = Item;
+export { Item as default };

package/space/cssm/index.js

@@ -1,7 +1,4 @@
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var Component = require('./Component.js');
-
-
-
-exports.Space = Component.Space;
+export { Space } from './Component.js';
+import 'react';
+import 'classnames';
+import './Item.js';

package/space/cssm/utils.js

@@ -1,15 +1,9 @@
-Object.defineProperty(exports, '__esModule', { value: true });
+import React__default from 'react';
 
-var React = require('react');
-
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-
-var SpaceContext = React__default.default.createContext({
+const SpaceContext = React__default.createContext({
     length: 0,
     horizontalSize: 0,
     verticalSize: 0,
 });
 
-exports.SpaceContext = SpaceContext;
+export { SpaceContext };

package/spinner/cssm/Component.js

@@ -1,25 +1,21 @@
-Object.defineProperty(exports, '__esModule', { value: true });
+import React from 'react';
+import cn from 'classnames';
+import { useId } from '@alfalab/hooks';
 
-var React = require('react');
-var cn = require('classnames');
-var hooks = require('@alfalab/hooks');
-var defaultColors = require('./default.module.css');
-var styles = require('./index.module.css');
-var invertedColors = require('./inverted.module.css');
+const defaultColors = {"component":"component"};
+require('./default.css');
 
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+const styles = {"spinner":"spinner","spin_animation":"spin_animation","visible":"visible","size-16":"size-16","size-24":"size-24","size-48":"size-48"};
+require('./index.css');
 
-var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
-var defaultColors__default = /*#__PURE__*/_interopDefaultCompat(defaultColors);
-var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
-var invertedColors__default = /*#__PURE__*/_interopDefaultCompat(invertedColors);
+const invertedColors = {"component":"component"};
+require('./inverted.css');
 
-var colorStyles = {
-    default: defaultColors__default.default,
-    inverted: invertedColors__default.default,
+const colorStyles = {
+    default: defaultColors,
+    inverted: invertedColors,
 };
-var CONFIG = {
+const CONFIG = {
     xs: {
         padding: 1,
         lineWidth: 2,
@@ -51,7 +47,7 @@ var CONFIG = {
         size: 48,
     },
 };
-var SIZE_TO_CLASSNAME_MAP = {
+const SIZE_TO_CLASSNAME_MAP = {
     xs: 'size-16',
     s: 'size-24',
     m: 'size-48',
@@ -59,32 +55,29 @@ var SIZE_TO_CLASSNAME_MAP = {
     24: 'size-24',
     48: 'size-48',
 };
-var Spinner = function (_a) {
-    var _b;
-    var _c = _a.size, sizeProp = _c === void 0 ? 24 : _c, _d = _a.colors, colors = _d === void 0 ? 'default' : _d, visible = _a.visible, id = _a.id, className = _a.className, dataTestId = _a.dataTestId;
-    var uniqId = hooks.useId();
-    var _e = CONFIG[sizeProp], size = _e.size, padding = _e.padding, lineWidth = _e.lineWidth;
-    var xStart = padding + lineWidth / 2;
-    var xEnd = size - xStart;
-    var y = size / 2;
-    var r = y - xStart;
-    var topGradientId = "".concat(uniqId, "_top");
-    var bottomGradientId = "".concat(uniqId, "_bottom");
-    return (React__default.default.createElement("svg", { viewBox: "0 0 ".concat(size, " ").concat(size), fill: 'none', xmlns: 'http://www.w3.org/2000/svg', className: cn__default.default(styles__default.default.spinner, colorStyles[colors].component, styles__default.default[SIZE_TO_CLASSNAME_MAP[sizeProp]], className, (_b = {},
-            _b[styles__default.default.visible] = visible,
-            _b)), "data-test-id": dataTestId, id: id },
-        React__default.default.createElement("defs", null,
-            React__default.default.createElement("linearGradient", { id: topGradientId, x1: '0.05' },
-                React__default.default.createElement("stop", { offset: '0.1', stopOpacity: '0', stopColor: 'currentColor' }),
-                React__default.default.createElement("stop", { offset: '1', stopOpacity: '0.3', stopColor: 'currentColor' })),
-            React__default.default.createElement("linearGradient", { id: bottomGradientId, x1: '0.05' },
-                React__default.default.createElement("stop", { offset: '0', stopOpacity: '1', stopColor: 'currentColor' }),
-                React__default.default.createElement("stop", { offset: '1', stopOpacity: '0.3', stopColor: 'currentColor' }))),
-        React__default.default.createElement("g", { strokeWidth: lineWidth },
-            React__default.default.createElement("path", { stroke: "url(#".concat(topGradientId, ")"), d: "M".concat(xStart, ",").concat(y, " A").concat(r, ",").concat(r, " 0 0 1 ").concat(xEnd, ",").concat(y) }),
-            React__default.default.createElement("path", { stroke: "url(#".concat(bottomGradientId, ")"), d: "M".concat(xEnd, ",").concat(y, " A").concat(r, ",").concat(r, " 0 0 1 ").concat(xStart, ",").concat(y) }),
-            React__default.default.createElement("path", { stroke: 'currentColor', strokeLinecap: 'round', d: "M".concat(xStart, ",").concat(y, " A").concat(r, ",").concat(r, " 0 0 1 ").concat(xStart, " ").concat(y) }))));
+const Spinner = ({ size: sizeProp = 24, colors = 'default', visible, id, className, dataTestId, }) => {
+    const uniqId = useId();
+    const { size, padding, lineWidth } = CONFIG[sizeProp];
+    const xStart = padding + lineWidth / 2;
+    const xEnd = size - xStart;
+    const y = size / 2;
+    const r = y - xStart;
+    const topGradientId = `${uniqId}_top`;
+    const bottomGradientId = `${uniqId}_bottom`;
+    return (React.createElement("svg", { viewBox: `0 0 ${size} ${size}`, fill: 'none', xmlns: 'http://www.w3.org/2000/svg', className: cn(styles.spinner, colorStyles[colors].component, styles[SIZE_TO_CLASSNAME_MAP[sizeProp]], className, {
+            [styles.visible]: visible,
+        }), "data-test-id": dataTestId, id: id },
+        React.createElement("defs", null,
+            React.createElement("linearGradient", { id: topGradientId, x1: '0.05' },
+                React.createElement("stop", { offset: '0.1', stopOpacity: '0', stopColor: 'currentColor' }),
+                React.createElement("stop", { offset: '1', stopOpacity: '0.3', stopColor: 'currentColor' })),
+            React.createElement("linearGradient", { id: bottomGradientId, x1: '0.05' },
+                React.createElement("stop", { offset: '0', stopOpacity: '1', stopColor: 'currentColor' }),
+                React.createElement("stop", { offset: '1', stopOpacity: '0.3', stopColor: 'currentColor' }))),
+        React.createElement("g", { strokeWidth: lineWidth },
+            React.createElement("path", { stroke: `url(#${topGradientId})`, d: `M${xStart},${y} A${r},${r} 0 0 1 ${xEnd},${y}` }),
+            React.createElement("path", { stroke: `url(#${bottomGradientId})`, d: `M${xEnd},${y} A${r},${r} 0 0 1 ${xStart},${y}` }),
+            React.createElement("path", { stroke: 'currentColor', strokeLinecap: 'round', d: `M${xStart},${y} A${r},${r} 0 0 1 ${xStart} ${y}` }))));
 };
 
-exports.SIZE_TO_CLASSNAME_MAP = SIZE_TO_CLASSNAME_MAP;
-exports.Spinner = Spinner;
+export { SIZE_TO_CLASSNAME_MAP, Spinner };

package/spinner/cssm/index.js

@@ -1,8 +1,4 @@
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var Component = require('./Component.js');
-
-
-
-exports.SIZE_TO_CLASSNAME_MAP = Component.SIZE_TO_CLASSNAME_MAP;
-exports.Spinner = Component.Spinner;
+export { SIZE_TO_CLASSNAME_MAP, Spinner } from './Component.js';
+import 'react';
+import 'classnames';
+import '@alfalab/hooks';

package/stack/cssm/component.js

@@ -1,18 +1,11 @@
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var context = require('./context.js');
-
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-
-var Stack = function (_a) {
-    var children = _a.children, _b = _a.value, value = _b === void 0 ? context.stackingOrder.DEFAULT : _b;
-    var previousValue = React.useContext(context.StackingContext);
-    var currentValue = Math.max(value, previousValue);
-    var nextValue = currentValue + 1;
-    return (React__default.default.createElement(context.StackingContext.Provider, { value: nextValue }, children(currentValue)));
+import React, { useContext } from 'react';
+import { StackingContext, stackingOrder } from './context.js';
+
+const Stack = ({ children, value = stackingOrder.DEFAULT }) => {
+    const previousValue = useContext(StackingContext);
+    const currentValue = Math.max(value, previousValue);
+    const nextValue = currentValue + 1;
+    return (React.createElement(StackingContext.Provider, { value: nextValue }, children(currentValue)));
 };
 
-exports.Stack = Stack;
+export { Stack };

package/stack/cssm/context.js

@@ -1,12 +1,10 @@
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
+import { createContext } from 'react';
 
 /**
  * Набор констант для z-index соответствующих классов компонентов.
  * Значения выбраны по приоритету.
  */
-var stackingOrder = {
+const stackingOrder = {
     /**
      * Для компонентов с возможностью фокуса: кнопки, поля ввода
      */
@@ -28,7 +26,6 @@ var stackingOrder = {
      */
     TOAST: 1000,
 };
-var StackingContext = React.createContext(stackingOrder.DEFAULT);
+const StackingContext = createContext(stackingOrder.DEFAULT);
 
-exports.StackingContext = StackingContext;
-exports.stackingOrder = stackingOrder;
+export { StackingContext, stackingOrder };

package/stack/cssm/index.js

@@ -1,10 +1,3 @@
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var context = require('./context.js');
-var component = require('./component.js');
-
-
-
-exports.StackingContext = context.StackingContext;
-exports.stackingOrder = context.stackingOrder;
-exports.Stack = component.Stack;
+export { StackingContext, stackingOrder } from './context.js';
+export { Stack } from './component.js';
+import 'react';

package/status/cssm/Component.js

@@ -1,20 +1,10 @@
-Object.defineProperty(exports, '__esModule', { value: true });
+import React from 'react';
+import cn from 'classnames';
 
-var React = require('react');
-var cn = require('classnames');
-var styles = require('./index.module.css');
+const styles = {"component":"component","soft":"soft","green":"green","orange":"orange","red":"red","blue":"blue","grey":"grey","teal":"teal","purple":"purple","contrast":"contrast"};
+require('./index.css');
 
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+const colors = ['green', 'orange', 'red', 'blue', 'grey', 'teal', 'purple'];
+const Status = ({ className, view = 'soft', color = 'green', children, dataTestId, }) => (React.createElement("span", { className: cn(styles.component, styles[color], styles[view], className), "data-test-id": dataTestId }, children));
 
-var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
-var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
-
-var colors = ['green', 'orange', 'red', 'blue', 'grey', 'teal', 'purple'];
-var Status = function (_a) {
-    var className = _a.className, _b = _a.view, view = _b === void 0 ? 'soft' : _b, _c = _a.color, color = _c === void 0 ? 'green' : _c, children = _a.children, dataTestId = _a.dataTestId;
-    return (React__default.default.createElement("span", { className: cn__default.default(styles__default.default.component, styles__default.default[color], styles__default.default[view], className), "data-test-id": dataTestId }, children));
-};
-
-exports.Status = Status;
-exports.colors = colors;
+export { Status, colors };

package/status/cssm/index.js

@@ -1,8 +1,3 @@
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var Component = require('./Component.js');
-
-
-
-exports.Status = Component.Status;
-exports.colors = Component.colors;
+export { Status, colors } from './Component.js';
+import 'react';
+import 'classnames';