import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import { s as styleInject, u as useViewHandler } from './index-bbdfb97a.js';
import { useState, useEffect } from 'react';
import { jsx, Fragment } from 'react/jsx-runtime';
import '@babel/runtime/helpers/defineProperty';
import 'react-dynamic-multi-render';
import '@crystaldesign/diva-core';
import 'mobx-react-lite';
import '@babel/runtime/helpers/asyncToGenerator';
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 metaData = "meta-data-kJbmQ";
var css_248z = ".meta-data-kJbmQ {\n  display: -webkit-box;\n  max-height: 64px;\n  min-height: 16px;\n  color: var(--secondaryColor);\n  overflow: hidden;\n  word-wrap: break-word;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 1;\n  position: relative;\n  -webkit-hyphens: auto;\n  hyphens: auto;\n  z-index: 100;\n  font-size: 13px;\n  line-height: 16px;\n  color: var(--secondaryColor);\n  width: 100%;\n  -webkit-user-select: text;\n     -moz-user-select: text;\n          user-select: text;\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .meta-data-kJbmQ {\n  color: #fff;\n}\n";
styleInject(css_248z);

var MetaData = function MetaData(_ref) {
  var style = _ref.style,
    metaData$1 = _ref.metaData,
    _ref$visible = _ref.visible,
    _ref$visible2 = _ref$visible === void 0 ? useState('') : _ref$visible,
    _ref$visible3 = _slicedToArray(_ref$visible2, 2),
    metaDataVisible = _ref$visible3[0],
    setMetaDataVisible = _ref$visible3[1];
  var viewHandler = useViewHandler();
  var _useState = useState(''),
    _useState2 = _slicedToArray(_useState, 2),
    text = _useState2[0],
    setText = _useState2[1];
  var displayMetaDatas = viewHandler.getViewConfig().displayMetaDatas;
  var firstItem = metaData$1 === null || metaData$1 === void 0 ? void 0 : metaData$1.find(function (data) {
    return displayMetaDatas === null || displayMetaDatas === void 0 ? void 0 : displayMetaDatas.includes(data.codex);
  });
  useEffect(function () {
    if (!firstItem) return;
    var textTmp = '';
    for (var i = 0; i < firstItem.values.length; i++) {
      if (textTmp !== '') textTmp = textTmp + ', ';
      var _loop = function _loop(j) {
        var data = metaData$1 === null || metaData$1 === void 0 ? void 0 : metaData$1.find(function (data) {
          return data.codex === displayMetaDatas[j];
        });
        if (!data) return 1; // continue
        if (textTmp !== '') textTmp = textTmp + ' ';
        textTmp = textTmp + (data.name ? data.name + ': ' : '') + data.values[i];
      };
      for (var j = 0; j < displayMetaDatas.length; j++) {
        if (_loop(j)) continue;
      }
    }
    setText(textTmp);
    setMetaDataVisible(textTmp);
  }, []);
  if (!metaDataVisible) return /*#__PURE__*/jsx(Fragment, {});
  return /*#__PURE__*/jsx("div", {
    style: style,
    className: metaData,
    children: text
  });
};

export { MetaData as default };
