import { u as useViewHandler, T as Toggle } from './index-bbdfb97a.js';
import 'react';
import { DivaUtils } from '@crystaldesign/diva-core';
import { jsxs, jsx } from 'react/jsx-runtime';
import '@babel/runtime/helpers/defineProperty';
import 'react-dynamic-multi-render';
import 'mobx-react-lite';
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 'classnames';
import 'qrcode.react';
import '@babel/runtime/helpers/typeof';
import 'flat';
import 'react-switch';
import 'react-countup';

var Varaint = function Varaint(_ref) {
  var _item$variantValues;
  var itemP = _ref.item;
  var item = itemP;
  var viewHandler = useViewHandler();
  return /*#__PURE__*/jsxs("div", {
    style: {
      userSelect: 'unset',
      display: 'flex',
      flexDirection: 'row',
      gap: 20,
      alignItems: 'center',
      borderBottom: '1px solid grey',
      justifyContent: 'space-between',
      padding: 10
    },
    children: [/*#__PURE__*/jsx("button", {
      onClick: item.onClick,
      children: "konfigurieren"
    }), /*#__PURE__*/jsx("div", {
      children: item.index
    }), (_item$variantValues = item.variantValues) === null || _item$variantValues === void 0 ? void 0 : _item$variantValues.map(function (item) {
      return /*#__PURE__*/jsxs("div", {
        style: {
          display: 'flex',
          alignItems: 'center',
          gap: 10
        },
        children: [item.optionValueImage && /*#__PURE__*/jsx("img", {
          src: item.optionValueImage,
          style: {
            height: 40
          }
        }), /*#__PURE__*/jsxs("div", {
          style: {
            display: 'flex',
            flexDirection: 'column',
            gap: 5,
            width: '150px'
          },
          children: [/*#__PURE__*/jsx("div", {
            children: item.optionName
          }), /*#__PURE__*/jsx("div", {
            children: item.optionValueName
          })]
        })]
      }, item.opt);
    }), /*#__PURE__*/jsx("div", {
      children: item.title
    }), /*#__PURE__*/jsx("div", {
      children: DivaUtils.formatPrice(item.price)
    }), /*#__PURE__*/jsx("div", {
      style: {
        alignSelf: 'flex-end'
      },
      children: /*#__PURE__*/jsx(Toggle, {
        height: 32,
        handleDiameter: 22,
        width: 60,
        onChange: function onChange() {
          item.onToggle();
          viewHandler.paletteViewHandler.updateCurPaletteData(true);
        },
        state: !item.disabled
      })
    })]
  }, item.hash);
};

export { Varaint as default };
