@itcase/ui 1.2.29 → 1.2.31

package/dist/components/Code.js

@@ -1,19 +1,25 @@
-import { a as __assign } from '../tslib.es6-w7hdJ3oZ.js';
+import { _ as __assign } from '../tslib.es6-5FtW-kfi.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
 import clsx from 'clsx';
 import OtpInput from 'react-otp-input';
+import { codeAppearance } from '../appearance/Code.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 
+var codeConfig = {
+    appearance: codeAppearance,
+    setAppearance: function (newComponent) {
+        codeConfig.appearance = newComponent;
+    },
+};
 function Code(props) {
-    var className = props.className, inputPlaceholder = props.inputPlaceholder, inputAutoFocus = props.inputAutoFocus, inputCount = props.inputCount, inputType = props.inputType, before = props.before, after = props.after, separatorComponent = props.separatorComponent, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus;
-    var _a = useState(''), otp = _a[0], setOtp = _a[1];
+    var after = props.after, appearance = props.appearance, before = props.before, className = props.className, inputAutoFocus = props.inputAutoFocus, _a = props.inputCount, inputCount = _a === void 0 ? 6 : _a, _b = props.inputPlaceholder, inputPlaceholder = _b === void 0 ? 0 : _b, _c = props.inputType, inputType = _c === void 0 ? 'number' : _c, separatorComponent = props.separatorComponent, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus;
+    var _d = useState(''), otp = _d[0], setOtp = _d[1];
     var fillClass = useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'inputFill',
@@ -74,9 +80,26 @@ function Code(props) {
         prefix: 'width_',
         propsKey: 'width',
     });
