@zohodesk/components/lib/DropBox/DropBoxElement/css/cssJSLogic.js

Dot UI is a customizable React component library built to deliver a clean, accessible, and developer-friendly UI experience. It offers a growing set of reusable components designed to align with modern design systems and streamline application development

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = cssJSLogic;

var _react = require("react");

var _LibraryContextInit = _interopRequireDefault(require("../../../Provider/LibraryContextInit"));

var _utils = require("@zohodesk/utils");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function cssJSLogic(_ref) {
  var _compileClassNames, _compileClassNames2;

  var props = _ref.props,
      style = _ref.style,
      customState = _ref.customState;
  var DropBoxElementContext = (0, _react.useContext)(_LibraryContextInit["default"]);
  var boxPosition = customState.boxPosition,
      boxDirection = customState.boxDirection,
      boxstyle = customState.boxstyle,
      needBoxStyle = customState.needBoxStyle,
      isAbsolute = customState.isAbsolute;

  var _ref2 = DropBoxElementContext || {},
      isReducedMotion = _ref2.isReducedMotion;

  var isAnimate = props.isAnimate,
      isArrow = props.isArrow,
      size = props.size,
      isRadius = props.isRadius,
      animationStyle = props.animationStyle,
      isActive = props.isActive,
      isModel = props.isModel,
      isBoxPaddingNeed = props.isBoxPaddingNeed,
      isPadding = props.isPadding,
      customClass = props.customClass,
      positionsOffset = props.positionsOffset,
      targetOffset = props.targetOffset,
      zIndexStyle = props.zIndexStyle,
      customInlineStyle = props.customInlineStyle;
  var _customClass$customDr = customClass.customDropBox,
      customDropBox = _customClass$customDr === void 0 ? '' : _customClass$customDr,
      _customClass$customMo = customClass.customMobileDropBox,
      customMobileDropBox = _customClass$customMo === void 0 ? '' : _customClass$customMo,
      _customClass$customDr2 = customClass.customDropBoxWrap,
      customDropBoxWrap = _customClass$customDr2 === void 0 ? '' : _customClass$customDr2,
      _customClass$customMo2 = customClass.customMobileDropBoxWrap,
      customMobileDropBoxWrap = _customClass$customMo2 === void 0 ? '' : _customClass$customMo2;
  var animationValue = animationStyle === 'default' ? 'fadeInScale' : animationStyle; // const {needBoxStyle,boxstyle} = useDropboxPosCalc(props)

  var boxClassName = (0, _utils.compileClassNames)((_compileClassNames = {}, _defineProperty(_compileClassNames, style.main, true), _defineProperty(_compileClassNames, style.hidden, !isActive), _defineProperty(_compileClassNames, style.responsive, !!isModel), _defineProperty(_compileClassNames, style.container, isAbsolute && !isModel), _defineProperty(_compileClassNames, style[boxPosition], isAbsolute && !isModel), _defineProperty(_compileClassNames, style.fixedContainer, !isAbsolute && !isModel), _defineProperty(_compileClassNames, style[size], size && !isModel), _defineProperty(_compileClassNames, style.boxDirection, !isModel && isActive && isArrow), _defineProperty(_compileClassNames, style.arrow, !isModel && isActive && isArrow && isAbsolute), _defineProperty(_compileClassNames, style.paddingSpace, !isModel && isActive && !isArrow && isPadding), _defineProperty(_compileClassNames, customMobileDropBoxWrap, !!isModel), _defineProperty(_compileClassNames, customDropBoxWrap, !isModel), _compileClassNames));
  var subContainerClass = (0, _utils.compileClassNames)((_compileClassNames2 = {}, _defineProperty(_compileClassNames2, style.subContainer, true), _defineProperty(_compileClassNames2, style.mobRadius, !!isModel), _defineProperty(_compileClassNames2, style.slideUp, !!isModel && isActive), _defineProperty(_compileClassNames2, style.shadow, !isModel), _defineProperty(_compileClassNames2, style.boxPadding, !isModel && isBoxPaddingNeed), _defineProperty(_compileClassNames2, style.radius, !isModel && isRadius), _defineProperty(_compileClassNames2, style[animationValue], !isModel && isAnimate && !isReducedMotion && isActive && !!animationStyle), _defineProperty(_compileClassNames2, customMobileDropBox, !!isModel), _defineProperty(_compileClassNames2, customDropBox, !isModel), _compileClassNames2));
  var inlineStyle = !isModel ? isAbsolute ? needBoxStyle && boxstyle : positionsOffset && positionsOffset[boxPosition] || {} : {};

  if (zIndexStyle) {
    inlineStyle = Object.assign({}, inlineStyle, zIndexStyle);
  }

  if (!isModel && !isAbsolute && size === 'default' && targetOffset && isActive) {
    inlineStyle = Object.assign({}, inlineStyle, {
      width: targetOffset.width
    });
  }

  if (customInlineStyle) {
    inlineStyle = Object.assign({}, inlineStyle, customInlineStyle);
  }

  return {
    boxClassName: boxClassName,
    subContainerClass: subContainerClass,
    inlineStyle: inlineStyle
  };
}