npm - @crystaldesign/diva-web-planner-react - Versions diffs - 25.1.0-rc.8 → 25.1.0 - Mend

@crystaldesign/diva-web-planner-react 25.1.0-rc.8 → 25.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1195) hide show

package/build/esm/index-a342949d.js ADDED Viewed

@@ -0,0 +1,78 @@
+import { s as styleInject } from './index-c5621857.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/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+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';
+var row = "row-aKbIG";
+var rowPaddingTop = "row-padding-top-SRH2s";
+var rowPaddingTopArticle = "row-padding-top-article-Iwelk";
+var columnLeft = "column-left-jSCha";
+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 {\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 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),
+        children: item.title
+      }), /*#__PURE__*/jsx("span", {
+        className: classnames(columnRight),
+        children: (item.quantity && item.quantity > 1 ? '(x' + item.quantity + ') ' : '') + (!hidePrices && item.price ? DivaUtils.formatPrice(item.price) : '')
+      })]
+    }), /*#__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", {
+            children: item.size && item.size !== '' ? t('configurator.size') : item.description
+          }), ": ", item.size]
+        }), !item.isPartlistArticle && /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsx("a", {
+            children: item.title
+          }), item.description && ': ' + item.description]
+        })]
+      }), /*#__PURE__*/jsx("span", {
+        className: classnames(columnOption, columnRight, columnRightRed, codexes),
+        children: item.codex
+      })]
+    })]
+  });
+};
+var index = observer(OptiontreeSerious);
+export { index as default };

package/build/esm/index-a36a9288.js ADDED Viewed

