'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
var React = require('react');
var index = require('../../utils/index.js');
var base$1 = require('./variations/_size/base.js');
var base = require('./variations/_view/base.js');
var base$2 = require('./variations/_hint-view/base.js');
var base$3 = require('./variations/_hint-size/base.js');
var base$4 = require('./variations/_disabled/base.js');
var base$5 = require('./variations/_readonly/base.js');
var index$1 = require('./utils/index.js');
var Range_styles = require('./Range.styles.js');
var Range_tokens = require('./Range.tokens.js');
var useForkRef = require('../../hooks/useForkRef.js');
var useOutsideClick = require('../../hooks/useOutsideClick.js');
var InformationWrapper_styles = require('./ui/InformationWrapper/InformationWrapper.styles.js');
var Hint = require('../InformationWrapper/ui/Hint/Hint.js');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var React__default = /*#__PURE__*/_interopDefault(React);

var _StyledDivider;
var _excluded = ["className", "firstValue", "secondValue", "firstValueError", "secondValueError", "firstValueSuccess", "secondValueSuccess", "firstValueEdited", "secondValueEdited", "firstPlaceholder", "secondPlaceholder", "appearance", "hasClearDivider", "view", "size", "readOnly", "disabled", "required", "requiredIndicatorPlacement", "hasRequiredIndicator", "hintTrigger", "hintText", "hintView", "hintSize", "hintTargetIcon", "hintTargetPlacement", "hintPlacement", "hintHasArrow", "hintOffset", "hintWidth", "hintContentLeft", "label", "leftHelper", "titleCaption", "contentLeft", "contentRight", "firstTextfieldContentLeft", "firstTextfieldContentRight", "secondTextfieldContentLeft", "secondTextfieldContentRight", "firstTextfieldTextBefore", "secondTextfieldTextBefore", "firstTextfieldTextAfter", "secondTextfieldTextAfter", "dividerVariant", "dividerIcon", "autoComplete", "onChangeFirstValue", "onChangeSecondValue", "onSearchFirstValue", "onSearchSecondValue", "onFocusFirstTextfield", "onFocusSecondTextfield", "onBlurFirstTextfield", "onBlurSecondTextfield"];
var rangeRoot = function rangeRoot(Root) {
  return /*#__PURE__*/React.forwardRef(function (_ref, ref) {
    var _StyledDivider2;
    var className = _ref.className,
      firstValue = _ref.firstValue,
      secondValue = _ref.secondValue,
      firstValueError = _ref.firstValueError,
      secondValueError = _ref.secondValueError,
      firstValueSuccess = _ref.firstValueSuccess,
      secondValueSuccess = _ref.secondValueSuccess,
      firstValueEdited = _ref.firstValueEdited,
      secondValueEdited = _ref.secondValueEdited,
      firstPlaceholder = _ref.firstPlaceholder,
      secondPlaceholder = _ref.secondPlaceholder,
      appearance = _ref.appearance,
      hasClearDivider = _ref.hasClearDivider,
      view = _ref.view,
      size = _ref.size,
      _ref$readOnly = _ref.readOnly,
      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
      _ref$disabled = _ref.disabled,
      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
      _ref$required = _ref.required,
      required = _ref$required === void 0 ? false : _ref$required,
      _ref$requiredIndicato = _ref.requiredIndicatorPlacement,
      requiredIndicatorPlacement = _ref$requiredIndicato === void 0 ? 'right' : _ref$requiredIndicato,
      _ref$hasRequiredIndic = _ref.hasRequiredIndicator,
      hasRequiredIndicator = _ref$hasRequiredIndic === void 0 ? false : _ref$hasRequiredIndic,
      _ref$hintTrigger = _ref.hintTrigger,
      hintTrigger = _ref$hintTrigger === void 0 ? 'hover' : _ref$hintTrigger,
      hintText = _ref.hintText,
      _ref$hintView = _ref.hintView,
      hintView = _ref$hintView === void 0 ? 'default' : _ref$hintView,
      _ref$hintSize = _ref.hintSize,
      hintSize = _ref$hintSize === void 0 ? 'm' : _ref$hintSize,
      hintTargetIcon = _ref.hintTargetIcon,
      _ref$hintTargetPlacem = _ref.hintTargetPlacement,
      hintTargetPlacement = _ref$hintTargetPlacem === void 0 ? 'outer' : _ref$hintTargetPlacem,
      _ref$hintPlacement = _ref.hintPlacement,
      hintPlacement = _ref$hintPlacement === void 0 ? 'auto' : _ref$hintPlacement,
      hintHasArrow = _ref.hintHasArrow,
      _ref$hintOffset = _ref.hintOffset,
      hintOffset = _ref$hintOffset === void 0 ? [0, 0] : _ref$hintOffset,
      hintWidth = _ref.hintWidth,
      hintContentLeft = _ref.hintContentLeft,
      label = _ref.label,
      leftHelper = _ref.leftHelper,
      titleCaption = _ref.titleCaption,
      contentLeft = _ref.contentLeft,
      contentRight = _ref.contentRight,
      firstTextfieldContentLeft = _ref.firstTextfieldContentLeft,
      firstTextfieldContentRight = _ref.firstTextfieldContentRight,
      secondTextfieldContentLeft = _ref.secondTextfieldContentLeft,
      secondTextfieldContentRight = _ref.secondTextfieldContentRight,
      firstTextfieldTextBefore = _ref.firstTextfieldTextBefore,
      secondTextfieldTextBefore = _ref.secondTextfieldTextBefore,
      firstTextfieldTextAfter = _ref.firstTextfieldTextAfter,
      secondTextfieldTextAfter = _ref.secondTextfieldTextAfter,
      _ref$dividerVariant = _ref.dividerVariant,
      dividerVariant = _ref$dividerVariant === void 0 ? 'dash' : _ref$dividerVariant,
      dividerIcon = _ref.dividerIcon,
      autoComplete = _ref.autoComplete,
      onChangeFirstValue = _ref.onChangeFirstValue,
      onChangeSecondValue = _ref.onChangeSecondValue,
      onSearchFirstValue = _ref.onSearchFirstValue,
      onSearchSecondValue = _ref.onSearchSecondValue,
      onFocusFirstTextfield = _ref.onFocusFirstTextfield,
      onFocusSecondTextfield = _ref.onFocusSecondTextfield,
      onBlurFirstTextfield = _ref.onBlurFirstTextfield,
      onBlurSecondTextfield = _ref.onBlurSecondTextfield,
      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
    var rangeRef = React.useRef(null);
    var firstTextFieldRef = React.useRef(null);
    var secondTextFieldRef = React.useRef(null);
    var hintRef = React.useRef(null);
    var _useState = React.useState(false),
      _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
      isHintVisible = _useState2[0],
      setIsHintVisible = _useState2[1];
    var noCaptionAndLabelClass = !label && !titleCaption ? Range_tokens.classes.noCaptionAndLabel : undefined;
    var clearClass = appearance === 'clear' ? Range_tokens.classes.clear : undefined;
    var clearDividerClass = hasClearDivider ? Range_tokens.classes.clearDivider : undefined;
    var clearOuterHintClass = clearClass && hintText && hintTargetPlacement === 'outer' ? Range_tokens.classes.clearHasOuterHint : undefined;
    var rangeErrorClass = firstValueError && secondValueError ? Range_tokens.classes.rangeError : undefined;
    var firstValueErrorClass = !rangeErrorClass && firstValueError ? Range_tokens.classes.rangeValueError : undefined;
    var secondValueErrorClass = !rangeErrorClass && secondValueError ? Range_tokens.classes.rangeValueError : undefined;
    var rangeSuccessClass = firstValueSuccess && secondValueSuccess ? Range_tokens.classes.rangeSuccess : undefined;
    var firstValueSuccessClass = !rangeSuccessClass && firstValueSuccess ? Range_tokens.classes.rangeValueSuccess : undefined;
    var secondValueSuccessClass = !rangeSuccessClass && secondValueSuccess ? Range_tokens.classes.rangeValueSuccess : undefined;
    var rangeEditedClass = firstValueEdited && secondValueEdited ? Range_tokens.classes.rangeEdited : undefined;
    var firstValueEditedClass = !rangeEditedClass && firstValueEdited ? Range_tokens.classes.rangeValueEdited : undefined;
    var secondValueEditedClass = !rangeEditedClass && secondValueEdited ? Range_tokens.classes.rangeValueEdited : undefined;
    var hintInnerRef = React.useRef(null);
    var hintForkRef = useForkRef.useForkRef(hintRef, hintInnerRef);
    var handleChangeFirstValue = index$1.getChangeHandler(onChangeFirstValue, disabled, readOnly);
    var handleChangeSecondValue = index$1.getChangeHandler(onChangeSecondValue, disabled, readOnly);
    var handleSearchFirstValue = index$1.getSearchHandler(onSearchFirstValue, disabled, readOnly);
    var handleSearchSecondValue = index$1.getSearchHandler(onSearchSecondValue, disabled, readOnly);
    var handleHintShow = function handleHintShow() {
      if (disabled) {
        return;
      }
      setIsHintVisible(true);
    };
    var handleHintHide = function handleHintHide() {
      return setIsHintVisible(false);
    };
    var handleHintClick = function handleHintClick(event) {
      var _hintInnerRef$current;
      if (!hintText || hintTrigger !== 'click' || disabled) {
        return;
      }
      event.stopPropagation();
      var targetIsPopover = event.target === hintInnerRef.current;
      var rootHasTarget = (_hintInnerRef$current = hintInnerRef.current) === null || _hintInnerRef$current === void 0 ? void 0 : _hintInnerRef$current.contains(event.target);
      if (!targetIsPopover && !rootHasTarget) {
        setIsHintVisible(true);
      }
    };
    useOutsideClick.useOutsideClick(function () {
      setIsHintVisible(false);
    }, [hintRef]);
    React.useImperativeHandle(ref, function () {
      return {
        firstTextField: function firstTextField() {
          return firstTextFieldRef;
        },
        secondTextField: function secondTextField() {
          return secondTextFieldRef;
        }
      };
    }, [firstTextFieldRef, secondTextFieldRef]);
    var Divider = React.useMemo(function () {
      if (dividerVariant === 'none') {
        return null;
      }
      if (dividerVariant === 'dash') {
        return _StyledDivider || (_StyledDivider = /*#__PURE__*/React__default.default.createElement(Range_styles.StyledDivider, null, "\u2013"));
      }
      return _StyledDivider2 || (_StyledDivider2 = /*#__PURE__*/React__default.default.createElement(Range_styles.StyledDivider, null, dividerIcon));
    }, [dividerVariant, dividerIcon]);
    return /*#__PURE__*/React__default.default.createElement(Root, _rollupPluginBabelHelpers.extends({
      ref: rangeRef,
      className: index.cx(clearClass, noCaptionAndLabelClass, className),
      view: view,
      size: size,
      disabled: disabled,
      readOnly: !disabled && readOnly
    }, hintText && {
      hintView: hintView,
      hintSize: hintSize
    }, rest), /*#__PURE__*/React__default.default.createElement(InformationWrapper_styles.InformationWrapperUI, _rollupPluginBabelHelpers.extends({
      className: index.cx(rangeErrorClass, firstValueErrorClass, secondValueErrorClass, rangeSuccessClass, firstValueSuccessClass, secondValueSuccessClass, rangeEditedClass, firstValueEditedClass, secondValueEditedClass, clearOuterHintClass),
      size: size,
      label: label,
      leftHelper: leftHelper,
      titleCaption: titleCaption,
      required: required,
      requiredIndicatorPlacement: requiredIndicatorPlacement,
      hasRequiredIndicator: hasRequiredIndicator,
      disabled: disabled
    }, hintText && hintTargetPlacement === 'outer' ? {
      hintText: hintText,
      hintView: hintView,
      hintSize: hintSize,
      hintTrigger: hintTrigger,
      hintTargetIcon: hintTargetIcon,
      hintPlacement: hintPlacement,
      hintHasArrow: hintHasArrow,
      hintOffset: hintOffset,
      hintWidth: hintWidth,
      hintContentLeft: hintContentLeft
    } : {
      hintText: undefined
    }), /*#__PURE__*/React__default.default.createElement(Range_styles.ContentWrapper, {
      className: index.cx(clearClass, clearDividerClass, rangeErrorClass, rangeSuccessClass, rangeEditedClass)
    }, contentLeft && /*#__PURE__*/React__default.default.createElement(Range_styles.StyledContentLeft, null, contentLeft), /*#__PURE__*/React__default.default.createElement(Range_styles.StyledInput, {
      ref: firstTextFieldRef,
      className: index.cx(firstValueErrorClass, firstValueSuccessClass, firstValueEditedClass),
      value: firstValue,
      readOnly: readOnly,
      disabled: disabled,
      placeholder: firstPlaceholder,
      contentLeft: firstTextfieldContentLeft,
      contentRight: firstTextfieldContentRight,
      textBefore: firstTextfieldTextBefore,
      textAfter: firstTextfieldTextAfter,
      onChange: handleChangeFirstValue,
      onSearch: handleSearchFirstValue,
      onFocus: onFocusFirstTextfield,
      onBlur: onBlurFirstTextfield,
      autoComplete: autoComplete,
      "data-error": firstValueError,
      "data-success": firstValueSuccess,
      hasDivider: hasClearDivider
    }), Divider, /*#__PURE__*/React__default.default.createElement(Range_styles.StyledInput, {
      ref: secondTextFieldRef,
      className: index.cx(secondValueErrorClass, secondValueSuccessClass, secondValueEditedClass),
      value: secondValue,
      readOnly: readOnly,
      disabled: disabled,
      placeholder: secondPlaceholder,
      contentLeft: secondTextfieldContentLeft,
      contentRight: secondTextfieldContentRight,
      textBefore: secondTextfieldTextBefore,
      textAfter: secondTextfieldTextAfter,
      onChange: handleChangeSecondValue,
      onSearch: handleSearchSecondValue,
      onFocus: onFocusSecondTextfield,
      onBlur: onBlurSecondTextfield,
      autoComplete: autoComplete,
      hasDivider: hasClearDivider
    }), /*#__PURE__*/React__default.default.createElement(Range_styles.StyledContentRightWrapper, null, !label && hintText && hintTargetPlacement === 'inner' && /*#__PURE__*/React__default.default.createElement(Hint.HintComponent, {
      ref: hintForkRef,
      hintText: hintText,
      hintTrigger: hintTrigger,
      isHintVisible: isHintVisible,
      hintTargetIcon: hintTargetIcon,
      hintPlacement: hintPlacement,
      hintHasArrow: hintHasArrow,
      hintOffset: hintOffset,
      hintWidth: hintWidth,
      hintContentLeft: hintContentLeft,
      size: size,
      handleHintShow: handleHintShow,
      handleHintHide: handleHintHide,
      handleHintClick: handleHintClick,
      withoutLabel: true
    }), contentRight && /*#__PURE__*/React__default.default.createElement(Range_styles.StyledContentRight, null, contentRight)))));
  });
};
var rangeConfig = {
  name: 'Range',
  tag: 'div',
  layout: rangeRoot,
  base: Range_styles.base,
  variations: {
    view: {
      css: base.base
    },
    size: {
      css: base$1.base
    },
    hintView: {
      css: base$2.base
    },
    hintSize: {
      css: base$3.base
    },
    disabled: {
      css: base$4.base,
      attrs: true
    },
    readOnly: {
      css: base$5.base,
      attrs: true
    }
  },
  defaults: {
    size: 'm',
    view: 'default',
    hintView: 'default',
    hintSize: 'm'
  }
};

exports.rangeConfig = rangeConfig;
exports.rangeRoot = rangeRoot;
