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

package/number-input/cssm/utils.js

@@ -1,19 +1,22 @@
-import { maskitoTransform } from '@maskito/core';
-import { getDataTestId, fnUtils } from '../../shared/cssm';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var core = require('@maskito/core');
+var coreComponentsShared = require('../../shared/cssm');
 
 /* eslint-disable no-param-reassign */
-const MINUS_SIGN = '-';
-const SEPARATORS = [',', '.'];
-const MAX_SAFE_INTEGER = 2 ** 53 - 1;
-const MIN_SAFE_INTEGER = -MAX_SAFE_INTEGER;
-const MAX_DIGITS = 15; // с 16 уже упираемся в MAX_SAFE_INTEGER
-function parseNumber(value = '') {
+var MINUS_SIGN = '-';
+var SEPARATORS = [',', '.'];
+var MAX_SAFE_INTEGER = Math.pow(2, 53) - 1;
+var MIN_SAFE_INTEGER = -MAX_SAFE_INTEGER;
+var MAX_DIGITS = 15; // с 16 уже упираемся в MAX_SAFE_INTEGER
+function parseNumber(value) {
+    if (value === void 0) { value = ''; }
     if (typeof value === 'number')
         return value;
-    const pseudoSeparatorsRegExp = new RegExp(`[${SEPARATORS.join('')}]`, 'gi');
+    var pseudoSeparatorsRegExp = new RegExp("[".concat(SEPARATORS.join(''), "]"), 'gi');
     return value
         ? parseFloat(value
-            .replace(new RegExp(`[^${MINUS_SIGN}${SEPARATORS.join('')}0-9]`, 'gi'), '')
+            .replace(new RegExp("[^".concat(MINUS_SIGN).concat(SEPARATORS.join(''), "0-9]"), 'gi'), '')
             .replace(pseudoSeparatorsRegExp, '.'))
         : NaN;
 }
@@ -21,60 +24,63 @@ function parseNumber(value = '') {
  * Преобразовать число в строку с заменой экспоненты на десятичную дробь
  */
 function stringifyNumberWithoutExp(value) {
-    const valueString = String(value);
-    const [numberPart, expPart] = valueString.split('e-');
-    let valueWithoutExp = valueString;
+    var valueString = String(value);
+    var _a = valueString.split('e-'), numberPart = _a[0], expPart = _a[1];
+    var valueWithoutExp = valueString;
     if (expPart) {
-        const [, fractionalPart] = numberPart.split('.');
-        const decimalDigits = Number(expPart) + (fractionalPart?.length || 0);
+        var _b = numberPart.split('.'), fractionalPart = _b[1];
+        var decimalDigits = Number(expPart) + ((fractionalPart === null || fractionalPart === void 0 ? void 0 : fractionalPart.length) || 0);
         valueWithoutExp = value.toFixed(decimalDigits);
     }
     return valueWithoutExp;
 }
-const getNumberRegExp = (min, fractionLength) => {
-    let reStr = '[0-9]*';
+var getNumberRegExp = function (min, fractionLength) {
+    var reStr = '[0-9]*';
     if (min < 0) {
-        reStr = `(\\${MINUS_SIGN})?${reStr}`;
+        reStr = "(\\".concat(MINUS_SIGN, ")?").concat(reStr);
     }
     if (fractionLength !== 0) {
-        reStr = `${reStr}[${SEPARATORS.map((s) => `\\${s}`).join('')}]?[0-9]{0,${fractionLength || MAX_DIGITS}}`;
+        reStr = "".concat(reStr, "[").concat(SEPARATORS.map(function (s) { return "\\".concat(s); }).join(''), "]?[0-9]{0,").concat(fractionLength || MAX_DIGITS, "}");
     }
-    return new RegExp(`^${reStr}$`);
+    return new RegExp("^".concat(reStr, "$"));
 };
-function createMaskOptions({ separator, fractionLength, min, max, }) {
+function createMaskOptions(_a) {
+    var separator = _a.separator, fractionLength = _a.fractionLength, min = _a.min, max = _a.max;
     return {
         mask: getNumberRegExp(min, fractionLength),
         preprocessors: [
             createPseudoSeparatorPreprocessor(separator),
-            createNotEmptyIntegerPartPreprocessor({ separator, fractionLength }),
+            createNotEmptyIntegerPartPreprocessor({ separator: separator, fractionLength: fractionLength }),
             createZeroFractionLengthPreprocessor(fractionLength, separator),
             createRepeatedSeparatorPreprocessor(separator),
         ],
         postprocessors: [
             createLeadingZeroesValidationPostprocessor(separator),
-            createMinMaxPostprocessor({ min, max, separator }),
+            createMinMaxPostprocessor({ min: min, max: max, separator: separator }),
         ],
-        plugins: [createNotEmptyPartsPlugin(separator), createMinMaxPlugin({ min, max })],
+        plugins: [createNotEmptyPartsPlugin(separator), createMinMaxPlugin({ min: min, max: max })],
     };
 }
 /**
  *  Заполняет целочисленную часть при вводе separator.
  *  @example Type , => 0,
  */
-function createNotEmptyIntegerPartPreprocessor({ separator, fractionLength, }) {
-    const startWithDecimalSepRegExp = new RegExp(`^\\D*\\${separator}`);
-    return ({ elementState, data }) => {
-        const { value, selection } = elementState;
-        const [from] = selection;
+function createNotEmptyIntegerPartPreprocessor(_a) {
+    var separator = _a.separator, fractionLength = _a.fractionLength;
+    var startWithDecimalSepRegExp = new RegExp("^\\D*\\".concat(separator));
+    return function (_a) {
+        var elementState = _a.elementState, data = _a.data;
+        var value = elementState.value, selection = elementState.selection;
+        var from = selection[0];
         if (fractionLength <= 0 ||
             value.includes(separator) ||
             !data.match(startWithDecimalSepRegExp)) {
-            return { elementState, data };
+            return { elementState: elementState, data: data };
         }
-        const digitsBeforeCursor = value.slice(0, from).match(/\d+/);
+        var digitsBeforeCursor = value.slice(0, from).match(/\d+/);
         return {
-            elementState,
-            data: digitsBeforeCursor ? data : `0${data}`,
+            elementState: elementState,
+            data: digitsBeforeCursor ? data : "0".concat(data),
         };
     };
 }
@@ -82,12 +88,13 @@ function createNotEmptyIntegerPartPreprocessor({ separator, fractionLength, }) {
  * Не позволяет вводить невалидный разделитель.
  */
 function createPseudoSeparatorPreprocessor(separator) {
-    const pseudoSeparatorsRegExp = new RegExp(`[${SEPARATORS.join('')}]`, 'gi');
-    return ({ elementState, data }) => {
-        const { value, selection } = elementState;
+    var pseudoSeparatorsRegExp = new RegExp("[".concat(SEPARATORS.join(''), "]"), 'gi');
+    return function (_a) {
+        var elementState = _a.elementState, data = _a.data;
+        var value = elementState.value, selection = elementState.selection;
         return {
             elementState: {
-                selection,
+                selection: selection,
                 value: value.replace(pseudoSeparatorsRegExp, separator),
             },
             data: data.replace(pseudoSeparatorsRegExp, separator),
@@ -100,13 +107,14 @@ function createPseudoSeparatorPreprocessor(separator) {
  */
 function createZeroFractionLengthPreprocessor(fractionLength, separator) {
     if (fractionLength > 0) {
-        return (state) => state;
+        return function (state) { return state; };
     }
-    const decimalPartRegExp = new RegExp(`\\${separator}.*$`, 'g');
-    return ({ elementState, data }) => {
-        const { value, selection } = elementState;
-        const [from, to] = selection;
-        const newValue = value.replace(decimalPartRegExp, '');
+    var decimalPartRegExp = new RegExp("\\".concat(separator, ".*$"), 'g');
+    return function (_a) {
+        var elementState = _a.elementState, data = _a.data;
+        var value = elementState.value, selection = elementState.selection;
+        var from = selection[0], to = selection[1];
+        var newValue = value.replace(decimalPartRegExp, '');
         return {
             elementState: {
                 selection: [Math.min(from, newValue.length), Math.min(to, newValue.length)],
@@ -120,14 +128,15 @@ function createZeroFractionLengthPreprocessor(fractionLength, separator) {
  *  Запрещает вводить второй сепаратор
  */
 function createRepeatedSeparatorPreprocessor(separator) {
-    return ({ elementState, data }) => {
-        const { value, selection } = elementState;
-        const [from, to] = selection;
+    return function (_a) {
+        var elementState = _a.elementState, data = _a.data;
+        var value = elementState.value, selection = elementState.selection;
+        var from = selection[0], to = selection[1];
         return {
-            elementState,
+            elementState: elementState,
             data: !value.includes(separator) || value.slice(from, to + 1).includes(separator)
                 ? data
-                : data.replace(new RegExp(`\\${separator}`), ''),
+                : data.replace(new RegExp("\\".concat(separator)), ''),
         };
     };
 }
@@ -139,24 +148,27 @@ function createRepeatedSeparatorPreprocessor(separator) {
  * @example 0| => Type "5" => 5|
  */
 function createLeadingZeroesValidationPostprocessor(separator) {
-    const trimLeadingZeroes = (value) => value
-        .replace(new RegExp('^(\\D+)?0+(?=0)'), '$1')
-        .replace(new RegExp('^(\\D+)?0+(?=[1-9])'), '$1');
-    const countTrimmedZeroesBefore = (value, index) => {
-        const valueBefore = value.slice(0, index);
-        const followedByZero = value.slice(index).startsWith('0');
+    var trimLeadingZeroes = function (value) {
+        return value
+            .replace(new RegExp('^(\\D+)?0+(?=0)'), '$1')
+            .replace(new RegExp('^(\\D+)?0+(?=[1-9])'), '$1');
+    };
+    var countTrimmedZeroesBefore = function (value, index) {
+        var valueBefore = value.slice(0, index);
+        var followedByZero = value.slice(index).startsWith('0');
         return (valueBefore.length - trimLeadingZeroes(valueBefore).length + (followedByZero ? 1 : 0));
     };
-    return ({ value, selection }) => {
-        const [from, to] = selection;
-        const hasSeparator = value.includes(separator);
-        const [integerPart, decimalPart = ''] = value.split(separator);
-        const zeroTrimmedIntegerPart = trimLeadingZeroes(integerPart);
+    return function (_a) {
+        var value = _a.value, selection = _a.selection;
+        var from = selection[0], to = selection[1];
+        var hasSeparator = value.includes(separator);
+        var _b = value.split(separator), integerPart = _b[0], _c = _b[1], decimalPart = _c === void 0 ? '' : _c;
+        var zeroTrimmedIntegerPart = trimLeadingZeroes(integerPart);
         if (integerPart === zeroTrimmedIntegerPart) {
-            return { value, selection };
+            return { value: value, selection: selection };
         }
-        const newFrom = from - countTrimmedZeroesBefore(value, from);
-        const newTo = to - countTrimmedZeroesBefore(value, to);
+        var newFrom = from - countTrimmedZeroesBefore(value, from);
+        var newTo = to - countTrimmedZeroesBefore(value, to);
         return {
             value: zeroTrimmedIntegerPart + (hasSeparator ? separator : '') + decimalPart,
             selection: [Math.max(newFrom, 0), Math.max(newTo, 0)],
@@ -167,10 +179,12 @@ function createLeadingZeroesValidationPostprocessor(separator) {
  * Валидирует значение с учетом min max значений.
  * Работает совместно с createMinMaxPlugin
  */
-function createMinMaxPostprocessor({ min, max, separator, }) {
-    return ({ value, selection }) => {
-        const parsedNumber = parseNumber(value);
-        const limitedValue = 
+function createMinMaxPostprocessor(_a) {
+    var min = _a.min, max = _a.max, separator = _a.separator;
+    return function (_a) {
+        var value = _a.value, selection = _a.selection;
+        var parsedNumber = parseNumber(value);
+        var limitedValue = 
         /**
          * Здесь невозможно ограничить нижнюю границу, если пользователь вводит положительное число.
          * То же самое для верхней границы и отрицательного числа.
@@ -178,69 +192,80 @@ function createMinMaxPostprocessor({ min, max, separator, }) {
          */
         parsedNumber > 0 ? Math.min(parsedNumber, max) : Math.max(parsedNumber, min);
         if (!Number.isNaN(parsedNumber) && limitedValue !== parsedNumber) {
-            const newValue = `${limitedValue}`.replace('.', separator);
+            var newValue = "".concat(limitedValue).replace('.', separator);
             return {
                 value: newValue,
                 selection: [newValue.length, newValue.length],
             };
         }
         return {
-            value,
-            selection,
+            value: value,
+            selection: selection,
         };
     };
 }
-function createMinMaxPlugin({ min, max }) {
-    return (element, options) => {
-        const listener = () => {
-            const parsedNumber = parseNumber(element.value);
-            const clampedNumber = fnUtils.clamp(parsedNumber, min, max);
+function createMinMaxPlugin(_a) {
+    var min = _a.min, max = _a.max;
+    return function (element, options) {
+        var listener = function () {
+            var parsedNumber = parseNumber(element.value);
+            var clampedNumber = coreComponentsShared.fnUtils.clamp(parsedNumber, min, max);
             if (!Number.isNaN(parsedNumber) && parsedNumber !== clampedNumber) {
-                element.value = maskitoTransform(stringifyNumberWithoutExp(clampedNumber), options);
+                element.value = core.maskitoTransform(stringifyNumberWithoutExp(clampedNumber), options);
                 element.dispatchEvent(new Event('input', { bubbles: true }));
             }
         };
-        const evListenerOptions = { capture: true };
+        var evListenerOptions = { capture: true };
         element.addEventListener('blur', listener, evListenerOptions);
-        return () => element.removeEventListener('blur', listener, evListenerOptions);
+        return function () { return element.removeEventListener('blur', listener, evListenerOptions); };
     };
 }
 function createNotEmptyPartsPlugin(separator) {
-    return (element) => {
-        const listener = () => {
-            const newValue = element.value
+    return function (element) {
+        var listener = function () {
+            var newValue = element.value
                 // 0,9000000 -> 0,9
-                .replace(new RegExp(`(\\${separator}\\d*?)(0+$)`), '$1')
+                .replace(new RegExp("(\\".concat(separator, "\\d*?)(0+$)")), '$1')
                 // ,2 => 0,2
-                .replace(new RegExp(`^(\\D+)?\\${separator}`), `$10${separator}`)
+                .replace(new RegExp("^(\\D+)?\\".concat(separator)), "$10".concat(separator))
                 // 0, -> 0
-                .replace(new RegExp(`\\${separator}$`), '')
+                .replace(new RegExp("\\".concat(separator, "$")), '')
                 // -0 -> 0
-                .replace(new RegExp(`^${MINUS_SIGN}0$`), '0')
+                .replace(new RegExp("^".concat(MINUS_SIGN, "0$")), '0')
                 // - -> ''
-                .replace(new RegExp(`^${MINUS_SIGN}$`), '');
+                .replace(new RegExp("^".concat(MINUS_SIGN, "$")), '');
             if (newValue !== element.value) {
                 element.value = newValue;
                 element.dispatchEvent(new Event('input', { bubbles: true }));
             }
         };
-        const evListenerOptions = { capture: true };
+        var evListenerOptions = { capture: true };
         element.addEventListener('blur', listener, evListenerOptions);
-        return () => element.removeEventListener('blur', listener, evListenerOptions);
+        return function () { return element.removeEventListener('blur', listener, evListenerOptions); };
     };
 }
 function getNumberInputTestIds(dataTestId) {
     return {
         input: dataTestId,
-        inputWrapper: getDataTestId(dataTestId, 'form-control'),
-        inputWrapperInner: getDataTestId(dataTestId, 'form-control-inner'),
-        leftAddons: getDataTestId(dataTestId, 'form-control-left-addons'),
-        rightAddons: getDataTestId(dataTestId, 'form-control-right-addons'),
-        error: getDataTestId(dataTestId, 'form-control-error-message'),
-        hint: getDataTestId(dataTestId, 'form-control-hint'),
-        decrementButton: getDataTestId(dataTestId, 'decrement-button'),
-        incrementButton: getDataTestId(dataTestId, 'increment-button'),
+        inputWrapper: coreComponentsShared.getDataTestId(dataTestId, 'form-control'),
+        inputWrapperInner: coreComponentsShared.getDataTestId(dataTestId, 'form-control-inner'),
+        leftAddons: coreComponentsShared.getDataTestId(dataTestId, 'form-control-left-addons'),
+        rightAddons: coreComponentsShared.getDataTestId(dataTestId, 'form-control-right-addons'),
+        error: coreComponentsShared.getDataTestId(dataTestId, 'form-control-error-message'),
+        hint: coreComponentsShared.getDataTestId(dataTestId, 'form-control-hint'),
+        decrementButton: coreComponentsShared.getDataTestId(dataTestId, 'decrement-button'),
+        incrementButton: coreComponentsShared.getDataTestId(dataTestId, 'increment-button'),
     };
 }
 
-export { MAX_DIGITS, MAX_SAFE_INTEGER, MINUS_SIGN, MIN_SAFE_INTEGER, SEPARATORS, createMaskOptions, createMinMaxPlugin, createNotEmptyPartsPlugin, getNumberInputTestIds, parseNumber, stringifyNumberWithoutExp };
+exports.MAX_DIGITS = MAX_DIGITS;
+exports.MAX_SAFE_INTEGER = MAX_SAFE_INTEGER;
+exports.MINUS_SIGN = MINUS_SIGN;
+exports.MIN_SAFE_INTEGER = MIN_SAFE_INTEGER;
+exports.SEPARATORS = SEPARATORS;
+exports.createMaskOptions = createMaskOptions;
+exports.createMinMaxPlugin = createMinMaxPlugin;
+exports.createNotEmptyPartsPlugin = createNotEmptyPartsPlugin;
+exports.getNumberInputTestIds = getNumberInputTestIds;
+exports.parseNumber = parseNumber;
+exports.stringifyNumberWithoutExp = stringifyNumberWithoutExp;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alfalab/core-components",
-  "version": "45.6.0-beta.2",
+  "version": "45.6.1",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -79,7 +79,7 @@
     "micromark-extension-gfm-strikethrough": "^0.6.5",
     "nouislider": "^15.6.0",
     "popper-max-size-modifier": "^0.2.0",
-    "react-canvas-pattern-lock": "^2.0.6",
+    "react-canvas-pattern-lock": "^1.2.0",
     "react-div-100vh": "^0.7.0",
     "react-focus-lock": "^2.9.3",
     "react-markdown": "6.0.2",

package/pagination/cssm/Component.js

@@ -1,33 +1,39 @@
-import React from 'react';
-import cn from 'classnames';
-import { ChevronBackMIcon } from '@alfalab/icons-glyph/ChevronBackMIcon';
-import { ChevronForwardMIcon } from '@alfalab/icons-glyph/ChevronForwardMIcon';
-import { DefaultView } from './components/default-view/index.js';
-import { PerPageView } from './components/per-page-view/index.js';
-import { Tag } from './components/tag/index.js';
-import '../../tag/cssm/desktop';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const styles = {"component":"component","defaultView":"defaultView"};
-require('./index.css');
+var React = require('react');
+var cn = require('classnames');
+var ChevronBackMIcon = require('@alfalab/icons-glyph/ChevronBackMIcon');
+var ChevronForwardMIcon = require('@alfalab/icons-glyph/ChevronForwardMIcon');
+var components_defaultView_index = require('./components/default-view/index.js');
+var components_perPageView_index = require('./components/per-page-view/index.js');
+var components_tag_index = require('./components/tag/index.js');
+var styles = require('./index.module.css');
 
-const Pagination = ({ currentPageIndex = 0, pagesCount, className, sidePadding = 1, activePadding = 2, hideArrows = true, view = 'default', onPageChange = () => null, dataTestId, }) => {
-    const handlePageClick = (pageIndex) => {
+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 Pagination = function (_a) {
+    var _b = _a.currentPageIndex, currentPageIndex = _b === void 0 ? 0 : _b, pagesCount = _a.pagesCount, className = _a.className, _c = _a.sidePadding, sidePadding = _c === void 0 ? 1 : _c, _d = _a.activePadding, activePadding = _d === void 0 ? 2 : _d, _e = _a.hideArrows, hideArrows = _e === void 0 ? true : _e, _f = _a.view, view = _f === void 0 ? 'default' : _f, _g = _a.onPageChange, onPageChange = _g === void 0 ? function () { return null; } : _g, dataTestId = _a.dataTestId;
+    var handlePageClick = function (pageIndex) {
         onPageChange(pageIndex);
     };
-    const handleNextPageClick = () => {
+    var handleNextPageClick = function () {
         handlePageClick(Math.min(pagesCount - 1, currentPageIndex + 1));
     };
-    const handlePrevPageClick = () => {
+    var handlePrevPageClick = function () {
         handlePageClick(Math.max(0, currentPageIndex - 1));
     };
-    const shouldRenderPrevArrow = view === 'per-page' || !hideArrows || currentPageIndex > 0;
-    const shouldRenderNextArrow = view === 'per-page' || !hideArrows || currentPageIndex < pagesCount - 1;
-    const viewClassName = view === 'default' ? 'defaultView' : view;
-    return (React.createElement("div", { className: cn(styles.component, className, styles[viewClassName]), "data-test-id": dataTestId },
-        shouldRenderPrevArrow && (React.createElement(Tag, { className: styles.arrow, disabled: currentPageIndex <= 0, onClick: handlePrevPageClick, rightAddons: React.createElement(ChevronBackMIcon, { width: 16, height: 16 }) })),
-        view === 'default' && (React.createElement(DefaultView, { activePadding: activePadding, sidePadding: sidePadding, currentPageIndex: currentPageIndex, pagesCount: pagesCount, onPageChange: handlePageClick })),
-        view === 'per-page' && (React.createElement(PerPageView, { currentPageIndex: currentPageIndex, pagesCount: pagesCount })),
-        shouldRenderNextArrow && (React.createElement(Tag, { className: styles.arrow, disabled: currentPageIndex >= pagesCount - 1, onClick: handleNextPageClick, rightAddons: React.createElement(ChevronForwardMIcon, { width: 16, height: 16 }) }))));
+    var shouldRenderPrevArrow = view === 'per-page' || !hideArrows || currentPageIndex > 0;
+    var shouldRenderNextArrow = view === 'per-page' || !hideArrows || currentPageIndex < pagesCount - 1;
+    var viewClassName = view === 'default' ? 'defaultView' : view;
+    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, className, styles__default.default[viewClassName]), "data-test-id": dataTestId },
+        shouldRenderPrevArrow && (React__default.default.createElement(components_tag_index.Tag, { className: styles__default.default.arrow, disabled: currentPageIndex <= 0, onClick: handlePrevPageClick, rightAddons: React__default.default.createElement(ChevronBackMIcon.ChevronBackMIcon, { width: 16, height: 16 }) })),
+        view === 'default' && (React__default.default.createElement(components_defaultView_index.DefaultView, { activePadding: activePadding, sidePadding: sidePadding, currentPageIndex: currentPageIndex, pagesCount: pagesCount, onPageChange: handlePageClick })),
+        view === 'per-page' && (React__default.default.createElement(components_perPageView_index.PerPageView, { currentPageIndex: currentPageIndex, pagesCount: pagesCount })),
+        shouldRenderNextArrow && (React__default.default.createElement(components_tag_index.Tag, { className: styles__default.default.arrow, disabled: currentPageIndex >= pagesCount - 1, onClick: handleNextPageClick, rightAddons: React__default.default.createElement(ChevronForwardMIcon.ChevronForwardMIcon, { width: 16, height: 16 }) }))));
 };
 
-export { Pagination };
+exports.Pagination = Pagination;

package/pagination/cssm/components/default-view/index.js

@@ -1,23 +1,27 @@
-import React, { useCallback } from 'react';
-import { Tag } from '../tag/index.js';
-import 'classnames';
-import '../../../../tag/cssm/desktop';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const styles = {"dots":"dots"};
-require('./index.css');
+var React = require('react');
+var components_tag_index = require('../tag/index.js');
+var styles = require('./index.module.css');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
 
 /* eslint-disable react/no-array-index-key */
-const DefaultView = ({ sidePadding = 2, activePadding = 1, pagesCount, currentPageIndex, onPageChange = () => null, }) => {
-    const maxHalfCount = sidePadding + activePadding + 1;
-    const maxElementsCount = maxHalfCount * 2 + 1;
-    const itemsFit = pagesCount <= maxElementsCount;
-    const elementsCount = itemsFit ? pagesCount : maxElementsCount;
-    const getPageIndex = useCallback((elementIndex) => {
-        const lastIndex = pagesCount - 1;
-        const reverseIndex = lastIndex - currentPageIndex;
-        const lastElementIndex = elementsCount - 1;
-        const reverseElementIndex = lastElementIndex - elementIndex;
-        const hasCollapsedItems = (index) => !itemsFit && index >= maxHalfCount;
+var DefaultView = function (_a) {
+    var _b = _a.sidePadding, sidePadding = _b === void 0 ? 2 : _b, _c = _a.activePadding, activePadding = _c === void 0 ? 1 : _c, pagesCount = _a.pagesCount, currentPageIndex = _a.currentPageIndex, _d = _a.onPageChange, onPageChange = _d === void 0 ? function () { return null; } : _d;
+    var maxHalfCount = sidePadding + activePadding + 1;
+    var maxElementsCount = maxHalfCount * 2 + 1;
+    var itemsFit = pagesCount <= maxElementsCount;
+    var elementsCount = itemsFit ? pagesCount : maxElementsCount;
+    var getPageIndex = React.useCallback(function (elementIndex) {
+        var lastIndex = pagesCount - 1;
+        var reverseIndex = lastIndex - currentPageIndex;
+        var lastElementIndex = elementsCount - 1;
+        var reverseElementIndex = lastElementIndex - elementIndex;
+        var hasCollapsedItems = function (index) { return !itemsFit && index >= maxHalfCount; };
         if (elementIndex < sidePadding) {
             return elementIndex;
         }
@@ -30,19 +34,19 @@ const DefaultView = ({ sidePadding = 2, activePadding = 1, pagesCount, currentPa
         if (reverseElementIndex < sidePadding) {
             return lastIndex - reverseElementIndex;
         }
-        const computedIndex = currentPageIndex - maxHalfCount + elementIndex;
+        var computedIndex = currentPageIndex - maxHalfCount + elementIndex;
         return Math.min(lastIndex - reverseElementIndex, Math.max(elementIndex, computedIndex));
     }, [currentPageIndex, elementsCount, itemsFit, maxHalfCount, pagesCount, sidePadding]);
-    return (React.createElement(React.Fragment, null, Array(elementsCount)
+    return (React__default.default.createElement(React__default.default.Fragment, null, Array(elementsCount)
         .fill('')
-        .map((_, i) => {
-        const pageIndex = getPageIndex(i);
+        .map(function (_, i) {
+        var pageIndex = getPageIndex(i);
         if (pageIndex === null) {
-            return (React.createElement("div", { key: i.toString(), className: styles.dots }, "..."));
+            return (React__default.default.createElement("div", { key: i.toString(), className: styles__default.default.dots }, "..."));
         }
-        const active = currentPageIndex === pageIndex;
-        return (React.createElement(Tag, { key: i.toString(), checked: active, disabled: active, onClick: () => onPageChange(pageIndex) }, pageIndex + 1));
+        var active = currentPageIndex === pageIndex;
+        return (React__default.default.createElement(components_tag_index.Tag, { key: i.toString(), checked: active, disabled: active, onClick: function () { return onPageChange(pageIndex); } }, pageIndex + 1));
     })));
 };
 
-export { DefaultView };
+exports.DefaultView = DefaultView;

package/pagination/cssm/components/default-view/index.module.css

@@ -0,0 +1,26 @@
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} /* deprecated */ :root {
+    --color-light-text-secondary: rgba(4, 4, 19, 0.55); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root {
+} :root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+} :root {
+} :root {
+} :root {
+} :root {
+} .dots {
+    width: 32px;
+    height: 32px;
+    text-align: center;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--color-light-text-secondary);
+    cursor: default;
+}

package/pagination/cssm/components/per-page-view/index.js

@@ -1,12 +1,20 @@
-import React from 'react';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const styles = {"component":"component"};
-require('./index.css');
+var React = require('react');
+var styles = require('./index.module.css');
 
-const PerPageView = ({ pagesCount, currentPageIndex }) => (React.createElement("span", { className: styles.component },
-    currentPageIndex + 1,
-    " \u0438\u0437 ",
-    pagesCount,
-    " \u0441\u0442\u0440\u0430\u043D\u0438\u0446"));
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
-export { PerPageView };
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var PerPageView = function (_a) {
+    var pagesCount = _a.pagesCount, currentPageIndex = _a.currentPageIndex;
+    return (React__default.default.createElement("span", { className: styles__default.default.component },
+        currentPageIndex + 1,
+        " \u0438\u0437 ",
+        pagesCount,
+        " \u0441\u0442\u0440\u0430\u043D\u0438\u0446"));
+};
+
+exports.PerPageView = PerPageView;

package/pagination/cssm/components/per-page-view/index.module.css

@@ -0,0 +1,20 @@
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root {
+} :root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+} :root {
+} :root {
+    --gap-m: 16px;
+} :root {
+} :root {
+} .component {
+    display: block;
+    margin: 0 var(--gap-m);
+}