+    var appearanceConfig = appearance && choiceConfig.appearance && choiceConfig.appearance[appearance];
     // NOTE: too many dependencies for "useCallback" and possible too many checks
     var renderInput = function (otpInputProps) {
-        return (jsx("input", __assign({}, otpInputProps, { className: clsx('code__input', caretClass, fillClass, fillHoverClass, placeholderClass, shapeClass, textSizeClass, textColorClass, weightClass, borderWidthClass, borderColorClass, borderColorHoverClass, borderColorFocusClass, sizeClass, fillClass), autoComplete: "one-time-code", onBlur: function (event) {
+        return (jsx("input", __assign({}, otpInputProps, { className: clsx('code__input', caretClass, fillClass ||
+                ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
+                    "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), fillHoverClass ||
+                ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
+                    "fill_hover_".concat(appearanceConfig.fillHover).replace(/([A-Z])/g, '-$1').toLowerCase()), placeholderClass, shapeClass ||
+                ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.shape) &&
+                    "code__input_shape_".concat(appearanceConfig.shape)
+                        .replace(/([A-Z])/g, '-$1')
+                        .toLowerCase()), textSizeClass ||
+                ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize) &&
+                    "text_size_".concat(appearanceConfig.textSize).replace(/([A-Z])/g, '-$1').toLowerCase()), textColorClass ||
+                ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor) &&
+                    "text-color_".concat(appearanceConfig.textColor).replace(/([A-Z])/g, '-$1').toLowerCase()), weightClass, borderWidthClass, borderColorClass ||
+                ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
+                    "border-color_".concat(appearanceConfig.borderColor)
+                        .replace(/([A-Z])/g, '-$1')
+                        .toLowerCase()), borderColorHoverClass, borderColorFocusClass, sizeClass), autoComplete: "one-time-code", onBlur: function (event) {
                 onBlur && onBlur(event);
                 otpInputProps.onBlur(event);
             }, onFocus: function (event) {
@@ -90,20 +113,17 @@ function Code(props) {
     return (jsxs("div", { className: clsx(className, 'code', widthClass), children: [before, jsx(OtpInput, { containerStyle: clsx(className, 'code__wrapper', gapClass), inputType: inputType, numInputs: inputCount, placeholder: inputPlaceholder, renderInput: renderInput, renderSeparator: separatorComponent || null, shouldAutoFocus: inputAutoFocus, value: otp, onChange: setOtp }), after] }));
 }
 Code.defaultProps = {
-    inputCount: 6,
-    inputType: 'number',
-    inputSize: 'normal',
-    inputBorderWidth: 1,
-    inputPlaceholder: 0,
     inputBorderColor: 'surfaceBorderTertiary',
     inputBorderColorHover: 'surfaceBorderQuaternary',
     inputBorderFocusColor: 'surfaceBorderAccent',
+    inputBorderWidth: 1,
+    inputCaretColor: 'surfaceItemAccent',
     inputFill: 'surfacePrimary',
     inputFillHover: 'surfaceSecondary',
     inputShape: 'rounded',
+    inputSize: 'normal',
     inputTextColor: 'surfaceTextPrimary',
     inputTextSize: 'xxl',
-    inputCaretColor: 'surfaceItemAccent',
 };
 
-export { Code };
+export { Code, codeConfig };

package/dist/components/ContextMenu.js

@@ -1,27 +1,27 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
-import { D as Divider } from '../Divider-U5UdY-ef.js';
-import { I as Icon } from '../Icon-ClsRaxDk.js';
-import { T as Text } from '../Text-kxGZButz.js';
+import { D as Divider } from '../Divider-DE2Q5J36.js';
+import { I as Icon } from '../Icon-B7BJo5kW.js';
+import { T as Text } from '../Text-DlSG_p4u.js';
 import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
+import '../appearance/Divider.js';
 import '../hooks/useStyles.js';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
+import '../tslib.es6-5FtW-kfi.js';
 import 'react-inlinesvg';
 import '../appearance/Icon.js';
-import '../Link-CzC1kU5C.js';
-import '../tslib.es6-w7hdJ3oZ.js';
-import '../Tooltip-ccRCMYQM.js';
+import '../Link-CeQuavin.js';
+import '../Tooltip-f5EWhsGj.js';
 import '../appearance/Tooltip.js';
-import '../Title-CQ_Fr1hO.js';
+import '../Title-mkus84Rh.js';
 import '../appearance/Title.js';
 import '../appearance/Text.js';
 
@@ -37,21 +37,9 @@ function ContextMenu(props) {
     });
     return (jsx("div", { className: clsx(className, 'context-menu', set && "context-menu_set_".concat(set), shapeClass, fillClass), id: id, onClick: onClick, children: children }));
 }
-ContextMenu.defaultProps = {
-    tag: 'div',
-};
 
 function ContextMenuItem(props) {
-    var id = props.id, className = props.className, label = props.label, dividerWidth = props.dividerWidth, dividerDirection = props.dividerDirection, dividerSize = props.dividerSize, dividerFill = props.dividerFill, iconBefore = props.iconBefore, iconBeforeSize = props.iconBeforeSize, iconBeforeBgFill = props.iconBeforeBgFill, iconBeforeFill = props.iconBeforeFill, iconAfter = props.iconAfter, iconAfterSize = props.iconAfterSize, iconAfterBgFill = props.iconAfterBgFill, iconAfterFill = props.iconAfterFill, onClick = props.onClick, labelTextColor = props.labelTextColor, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight;
-    useDeviceTargetClass(props, {
-        propsKey: 'labelTextSize',
-    });
-    useDeviceTargetClass(props, {
-        propsKey: 'labelTextColor',
-    });
-    useDeviceTargetClass(props, {
-        propsKey: 'labelTextWeight',
-    });
+    var id = props.id, className = props.className, dividerDirection = props.dividerDirection, dividerFill = props.dividerFill, dividerSize = props.dividerSize, dividerWidth = props.dividerWidth, iconAfter = props.iconAfter, iconAfterBgFill = props.iconAfterBgFill, iconAfterFill = props.iconAfterFill, iconAfterSize = props.iconAfterSize, iconBefore = props.iconBefore, iconBeforeBgFill = props.iconBeforeBgFill, iconBeforeFill = props.iconBeforeFill, iconBeforeSize = props.iconBeforeSize, label = props.label, labelTextColor = props.labelTextColor, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, onClick = props.onClick;
     var fillClass = useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -60,7 +48,7 @@ function ContextMenuItem(props) {
         prefix: 'fill_hover_',
         propsKey: 'fillHover',
     });
-    return (jsxs("div", { className: clsx(className, 'context-menu__item', fillClass, fillHoverClass, onClick && 'cursor_type_pointer'), id: id, onClick: onClick, children: [jsxs("div", { className: "context-menu__item-wrapper", children: [iconBefore && (jsx(Icon, { className: "context-menu__item-icon-before", SvgImage: iconBefore, size: iconBeforeSize, bgFill: iconBeforeBgFill, fill: iconBeforeFill })), label && (jsx(Text, { className: "context-menu__item-title", textColor: labelTextColor, size: labelTextSize, textWeight: labelTextWeight, children: label })), iconAfter && (jsx(Icon, { className: "context-menu__item-icon-after", SvgImage: iconAfter, size: iconAfterSize, bgFill: iconAfterBgFill, fill: iconAfterFill }))] }), jsx(Divider, { className: "context-menu__item-divider", width: dividerWidth, direction: dividerDirection, size: dividerSize, fill: dividerFill })] }));
+    return (jsxs("div", { className: clsx(className, 'context-menu__item', fillClass, fillHoverClass, onClick && 'cursor_type_pointer'), id: id, onClick: onClick, children: [jsxs("div", { className: "context-menu__item-wrapper", children: [iconBefore && (jsx(Icon, { className: "context-menu__item-icon-before", fill: iconBeforeFill, bgFill: iconBeforeBgFill, size: iconBeforeSize, SvgImage: iconBefore })), label && (jsx(Text, { className: "context-menu__item-title", size: labelTextSize, textColor: labelTextColor, textWeight: labelTextWeight, children: label })), iconAfter && (jsx(Icon, { className: "context-menu__item-icon-after", fill: iconAfterFill, bgFill: iconAfterBgFill, size: iconAfterSize, SvgImage: iconAfter }))] }), jsx(Divider, { className: "context-menu__item-divider", width: dividerWidth, fill: dividerFill, direction: dividerDirection, size: dividerSize })] }));
 }
 
 export { ContextMenu, ContextMenuItem };

