@crystaldesign/diva-web-planner-react 26.3.0-beta.4 → 26.3.0-beta.41

package/build/esm/index-e94bb023.js

@@ -0,0 +1,641 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
+import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
+import _regeneratorRuntime from '@babel/runtime/regenerator';
+import { s as styleInject, u as useViewHandler } from './index-e7467256.js';
+import { useMemo, useState, useEffect, useRef } from 'react';
+import { n as notExpanded } from './index.module-50b082ee.js';
+import { observer } from 'mobx-react-lite';
+import classnames from 'classnames';
+import { DivaUtils } from '@crystaldesign/diva-core';
+import { u as useAgGrid } from './agGridLoader-3b7ebab3.js';
+import ArticleSelector from './index-14092b3a.js';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-select';
+
+var tableDescription = "tableDescription-GAttr";
+var optionsTable = "optionsTable-S8hXd";
+var optionsTableColumn = "optionsTableColumn-SUPzz";
+var optionsTableSelected = "optionsTableSelected---0cU";
+var priceDetailTable = "priceDetailTable-pRCLJ";
+var articleOverviewTable = "articleOverviewTable-XtCAq";
+var gridContainer = "gridContainer-7l7cY";
+var detailGridContainer = "detailGridContainer-j9Bbb";
+var articleOverviewTableRowSelected = "articleOverviewTableRowSelected-WzfbX";
+var priceStatusNoPrices = "priceStatusNoPrices-RyHFl";
+var priceStatusConfigMismatch = "priceStatusConfigMismatch-qPTmb";
+var priceStatusActive = "priceStatusActive-CQ5k0";
+var priceStatusFlat = "priceStatusFlat-COOK-";
+var scrollable = "scrollable-VXYsC";
+var header = "header-T1xEK";
+var finishActive = "finishActive-L6ILp";
+var finishInactive = "finishInactive-YGKR2";
+var css_248z = ".table-dlyc3 {\n  position: relative;\n  width: 100%;\n  border-collapse: collapse;\n  font-family: var(--diva-typography-font-family);\n  font-size: 13px;\n  background: #fff;\n  border-radius: 8px;\n  overflow: hidden;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);\n}\n\n.table-dlyc3 thead {\n  background: linear-gradient(135deg, #2d3748 0%, #1a202c 100%);\n  color: #fff;\n  font-size: 12px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n}\n\n.table-dlyc3 th,\n.table-dlyc3 td {\n  padding: 10px 14px;\n  text-align: left;\n  border-bottom: 1px solid #e2e8f0;\n}\n\n.table-dlyc3 tbody tr:hover {\n  background: #f7fafc;\n}\n\n.filter-uCpFs {\n  height: 24px;\n  padding: 4px 10px;\n  font-size: 13px;\n  border: 1px solid #cbd5e0;\n  border-radius: 6px;\n  min-width: 120px;\n  margin-top: 8px;\n}\n\n.filter-uCpFs:focus {\n  outline: none;\n  border-color: var(--primaryColor);\n  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);\n}\n\n.tableDescription-GAttr {\n  margin: 8px 0 12px;\n  font-size: 13px;\n  color: #64748b;\n  line-height: 1.4;\n}\n\n.optionsTable-S8hXd {\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n  gap: 16px;\n  margin-top: 16px;\n  flex-wrap: nowrap;\n  overflow-x: auto;\n  height: 40%;\n}\n\n.optionsTableColumn-SUPzz {\n  flex: 0 0 auto;\n  align-self: flex-start;\n  height: 100%;\n  width: calc(50% - 24px);\n}\n\n.optionsTableSelected---0cU {\n  background: #ebf8ff !important;\n}\n\n.optionsTableSelected---0cU {\n  border-left: 3px solid var(--primaryColor);\n}\n\n.decisionCell-1WadE {\n  cursor: pointer;\n  transition: background 0.15s ease;\n}\n\n.decisionCell-1WadE:hover {\n  background: #edf2f7;\n}\n\n.priceDetailTable-pRCLJ {\n  flex: 0 0 auto;\n  align-self: flex-start;\n  padding: 16px;\n  background: #f8fafc;\n  border-radius: 8px;\n  border: 1px solid #e2e8f0;\n  min-width: 280px;\n}\n\n.priceDetailTable-pRCLJ h4 {\n  margin: 0 0 12px 0;\n  font-size: 14px;\n  font-weight: 600;\n  color: #2d3748;\n}\n\n.priceDetailTable-pRCLJ h5 {\n  margin: 12px 0 8px 0;\n  font-size: 12px;\n  font-weight: 600;\n  color: #4a5568;\n}\n\n.articleOverviewTable-XtCAq {\n  margin-top: 16px;\n  height: 50%;\n}\n\n.gridContainer-7l7cY {\n  width: 100%;\n  min-height: 150px;\n  height: 100%;\n}\n\n.detailGridContainer-j9Bbb {\n  width: 100%;\n  min-height: 80px;\n}\n\n.articleOverviewTableRowSelected-WzfbX {\n  background-color: #dcfce7 !important;\n}\n\n.articleOverviewTableRowSelected-WzfbX:hover {\n  background-color: #bbf7d0 !important;\n}\n\n.priceStatusNoPrices-RyHFl {\n  color: #718096;\n  font-style: italic;\n}\n\n.priceStatusConfigMismatch-qPTmb {\n  color: #d69e2e;\n}\n\n.priceStatusActive-CQ5k0 {\n  color: #38a169;\n  font-weight: 500;\n}\n\n.priceStatusFlat-COOK- {\n  color: #3182ce;\n}\n\n.column--cQ52 {\n  text-align: left;\n}\n\n.column--cQ52:first-child {\n  height: 20px;\n}\n\n.column--cQ52 th {\n  padding-right: 10px;\n  margin-bottom: 1%;\n  font-weight: normal;\n}\n\n.scrollable-VXYsC {\n  overflow: auto;\n  width: 100%;\n  padding: 16px;\n  height: 100%;\n  position: relative;\n  box-sizing: border-box;\n}\n\n.header-T1xEK {\n  height: 8%;\n  width: calc(100% - 16px);\n  padding: 8px 16px;\n  text-align: center;\n  background: linear-gradient(135deg, var(--primaryColor) 0%, color-mix(in srgb, var(--primaryColor) 90%, black) 100%);\n  font-size: 18px;\n  color: white;\n  font-weight: 600;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  gap: 12px;\n  border-radius: 0 0 8px 8px;\n  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);\n}\n\n.idm-container-S4cxx {\n  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n  border: 1px solid #ddd;\n  border-radius: 8px;\n  -webkit-user-select: text;\n     -moz-user-select: text;\n          user-select: text;\n  height: 100%;\n}\n\n.idm-title-9Dkxf {\n  font-size: 1.5em;\n  font-weight: bold;\n}\n\n.idm-subtitle-KoD3- {\n  margin-top: 16px;\n  font-size: 1.2em;\n  font-weight: bold;\n}\n\n.idm-table-NbBVs {\n  width: calc(100% - 4px);\n  border-collapse: collapse;\n  margin-top: 8px;\n}\n\n.idm-table-NbBVs th,\n.idm-table-NbBVs td {\n  border: 1px solid #ddd;\n  padding: 8px;\n  text-align: left;\n  line-break: anywhere;\n}\n\n.idm-table-NbBVs th {\n  background-color: #f2f2f2;\n}\n\n.finishActive-L6ILp {\n  background-color: #dcfce7 !important;\n}\n\n.finishInactive-YGKR2 {\n  background-color: #f1f5f9 !important;\n}\n\n/* Dark mode compatibility */\n.darkmode .tableDescription-GAttr,\nbody.darkmode .tableDescription-GAttr {\n  color: #94a3b8;\n}\n\n.darkmode .optionsTableSelected---0cU,\nbody.darkmode .optionsTableSelected---0cU {\n  background: rgba(56, 178, 172, 0.25) !important;\n}\n\n.darkmode .optionsTableSelected---0cU,\nbody.darkmode .optionsTableSelected---0cU {\n  border-left-color: #38b2ac;\n}\n\n.darkmode .articleOverviewTableRowSelected-WzfbX,\nbody.darkmode .articleOverviewTableRowSelected-WzfbX {\n  background-color: rgba(34, 197, 94, 0.25) !important;\n}\n\n.darkmode .articleOverviewTableRowSelected-WzfbX:hover,\nbody.darkmode .articleOverviewTableRowSelected-WzfbX:hover {\n  background-color: rgba(34, 197, 94, 0.35) !important;\n}\n\n.darkmode .priceStatusNoPrices-RyHFl,\nbody.darkmode .priceStatusNoPrices-RyHFl {\n  color: #94a3b8;\n}\n\n.darkmode .priceStatusConfigMismatch-qPTmb,\nbody.darkmode .priceStatusConfigMismatch-qPTmb {\n  color: #fbbf24;\n}\n\n.darkmode .priceStatusActive-CQ5k0,\nbody.darkmode .priceStatusActive-CQ5k0 {\n  color: #68d391;\n}\n\n.darkmode .priceStatusFlat-COOK-,\nbody.darkmode .priceStatusFlat-COOK- {\n  color: #63b3ed;\n}\n\n.darkmode .priceDetailTable-pRCLJ,\nbody.darkmode .priceDetailTable-pRCLJ {\n  background: rgba(30, 41, 59, 0.6);\n  border-color: rgba(71, 85, 105, 0.8);\n}\n\n.darkmode .priceDetailTable-pRCLJ h4,\nbody.darkmode .priceDetailTable-pRCLJ h4 {\n  color: #e2e8f0;\n}\n\n.darkmode .priceDetailTable-pRCLJ h5,\nbody.darkmode .priceDetailTable-pRCLJ h5 {\n  color: #94a3b8;\n}\n\n.darkmode .finishActive-L6ILp,\nbody.darkmode .finishActive-L6ILp {\n  background-color: rgba(34, 197, 94, 0.3) !important;\n}\n\n.darkmode .finishInactive-YGKR2,\nbody.darkmode .finishInactive-YGKR2 {\n  background-color: rgba(51, 65, 85, 0.5) !important;\n}\n";
+styleInject(css_248z);
+
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function getArticlePriceStatus(article) {
+  var _article$catalogArtic2, _article$decisionDebu, _lastStack$prices;
+  // FLAT articles have a fixed price from catalog, no config-dependent price logic
+  if (article.catalogArticle.articleType === 'FLAT') {
+    var _article$price, _article$catalogArtic;
+    var hasPrice = ((_article$price = article.price) !== null && _article$price !== void 0 ? _article$price : 0) > 0 || ((_article$catalogArtic = article.catalogArticle.articlePrice) !== null && _article$catalogArtic !== void 0 ? _article$catalogArtic : 0) > 0;
+    return hasPrice ? 'flat' : 'no-prices';
+  }
+  var priceGroupNos = (_article$catalogArtic2 = article.catalogArticle.priceFeatureGroupNos) !== null && _article$catalogArtic2 !== void 0 ? _article$catalogArtic2 : [];
+  if (priceGroupNos.length === 0 || article.noPrice) return 'no-prices';
+  var lastStack = Object.values((_article$decisionDebu = article.decisionDebugStacks) !== null && _article$decisionDebu !== void 0 ? _article$decisionDebu : {}).findLast(function (v) {
+    return v;
+  });
+  if (!(lastStack !== null && lastStack !== void 0 && (_lastStack$prices = lastStack.prices) !== null && _lastStack$prices !== void 0 && _lastStack$prices.length)) return 'config-mismatch';
+  return 'active';
+}
+function getPartlistPriceSum(article) {
+  var sum = 0;
+  for (var key in (_article$partlistArti = article.partlistArticles) !== null && _article$partlistArti !== void 0 ? _article$partlistArti : {}) {
+    var _article$partlistArti;
+    var pa = article.partlistArticles[key];
+    if (pa.bruttoPrice) {
+      var _pa$calcPrice;
+      sum += (_pa$calcPrice = pa.calcPrice(true)) !== null && _pa$calcPrice !== void 0 ? _pa$calcPrice : 0;
+    }
+  }
+  return sum;
+}
+function flattenArticlesWithDepth(articles, depth) {
+  var result = [];
+  var _iterator = _createForOfIteratorHelper(articles),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var _article$partlistArti2;
+      var article = _step.value;
+      result.push({
+        article: article,
+        depth: depth
+      });
+      var children = Object.values((_article$partlistArti2 = article.partlistArticles) !== null && _article$partlistArti2 !== void 0 ? _article$partlistArti2 : {});
+      if (children.length > 0) {
+        result.push.apply(result, _toConsumableArray(flattenArticlesWithDepth(children, depth + 1)));
+      }
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  return result;
+}
+function PriceDetailTable(_ref) {
+  var _article$catalogArtic3, _pf$finishes2;
+  var row = _ref.row,
+    article = _ref.article,
+    onClose = _ref.onClose;
+  var agGrid = useAgGrid();
+  var pf = row.priceFeatureGroup;
+  var idmPrices = (_article$catalogArtic3 = article.catalogArticle.idmPrices) === null || _article$catalogArtic3 === void 0 ? void 0 : _article$catalogArtic3.prices;
+  var darkMode = typeof document !== 'undefined' && document.body.classList.contains('darkmode');
+  var gridTheme = useMemo(function () {
+    return agGrid.themeQuartz ? darkMode && agGrid.colorSchemeDarkBlue ? agGrid.themeQuartz.withPart(agGrid.colorSchemeDarkBlue) : agGrid.themeQuartz : undefined;
+  }, [darkMode, agGrid.themeQuartz, agGrid.colorSchemeDarkBlue]);
+  var fieldValueRowData = useMemo(function () {
+    var _ref2, _pf$priceFeatureGroup, _pf$priceFeatureGroup2, _pf$priceFeatureGroup3, _pf$activeCombination, _pf$featureNos;
+    return [{
+      field: 'Text',
+      value: (_ref2 = (_pf$priceFeatureGroup = (_pf$priceFeatureGroup2 = pf.priceFeatureGroupText) === null || _pf$priceFeatureGroup2 === void 0 ? void 0 : _pf$priceFeatureGroup2.DE) !== null && _pf$priceFeatureGroup !== void 0 ? _pf$priceFeatureGroup : (_pf$priceFeatureGroup3 = pf.priceFeatureGroupText) === null || _pf$priceFeatureGroup3 === void 0 ? void 0 : _pf$priceFeatureGroup3.EN) !== null && _ref2 !== void 0 ? _ref2 : '-'
+    }, {
+      field: 'Active Combination',
+      value: String((_pf$activeCombination = pf.activeCombination) !== null && _pf$activeCombination !== void 0 ? _pf$activeCombination : '-')
+    }, {
+      field: 'isPercentage',
+      value: String(pf.isPercentage)
+    }, {
+      field: 'additionalPrice',
+      value: String(pf.additionalPrice)
+    }, {
+      field: 'featureNos',
+      value: ((_pf$featureNos = pf.featureNos) !== null && _pf$featureNos !== void 0 ? _pf$featureNos : []).join(', ') || '-'
+    }].concat(_toConsumableArray(row.variantValues ? [{
+      field: 'VariantValues',
+      value: JSON.stringify(row.variantValues)
+    }] : []));
+  }, [pf, row.variantValues]);
+  var finishRowData = useMemo(function () {
+    var _pf$finishes;
+    return ((_pf$finishes = pf.finishes) !== null && _pf$finishes !== void 0 ? _pf$finishes : []).map(function (f) {
+      var _f$supplierPriceGroup, _f$_id, _f$optionsSetRefs;
+      var priceKey = 'PRFG' + pf.priceFeatureGroupNo + '_' + ((_f$supplierPriceGroup = f.supplierPriceGroup) !== null && _f$supplierPriceGroup !== void 0 ? _f$supplierPriceGroup : f.priceField);
+      var price = idmPrices === null || idmPrices === void 0 ? void 0 : idmPrices[priceKey];
+      var isActive = f.sequence === pf.activeCombination;
+      var hasMatch = price != null;
+      return {
+        _id: (_f$_id = f._id) !== null && _f$_id !== void 0 ? _f$_id : String(f.sequence),
+        sequence: f.sequence,
+        priceField: "PRFG".concat(pf.priceFeatureGroupNo, "_").concat(f.priceField),
+        price: hasMatch ? String(price) : '-',
+        optionsSetRefs: JSON.stringify((_f$optionsSetRefs = f.optionsSetRefs) !== null && _f$optionsSetRefs !== void 0 ? _f$optionsSetRefs : {}),
+        isActive: isActive
+      };
+    });
+  }, [pf, idmPrices]);
+  var fieldValueColDefs = useMemo(function () {
+    return [{
+      field: 'field',
+      headerName: 'Field',
+      flex: 0,
+      width: 140
+    }, {
+      field: 'value',
+      headerName: 'Value',
+      flex: 1,
+      minWidth: 120
+    }];
+  }, []);
+  var finishColDefs = useMemo(function () {
+    return [{
+      field: 'sequence',
+      headerName: 'Seq',
+      flex: 0,
+      width: 60
+    }, {
+      field: 'priceField',
+      headerName: 'priceField',
+      flex: 1,
+      minWidth: 100
+    }, {
+      field: 'price',
+      headerName: 'Price',
+      flex: 0,
+      width: 80
+    }, {
+      field: 'optionsSetRefs',
+      headerName: 'optionsSetRefs',
+      flex: 1,
+      minWidth: 100
+    }];
+  }, []);
+  var getFinishRowClass = function getFinishRowClass(params) {
+    var _params$data;
+    return (_params$data = params.data) !== null && _params$data !== void 0 && _params$data.isActive ? finishActive : finishInactive;
+  };
+  if (!agGrid.loaded || !agGrid.AgGridReact || !gridTheme) return null;
+  var Grid = agGrid.AgGridReact;
+  return /*#__PURE__*/jsxs("div", {
+    className: priceDetailTable,
+    children: [/*#__PURE__*/jsxs("h4", {
+      children: ["PriceFeatureGroup #", pf.priceFeatureGroupNo, /*#__PURE__*/jsx("button", {
+        type: "button",
+        onClick: onClose,
+        style: {
+          "float": 'right',
+          marginLeft: 8
+        },
+        children: "\xD7"
+      })]
+    }), /*#__PURE__*/jsx("div", {
+      className: detailGridContainer,
+      children: /*#__PURE__*/jsx(Grid, {
+        rowData: fieldValueRowData,
+        columnDefs: fieldValueColDefs,
+        theme: gridTheme,
+        suppressCellFocus: true,
+        domLayout: "autoHeight",
+        headerHeight: 32,
+        rowHeight: 32
+      })
+    }), ((_pf$finishes2 = pf.finishes) === null || _pf$finishes2 === void 0 ? void 0 : _pf$finishes2.length) > 0 && /*#__PURE__*/jsxs(Fragment, {
+      children: [/*#__PURE__*/jsx("h5", {
+        children: "Finishes"
+      }), /*#__PURE__*/jsx("div", {
+        className: detailGridContainer,
+        children: /*#__PURE__*/jsx(Grid, {
+          rowData: finishRowData,
+          columnDefs: finishColDefs,
+          theme: gridTheme,
+          getRowId: function getRowId(p) {
+            var _p$data$_id, _p$data;
+            return (_p$data$_id = (_p$data = p.data) === null || _p$data === void 0 ? void 0 : _p$data._id) !== null && _p$data$_id !== void 0 ? _p$data$_id : '';
+          },
+          getRowClass: getFinishRowClass,
+          suppressCellFocus: true,
+          domLayout: "autoHeight",
+          headerHeight: 32,
+          rowHeight: 32
+        })
+      })]
+    })]
+  });
+}
+var PriceAnalyzer = function PriceAnalyzer(_ref3) {
+  var _viewHandler$divaWebP, _baseArticles$find, _selectedArticle$bask, _selectedArticle$arti, _ref6, _allArticlesMap$selec, _articleForPriceHisto, _articleForPriceHisto2, _articleForPriceHisto3, _lastStack$prices2, _selectedRow$priceFea3;
+  var props = Object.assign({}, (_objectDestructuringEmpty(_ref3), _ref3));
+  var viewHandler = useViewHandler();
+  var agGrid = useAgGrid();
+  var configChanged = viewHandler.settingsState.configChanged; // read during render so observer re-renders when it changes
+  var allArticlesMap = (_viewHandler$divaWebP = viewHandler.divaWebPlanner.getDivaArticles(false, true)) !== null && _viewHandler$divaWebP !== void 0 ? _viewHandler$divaWebP : {};
+  var allArticles = useMemo(function () {
+    return Object.values(allArticlesMap);
+  }, [allArticlesMap]);
+  var darkMode = typeof document !== 'undefined' && document.body.classList.contains('darkmode');
+  var gridTheme = useMemo(function () {
+    return agGrid.themeQuartz ? darkMode && agGrid.colorSchemeDarkBlue ? agGrid.themeQuartz.withPart(agGrid.colorSchemeDarkBlue) : agGrid.themeQuartz : undefined;
+  }, [darkMode, agGrid.themeQuartz, agGrid.colorSchemeDarkBlue]);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    rerender = _useState2[0],
+    setRerender = _useState2[1];
+  useEffect(function () {
+    var asyncFunct = /*#__PURE__*/function () {
+      var _ref4 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              _context.next = 2;
+              return DivaUtils.Sleep(1000);
+            case 2:
+              setRerender(!rerender);
+            case 3:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee);
+      }));
+      return function asyncFunct() {
+        return _ref4.apply(this, arguments);
+      };
+    }();
+    asyncFunct();
+  }, [viewHandler.tabGroupState.allTabGroups]);
+  useEffect(function () {
+    var set = viewHandler.divaWebPlanner.actSet();
+    if (set && !set.logDecisions) set.logDecisions = true;
+    return function () {
+      var set = viewHandler.divaWebPlanner.actSet();
+      if (set) set.logDecisions = false;
+    };
+  }, [viewHandler.uiState.isLoading]);
+  var baseArticles = useMemo(function () {
+    return allArticles.filter(function (a) {
+      return !a.isPartListArticle;
+    });
+  }, [allArticles]);
+  var _useState3 = useState((_baseArticles$find = baseArticles.find(function (a) {
+      return a.posNr === 1;
+    })) !== null && _baseArticles$find !== void 0 ? _baseArticles$find : baseArticles[0]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    selectedArticle = _useState4[0],
+    setSelectedArticleState = _useState4[1];
+  var selectedBasketIdRef = useRef(undefined);
+  var selectedArticleCodexRef = useRef(undefined);
+  selectedBasketIdRef.current = (_selectedArticle$bask = selectedArticle === null || selectedArticle === void 0 ? void 0 : selectedArticle.basketId) !== null && _selectedArticle$bask !== void 0 ? _selectedArticle$bask : selectedBasketIdRef.current;
+  selectedArticleCodexRef.current = (_selectedArticle$arti = selectedArticle === null || selectedArticle === void 0 ? void 0 : selectedArticle.articleCodex) !== null && _selectedArticle$arti !== void 0 ? _selectedArticle$arti : selectedArticleCodexRef.current;
+  var _useState5 = useState(),
+    _useState6 = _slicedToArray(_useState5, 2),
+    selectedRow = _useState6[0],
+    setSelectedRow = _useState6[1];
+  var setSelectedArticle = function setSelectedArticle(articleOrUpdater) {
+    setSelectedArticleState(function (prev) {
+      var next = typeof articleOrUpdater === 'function' ? articleOrUpdater(prev) : articleOrUpdater;
+      if (next) {
+        selectedBasketIdRef.current = next.basketId;
+        selectedArticleCodexRef.current = next.articleCodex;
+      }
+      return next;
+    });
+  };
+  useEffect(function () {
+    var basketIdToReselect = selectedBasketIdRef.current;
+    var articleCodexToReselect = selectedArticleCodexRef.current;
+    var t = setTimeout(function () {
+      setRerender(function (r) {
+        return !r;
+      });
+      if (basketIdToReselect || articleCodexToReselect) {
+        var _viewHandler$divaWebP2, _ref5;
+        var articles = (_viewHandler$divaWebP2 = viewHandler.divaWebPlanner.getDivaArticles(false, true)) !== null && _viewHandler$divaWebP2 !== void 0 ? _viewHandler$divaWebP2 : {};
+        var currentArticle = (_ref5 = basketIdToReselect ? articles[basketIdToReselect] : undefined) !== null && _ref5 !== void 0 ? _ref5 : articleCodexToReselect ? Object.values(articles).find(function (a) {
+          return a.articleCodex === articleCodexToReselect;
+        }) : undefined;
+        if (currentArticle) {
+          setSelectedArticleState(currentArticle);
+        } else {
+          selectedBasketIdRef.current = undefined;
+          selectedArticleCodexRef.current = undefined;
+          setSelectedArticleState(undefined);
+        }
+      }
+    }, 200);
+    return function () {
+      return clearTimeout(t);
+    };
+  }, [configChanged]);
+
+  // Always use the current article from the set (resolves by basketId, fallback articleCodex) so we get fresh decisionDebugStacks after config changes
+  var articleForPriceHistory = selectedArticle ? (_ref6 = (_allArticlesMap$selec = allArticlesMap[selectedArticle.basketId]) !== null && _allArticlesMap$selec !== void 0 ? _allArticlesMap$selec : Object.values(allArticlesMap).find(function (a) {
+    return a.articleCodex === selectedArticle.articleCodex;
+  })) !== null && _ref6 !== void 0 ? _ref6 : selectedArticle : undefined;
+  var isIDMFormat = (_articleForPriceHisto = articleForPriceHistory === null || articleForPriceHistory === void 0 || (_articleForPriceHisto2 = articleForPriceHistory.CatalogData) === null || _articleForPriceHisto2 === void 0 ? void 0 : _articleForPriceHisto2.isIDMFormat) !== null && _articleForPriceHisto !== void 0 ? _articleForPriceHisto : false;
+  var lastStack = articleForPriceHistory ? Object.values((_articleForPriceHisto3 = articleForPriceHistory.decisionDebugStacks) !== null && _articleForPriceHisto3 !== void 0 ? _articleForPriceHisto3 : {}).findLast(function (v) {
+    return v;
+  }) : undefined;
+  var prices = (_lastStack$prices2 = lastStack === null || lastStack === void 0 ? void 0 : lastStack.prices) !== null && _lastStack$prices2 !== void 0 ? _lastStack$prices2 : [];
+  var articleOverviewRowData = useMemo(function () {
+    var flat = flattenArticlesWithDepth(baseArticles, 0);
+    return flat.map(function (_ref7) {
+      var _article$mainPrice;
+      var article = _ref7.article,
+        depth = _ref7.depth;
+      var ownPrice = (_article$mainPrice = article.mainPrice) !== null && _article$mainPrice !== void 0 ? _article$mainPrice : 0;
+      var partlistSum = getPartlistPriceSum(article);
+      var totalPrice = !article.isPartListArticle ? article.calcPrice(false) / (article.quantity || 1) : 0;
+      return {
+        article: article,
+        depth: depth,
+        articleCodex: '│ '.repeat(depth) + article.articleCodex,
+        name: article.name,
+        posNr: article.posNr,
+        status: getArticlePriceStatus(article),
+        ownPrice: ownPrice,
+        partlistSum: partlistSum,
+        totalPrice: totalPrice
+      };
+    });
+  }, [baseArticles]);
+  var articleOverviewColDefs = useMemo(function () {
+    return [{
+      field: 'articleCodex',
+      headerName: 'Article',
+      flex: 1,
+      minWidth: 120,
+      cellStyle: function cellStyle(params) {
+        var _params$data$depth, _params$data2;
+        return {
+          paddingLeft: 8 + ((_params$data$depth = (_params$data2 = params.data) === null || _params$data2 === void 0 ? void 0 : _params$data2.depth) !== null && _params$data$depth !== void 0 ? _params$data$depth : 0) * 12
+        };
+      }
+    }, {
+      field: 'name',
+      headerName: 'Name',
+      flex: 1,
+      minWidth: 100
+    }, {
+      field: 'posNr',
+      headerName: 'Pos',
+      flex: 0,
+      width: 60
+    }, {
+      headerName: 'Status',
+      flex: 1,
+      minWidth: 110,
+      cellRenderer: function cellRenderer(params) {
+        var _params$data3;
+        var s = (_params$data3 = params.data) === null || _params$data3 === void 0 ? void 0 : _params$data3.status;
+        if (!s) return null;
+        var labels = {
+          'no-prices': 'No prices',
+          'config-mismatch': 'Config mismatch',
+          active: 'Active',
+          flat: 'Flat'
+        };
+        return /*#__PURE__*/jsx("span", {
+          className: classnames(s === 'no-prices' && priceStatusNoPrices, s === 'config-mismatch' && priceStatusConfigMismatch, s === 'active' && priceStatusActive, s === 'flat' && priceStatusFlat),
+          children: labels[s]
+        });
+      }
+    }, {
+      field: 'ownPrice',
+      headerName: 'Own',
+      flex: 0,
+      width: 70,
+      valueFormatter: function valueFormatter(p) {
+        return p.value != null && p.value > 0 ? p.value.toFixed(2) : '-';
+      }
+    }, {
+      field: 'partlistSum',
+      headerName: 'Partlist',
+      flex: 0,
+      width: 80,
+      valueFormatter: function valueFormatter(p) {
+        var _p$data2;
+        return (_p$data2 = p.data) !== null && _p$data2 !== void 0 && _p$data2.article.hasPartlistArticle && p.value != null && p.value > 0 ? p.value.toFixed(2) : '-';
+      }
+    }, {
+      field: 'totalPrice',
+      headerName: 'Total',
+      flex: 0,
+      width: 70,
+      valueFormatter: function valueFormatter(p) {
+        return p.value != null && p.value > 0 ? p.value.toFixed(2) : '-';
+      }
+    }];
+  }, []);
+  var getArticleRowId = function getArticleRowId(params) {
+    var _params$data$article$, _params$data4;
+    return (_params$data$article$ = (_params$data4 = params.data) === null || _params$data4 === void 0 || (_params$data4 = _params$data4.article) === null || _params$data4 === void 0 ? void 0 : _params$data4.basketId) !== null && _params$data$article$ !== void 0 ? _params$data$article$ : '';
+  };
+  var getArticleRowClass = function getArticleRowClass(params) {
+    var _params$data5;
+    return ((_params$data5 = params.data) === null || _params$data5 === void 0 ? void 0 : _params$data5.article.basketId) === (selectedArticle === null || selectedArticle === void 0 ? void 0 : selectedArticle.basketId) ? articleOverviewTableRowSelected : undefined;
+  };
+  var articleGridRef = useRef(null);
+  var priceHistoryGridRef = useRef(null);
+  var priceHistoryColDefs = useMemo(function () {
+    return [{
+      field: 'nr',
+      headerName: '#',
+      flex: 0,
+      width: 50
+    }, {
+      field: 'text',
+      headerName: 'Price',
+      flex: 1,
+      minWidth: 100
+    }, {
+      headerName: 'Loaded',
+      flex: 1,
+      minWidth: 80,
+      cellRenderer: function cellRenderer(params) {
+        var _pf$finishes3, _activeFinish$supplie, _articleForPriceHisto4;
+        var p = params.data;
+        if (!p) return null;
+        var pf = p.priceFeatureGroup;
+        var activeFinish = (_pf$finishes3 = pf.finishes) === null || _pf$finishes3 === void 0 ? void 0 : _pf$finishes3.find(function (f) {
+          return f.sequence === pf.activeCombination;
+        });
+        var priceKey = activeFinish ? 'PRFG' + pf.priceFeatureGroupNo + '_' + ((_activeFinish$supplie = activeFinish.supplierPriceGroup) !== null && _activeFinish$supplie !== void 0 ? _activeFinish$supplie : activeFinish.priceField) : null;
+        var loadedPrice = priceKey ? articleForPriceHistory === null || articleForPriceHistory === void 0 || (_articleForPriceHisto4 = articleForPriceHistory.catalogArticle.idmPrices) === null || _articleForPriceHisto4 === void 0 ? void 0 : _articleForPriceHisto4.prices[priceKey] : undefined;
+        return pf.isPercentage && p.percentageValue != null ? p.percentageValue + '%' : loadedPrice != null ? String(loadedPrice) : '-';
+      }
+    }];
+  }, [articleForPriceHistory]);
+  var getPriceRowId = function getPriceRowId(params) {
+    var _params$data$priceFea, _params$data6;
+    return String((_params$data$priceFea = (_params$data6 = params.data) === null || _params$data6 === void 0 || (_params$data6 = _params$data6.priceFeatureGroup) === null || _params$data6 === void 0 ? void 0 : _params$data6.priceFeatureGroupNo) !== null && _params$data$priceFea !== void 0 ? _params$data$priceFea : '');
+  };
+  var getPriceRowClass = function getPriceRowClass(params) {
+    var _params$data$priceFea2, _selectedRow$priceFea;
+    return params.data && selectedRow && ((_params$data$priceFea2 = params.data.priceFeatureGroup) === null || _params$data$priceFea2 === void 0 ? void 0 : _params$data$priceFea2.priceFeatureGroupNo) === ((_selectedRow$priceFea = selectedRow.priceFeatureGroup) === null || _selectedRow$priceFea === void 0 ? void 0 : _selectedRow$priceFea.priceFeatureGroupNo) ? optionsTableSelected : undefined;
+  };
+  var onArticleRowClicked = function onArticleRowClicked(e) {
+    var _e$data;
+    if ((_e$data = e.data) !== null && _e$data !== void 0 && _e$data.article) setSelectedArticle(e.data.article);
+  };
+  var onPriceRowClicked = function onPriceRowClicked(e) {
+    var _e$data$priceFeatureG, _selectedRow$priceFea2;
+    if (!e.data) return;
+    var pfNo = (_e$data$priceFeatureG = e.data.priceFeatureGroup) === null || _e$data$priceFeatureG === void 0 ? void 0 : _e$data$priceFeatureG.priceFeatureGroupNo;
+    if (pfNo === (selectedRow === null || selectedRow === void 0 || (_selectedRow$priceFea2 = selectedRow.priceFeatureGroup) === null || _selectedRow$priceFea2 === void 0 ? void 0 : _selectedRow$priceFea2.priceFeatureGroupNo)) {
+      setSelectedRow(undefined);
+    } else {
+      setSelectedRow(e.data);
+    }
+  };
+  useEffect(function () {
+    var id = setTimeout(function () {
+      var _articleGridRef$curre, _priceHistoryGridRef$;
+      (_articleGridRef$curre = articleGridRef.current) === null || _articleGridRef$curre === void 0 || (_articleGridRef$curre = _articleGridRef$curre.api) === null || _articleGridRef$curre === void 0 || _articleGridRef$curre.redrawRows();
+      (_priceHistoryGridRef$ = priceHistoryGridRef.current) === null || _priceHistoryGridRef$ === void 0 || (_priceHistoryGridRef$ = _priceHistoryGridRef$.api) === null || _priceHistoryGridRef$ === void 0 || _priceHistoryGridRef$.redrawRows();
+    }, 0);
+    return function () {
+      return clearTimeout(id);
+    };
+  }, [selectedArticle === null || selectedArticle === void 0 ? void 0 : selectedArticle.basketId, selectedRow === null || selectedRow === void 0 || (_selectedRow$priceFea3 = selectedRow.priceFeatureGroup) === null || _selectedRow$priceFea3 === void 0 ? void 0 : _selectedRow$priceFea3.priceFeatureGroupNo]);
+  if (baseArticles.length === 0) return /*#__PURE__*/jsx("div", _objectSpread(_objectSpread({}, props), {}, {
+    className: classnames(props.className, scrollable),
+    style: {
+      zIndex: 800
+    },
+    children: /*#__PURE__*/jsx("a", {
+      className: header,
+      children: "Price analyzer - plan article"
+    })
+  }));
+  if (!selectedArticle) return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, props), {}, {
+    className: classnames(props.className, scrollable),
+    style: {
+      zIndex: 800
+    },
+    children: [/*#__PURE__*/jsx("a", {
+      className: header,
+      children: "Price analyzer"
+    }), /*#__PURE__*/jsx(ArticleSelector, {
+      articleState: [selectedArticle, setSelectedArticle],
+      rerender: rerender,
+      filter: function filter(a) {
+        return !a.relatedToBasketId || a.isPartListArticle;
+      }
+    })]
+  }));
+  if (!isIDMFormat) return /*#__PURE__*/jsx(Fragment, {
+    children: "Only implemented for IDM enricher data"
+  });
+  if (!agGrid.loaded || !agGrid.AgGridReact) {
+    return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, props), {}, {
+      className: classnames(props.className, scrollable),
+      style: {
+        zIndex: 800
+      },
+      children: [/*#__PURE__*/jsx("a", {
+        className: header,
+        children: "Price analyzer"
+      }), /*#__PURE__*/jsx(ArticleSelector, {
+        articleState: [selectedArticle, setSelectedArticle],
+        rerender: rerender,
+        filter: function filter(a) {
+          return !a.relatedToBasketId || a.isPartListArticle;
+        }
+      }), /*#__PURE__*/jsx("p", {
+        className: tableDescription,
+        children: "Tables require ag-grid (Go first to backoffice)."
+      })]
+    }));
+  }
+  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, props), {}, {
+    className: classnames(props.className, scrollable, viewHandler.uiState.configSettingsIsExpanded ? notExpanded : undefined),
+    style: {
+      zIndex: 800
+    },
+    children: [/*#__PURE__*/jsx("a", {
+      className: header,
+      children: "Price analyzer"
+    }), /*#__PURE__*/jsx(ArticleSelector, {
+      articleState: [selectedArticle, setSelectedArticle],
+      rerender: rerender,
+      filter: function filter(a) {
+        return !a.relatedToBasketId || a.isPartListArticle;
+      }
+    }), /*#__PURE__*/jsx("p", {
+      className: tableDescription,
+      children: "All articles overview. Price status: no prices (catalog), config mismatch (prices possible but not for current config), active (current price), flat (fixed price from catalog, no config-dependent pricing). Own = article's own price, Partlist = sum from partlist children. Total = set contribution (matches header) for base articles; own + partlist for nested partlist articles."
+    }), /*#__PURE__*/jsx("div", {
+      className: articleOverviewTable,
+      children: /*#__PURE__*/jsx("div", {
+        className: gridContainer,
+        children: /*#__PURE__*/jsx(agGrid.AgGridReact, {
+          ref: articleGridRef,
+          rowData: articleOverviewRowData,
+          columnDefs: articleOverviewColDefs,
+          theme: gridTheme,
+          getRowId: getArticleRowId,
+          getRowClass: getArticleRowClass,
+          onRowClicked: onArticleRowClicked,
+          suppressCellFocus: true,
+          suppressRowClickSelection: true,
+          domLayout: "normal"
+        })
+      })
+    }), /*#__PURE__*/jsx("p", {
+      className: tableDescription,
+      children: "Price history for selected article. Click a price to see details."
+    }), /*#__PURE__*/jsxs("div", {
+      className: optionsTable,
+      children: [/*#__PURE__*/jsx("div", {
+        className: optionsTableColumn,
+        children: /*#__PURE__*/jsx("div", {
+          className: gridContainer,
+          children: /*#__PURE__*/jsx(agGrid.AgGridReact, {
+            ref: priceHistoryGridRef,
+            rowData: prices,
+            columnDefs: priceHistoryColDefs,
+            theme: gridTheme,
+            getRowId: getPriceRowId,
+            getRowClass: getPriceRowClass,
+            onRowClicked: onPriceRowClicked,
+            suppressCellFocus: true,
+            suppressRowClickSelection: true,
+            domLayout: "normal",
+            overlayNoRowsTemplate: "<span class='ag-overlay-no-rows-center'>Change config to get price history</span>"
+          })
+        })
+      }), selectedRow && /*#__PURE__*/jsx("div", {
+        className: optionsTableColumn,
+        children: /*#__PURE__*/jsx(PriceDetailTable, {
+          row: selectedRow,
+          article: articleForPriceHistory !== null && articleForPriceHistory !== void 0 ? articleForPriceHistory : selectedArticle,
+          onClose: function onClose() {
+            return setSelectedRow(undefined);
+          }
+        })
+      })]
+    }, viewHandler.settingsState.configChanged)]
+  }));
+};
+var PriceAnalyzer$1 = observer(PriceAnalyzer);
+
+export { PriceAnalyzer$1 as default };

package/build/esm/{index-2510d869.js → index-e97380bb.js}

@@ -1,5 +1,5 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler } from './index-1f4ff73d.js';
+import { u as useViewHandler } from './index-e7467256.js';
 import { useState, useRef } from 'react';
 import classnames from 'classnames';
 import { Vector2 } from '@crystaldesign/web-planner-logic';

package/build/esm/{index-5c7907dc.js → index-eb622f08.js}

@@ -1,9 +1,9 @@
 import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
-import { u as useViewHandler } from './index-1f4ff73d.js';
+import { u as useViewHandler } from './index-e7467256.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import 'react';
-import { w as wcPlannerMsgContainerParent, e as expanded, m as mobile, P as PlannerMsgItem } from './index-37f6891f.js';
+import { w as wcPlannerMsgContainerParent, e as expanded, m as mobile, P as PlannerMsgItem } from './index-347d0778.js';
 import { jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';