@itcase/ui 1.1.6 → 1.1.8

package/dist/components/Code.js

@@ -1,32 +1,24 @@
-'use strict';
-
-var React = require('react');
-var PropTypes = require('prop-types');
-var clsx = require('clsx');
-var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
-require('lodash/castArray');
-require('lodash/camelCase');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries.js');
-require('react-responsive');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
-var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+import React__default, { useState, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
+import 'lodash/castArray';
+import 'lodash/camelCase';
+import '../context/UIContext.js';
+import '../hooks/useMediaQueries.js';
+import 'react-responsive';
 
 var isStyleObject = function (obj) { return typeof obj === 'object' && obj !== null; };
 var OTPInput = function (_a) {
     var _b = _a.value, value = _b === void 0 ? '' : _b, _c = _a.numInputs, numInputs = _c === void 0 ? 4 : _c, onChange = _a.onChange, onPaste = _a.onPaste, renderInput = _a.renderInput, _d = _a.shouldAutoFocus, shouldAutoFocus = _d === void 0 ? false : _d, _e = _a.inputType, inputType = _e === void 0 ? 'text' : _e, renderSeparator = _a.renderSeparator, placeholder = _a.placeholder, containerStyle = _a.containerStyle, inputStyle = _a.inputStyle, _f = _a.skipDefaultStyles, skipDefaultStyles = _f === void 0 ? false : _f;
-    var _g = React__default.default.useState(0), activeInput = _g[0], setActiveInput = _g[1];
-    var inputRefs = React__default.default.useRef([]);
+    var _g = React__default.useState(0), activeInput = _g[0], setActiveInput = _g[1];
+    var inputRefs = React__default.useRef([]);
     var getOTPValue = function () { return (value ? value.toString().split('') : []); };
     var isInputNum = inputType === 'number' || inputType === 'tel';
-    React__default.default.useEffect(function () {
+    React__default.useEffect(function () {
         inputRefs.current = inputRefs.current.slice(0, numInputs);
     }, [numInputs]);
-    React__default.default.useEffect(function () {
+    React__default.useEffect(function () {
         var _a;
         if (shouldAutoFocus) {
             (_a = inputRefs.current[0]) === null || _a === void 0 ? void 0 : _a.focus();
@@ -162,9 +154,9 @@ var OTPInput = function (_a) {
         focusInput(nextActiveInput);
         handleOTPChange(otp);
     };
-    return (React__default.default.createElement("div", { style: Object.assign({ display: 'flex', alignItems: 'center' }, isStyleObject(containerStyle) && containerStyle), className: typeof containerStyle === 'string' ? containerStyle : undefined, onPaste: onPaste }, Array.from({ length: numInputs }, function (_, index) { return index; }).map(function (index) {
+    return (React__default.createElement("div", { style: Object.assign({ display: 'flex', alignItems: 'center' }, isStyleObject(containerStyle) && containerStyle), className: typeof containerStyle === 'string' ? containerStyle : undefined, onPaste: onPaste }, Array.from({ length: numInputs }, function (_, index) { return index; }).map(function (index) {
         var _a, _b, _c;
-        return (React__default.default.createElement(React__default.default.Fragment, { key: index },
+        return (React__default.createElement(React__default.Fragment, { key: index },
             renderInput({
                 value: (_a = getOTPValue()[index]) !== null && _a !== void 0 ? _a : '',
                 placeholder: (_c = (_b = getPlaceholderValue()) === null || _b === void 0 ? void 0 : _b[index]) !== null && _c !== void 0 ? _c : undefined,
@@ -200,73 +192,73 @@ function Code(props) {
     onChange,
     onFocus
   } = props;
-  const [otp, setOtp] = React.useState('');
-  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const [otp, setOtp] = useState('');
+  const fillClass = useDeviceTargetClass(props, {
     prefix: 'fill_',
     propsKey: 'inputFill'
   });
-  const fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const fillHoverClass = useDeviceTargetClass(props, {
     prefix: 'fill_hover_',
     propsKey: 'inputFillHover'
   });
-  const sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const sizeClass = useDeviceTargetClass(props, {
     prefix: 'code__input_size_',
     propsKey: 'inputSize'
   });
-  const shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const shapeClass = useDeviceTargetClass(props, {
     prefix: 'code__input_shape_',
     propsKey: 'inputShape'
   });
-  const textSizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const textSizeClass = useDeviceTargetClass(props, {
     prefix: 'text_size_',
     propsKey: 'inputTextSize'
   });
-  const textColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const textColorClass = useDeviceTargetClass(props, {
     prefix: 'text-color_',
     propsKey: 'inputTextColor'
   });
-  const caretClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const caretClass = useDeviceTargetClass(props, {
     prefix: 'caret-color_',
     propsKey: 'inputCaretColor'
   });
-  const placeholderClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const placeholderClass = useDeviceTargetClass(props, {
     prefix: 'placeholder-text-color_',
     propsKey: 'inputPlaceholderTextColor'
   });
-  const weightClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const weightClass = useDeviceTargetClass(props, {
     prefix: 'text-weight_',
     propsKey: 'inputTextWeight'
   });
-  const borderWidthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const borderWidthClass = useDeviceTargetClass(props, {
     prefix: 'border-width_',
     propsKey: 'inputBorderWidth'
   });
-  const borderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const borderColorClass = useDeviceTargetClass(props, {
     prefix: 'border-color_',
     propsKey: 'inputBorderColor'
   });
-  const borderColorHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const borderColorHoverClass = useDeviceTargetClass(props, {
     prefix: 'border-color_hover_',
     propsKey: 'inputBorderColorHover'
   });
-  const borderColorFocusClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const borderColorFocusClass = useDeviceTargetClass(props, {
     prefix: 'border-color_focus_',
     propsKey: 'inputBorderFocusColor'
   });
-  const gapClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const gapClass = useDeviceTargetClass(props, {
     prefix: 'gap_',
     propsKey: 'gap'
   });
-  const widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const widthClass = useDeviceTargetClass(props, {
     prefix: 'width_',
     propsKey: 'width'
   });
 
   // NOTE: too many dependencies for "useCallback" and possible too many checks
   const renderInput = otpInputProps => {
-    return /*#__PURE__*/React__default.default.createElement("input", Object.assign({}, otpInputProps, {
+    return /*#__PURE__*/React__default.createElement("input", Object.assign({}, otpInputProps, {
       autocomplete: "one-time-code",
-      className: clsx__default.default('code__input', caretClass, fillClass, fillHoverClass, placeholderClass, shapeClass, textSizeClass, textColorClass, weightClass, borderWidthClass, borderColorClass, borderColorHoverClass, borderColorFocusClass, sizeClass, fillClass),
+      className: clsx('code__input', caretClass, fillClass, fillHoverClass, placeholderClass, shapeClass, textSizeClass, textColorClass, weightClass, borderWidthClass, borderColorClass, borderColorHoverClass, borderColorFocusClass, sizeClass, fillClass),
       onBlur: event => {
         onBlur && onBlur(event);
         otpInputProps.onBlur(event);
@@ -277,13 +269,13 @@ function Code(props) {
       }
     }));
   };
-  React.useEffect(() => {
+  useEffect(() => {
     onChange && onChange(otp);
   }, [otp]);
-  return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'code', widthClass)
-  }, before, /*#__PURE__*/React__default.default.createElement(OTPInput, {
-    containerStyle: clsx__default.default(className, 'code__wrapper', gapClass),
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: clsx(className, 'code', widthClass)
+  }, before, /*#__PURE__*/React__default.createElement(OTPInput, {
+    containerStyle: clsx(className, 'code__wrapper', gapClass),
     inputType: inputType,
     numInputs: inputCount,
     placeholder: inputPlaceholder,
@@ -295,7 +287,7 @@ function Code(props) {
   }), after);
 }
 Code.propTypes = {
-  value: PropTypes__default.default.number
+  value: PropTypes.number
 };
 Code.defaultProps = {
   inputCount: 6,
@@ -434,4 +426,4 @@ Code.__docgenInfo = {
   }
 };
 
-exports.Code = Code;
+export { Code };

package/dist/components/ContextMenu.js

@@ -1,246 +1,34 @@
-'use strict';
-
-var React = require('react');
-var PropTypes = require('prop-types');
-var clsx = require('clsx');
-var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
-var shape = require('../constants/componentProps/shape.js');
-var index$1 = require('./Text.js');
-var index = require('./Icon.js');
-var index$2 = require('./Divider.js');
-require('lodash/castArray');
-require('lodash/camelCase');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries.js');
-require('react-responsive');
-require('../constants/componentProps/textColor.js');
-require('../constants/componentProps/textColorActive.js');
-require('../constants/componentProps/textColorHover.js');
-require('../constants/componentProps/size.js');
-require('../constants/componentProps/textStyle.js');
-require('../constants/componentProps/textGradient.js');
-require('../constants/componentProps/textWeight.js');
-require('../hooks/useStyles.js');
-require('lodash/maxBy');
-require('lodash/upperFirst');
-require('../hooks/styleAttributes.js');
-require('react-inlinesvg');
-require('./Link.js');
-require('../constants/componentProps/fill.js');
-require('../constants/componentProps/type.js');
-require('../constants/componentProps/underline.js');
-require('../constants/componentProps/borderColor.js');
-require('../constants/componentProps/borderType.js');
-require('../constants/componentProps/iconSize.js');
-require('../constants/componentProps/strokeColor.js');
-require('./Tooltip.js');
-require('./Title.js');
-require('../constants/componentProps/textAlign.js');
-require('../constants/componentProps/titleSize.js');
-require('../constants/componentProps/wrap.js');
-require('../constants/componentProps/textSize.js');
-require('../constants/componentProps/direction.js');
-require('../constants/componentProps/width.js');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
-var clsx__default = /*#__PURE__*/_interopDefault(clsx);
-
-function ContextMenu(props) {
-  const {
-    id,
-    children,
-    className,
-    set,
-    onClick
-  } = props;
-  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'fill_',
-    propsKey: 'fill'
-  });
-  const shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'context-menu_shape_',
-    propsKey: 'shape'
-  });
-  return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'context-menu', set && `context-menu_set_${set}`, shapeClass, fillClass),
-    id: id,
-    onClick: onClick
-  }, children);
-}
-ContextMenu.propTypes = {
-  className: PropTypes__default.default.string,
-  id: PropTypes__default.default.string,
-  set: PropTypes__default.default.string,
-  shape: PropTypes__default.default.oneOf(shape.default),
-  shapeDesktop: PropTypes__default.default.oneOf(shape.default),
-  shapeMobile: PropTypes__default.default.oneOf(shape.default),
-  shapeTablet: PropTypes__default.default.oneOf(shape.default),
-  onClick: PropTypes__default.default.func
-};
-ContextMenu.defaultProps = {
-  tag: 'div'
-};
-ContextMenu.__docgenInfo = {
-  "description": "",
-  "methods": [],
-  "displayName": "ContextMenu",
-  "props": {
-    "tag": {
-      "defaultValue": {
-        "value": "'div'",
-        "computed": false
-      },
-      "required": false
-    },
-    "className": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "id": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "set": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "shape": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "shapeProps"
-      },
-      "required": false
-    },
-    "shapeDesktop": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "shapeProps"
-      },
-      "required": false
-    },
-    "shapeMobile": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "shapeProps"
-      },
-      "required": false
-    },
-    "shapeTablet": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "shapeProps"
-      },
-      "required": false
-    },
-    "onClick": {
-      "description": "",
-      "type": {
-        "name": "func"
-      },
-      "required": false
-    }
-  }
-};
-
-function ContextMenuItem(props) {
-  const {
-    id,
-    children,
-    className,
-    label,
-    dividerWidth,
-    dividerDirection,
-    dividerSize,
-    dividerFill,
-    iconBefore,
-    iconBeforeSize,
-    iconBeforeBgFill,
-    iconBeforeFill,
-    iconBeforeStroke,
-    iconAfter,
-    iconAfterSize,
-    iconAfterBgFill,
-    iconAfterFill,
-    iconAfterStroke,
-    isActive,
-    onClick
-  } = props;
-  const labelTextSizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    propsKey: 'labelTextSize'
-  });
-  const labelTextColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    propsKey: 'labelTextColor'
-  });
-  const labelTextWeightClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    propsKey: 'labelTextWeight'
-  });
-  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'fill_',
-    propsKey: 'fill'
-  });
-  const fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'fill_hover_',
-    propsKey: 'fillHover'
-  });
-  return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'context-menu__item', fillClass, fillHoverClass, onClick && 'cursor_type_pointer'),
-    id: id,
-    onClick: onClick
-  }, /*#__PURE__*/React__default.default.createElement("div", {
-    className: "context-menu__item-wrapper"
-  }, iconBefore && /*#__PURE__*/React__default.default.createElement(index.Icon, {
-    className: "context-menu__item-icon-before",
-    SvgImage: iconBefore,
-    size: iconBeforeSize,
-    bgFill: iconBeforeBgFill,
-    fill: iconBeforeFill,
-    stroke: iconBeforeStroke
-  }), label && /*#__PURE__*/React__default.default.createElement(index$1.Text, {
-    className: "context-menu__item-title",
-    textColor: labelTextColorClass,
-    size: labelTextSizeClass,
-    textWeight: labelTextWeightClass
-  }, label), iconAfter && /*#__PURE__*/React__default.default.createElement(index.Icon, {
-    className: "context-menu__item-icon-after",
-    SvgImage: iconAfter,
-    size: iconAfterSize,
-    bgFill: iconAfterBgFill,
-    fill: iconAfterFill,
-    stroke: iconAfterStroke
-  })), /*#__PURE__*/React__default.default.createElement(index$2.Divider, {
-    className: "context-menu__item-divider",
-    width: dividerWidth,
-    direction: dividerDirection,
-    size: dividerSize,
-    fill: dividerFill
-  }));
-}
-ContextMenuItem.propTypes = {};
-ContextMenuItem.__docgenInfo = {
-  "description": "",
-  "methods": [],
-  "displayName": "ContextMenuItem"
-};
-
-exports.ContextMenu = ContextMenu;
-exports.ContextMenuItem = ContextMenuItem;
+export { C as ContextMenu, a as ContextMenuItem } from '../ContextMenuItem-BPqsjmSA.js';
+import 'react';
+import 'prop-types';
+import 'clsx';
+import '../hooks/useDeviceTargetClass.js';
+import 'lodash/castArray';
+import 'lodash/camelCase';
+import '../context/UIContext.js';
+import '../hooks/useMediaQueries.js';
+import 'react-responsive';
+import '../constants/componentProps/shape.js';
+import '../Text-BcGbRc14.js';
+import '../jsx-runtime-ClDdVO4Q.js';
+import '../hooks/useStyles.js';
+import 'lodash/maxBy';
+import 'lodash/upperFirst';
+import '../hooks/styleAttributes.js';
+import '../Icon-Dn2eEZvb.js';
+import '../Link-ByBzBRDH.js';
+import 'react-inlinesvg';
+import './Tooltip.js';
+import './Title.js';
+import '../constants/componentProps/fill.js';
+import '../constants/componentProps/textAlign.js';
+import '../constants/componentProps/textColor.js';
+import '../constants/componentProps/textGradient.js';
+import '../constants/componentProps/textStyle.js';
+import '../constants/componentProps/textWeight.js';
+import '../constants/componentProps/titleSize.js';
+import '../constants/componentProps/type.js';
+import '../constants/componentProps/wrap.js';
+import '../constants/componentProps/size.js';
+import '../constants/componentProps/textSize.js';
+import '../Divider-BlBwMHgl.js';