@@ -0,0 +1,99 @@
+import { s as styleInject, u as useViewHandler } from './index-c5621857.js';
+import 'react';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { useTranslation } from '@crystaldesign/diva-core';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+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';
+var wcToolbarFilter = "wcToolbarFilter-Gz4PK";
+var wcPlToolIcon = "wcPlToolIcon-UBaTH";
+var wcToolbarFilterExpanded = "wcToolbarFilterExpanded-Yi0L8";
+var wcToolbarFilterMaxExpanded = "wcToolbarFilterMaxExpanded-7XK-7";
+var wcToolbarCatalogItem = "wcToolbarCatalogItem-PuT3F";
+var mobile = "mobile-Bp3bL";
+var dockL = "DockL-2XY68";
+var isActive = "is-active-Ta3Um";
+var dockLr = "DockLR-PVa10";
+var dockR = "DockR-uK2j5";
+var dockNone = "DockNone-KdE70";
+var accessoire = "Accessoire-ZN7LO";
+var css_248z = "/*DOCKFilter*/\n.wcToolbarFilter-Gz4PK {\n  margin: 0;\n  padding: 0;\n  padding: initial;\n}\n\n@media all and (max-width: 730px) and (orientation: landscape) {\n  .wcToolbarFilter-Gz4PK {\n    display: none;\n  }\n}\n\n.wcPlToolIcon-UBaTH {\n  height: 25px;\n  width: 25px;\n  background-repeat: no-repeat;\n  background-size: auto 20px;\n  display: inline-block;\n  font-size: 0;\n  text-align: center;\n  z-index: 99;\n  margin-top: 5px;\n  cursor: pointer;\n  transition: 0.35s ease;\n}\n\n.wcToolbarFilterExpanded-Yi0L8 .wcPlToolIcon-UBaTH,\n.wcToolbarFilterMaxExpanded-7XK-7 .wcPlToolIcon-UBaTH {\n  height: 30px;\n  width: 30px;\n  background-size: auto 25px;\n}\n.wcToolbarCatalogItem-PuT3F {\n  display: inline-block;\n  list-style: none outside none;\n  padding: 0 0.3em;\n  cursor: pointer;\n  height: 32px;\n}\n.mobile-Bp3bL .wcPlToolIcon-UBaTH {\n  height: 22px;\n  width: 22px;\n  background-size: auto 18px;\n}\n\n.mobile-Bp3bL .wcToolbarCatalogItem-PuT3F {\n  height: 30px;\n  padding: 0 4px;\n}\n\n.DockL-2XY68 {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 51.12 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockL%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%223.5%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22 transform%3D%22translate(45.5 45.5) rotate(180)%22%2F%3E%3Cpolygon points%3D%2235 6.5 51.13 22.63 35 38.75 35 22.63 35 6.5%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n.DockL-2XY68.is-active-Ta3Um {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 51.12 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D.cls-2%7Bfill%3A%23e77031%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockL%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%223.5%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22 transform%3D%22translate(45.5 45.5) rotate(180)%22%2F%3E%3Cpolygon class%3D%22cls-2%22 points%3D%2235 6.5 51.13 22.63 35 38.75 35 22.63 35 6.5%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n\n.DockLR-PVa10 {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 57.25 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockLR%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%229.62%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22 transform%3D%22translate(57.75 45.5) rotate(180)%22%2F%3E%3Cpolygon points%3D%2216.13 38.75 0 22.63 16.13 6.5 16.13 22.63 16.13 38.75%22%2F%3E%3Cpolygon points%3D%2241.13 6.5 57.25 22.63 41.13 38.75 41.13 22.63 41.13 6.5%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n.DockLR-PVa10.is-active-Ta3Um {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 57.25 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D.cls-2%7Bfill%3A%23e77031%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockLR%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%229.62%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22 transform%3D%22translate(57.75 45.5) rotate(180)%22%2F%3E%3Cpolygon class%3D%22cls-2%22 points%3D%2216.13 38.75 0 22.63 16.13 6.5 16.13 22.63 16.13 38.75%22%2F%3E%3Cpolygon class%3D%22cls-2%22 points%3D%2241.13 6.5 57.25 22.63 41.13 38.75 41.13 22.63 41.13 6.5%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n\n.DockR-uK2j5 {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 51.12 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockR%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%229.12%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22%2F%3E%3Cpolygon points%3D%2216.13 39.25 0 23.13 16.13 7 16.13 23.13 16.13 39.25%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n.DockR-uK2j5.is-active-Ta3Um {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 51.12 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D.cls-2%7Bfill%3A%23e77031%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockR%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%229.12%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22%2F%3E%3Cpolygon class%3D%22cls-2%22 points%3D%2216.13 39.25 0 23.13 16.13 7 16.13 23.13 16.13 39.25%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n\n.DockNone-KdE70 {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 45.5 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockNone%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%223.5%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22%2F%3E%3Crect x%3D%2211.5%22 y%3D%2211%22 width%3D%2223%22 height%3D%2223%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n.DockNone-KdE70.is-active-Ta3Um {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 45.5 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D.cls-2%7Bfill%3A%23e77031%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockNoneOrange%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%223.5%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22%2F%3E%3Crect class%3D%22cls-2%22 x%3D%2211.5%22 y%3D%2211%22 width%3D%2223%22 height%3D%2223%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n\n.Accessoire-ZN7LO {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 43.05 43.1%22%3E%3Ctitle%3EPlus%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_3%22 data-name%3D%22Ebene 3%22%3E%3Cpath d%3D%22M24.79%2C24.79V43.1H18.18V24.79H0V18.18H18.18V0h6.61V18.18H43.05v6.61Z%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n.Accessoire-ZN7LO.is-active-Ta3Um {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 43.05 43.1%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23e77031%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EAddAccessoireOrange%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_2-2%22 data-name%3D%22Ebene 2%22%3E%3Cpath class%3D%22cls-1%22 d%3D%22M24.79%2C24.79V43.1H18.18V24.79H0V18.18H18.18V0h6.61V18.18H43.05v6.61Z%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n";
+styleInject(css_248z);
+var DockFilter = function DockFilter() {
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var plannerItems = viewHandler.paletteViewHandler.plannerItems;
+  if (!plannerItems.doShowFilterTypes()) return /*#__PURE__*/jsx(Fragment, {});
+  var onSelectConfigFilter = function onSelectConfigFilter(paletteId, codex, filterType) {
+    viewHandler.paletteViewHandler.onSelectFilter(paletteId, codex, filterType);
+  };
+  return /*#__PURE__*/jsxs("ul", {
+    style: {
+      "float": viewHandler.getIsInMobileView() ? 'left' : 'none'
+    },
+    className: classnames(wcToolbarFilter, viewHandler.uiState.configSettingsIsExpanded ? wcToolbarFilterExpanded : undefined, viewHandler.uiState.configSettingsIsMaxExpanded ? wcToolbarFilterMaxExpanded : undefined, viewHandler.getIsInMobileView() ? mobile : undefined),
+    children: [viewHandler.settingsState.plannerFilter.curFilteredTypes['DockL'] && /*#__PURE__*/jsx("li", {
+      className: wcToolbarCatalogItem,
+      onClick: function onClick() {
+        return onSelectConfigFilter(1, 'DockL', 'DockFilter');
+      },
+      children: /*#__PURE__*/jsx("span", {
+        className: classnames(wcPlToolIcon, dockL, viewHandler.settingsState.plannerFilter.dockFilter['DockL'] ? isActive : undefined),
+        title: t('configurator.LEFT_ELEMENTS')
+      })
+    }), viewHandler.settingsState.plannerFilter.curFilteredTypes['DockLR'] && /*#__PURE__*/jsx("li", {
+      className: wcToolbarCatalogItem,
+      onClick: function onClick() {
+        return onSelectConfigFilter(1, 'DockLR', 'DockFilter');
+      },
+      children: /*#__PURE__*/jsx("span", {
+        className: classnames(wcPlToolIcon, dockLr, viewHandler.settingsState.plannerFilter.dockFilter['DockLR'] ? isActive : undefined),
+        title: t('configurator.MIDDLE_ELEMENTS')
+      })
+    }), viewHandler.settingsState.plannerFilter.curFilteredTypes['DockR'] && /*#__PURE__*/jsx("li", {
+      className: wcToolbarCatalogItem,
+      onClick: function onClick() {
+        return onSelectConfigFilter(1, 'DockR', 'DockFilter');
+      },
+      children: /*#__PURE__*/jsx("span", {
+        className: classnames(wcPlToolIcon, dockR, viewHandler.settingsState.plannerFilter.dockFilter['DockR'] ? isActive : undefined),
+        title: t('configurator.RIGHT_ELEMENTS')
+      })
+    }), viewHandler.settingsState.plannerFilter.curFilteredTypes['DockNone'] && /*#__PURE__*/jsx("li", {
+      className: wcToolbarCatalogItem,
+      onClick: function onClick() {
+        return onSelectConfigFilter(1, 'DockNone', 'DockFilter');
+      },
+      children: /*#__PURE__*/jsx("span", {
+        className: classnames(wcPlToolIcon, dockNone, viewHandler.settingsState.plannerFilter.dockFilter['DockNone'] ? isActive : undefined),
+        title: t('configurator.SOLO_ELEMENTS')
+      })
+    }), viewHandler.settingsState.plannerFilter.curFilteredTypes['Accessoire'] && /*#__PURE__*/jsx("li", {
+      className: wcToolbarCatalogItem,
+      onClick: function onClick() {
+        return onSelectConfigFilter(1, 'Accessoire', 'DockFilter');
+      },
+      children: /*#__PURE__*/jsx("span", {
+        className: classnames(wcPlToolIcon, accessoire, viewHandler.settingsState.plannerFilter.dockFilter['Accessoire'] ? isActive : undefined),
+        title: t('configurator.ACCESSOIRE_ELEMENTS')
+      })
+    })]
+  });
+};
+var DockFilter$1 = observer(DockFilter);
+export { DockFilter$1 as default };