package/dist/components/CookiesWarning.js

@@ -3,13 +3,12 @@ import { useRef, useMemo, useCallback, useEffect } from 'react';
 import clsx from 'clsx';
 import Cookies from 'js-cookie';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
-import { B as Button } from '../Button-avhviao1.js';
+import { B as Button } from '../Button-DS2l65oq.js';
 import { G as Group } from '../Group-Dc70Z4_7.js';
-import { T as Text } from '../Text-kxGZButz.js';
+import { T as Text } from '../Text-DlSG_p4u.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../appearance/Button.js';
@@ -17,22 +16,22 @@ import '../hooks/useStyles.js';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import '../Icon-ClsRaxDk.js';
+import '../Icon-B7BJo5kW.js';
+import '../tslib.es6-5FtW-kfi.js';
 import 'react-inlinesvg';
 import '../appearance/Icon.js';
-import '../Link-CzC1kU5C.js';
-import '../tslib.es6-w7hdJ3oZ.js';
-import '../Tooltip-ccRCMYQM.js';
+import '../Link-CeQuavin.js';
+import '../Tooltip-f5EWhsGj.js';
 import '../appearance/Tooltip.js';
-import '../Title-CQ_Fr1hO.js';
+import '../Title-mkus84Rh.js';
 import '../appearance/Title.js';
