@alfalab/core-components 45.9.0-beta.0 → 45.9.0-beta.2

package/calendar-range/cssm/views/static.js

@@ -1,103 +1,115 @@
-import React, { useState, useCallback, useEffect } from 'react';
-import cn from 'classnames';
-import addMonths from 'date-fns/addMonths';
-import endOfMonth from 'date-fns/endOfMonth';
-import isSameMonth from 'date-fns/isSameMonth';
-import max from 'date-fns/max';
-import startOfMonth from 'date-fns/startOfMonth';
-import subMonths from 'date-fns/subMonths';
-import { CalendarDesktop } from '../../../calendar/cssm/desktop';
-import { usePeriodWithReset } from '../../../calendar/cssm/shared';
-import { isValidInputValue, parseDateString, formatDate } from '../../../calendar-input/cssm/shared';
-import { isCompleteDateInput, DateInput } from '../../../date-input/cssm';
-import { Divider } from '../components/divider/Component.js';
-import { useStaticViewMonthes, useSelectionProps } from '../hooks.js';
-import { isDayButton } from '../utils.js';
-import styles from './index.module.css';
-import '../components/divider/index.module.css';
-import 'date-fns/isEqual';
-import 'date-fns/min';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-/* eslint-disable complexity */
-const CalendarRangeStatic = ({ className, defaultMonth = startOfMonth(new Date()).getTime(), defaultMonthPosition = 'left', minDate, maxDate, valueFrom = '', valueTo = '', onDateFromChange = () => null, onDateToChange = () => null, onChange = () => null, onError, inputFromProps = {}, inputToProps = {}, offDays, events, returnInvalidDates = false, dataTestId, }) => {
-    const [inputFromValue, setInputFromValue] = useState(valueFrom);
-    const [inputToValue, setInputToValue] = useState(valueTo);
-    let dateFrom = isValidInputValue(inputFromValue, minDate, maxDate, offDays)
-        ? parseDateString(inputFromValue).getTime()
+var tslib = require('tslib');
+var React = require('react');
+var cn = require('classnames');
+var addMonths = require('date-fns/addMonths');
+var endOfMonth = require('date-fns/endOfMonth');
+var isSameMonth = require('date-fns/isSameMonth');
+var max = require('date-fns/max');
+var startOfMonth = require('date-fns/startOfMonth');
+var subMonths = require('date-fns/subMonths');
+var desktop = require('../../../calendar/cssm/desktop');
+var shared$1 = require('../../../calendar/cssm/shared');
+var shared = require('../../../calendar-input/cssm/shared');
+var coreComponentsDateInput = require('../../../date-input/cssm');
+var components_divider_Component = require('../components/divider/Component.js');
+var hooks = require('../hooks.js');
+var utils = require('../utils.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 cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var addMonths__default = /*#__PURE__*/_interopDefaultCompat(addMonths);
+var endOfMonth__default = /*#__PURE__*/_interopDefaultCompat(endOfMonth);
+var isSameMonth__default = /*#__PURE__*/_interopDefaultCompat(isSameMonth);
+var max__default = /*#__PURE__*/_interopDefaultCompat(max);
+var startOfMonth__default = /*#__PURE__*/_interopDefaultCompat(startOfMonth);
+var subMonths__default = /*#__PURE__*/_interopDefaultCompat(subMonths);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var CalendarRangeStatic = function (_a) {
+    var className = _a.className, _b = _a.defaultMonth, defaultMonth = _b === void 0 ? startOfMonth__default.default(new Date()).getTime() : _b, _c = _a.defaultMonthPosition, defaultMonthPosition = _c === void 0 ? 'left' : _c, minDate = _a.minDate, maxDate = _a.maxDate, _d = _a.valueFrom, valueFrom = _d === void 0 ? '' : _d, _e = _a.valueTo, valueTo = _e === void 0 ? '' : _e, _f = _a.onDateFromChange, onDateFromChange = _f === void 0 ? function () { return null; } : _f, _g = _a.onDateToChange, onDateToChange = _g === void 0 ? function () { return null; } : _g, _h = _a.onChange, onChange = _h === void 0 ? function () { return null; } : _h, onError = _a.onError, _j = _a.inputFromProps, inputFromProps = _j === void 0 ? {} : _j, _k = _a.inputToProps, inputToProps = _k === void 0 ? {} : _k, offDays = _a.offDays, events = _a.events, _l = _a.returnInvalidDates, returnInvalidDates = _l === void 0 ? false : _l, dataTestId = _a.dataTestId;
+    var _m = React.useState(valueFrom), inputFromValue = _m[0], setInputFromValue = _m[1];
+    var _o = React.useState(valueTo), inputToValue = _o[0], setInputToValue = _o[1];
+    var dateFrom = shared.isValidInputValue(inputFromValue, minDate, maxDate, offDays)
+        ? shared.parseDateString(inputFromValue).getTime()
         : null;
-    const dateTo = isValidInputValue(inputToValue, dateFrom || minDate, maxDate, offDays)
-        ? parseDateString(inputToValue).getTime()
+    var dateTo = shared.isValidInputValue(inputToValue, dateFrom || minDate, maxDate, offDays)
+        ? shared.parseDateString(inputToValue).getTime()
         : null;
-    if (isCompleteDateInput(inputToValue) && !dateTo && !returnInvalidDates) {
+    if (coreComponentsDateInput.isCompleteDateInput(inputToValue) && !dateTo && !returnInvalidDates) {
         dateFrom = null;
     }
-    const bothInvalid = isCompleteDateInput(inputFromValue) &&
-        isCompleteDateInput(inputToValue) &&
-        parseDateString(inputFromValue).getTime() > parseDateString(inputToValue).getTime();
-    const [highlightedDate, setHighlightedDate] = useState(undefined);
-    const period = usePeriodWithReset({
-        initialSelectedFrom: dateFrom ? parseDateString(inputFromValue).getTime() : undefined,
-        initialSelectedTo: dateTo ? parseDateString(inputToValue).getTime() : undefined,
+    var bothInvalid = coreComponentsDateInput.isCompleteDateInput(inputFromValue) &&
+        coreComponentsDateInput.isCompleteDateInput(inputToValue) &&
+        shared.parseDateString(inputFromValue).getTime() > shared.parseDateString(inputToValue).getTime();
+    var _p = React.useState(undefined), highlightedDate = _p[0], setHighlightedDate = _p[1];
+    var period = shared$1.usePeriodWithReset({
+        initialSelectedFrom: dateFrom ? shared.parseDateString(inputFromValue).getTime() : undefined,
+        initialSelectedTo: dateTo ? shared.parseDateString(inputToValue).getTime() : undefined,
     });
-    const validateInputFromValue = useCallback((value) => isValidInputValue(value, minDate, dateFrom || maxDate, offDays), [dateFrom, maxDate, minDate, offDays]);
-    const validateInputToValue = useCallback((value) => isValidInputValue(value, dateFrom || minDate, maxDate, offDays), [dateFrom, minDate, maxDate, offDays]);
-    const [inputFromInvalid, setInputFromInvalid] = useState(isCompleteDateInput(inputFromValue) && dateFrom === null);
-    const [inputToInvalid, setInputToInvalid] = useState(isCompleteDateInput(inputToValue) && dateTo === null);
-    const hasValidateError = bothInvalid || inputFromInvalid || inputToInvalid;
-    const { calendarProps: calendarFromProps, onInputChange: onInputChangeFrom, ...dateInputFromProps } = inputFromProps;
-    const { calendarProps: calendarToProps, onInputChange: onInputChangeTo, ...dateInputToProps } = inputToProps;
-    const { monthFrom, monthTo, handleMonthFromChange, handleMonthToChange } = useStaticViewMonthes({
+    var validateInputFromValue = React.useCallback(function (value) { return shared.isValidInputValue(value, minDate, dateFrom || maxDate, offDays); }, [dateFrom, maxDate, minDate, offDays]);
+    var validateInputToValue = React.useCallback(function (value) { return shared.isValidInputValue(value, dateFrom || minDate, maxDate, offDays); }, [dateFrom, minDate, maxDate, offDays]);
+    var _q = React.useState(coreComponentsDateInput.isCompleteDateInput(inputFromValue) && dateFrom === null), inputFromInvalid = _q[0], setInputFromInvalid = _q[1];
+    var _r = React.useState(coreComponentsDateInput.isCompleteDateInput(inputToValue) && dateTo === null), inputToInvalid = _r[0], setInputToInvalid = _r[1];
+    var hasValidateError = bothInvalid || inputFromInvalid || inputToInvalid;
+    var calendarFromProps = inputFromProps.calendarProps, onInputChangeFrom = inputFromProps.onInputChange, dateInputFromProps = tslib.__rest(inputFromProps, ["calendarProps", "onInputChange"]);
+    var calendarToProps = inputToProps.calendarProps, onInputChangeTo = inputToProps.onInputChange, dateInputToProps = tslib.__rest(inputToProps, ["calendarProps", "onInputChange"]);
+    var _s = hooks.useStaticViewMonthes({
         selectedFrom: period.selectedFrom,
         selectedTo: period.selectedTo,
-        defaultMonth,
-        defaultMonthPosition,
-    });
-    const handleValidInputFrom = useCallback(() => {
+        defaultMonth: defaultMonth,
+        defaultMonthPosition: defaultMonthPosition,
+    }), monthFrom = _s.monthFrom, monthTo = _s.monthTo, handleMonthFromChange = _s.handleMonthFromChange, handleMonthToChange = _s.handleMonthToChange;
+    var handleValidInputFrom = React.useCallback(function () {
         setInputFromInvalid(inputFromValue !== '' && !validateInputFromValue(inputFromValue));
     }, [inputFromValue, validateInputFromValue]);
-    const handleValidInputTo = useCallback(() => {
+    var handleValidInputTo = React.useCallback(function () {
         setInputToInvalid(inputToValue !== '' && !validateInputToValue(inputToValue));
     }, [inputToValue, validateInputToValue]);
-    const handleInputFromChange = (event, payload) => {
+    var handleInputFromChange = function (event, payload) {
         setInputFromValue(payload.value);
-        onInputChangeFrom?.(event, payload);
+        onInputChangeFrom === null || onInputChangeFrom === void 0 ? void 0 : onInputChangeFrom(event, payload);
     };
-    const handleInputToChange = (event, payload) => {
+    var handleInputToChange = function (event, payload) {
         setInputToValue(payload.value);
-        onInputChangeTo?.(event, payload);
+        onInputChangeTo === null || onInputChangeTo === void 0 ? void 0 : onInputChangeTo(event, payload);
     };
-    const handleMouseOver = useCallback((event) => {
-        const target = event.target;
-        const mouseOverDayButton = isDayButton(target) || isDayButton(target.parentElement);
-        let date;
+    var handleMouseOver = React.useCallback(function (event) {
+        var target = event.target;
+        var mouseOverDayButton = utils.isDayButton(target) || utils.isDayButton(target.parentElement);
+        var date;
         if (mouseOverDayButton) {
-            const button = target.tagName === 'BUTTON' ? target : target.parentElement;
+            var button = target.tagName === 'BUTTON' ? target : target.parentElement;
             if (button.dataset.date) {
                 date = +button.dataset.date;
             }
         }
         setHighlightedDate(date);
     }, []);
-    const handleClearFrom = useCallback(() => {
+    var handleClearFrom = React.useCallback(function () {
         setInputFromValue('');
     }, []);
-    const handleClearTo = useCallback(() => {
+    var handleClearTo = React.useCallback(function () {
         setInputToValue('');
     }, []);
-    useEffect(() => {
-        setInputFromValue(period.selectedFrom ? formatDate(period.selectedFrom) : '');
+    React.useEffect(function () {
+        setInputFromValue(period.selectedFrom ? shared.formatDate(period.selectedFrom) : '');
     }, [period.selectedFrom]);
-    useEffect(() => {
-        setInputToValue(period.selectedTo ? formatDate(period.selectedTo) : '');
+    React.useEffect(function () {
+        setInputToValue(period.selectedTo ? shared.formatDate(period.selectedTo) : '');
     }, [period.selectedTo]);
-    useEffect(() => {
+    React.useEffect(function () {
         setInputFromValue(valueFrom);
     }, [valueFrom]);
-    useEffect(() => {
+    React.useEffect(function () {
         setInputToValue(valueTo);
     }, [valueTo]);
-    useEffect(() => {
-        if (!inputFromValue || isCompleteDateInput(inputFromValue)) {
+    React.useEffect(function () {
+        if (!inputFromValue || coreComponentsDateInput.isCompleteDateInput(inputFromValue)) {
             handleValidInputFrom();
         }
         period.setStart(dateFrom || undefined);
@@ -112,14 +124,14 @@ const CalendarRangeStatic = ({ className, defaultMonth = startOfMonth(new Date()
             onChange({
                 valueFrom: inputFromValue,
                 valueTo: inputToValue,
-                dateFrom,
-                dateTo,
+                dateFrom: dateFrom,
+                dateTo: dateTo,
             });
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [inputFromValue]);
-    useEffect(() => {
-        if (!inputToValue || isCompleteDateInput(inputToValue)) {
+    React.useEffect(function () {
+        if (!inputToValue || coreComponentsDateInput.isCompleteDateInput(inputToValue)) {
             handleValidInputTo();
         }
         period.setEnd(dateTo || undefined);
@@ -128,9 +140,9 @@ const CalendarRangeStatic = ({ className, defaultMonth = startOfMonth(new Date()
         }
         if (inputToValue !== valueTo) {
             // eslint-disable-next-line no-nested-ternary
-            const inputDateTo = returnInvalidDates
-                ? isCompleteDateInput(inputToValue)
-                    ? parseDateString(inputToValue).getTime()
+            var inputDateTo = returnInvalidDates
+                ? coreComponentsDateInput.isCompleteDateInput(inputToValue)
+                    ? shared.parseDateString(inputToValue).getTime()
                     : null
                 : dateTo;
             onDateToChange({
@@ -140,40 +152,40 @@ const CalendarRangeStatic = ({ className, defaultMonth = startOfMonth(new Date()
             onChange({
                 valueFrom: inputFromValue,
                 valueTo: inputToValue,
-                dateFrom,
+                dateFrom: dateFrom,
                 dateTo: inputDateTo,
             });
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [inputToValue]);
-    useEffect(() => {
+    React.useEffect(function () {
         if (onError) {
             onError(hasValidateError);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [hasValidateError]);
-    const rangeProps = useSelectionProps(period.selectedFrom, period.selectedTo, highlightedDate);
-    const CalendarFromComponent = dateInputFromProps.Calendar || CalendarDesktop;
-    const CalendarToComponent = dateInputToProps.Calendar || CalendarDesktop;
-    const minMaxInSameMonth = minDate && maxDate && isSameMonth(minDate, maxDate);
+    var rangeProps = hooks.useSelectionProps(period.selectedFrom, period.selectedTo, highlightedDate);
+    var CalendarFromComponent = dateInputFromProps.Calendar || desktop.CalendarDesktop;
+    var CalendarToComponent = dateInputToProps.Calendar || desktop.CalendarDesktop;
+    var minMaxInSameMonth = minDate && maxDate && isSameMonth__default.default(minDate, maxDate);
     return (
     // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
-    React.createElement("div", { className: cn(styles.component, styles.static, className), onMouseOver: handleMouseOver, "data-test-id": dataTestId },
-        React.createElement("div", null,
-            React.createElement(DateInput, { ...dateInputFromProps, mobileMode: dateInputFromProps.mobileMode === 'popover'
+    React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, styles__default.default.static, className), onMouseOver: handleMouseOver, "data-test-id": dataTestId },
+        React__default.default.createElement("div", null,
+            React__default.default.createElement(coreComponentsDateInput.DateInput, tslib.__assign({}, dateInputFromProps, { mobileMode: dateInputFromProps.mobileMode === 'popover'
                     ? 'input'
-                    : dateInputFromProps.mobileMode, value: inputFromValue, onChange: handleInputFromChange, onClear: handleClearFrom, onBlur: handleValidInputFrom, error: bothInvalid || inputFromInvalid || dateInputFromProps.error, clear: true, block: true }),
-            React.createElement(CalendarFromComponent, { ...calendarFromProps, className: cn(styles.calendar, calendarFromProps?.className), month: monthFrom, selectorView: 'month-only', offDays: offDays, events: events, onChange: period.updatePeriod, onMonthChange: handleMonthFromChange, minDate: minDate, maxDate: minMaxInSameMonth
+                    : dateInputFromProps.mobileMode, value: inputFromValue, onChange: handleInputFromChange, onClear: handleClearFrom, onBlur: handleValidInputFrom, error: bothInvalid || inputFromInvalid || dateInputFromProps.error, clear: true, block: true })),
+            React__default.default.createElement(CalendarFromComponent, tslib.__assign({}, calendarFromProps, { className: cn__default.default(styles__default.default.calendar, calendarFromProps === null || calendarFromProps === void 0 ? void 0 : calendarFromProps.className), month: monthFrom, selectorView: 'month-only', offDays: offDays, events: events, onChange: period.updatePeriod, onMonthChange: handleMonthFromChange, minDate: minDate, maxDate: minMaxInSameMonth
                     ? maxDate
-                    : maxDate && max([maxDate, endOfMonth(subMonths(maxDate, 1))]).getTime(), ...rangeProps })),
-        React.createElement(Divider, { inputFromProps: inputFromProps, inputToProps: inputToProps }),
-        React.createElement("div", null,
-            React.createElement(DateInput, { ...dateInputToProps, mobileMode: dateInputToProps.mobileMode === 'popover'
+                    : maxDate && max__default.default([maxDate, endOfMonth__default.default(subMonths__default.default(maxDate, 1))]).getTime() }, rangeProps))),
+        React__default.default.createElement(components_divider_Component.Divider, { inputFromProps: inputFromProps, inputToProps: inputToProps }),
+        React__default.default.createElement("div", null,
+            React__default.default.createElement(coreComponentsDateInput.DateInput, tslib.__assign({}, dateInputToProps, { mobileMode: dateInputToProps.mobileMode === 'popover'
                     ? 'input'
-                    : dateInputToProps.mobileMode, value: inputToValue, onChange: handleInputToChange, onClear: handleClearTo, onBlur: handleValidInputTo, error: bothInvalid || inputToInvalid || dateInputToProps.error, clear: true, block: true }),
-            React.createElement(CalendarToComponent, { ...calendarToProps, className: cn(styles.calendar, calendarToProps?.className), month: monthTo, selectorView: 'month-only', offDays: offDays, events: events, onChange: period.updatePeriod, onMonthChange: handleMonthToChange, minDate: minMaxInSameMonth
+                    : dateInputToProps.mobileMode, value: inputToValue, onChange: handleInputToChange, onClear: handleClearTo, onBlur: handleValidInputTo, error: bothInvalid || inputToInvalid || dateInputToProps.error, clear: true, block: true })),
+            React__default.default.createElement(CalendarToComponent, tslib.__assign({}, calendarToProps, { className: cn__default.default(styles__default.default.calendar, calendarToProps === null || calendarToProps === void 0 ? void 0 : calendarToProps.className), month: monthTo, selectorView: 'month-only', offDays: offDays, events: events, onChange: period.updatePeriod, onMonthChange: handleMonthToChange, minDate: minMaxInSameMonth
                     ? minDate
-                    : minDate && startOfMonth(addMonths(minDate, 1)).getTime(), maxDate: maxDate, ...rangeProps }))));
+                    : minDate && startOfMonth__default.default(addMonths__default.default(minDate, 1)).getTime(), maxDate: maxDate }, rangeProps)))));
 };
 
-export { CalendarRangeStatic };
+exports.CalendarRangeStatic = CalendarRangeStatic;

package/calendar-with-skeleton/cssm/Component.js

@@ -1,25 +1,36 @@
-import React, { forwardRef } from 'react';
-import { CSSTransition } from 'react-transition-group';
-import cn from 'classnames';
-import { CalendarDesktop } from '../../calendar/cssm/desktop';
-import { Skeleton } from '../../skeleton/cssm';
-import styles from './index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const CalendarWithSkeleton = forwardRef(({ calendarVisible = true, animate = true, className, ...restProps }, ref) => {
-    const skeletonProps = { visible: true, animate };
-    return (React.createElement("div", { className: cn(styles.component, className, {
-            [styles.calendarVisible]: calendarVisible,
-        }) },
-        calendarVisible && React.createElement(CalendarDesktop, { ref: ref, responsive: true, ...restProps }),
-        React.createElement(CSSTransition, { in: !calendarVisible, timeout: 200, unmountOnExit: true, classNames: styles },
-            React.createElement("div", { className: styles.skeleton, ref: calendarVisible ? undefined : ref },
-                React.createElement(Skeleton, { ...skeletonProps, className: styles.header }),
-                React.createElement(Skeleton, { ...skeletonProps, className: styles.weekDays }),
-                React.createElement(Skeleton, { ...skeletonProps, className: styles.row }),
-                React.createElement(Skeleton, { ...skeletonProps, className: styles.row }),
-                React.createElement(Skeleton, { ...skeletonProps, className: styles.row }),
-                React.createElement(Skeleton, { ...skeletonProps, className: styles.row }),
-                React.createElement(Skeleton, { ...skeletonProps, className: styles.row })))));
+var tslib = require('tslib');
+var React = require('react');
+var reactTransitionGroup = require('react-transition-group');
+var cn = require('classnames');
+var desktop = require('../../calendar/cssm/desktop');
+var coreComponentsSkeleton = require('../../skeleton/cssm');
+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 cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var CalendarWithSkeleton = React.forwardRef(function (_a, ref) {
+    var _b;
+    var _c = _a.calendarVisible, calendarVisible = _c === void 0 ? true : _c, _d = _a.animate, animate = _d === void 0 ? true : _d, className = _a.className, restProps = tslib.__rest(_a, ["calendarVisible", "animate", "className"]);
+    var skeletonProps = { visible: true, animate: animate };
+    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, className, (_b = {},
+            _b[styles__default.default.calendarVisible] = calendarVisible,
+            _b)) },
+        calendarVisible && React__default.default.createElement(desktop.CalendarDesktop, tslib.__assign({ ref: ref, responsive: true }, restProps)),
+        React__default.default.createElement(reactTransitionGroup.CSSTransition, { in: !calendarVisible, timeout: 200, unmountOnExit: true, classNames: styles__default.default },
+            React__default.default.createElement("div", { className: styles__default.default.skeleton, ref: calendarVisible ? undefined : ref },
+                React__default.default.createElement(coreComponentsSkeleton.Skeleton, tslib.__assign({}, skeletonProps, { className: styles__default.default.header })),
+                React__default.default.createElement(coreComponentsSkeleton.Skeleton, tslib.__assign({}, skeletonProps, { className: styles__default.default.weekDays })),
+                React__default.default.createElement(coreComponentsSkeleton.Skeleton, tslib.__assign({}, skeletonProps, { className: styles__default.default.row })),
+                React__default.default.createElement(coreComponentsSkeleton.Skeleton, tslib.__assign({}, skeletonProps, { className: styles__default.default.row })),
+                React__default.default.createElement(coreComponentsSkeleton.Skeleton, tslib.__assign({}, skeletonProps, { className: styles__default.default.row })),
+                React__default.default.createElement(coreComponentsSkeleton.Skeleton, tslib.__assign({}, skeletonProps, { className: styles__default.default.row })),
+                React__default.default.createElement(coreComponentsSkeleton.Skeleton, tslib.__assign({}, skeletonProps, { className: styles__default.default.row }))))));
 });
 
-export { CalendarWithSkeleton };
+exports.CalendarWithSkeleton = CalendarWithSkeleton;

package/calendar-with-skeleton/cssm/index.js

@@ -1,7 +1,7 @@
-export { CalendarWithSkeleton } from './Component.js';
-import 'react';
-import 'react-transition-group';
-import 'classnames';
-import '../../calendar/cssm/desktop';
-import '../../skeleton/cssm';
-import './index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Component = require('./Component.js');
+
+
+
+exports.CalendarWithSkeleton = Component.CalendarWithSkeleton;

package/card-image/cssm/Component.js

@@ -1,39 +1,52 @@
-import React, { useState, useRef, useEffect } from 'react';
-import cn from 'classnames';
-import styles from './index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const ASPECT_RATIO = 0.63;
-const DEFAULT_WIDTH = 280;
-const DEFAULT_BASE_URL = 'https://online.alfabank.ru/cards-images/cards/';
-const CardImage = ({ cardId, layers = 'BACKGROUND,CARD_NUMBER,CARD_HOLDER,PAY_PASS,CHIP,LOGO,PAYMENT_SYSTEM,RESERVED_1,RESERVED_2,VALID_DATE', width = DEFAULT_WIDTH, baseUrl = DEFAULT_BASE_URL, rounded = true, alt, id, dataTestId, onLoad, className, }) => {
-    const [loaded, setLoaded] = useState(false);
-    const image = useRef(null);
-    const height = width * ASPECT_RATIO;
-    useEffect(() => {
-        setLoaded((prevLoaded) => {
-            if (!prevLoaded && image.current?.complete) {
-                onLoad?.();
+var React = require('react');
+var cn = require('classnames');
+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 cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var ASPECT_RATIO = 0.63;
+var DEFAULT_WIDTH = 280;
+var DEFAULT_BASE_URL = 'https://online.alfabank.ru/cards-images/cards/';
+var CardImage = function (_a) {
+    var cardId = _a.cardId, _b = _a.layers, layers = _b === void 0 ? 'BACKGROUND,CARD_NUMBER,CARD_HOLDER,PAY_PASS,CHIP,LOGO,PAYMENT_SYSTEM,RESERVED_1,RESERVED_2,VALID_DATE' : _b, _c = _a.width, width = _c === void 0 ? DEFAULT_WIDTH : _c, _d = _a.baseUrl, baseUrl = _d === void 0 ? DEFAULT_BASE_URL : _d, _e = _a.rounded, rounded = _e === void 0 ? true : _e, alt = _a.alt, id = _a.id, dataTestId = _a.dataTestId, onLoad = _a.onLoad, className = _a.className;
+    var _f = React.useState(false), loaded = _f[0], setLoaded = _f[1];
+    var image = React.useRef(null);
+    var height = width * ASPECT_RATIO;
+    React.useEffect(function () {
+        setLoaded(function (prevLoaded) {
+            var _a;
+            if (!prevLoaded && ((_a = image.current) === null || _a === void 0 ? void 0 : _a.complete)) {
+                onLoad === null || onLoad === void 0 ? void 0 : onLoad();
                 return true;
             }
             return prevLoaded;
         });
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    const handleLoadedImage = () => {
-        setLoaded((prevLoaded) => {
+    var handleLoadedImage = function () {
+        setLoaded(function (prevLoaded) {
             if (!prevLoaded) {
-                onLoad?.();
+                onLoad === null || onLoad === void 0 ? void 0 : onLoad();
                 return true;
             }
             return prevLoaded;
         });
     };
-    const cardImageUrl = `${baseUrl}${cardId}/images?layers=${layers}&width=${width}`;
-    const cardImageUrl2x = `${baseUrl}${cardId}/images?layers=${layers}&width=${width * 2}`;
-    return (React.createElement("div", { className: cn(styles.cardImage, rounded && styles.rounded, loaded && styles.loaded, className), style: {
-            width,
-            height,
-        }, id: id, "data-test-id": dataTestId }, cardId && (React.createElement("img", { ref: image, className: styles.image, width: width, height: height, src: cardImageUrl, srcSet: `${cardImageUrl2x} 2x`, alt: alt, role: 'presentation', onLoad: handleLoadedImage }))));
+    var cardImageUrl = "".concat(baseUrl).concat(cardId, "/images?layers=").concat(layers, "&width=").concat(width);
+    var cardImageUrl2x = "".concat(baseUrl).concat(cardId, "/images?layers=").concat(layers, "&width=").concat(width * 2);
+    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.cardImage, rounded && styles__default.default.rounded, loaded && styles__default.default.loaded, className), style: {
+            width: width,
+            height: height,
+        }, id: id, "data-test-id": dataTestId }, cardId && (React__default.default.createElement("img", { ref: image, className: styles__default.default.image, width: width, height: height, src: cardImageUrl, srcSet: "".concat(cardImageUrl2x, " 2x"), alt: alt, role: 'presentation', onLoad: handleLoadedImage }))));
 };
 
-export { ASPECT_RATIO, CardImage, DEFAULT_BASE_URL, DEFAULT_WIDTH };
+exports.ASPECT_RATIO = ASPECT_RATIO;
+exports.CardImage = CardImage;
+exports.DEFAULT_BASE_URL = DEFAULT_BASE_URL;
+exports.DEFAULT_WIDTH = DEFAULT_WIDTH;

package/card-image/cssm/index.js

@@ -1,4 +1,10 @@
-export { ASPECT_RATIO, CardImage, DEFAULT_BASE_URL, DEFAULT_WIDTH } from './Component.js';
-import 'react';
-import 'classnames';
-import './index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Component = require('./Component.js');
+
+
+
+exports.ASPECT_RATIO = Component.ASPECT_RATIO;
+exports.CardImage = Component.CardImage;
+exports.DEFAULT_BASE_URL = Component.DEFAULT_BASE_URL;
+exports.DEFAULT_WIDTH = Component.DEFAULT_WIDTH;

package/cdn-icon/cssm/Component.js

@@ -1,6 +1,15 @@
-import React, { useState, useEffect } from 'react';
-import cn from 'classnames';
-import styles from './index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var cn = require('classnames');
+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 cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
 
 var LoadingStatus;
 (function (LoadingStatus) {
@@ -8,17 +17,19 @@ var LoadingStatus;
     LoadingStatus[LoadingStatus["SUCCESS"] = 1] = "SUCCESS";
     LoadingStatus[LoadingStatus["FAILURE"] = 2] = "FAILURE";
 })(LoadingStatus || (LoadingStatus = {}));
-const CDNIcon = ({ name, color, dataTestId, className, baseUrl = 'https://alfabank.servicecdn.ru/icons', fallback, }) => {
-    const [loadingStatus, setLoadingStatus] = useState(LoadingStatus.INITIAL);
-    const [icon, setIcon] = useState('');
-    const monoIcon = !name.includes('_color');
-    useEffect(() => {
-        const xhr = new XMLHttpRequest();
-        xhr.open('GET', `${baseUrl}/${name}.svg`);
+var CDNIcon = function (_a) {
+    var _b;
+    var name = _a.name, color = _a.color, dataTestId = _a.dataTestId, className = _a.className, _c = _a.baseUrl, baseUrl = _c === void 0 ? 'https://alfabank.servicecdn.ru/icons' : _c, fallback = _a.fallback;
+    var _d = React.useState(LoadingStatus.INITIAL), loadingStatus = _d[0], setLoadingStatus = _d[1];
+    var _e = React.useState(''), icon = _e[0], setIcon = _e[1];
+    var monoIcon = !name.includes('_color');
+    React.useEffect(function () {
+        var xhr = new XMLHttpRequest();
+        xhr.open('GET', "".concat(baseUrl, "/").concat(name, ".svg"));
         xhr.send();
         xhr.onload = function onload() {
             setLoadingStatus(LoadingStatus.SUCCESS);
-            const svg = xhr.response;
+            var svg = xhr.response;
             if (svg.startsWith('<svg')) {
                 setIcon(svg);
             }
@@ -26,13 +37,13 @@ const CDNIcon = ({ name, color, dataTestId, className, baseUrl = 'https://alfaba
         xhr.onerror = function onError() {
             setLoadingStatus(LoadingStatus.FAILURE);
         };
-        return () => xhr.abort();
+        return function () { return xhr.abort(); };
     }, [name, baseUrl]);
-    return (React.createElement("span", { style: { color }, className: cn('cc-cdn-icon', styles.component, className, {
-            [styles.parentColor]: monoIcon,
-        }), "data-test-id": dataTestId, ...(loadingStatus === LoadingStatus.FAILURE
-            ? { children: fallback }
-            : { dangerouslySetInnerHTML: { __html: icon } }) }));
+    return (React__default.default.createElement("span", tslib.__assign({ style: { color: color }, className: cn__default.default('cc-cdn-icon', styles__default.default.component, className, (_b = {},
+            _b[styles__default.default.parentColor] = monoIcon,
+            _b)), "data-test-id": dataTestId }, (loadingStatus === LoadingStatus.FAILURE
+        ? { children: fallback }
+        : { dangerouslySetInnerHTML: { __html: icon } }))));
 };
 
-export { CDNIcon };
+exports.CDNIcon = CDNIcon;

package/cdn-icon/cssm/index.js

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