package/build/esm/index-a45bd545.js ADDED Viewed

@@ -0,0 +1,123 @@
+import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
+import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
+import _regeneratorRuntime from '@babel/runtime/regenerator';
+import { s as styleInject, u as useViewHandler } from './index-c5621857.js';
+import { useRef, useEffect } from 'react';
+import { observer } from 'mobx-react-lite';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+var wcTextBoxInDialog = "wcTextBoxInDialog-cUykT";
+var wcPopupWindowContainer = "wcPopupWindowContainer-RSZGf";
+var wcClose = "wcClose-X1s6d";
+var wcSubmit = "wcSubmit-Ax0lk";
+var css_248z = ".wcTextBoxInDialog-cUykT {\n  width: 90%;\n  padding: 12px 20px;\n  margin: 8px 0;\n  display: inline-block;\n  border: 1px solid #ccc;\n  border-radius: 4px;\n  box-sizing: border-box;\n  float: left;\n}\n\n.wcPopupWindowContainer-RSZGf {\n  letter-spacing: 0.5px;\n  -webkit-text-stroke: 0.1px;\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n  z-index: 999;\n  width: 40em;\n  max-width: 70%;\n  max-height: 90%;\n  background-color: white;\n  padding: 1em 2em 0.5em 2em;\n  border-radius: 15px;\n  border: 1px solid #cbcbcb;\n  font-size: 14.4px;\n  color: #363636;\n  display: flex;\n  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n}\n.wcPopupWindowContainer-RSZGf p {\n  font-size: 16px;\n  -webkit-text-stroke: 0.5px;\n}\n\n.wcPopupWindowContainer-RSZGf ul {\n  padding: 0;\n  margin: 0;\n}\n\n.wcPopupWindowContainer-RSZGf .wctooltext-G-oa5 {\n  width: calc(100% - 65px);\n  float: left;\n  padding: 8px 0 15px 10px;\n}\n\n.wcPopupWindowContainer-RSZGf li {\n  height: 40px;\n  width: 55px;\n  display: block;\n  background-repeat: no-repeat;\n  background-position: center;\n  float: left;\n  clear: both;\n  margin-bottom: 15px;\n}\n\n.wcClose-X1s6d {\n  border-radius: 20px;\n  position: absolute;\n  font-size: 22pt;\n  font-family: sans-serif;\n  font-weight: 50;\n  top: -20px;\n  right: -20px;\n  width: 40px;\n  height: 40px;\n  background-color: #fff;\n  color: #666;\n  border: 2px solid #666;\n  text-align: center;\n  padding-top: 0px;\n  content: 'X';\n}\n\n.wcClose-X1s6d:hover {\n  background-color: #aaa;\n  color: #000;\n  border: 2px solid #000;\n}\n.wcSubmit-Ax0lk {\n  border: 1px var(--secondaryColor) solid;\n  background-color: var(--secondaryColor);\n  color: #ffffff;\n  height: 41px;\n  width: 8%;\n  margin: 8px 0 7px;\n  float: right;\n  border-radius: var(--globalBorderRadius);\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-image: url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 22.0.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0)  --%3E%3Csvg version%3D%221.1%22 id%3D%22Ebene_1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 x%3D%220px%22 y%3D%220px%22%09 viewBox%3D%220 0 8 13.5%22 style%3D%22enable-background%3Anew 0 0 8 13.5%3B%22 xml%3Aspace%3D%22preserve%22%3E%3Cstyle type%3D%22text%2Fcss%22%3E%09.st0%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3Cg%3E%09%3Cpath class%3D%22st0%22 d%3D%22M6.5%2C11.7c-0.1%2C0-0.2%2C0-0.3-0.1l-5-4.3C1.1%2C7.2%2C1%2C7.1%2C1%2C7c0-0.1%2C0.1-0.3%2C0.2-0.4l5-4.7c0.2-0.2%2C0.5-0.2%2C0.7%2C0%09%09c0.2%2C0.2%2C0.2%2C0.5%2C0%2C0.7L2.3%2C6.9l4.6%2C3.9C7%2C11%2C7.1%2C11.4%2C6.9%2C11.6C6.8%2C11.7%2C6.7%2C11.7%2C6.5%2C11.7z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n  background-size: 16px;\n  transform: rotate(180deg);\n}\n";
+styleInject(css_248z);
+var Inputbox = function Inputbox(_ref) {
+  _objectDestructuringEmpty(_ref);
+  var viewHandler = useViewHandler();
+  var inputBox = useRef(null);
+  useEffect(function () {
+    var _viewHandler$settings, _viewHandler$settings2, _inputBox$current;
+    viewHandler.settingsState.setInputBoxValue((_viewHandler$settings = (_viewHandler$settings2 = viewHandler.settingsState.inputBoxItem) === null || _viewHandler$settings2 === void 0 ? void 0 : _viewHandler$settings2.freeText) !== null && _viewHandler$settings !== void 0 ? _viewHandler$settings : '');
+    (_inputBox$current = inputBox.current) === null || _inputBox$current === void 0 || _inputBox$current.focus();
+  }, []);
+  useEffect(function () {
+    var _viewHandler$settings3;
+    if ((_viewHandler$settings3 = viewHandler.settingsState.inputBoxItem) !== null && _viewHandler$settings3 !== void 0 && _viewHandler$settings3.freeText) {
+      viewHandler.settingsState.setInputBoxValue(viewHandler.settingsState.inputBoxItem.freeText);
+    }
+  }, [viewHandler.settingsState.inputBoxItem]);
+  if (!viewHandler.settingsState.inputBoxItem) return /*#__PURE__*/jsx(Fragment, {});
+  var title = viewHandler.settingsState.inputBoxItem.text;
+  if (title.includes(':')) title = title.slice(0, title.lastIndexOf(':'));
+  var onSubmit = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            if (!viewHandler.settingsState.inputBoxItem) {
+              _context.next = 6;
+              break;
+            }
+            viewHandler.settingsState.inputBoxItem.freeText = viewHandler.settingsState.inputBoxValue;
+            _context.next = 4;
+            return viewHandler.paletteViewHandler.clickedOnConfigPalette(viewHandler.settingsState.inputBoxItem, 'inputbox');
+          case 4:
+            viewHandler.settingsState.updateInputBoxValues(false, undefined);
+            viewHandler.uiState.setConfiguratorDisabled(false);
+          case 6:
+            if (viewHandler.settingsState.inputBoxVisible) {
+              viewHandler.uiState.setConfiguratorDisabled(true);
+            } else {
+              viewHandler.uiState.setConfiguratorDisabled(false);
+            }
+          case 7:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function onSubmit() {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+  var isNumberBox = !!viewHandler.settingsState.inputBoxItem.measureUnit;
+  var keyDownFunction = function keyDownFunction(e) {
+    if (!viewHandler) return;
+    if (e.key === 'Enter') {
+      onSubmit();
+      e.stopPropagation();
+    }
+  };
+  return /*#__PURE__*/jsx("div", {
+    children: /*#__PURE__*/jsxs("div", {
+      className: wcPopupWindowContainer,
+      children: [/*#__PURE__*/jsx("span", {
+        onClick: function onClick() {
+          return viewHandler.settingsState.inputBoxVisible = false;
+        },
+        className: wcClose,
+        children: "\u2716"
+      }), /*#__PURE__*/jsxs("div", {
+        style: {
+          width: '100%'
+        },
+        children: [/*#__PURE__*/jsx("p", {
+          style: {
+            marginTop: '2px'
+          },
+          children: title
+        }), /*#__PURE__*/jsx("input", {
+          ref: inputBox,
+          onKeyDown: function onKeyDown(e) {
+            return keyDownFunction(e);
+          },
+          className: wcTextBoxInDialog,
+          type: isNumberBox ? 'number' : 'text',
+          onChange: function onChange(event) {
+            return viewHandler.settingsState.setInputBoxValue(event.target.value);
+          },
+          value: viewHandler.settingsState.inputBoxValue
+        }), /*#__PURE__*/jsx("button", {
+          className: wcSubmit,
+          onClick: onSubmit
+        })]
+      })]
+    })
+  });
+};
+var Inputbox$1 = observer(Inputbox);
+export { Inputbox$1 as default };

package/build/esm/index-a8edc564.js ADDED Viewed

@@ -0,0 +1,46 @@
+import { s as styleInject, u as useViewHandler } from './index-c5621857.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+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';
+var container = "container-vxlYB";
+var totalPrice = "totalPrice-sBu4C";
+var price = "price-jVSu8";
+var css_248z = ".container-vxlYB {\n  width: 100%;\n  border-top: 1px #6d6e71 solid;\n  color: #6d6e71;\n  font-weight: 600;\n  font-size: 20px;\n  line-height: 24px;\n  padding-top: 1rem;\n}\n\n.totalPrice-sBu4C {\n  float: left;\n  margin-left: 2rem;\n}\n\n.price-jVSu8 {\n  float: right;\n  margin-right: 2rem;\n}\n";
+styleInject(css_248z);
+var SummaryTotalPrice = function SummaryTotalPrice(props) {
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var viewHandler = useViewHandler();
+  var _useDivaCore = useDivaCore(),
+    hidePrices = _useDivaCore.state.hidePrices;
+  return /*#__PURE__*/jsx(Fragment, {
+    children: !hidePrices && /*#__PURE__*/jsxs("div", {
+      className: container,
+      children: [/*#__PURE__*/jsx("div", {
+        className: totalPrice,
+        children: t('configurator.TotalPrice', 'TotalPrice')
+      }), /*#__PURE__*/jsx("div", {
+        className: price,
+        children: viewHandler.productState.formatedTotalPrice
+      })]
+    })
+  });
+};
+var TotalPrice = observer(SummaryTotalPrice);
+export { TotalPrice as default };

package/build/esm/index-a9ebf567.js ADDED Viewed

@@ -0,0 +1,27 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import './index-c5621857.js';
+import 'react';
+import DynamicMultiRender from 'react-dynamic-multi-render';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'mobx-react-lite';
+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; }
+var BasketAction = function BasketAction(props) {
+  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
+    componentName: "Action/Basket"
+  }));
+};
+export { BasketAction as default };