-import '../Loader-CU_5Ydmy.js';
+import '../Loader-CqEocvjh.js';
 import '../appearance/Loader.js';
 import '../appearance/Group.js';
 import '../appearance/Text.js';
 
 function CookiesWarning(props) {
-    var _a = props.message, message = _a === void 0 ? 'The site uses cookies to collect technical information, to optimize the design and improvement of the website, and to provide certain functions. By using the website, you agree to the use of «cookies».' : _a, className = props.className, buttonFill = props.buttonFill, buttonFillHover = props.buttonFillHover, _b = props.buttonLabel, buttonLabel = _b === void 0 ? 'I agree' : _b, buttonLabelSize = props.buttonLabelSize, buttonLabelTextColor = props.buttonLabelTextColor, buttonShape = props.buttonShape, buttonSize = props.buttonSize, textSize = props.textSize, textColor = props.textColor, buttonWidth = props.buttonWidth, _c = props.isHideOnScroll, isHideOnScroll = _c === void 0 ? false : _c;
+    var _a = props.isHideOnScroll, isHideOnScroll = _a === void 0 ? false : _a, buttonFill = props.buttonFill, buttonFillHover = props.buttonFillHover, _b = props.buttonLabel, buttonLabel = _b === void 0 ? 'I agree' : _b, buttonLabelSize = props.buttonLabelSize, buttonLabelTextColor = props.buttonLabelTextColor, buttonShape = props.buttonShape, buttonSize = props.buttonSize, buttonWidth = props.buttonWidth, className = props.className, _c = props.message, message = _c === void 0 ? 'The site uses cookies to collect technical information, to optimize the design and improvement of the website, and to provide certain functions. By using the website, you agree to the use of «cookies».' : _c, textColor = props.textColor, textSize = props.textSize;
     var cookiesWarningRef = useRef(null);
     var isOpen = useMemo(function () { return Cookies.get('cookies-warning') !== 'close'; }, []);
     var closeCookiesWarning = useCallback(function () {
@@ -65,12 +64,7 @@ function CookiesWarning(props) {
     var gap = useDeviceTargetClass(props, {
         propsKey: 'gap',
     });
-    return isOpen ? (jsx("div", { className: clsx('cookies-warning', className, fillClass, fillGradientClass), ref: cookiesWarningRef, children: jsxs(Group, { direction: "vertical", className: "cookies-warning__inner", gap: gap ? gap : undefined, children: [jsx(Text, { size: textSize, textColor: textColor, children: message }), jsx(Button, { width: buttonWidth, fill: buttonFill, fillHover: buttonFillHover, shape: buttonShape, size: buttonSize, labelTextColor: buttonLabelTextColor, labelTextSize: buttonLabelSize, onClick: closeCookiesWarning, children: buttonLabel })] }) })) : null;
+    return isOpen ? (jsx("div", { className: clsx('cookies-warning', className, fillClass, fillGradientClass), ref: cookiesWarningRef, children: jsxs(Group, { className: "cookies-warning__inner", direction: "vertical", gap: gap ? gap : undefined, children: [jsx(Text, { size: textSize, textColor: textColor, children: message }), jsx(Button, { width: buttonWidth, labelTextColor: buttonLabelTextColor, labelTextSize: buttonLabelSize, fill: buttonFill, fillHover: buttonFillHover, shape: buttonShape, size: buttonSize, onClick: closeCookiesWarning, children: buttonLabel })] }) })) : null;
 }
-CookiesWarning.defaultProps = {
-    message: 'The site uses cookies to collect technical information, to optimize the design and improvement of the website, and to provide certain functions. By using the website, you agree to the use of «cookies».',
-    buttonText: 'I agree',
-    isHideOnScroll: false,
-};
 
 export { CookiesWarning };

package/dist/components/DadataHintField.js

@@ -1,15 +1,14 @@
-import { a as __assign, _ as __rest } from '../tslib.es6-w7hdJ3oZ.js';
+import { _ as __assign, a as __rest } from '../tslib.es6-5FtW-kfi.js';
 import { jsx } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 import clsx from 'clsx';
 import { PartySuggestions } from 'react-dadata';
-import { I as Input } from '../Input-DbzsXvEf.js';
+import { I as Input } from '../Input-HGM-rzzr.js';
 import '../appearance/Input.js';
 import '../hooks/useDeviceTargetClass.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';