package/dist/components/CookiesWarning.js

@@ -1,57 +1,39 @@
-'use strict';
-
-var React = require('react');
-var PropTypes = require('prop-types');
-var Cookies = require('js-cookie');
-var clsx = require('clsx');
-var index$1 = require('./Text.js');
-var index$2 = require('./Button.js');
-var index = require('./Group.js');
-require('lodash/camelCase');
-require('lodash/maxBy');
-require('lodash/upperFirst');
-require('../context/UIContext.js');
-var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
-require('../constants/componentProps/textColor.js');
-require('../constants/componentProps/textColorActive.js');
-require('../constants/componentProps/textColorHover.js');
-require('../constants/componentProps/size.js');
-require('../constants/componentProps/textStyle.js');
-require('../constants/componentProps/textGradient.js');
-require('../constants/componentProps/textWeight.js');
-require('../hooks/useStyles.js');
-require('../hooks/styleAttributes.js');
-require('./Icon.js');
-require('react-inlinesvg');
-require('./Link.js');
-require('../constants/componentProps/fill.js');
-require('../constants/componentProps/type.js');
-require('../constants/componentProps/underline.js');
-require('../constants/componentProps/borderColor.js');
-require('../constants/componentProps/borderType.js');
-require('../constants/componentProps/iconSize.js');
-require('../constants/componentProps/shape.js');
-require('../constants/componentProps/strokeColor.js');
-require('./Tooltip.js');
-require('./Title.js');
-require('../constants/componentProps/textAlign.js');
-require('../constants/componentProps/titleSize.js');
-require('../constants/componentProps/wrap.js');
-require('../constants/componentProps/textSize.js');
-require('./Loader.js');
-require('../constants/componentProps/width.js');
-require('../constants/componentProps/direction.js');
-require('../constants/componentProps/stacking.js');
-require('../hooks/useMediaQueries.js');
-require('react-responsive');
-require('lodash/castArray');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
-var Cookies__default = /*#__PURE__*/_interopDefault(Cookies);
-var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+import React__default, { useRef, useMemo, useCallback, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import Cookies from 'js-cookie';
+import clsx from 'clsx';
+import { T as Text } from '../Text-BcGbRc14.js';
+import { B as Button } from '../Button-B7vbiqrJ.js';
+import { G as Group } from '../Group-fbVPmr8W.js';
+import 'lodash/camelCase';
+import 'lodash/maxBy';
+import 'lodash/upperFirst';
+import '../context/UIContext.js';
+import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
+import '../jsx-runtime-ClDdVO4Q.js';
+import '../hooks/useStyles.js';
+import '../hooks/styleAttributes.js';
+import '../Icon-Dn2eEZvb.js';
+import '../Link-ByBzBRDH.js';
+import 'react-inlinesvg';
+import './Tooltip.js';
+import './Title.js';
+import '../constants/componentProps/fill.js';
+import '../constants/componentProps/textAlign.js';
+import '../constants/componentProps/textColor.js';
+import '../constants/componentProps/textGradient.js';
+import '../constants/componentProps/textStyle.js';
+import '../constants/componentProps/textWeight.js';
+import '../constants/componentProps/titleSize.js';
+import '../constants/componentProps/type.js';
+import '../constants/componentProps/wrap.js';
+import '../constants/componentProps/size.js';
+import '../constants/componentProps/textSize.js';
+import '../constants/componentProps/shape.js';
+import './Loader.js';
+import '../hooks/useMediaQueries.js';
+import 'react-responsive';
+import 'lodash/castArray';
 
 function CookiesWarning(props) {
   const {
@@ -69,13 +51,13 @@ function CookiesWarning(props) {
     buttonWidth,
     isHideOnScroll
   } = props;
-  const cookiesWarningRef = React.useRef(null);
-  const isOpen = React.useMemo(() => Cookies__default.default.get('cookies-warning') !== 'close', []);
-  const closeCookiesWarning = React.useCallback(() => {
+  const cookiesWarningRef = useRef(null);
+  const isOpen = useMemo(() => Cookies.get('cookies-warning') !== 'close', []);
+  const closeCookiesWarning = useCallback(() => {
     cookiesWarningRef.current?.classList.add('cookies-warning_state_hidden');
-    Cookies__default.default.set('cookies-warning', 'close');
+    Cookies.set('cookies-warning', 'close');
   }, []);
-  React.useEffect(() => {
+  useEffect(() => {
     if (isHideOnScroll) {
       window.addEventListener('scroll', closeCookiesWarning, true);
     }
@@ -84,35 +66,35 @@ function CookiesWarning(props) {
     };
   }, []); // eslint-disable-line
 
-  React.useEffect(() => {
+  useEffect(() => {
     // isHideOnScroll &&
     if (!isOpen) {
       window.removeEventListener('scroll', closeCookiesWarning, true);
     }
   }, [isOpen]); // eslint-disable-line
 
-  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const fillClass = useDeviceTargetClass(props, {
     prefix: 'fill_',
     propsKey: 'fill'
   });
-  const fillGradientClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const fillGradientClass = useDeviceTargetClass(props, {
     prefix: 'fill-gradient_',
     propsKey: 'fillGradient'
   });
-  const gap = useDeviceTargetClass.useDeviceTargetClass(props, {
+  const gap = useDeviceTargetClass(props, {
     propsKey: 'gap'
   });
-  return isOpen ? /*#__PURE__*/React__default.default.createElement("div", {
+  return isOpen ? /*#__PURE__*/React__default.createElement("div", {
     ref: cookiesWarningRef,
-    className: clsx__default.default('cookies-warning', className, fillClass, fillGradientClass)
-  }, /*#__PURE__*/React__default.default.createElement(index.Group, {
+    className: clsx('cookies-warning', className, fillClass, fillGradientClass)
+  }, /*#__PURE__*/React__default.createElement(Group, {
     direction: "vertical",
     className: "cookies-warning__inner",
     gap: gap
-  }, /*#__PURE__*/React__default.default.createElement(index$1.Text, {
+  }, /*#__PURE__*/React__default.createElement(Text, {
     size: textSize,
     textColor: textColor
-  }, message), /*#__PURE__*/React__default.default.createElement(index$2.Button, {
+  }, message), /*#__PURE__*/React__default.createElement(Button, {
     width: buttonWidth,
     fill: buttonFill,
     fillHover: buttonFillHover,
@@ -124,10 +106,10 @@ function CookiesWarning(props) {
   }, buttonLabel))) : null;
 }
 CookiesWarning.propTypes = {
-  buttonClass: PropTypes__default.default.string,
-  buttonText: PropTypes__default.default.string,
-  isHideOnScroll: PropTypes__default.default.bool,
-  message: PropTypes__default.default.string
+  buttonClass: PropTypes.string,
+  buttonText: PropTypes.string,
+  isHideOnScroll: PropTypes.bool,
+  message: PropTypes.string
 };
 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».',
@@ -186,4 +168,4 @@ CookiesWarning.__docgenInfo = {
   }
 };
 
-exports.CookiesWarning = CookiesWarning;
+export { CookiesWarning };