import { s as styleInject, u as useViewHandler } from './index-bbdfb97a.js';
import classnames from 'classnames';
import { observer } from 'mobx-react-lite';
import 'react';
import { useDivaCore, useTranslation, DivaUtils } from '@crystaldesign/diva-core';
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
import '@babel/runtime/helpers/defineProperty';
import 'react-dynamic-multi-render';
import '@babel/runtime/helpers/asyncToGenerator';
import '@babel/runtime/helpers/slicedToArray';
import '@babel/runtime/helpers/objectWithoutProperties';
import '@babel/runtime/regenerator';
import '@babel/runtime/helpers/classCallCheck';
import '@babel/runtime/helpers/createClass';
import '@babel/runtime/helpers/toConsumableArray';
import '@crystaldesign/diva-utils';
import 'mobx';
import '@crystaldesign/web-planner-logic';
import 'qrcode.react';
import '@babel/runtime/helpers/typeof';
import 'flat';
import 'react-switch';
import 'react-countup';

var row = "row-aKbIG";
var rowPaddingTop = "row-padding-top-SRH2s";
var rowPaddingTopArticle = "row-padding-top-article-Iwelk";
var columnLeft = "column-left-jSCha";
var primary = "primary--disG";
var columnRight = "column-right-rkkBn";
var columnRightRed = "column-right-red-Lmt65";
var columnOption = "column-option-2v7Hm";
var columnPartlist = "column-partlist-0LS9Z";
var codexes = "codexes--r2fL";
var tabGroup = "tab-group-an6TP";
var css_248z = ".row-aKbIG {\n  height: -moz-fit-content;\n  height: fit-content;\n  position: relative;\n  font-weight: 300;\n  padding-right: 0.9375rem;\n  padding-left: 0.9375rem;\n  display: flow-root;\n  color: #404040;\n}\n.row-padding-top-SRH2s {\n  padding-top: 8px;\n}\n\n.row-padding-top-article-Iwelk {\n  padding-top: 1rem;\n}\n\n.column-left-jSCha {\n  float: left;\n}\n.column-left-jSCha a.primary--disG {\n  color: var(--primaryColor);\n}\n.column-right-rkkBn {\n  float: right;\n  text-align: right;\n}\n\n.column-right-red-Lmt65 {\n  color: var(--primaryColor);\n}\n.column-option-2v7Hm {\n  font-size: 0.8125rem;\n  font-weight: normal;\n  line-height: 1.1;\n}\n.column-partlist-0LS9Z {\n  max-width: 70%;\n}\n\n.codexes--r2fL {\n  font-style: italic;\n}\n\n.tab-group-an6TP {\n  border-bottom: 1px solid var(--primaryColor);\n  font-size: 1.125rem;\n  margin: 1.5rem 0 0 0;\n  color: var(--primaryColor);\n  padding: 0;\n  text-align: left;\n  text-transform: capitalize;\n  font-weight: 300;\n}\n";
styleInject(css_248z);

var OptiontreeSerious = function OptiontreeSerious(_ref) {
  var itemP = _ref.item;
  var _useDivaCore = useDivaCore(),
    hidePrices = _useDivaCore.state.hidePrices;
  var _useTranslation = useTranslation(),
    t = _useTranslation.t;
  var viewHandler = useViewHandler();
  var item = itemP;
  if (item.isTabGroup) {
    return /*#__PURE__*/jsx("div", {
      className: tabGroup,
      children: item.title
    });
  }
  return /*#__PURE__*/jsxs(Fragment, {
    children: [item.isPartlistArticle && /*#__PURE__*/jsxs("div", {
      className: classnames(row, rowPaddingTopArticle),
      children: [/*#__PURE__*/jsx("span", {
        className: classnames(columnPartlist, columnLeft),
        dangerouslySetInnerHTML: {
          __html: item.title
        }
      }), /*#__PURE__*/jsx("span", {
        className: classnames(columnRight),
        children: (item.quantity && item.quantity > 1 ? '(x' + item.quantity + ') ' : '') + (!hidePrices && item.price ? DivaUtils.formatPrice(item.price, viewHandler.productState.priceFormat) : '')
      })]
    }), /*#__PURE__*/jsxs("div", {
      className: classnames(row, item.isPartlistArticle ? rowPaddingTop : undefined),
      children: [/*#__PURE__*/jsxs("span", {
        className: classnames(columnOption, columnLeft),
        children: [item.isPartlistArticle && /*#__PURE__*/jsxs(Fragment, {
          children: [/*#__PURE__*/jsx("a", {
            className: primary,
            children: item.size && item.size !== '' ? t('configurator.size') : item.description
          }), ": ", item.size]
        }), !item.isPartlistArticle && /*#__PURE__*/jsxs(Fragment, {
          children: [/*#__PURE__*/jsx("a", {
            className: primary,
            dangerouslySetInnerHTML: {
              __html: item.title
            }
          }), item.description && /*#__PURE__*/jsx("a", {
            dangerouslySetInnerHTML: {
              __html: ': ' + item.description
            }
          })]
        })]
      }), /*#__PURE__*/jsx("span", {
        className: classnames(columnOption, columnRight, columnRightRed, codexes),
        children: item.codex
      })]
    })]
  });
};
var index = observer(OptiontreeSerious);

export { index as default };