package/build/esm/index-aa9f310f.js ADDED Viewed

@@ -0,0 +1,44 @@
+import './index-c5621857.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+var Trash = function Trash(_ref) {
+  var item = _ref.item,
+    rect = _ref.rect,
+    onElement = _ref.onElement,
+    plannerUIProps = _ref.plannerUIProps;
+  return /*#__PURE__*/jsx("div", {
+    ref: function ref(elem) {
+      return onElement(elem);
+    },
+    onClick: function onClick() {
+      var _item$clickFunction;
+      (_item$clickFunction = item.clickFunction) === null || _item$clickFunction === void 0 || _item$clickFunction.call(item, item.setId, Number(item.elementId));
+    },
+    style: {
+      left: rect.doUseCalc ? rect.leftCalc : item.position.interpretation == 'percentage' ? rect.left + '%' : rect.left + 'px',
+      top: rect.doUseCalc ? rect.topCalc : item.position.interpretation == 'percentage' ? rect.top + '%' : rect.top + 'px'
+    },
+    className: classnames(plannerUIProps.classes.trash.trashClass, plannerUIProps.classes.buttonGeneral, item.plannerMode == 'BOX' ? plannerUIProps.classes.trash.boxplanner : undefined),
+    id: "testDel",
+    children: item.posNr
+  });
+};
+var Trash$1 = observer(Trash);
+export { Trash$1 as default };

package/build/esm/index-ab56240c.js ADDED Viewed

@@ -0,0 +1,27 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import './index-c5621857.js';
+import 'react';
+import DynamicMultiRender from 'react-dynamic-multi-render';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'mobx-react-lite';
+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; }
+var ItemVariant = function ItemVariant(props) {
+  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
+    componentName: "Settings/SettingsScroller/SettingsItem/ItemPalette/Options/Gallery"
+  }));
+};
+export { ItemVariant as default };

package/build/esm/index-ac04ddd6.js ADDED Viewed

@@ -0,0 +1,137 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-c5621857.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { useState } from 'react';
+import { w as wcFavoriteSel, a as wcFavorite } from './index.module-542a9a0f.js';
+import { useHover, useLayer } from 'react-laag';
+import GenericToolTip from './index-7644273f.js';
+import MetaData from './index-52101ce2.js';
+import { useDivaCore } from '@crystaldesign/diva-core';
+import InfoIcon from './index-6403dff3.js';
+import PricePreview from './index-ff532b7c.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+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';
+var paletteItem = "PaletteItem-C-fa2";
+var wcVCodexText = "wcVCodexText-GN3-8";
+var sel = "sel-3ZIRz";
+var imageWrapper = "imageWrapper-QwsRE";
+var small = "small-Ynrzj";
+var wcImage = "wcImage-eveCj";
+var title = "title-mFBM6";
+var big = "big-wADuy";
+var css_248z = "/*Size Normal */\n\n.PaletteItem-C-fa2 {\n  border-radius: var(--globalBorderRadius);\n  position: relative;\n  z-index: 100;\n  transition: all 0.15s ease;\n  cursor: pointer;\n}\n\n.PaletteItem-C-fa2:active,\n.PaletteItem-C-fa2:hover {\n  z-index: 200;\n  transition: 0.15s ease;\n}\n\n.wcVCodexText-GN3-8 {\n  position: absolute;\n  line-height: 104px;\n  width: 100%;\n  color: white;\n  display: none;\n  text-align: center;\n}\n\n.PaletteItem-C-fa2:hover .wcVCodexText-GN3-8,\n.sel-3ZIRz .wcVCodexText-GN3-8 {\n  display: block;\n}\n\n.imageWrapper-QwsRE {\n  border-radius: 50%;\n  border: 1px rgb(230, 230, 230) solid;\n  display: flex;\n  transition: 0.15s ease;\n  position: relative;\n}\n.imageWrapper-QwsRE:hover {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n  border: 1px var(--primaryColor) solid;\n  border: 1px var(--optionItemBorderSelColor, var(--primaryColor)) solid;\n}\n.sel-3ZIRz .imageWrapper-QwsRE:hover,\n.small-Ynrzj.sel-3ZIRz .imageWrapper-QwsRE:hover {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n  border: 1px rgb(230, 230, 230) solid;\n}\n.sel-3ZIRz .imageWrapper-QwsRE,\n.small-Ynrzj.sel-3ZIRz .imageWrapper-QwsRE {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n}\n\n.wcImage-eveCj {\n  width: calc(100% - 8px);\n  aspect-ratio: 1;\n  border: 4px white solid;\n  border-radius: 50%;\n  user-select: none;\n  -moz-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n}\n.sel-3ZIRz .wcImage-eveCj,\n.small-Ynrzj.sel-3ZIRz .wcImage-eveCj {\n  border: 4px var(--primaryColor) solid;\n  border: 4px var(--optionItemBorderSelColor, var(--primaryColor)) solid;\n}\n\n.hexColor-NBrjx {\n  width: 80px;\n  height: 80px;\n}\n\n.title-mFBM6 {\n  margin-top: 4px;\n  text-align: center;\n  float: left;\n  max-height: 64px;\n  min-height: 16px;\n  width: 100%;\n  font-size: 14px;\n  line-height: 16px;\n  overflow: hidden;\n  display: -webkit-box;\n  word-wrap: break-word;\n  -webkit-box-orient: vertical;\n  -webkit-hyphens: auto;\n  hyphens: auto;\n  -webkit-line-clamp: 2;\n  position: relative;\n  -webkit-hyphens: auto;\n  hyphens: auto;\n  user-select: none;\n  -moz-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n  z-index: 400;\n}\n\n.PaletteItem-C-fa2:hover .title-mFBM6,\n.small-Ynrzj .PaletteItem-C-fa2:hover .title-mFBM6 {\n  max-height: 608px;\n  -webkit-line-clamp: 30;\n  overflow: visible;\n  z-index: 200;\n}\n\n/* Size Small */\n\n.small-Ynrzj .wcVCodexText-GN3-8 {\n  line-height: 58px;\n  font-size: 12px;\n}\n\n.small-Ynrzj .title-mFBM6 {\n  font-size: 12px;\n  margin-top: 6px;\n  -webkit-line-clamp: 1;\n}\n/* Size very Small */\n\n.very-small-XTQPS .wcVCodexText-GN3-8 {\n  line-height: 48px;\n  font-size: 10px;\n}\n\n.very-small-XTQPS .title-mFBM6 {\n  font-size: 10px;\n  margin-top: 5px;\n  -webkit-line-clamp: 1;\n}\n\n/* Size big */\n\n.big-wADuy .wcVCodexText-GN3-8 {\n  line-height: 158px;\n  font-size: 15px;\n}\n\n.big-wADuy .title-mFBM6 {\n  font-size: 15px;\n  margin-top: 10px;\n  -webkit-line-clamp: 2;\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; }
+var Option = function Option(_ref) {
+  var _item$hexColor, _renderLayer;
+  var itemP = _ref.item,
+    type = _ref.type,
+    paletteId = _ref.paletteId,
+    hidePricePreview = _ref.hidePricePreview;
+  var item = itemP;
+  var viewHandler = useViewHandler();
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    metaDataVisible = _useState2[0],
+    setMetaDataVisible = _useState2[1];
+  var onClick = function onClick() {
+    viewHandler.paletteViewHandler.clickedOnConfigPalette(item, undefined, paletteId);
+  };
+  var _useDivaCore = useDivaCore(),
+    _useDivaCore$state$di = _useDivaCore.state.dimensions,
+    isMobile = _useDivaCore$state$di.isMobile,
+    isTablet = _useDivaCore$state$di.isTablet;
+  /* tool tip stuff*/
+  var triggerProps = {};
+  var layerProps = {};
+  var renderLayer = undefined;
+  var isOver = false;
+  var hoverProps = {};
+  var hover = useHover({
+    delayEnter: 600,
+    hideOnScroll: true
+  });
+  var tooltip = useLayer({
+    isOpen: hover[0],
+    auto: true,
+    placement: viewHandler.getViewConfig().tooltipPosition || 'left-center'
+  });
+  if (!isMobile && !isTablet && !viewHandler.getViewConfig().hideTooltip && (item.image || item.hexColor) && !item.contentItemId) {
+    isOver = hover[0];
+    hoverProps = hover[1];
+    triggerProps = tooltip.triggerProps;
+    layerProps = tooltip.layerProps;
+    renderLayer = tooltip.renderLayer;
+  }
+  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread(_objectSpread({
+    id: item.codex,
+    className: classnames(type == 'small' ? small : undefined, type == 'big' ? big : undefined, paletteItem, item.sel ? sel : undefined),
+    onClick: onClick
+  }, triggerProps), hoverProps), {}, {
+    children: [/*#__PURE__*/jsxs("div", {
+      className: classnames(imageWrapper),
+      children: [item.vCodex && /*#__PURE__*/jsx("div", {
+        className: classnames(wcVCodexText),
+        children: item.vCodex
+      }), item.image ? /*#__PURE__*/jsx("img", {
+        className: classnames(wcImage),
+        src: item.image
+      }) : /*#__PURE__*/jsx("div", {
+        className: classnames(wcImage),
+        style: {
+          backgroundColor: '#' + ((_item$hexColor = item.hexColor) !== null && _item$hexColor !== void 0 ? _item$hexColor : 'dfdfdf')
+        }
+      }), item.contentItemId && /*#__PURE__*/jsx(InfoIcon, {
+        item: item
+      })]
+    }), /*#__PURE__*/jsx("div", {
+      className: title,
+      dangerouslySetInnerHTML: {
+        __html: item.text
+      }
+    }), item.doShowFav && /*#__PURE__*/jsx("div", {
+      className: item.isFav ? wcFavoriteSel : wcFavorite,
+      onClick: function onClick() {
+        return viewHandler.paletteViewHandler.clickedOnFavIcon(item);
+      }
+    }), /*#__PURE__*/jsx(MetaData, {
+      style: {
+        position: 'relative',
+        "float": 'left',
+        display: 'none'
+      },
+      metaData: item.metaData,
+      visible: [metaDataVisible, setMetaDataVisible]
+    }, item.codex), !hidePricePreview && item.pricePreviewPromise !== undefined && /*#__PURE__*/jsx(PricePreview, {
+      asyncPricePreview: item.pricePreviewPromise,
+      style: type == 'small' ? {
+        fontSize: 9
+      } : undefined
+    }), isOver && ((_renderLayer = renderLayer) === null || _renderLayer === void 0 ? void 0 : _renderLayer(/*#__PURE__*/jsx(GenericToolTip, {
+      text: item.text + (item.freeText ? item.freeText : ''),
+      hexColor: item.hexColor,
+      desciption: metaDataVisible,
+      pricePreviewPromise: item.pricePreviewPromise,
+      image: item.image,
+      layerProps: layerProps
+    }, item.codex)))]
+  }));
+};
+var GalleryText = observer(Option);
+export { GalleryText as default };