@crystaldesign/diva-web-planner-react 25.4.0-beta.3 → 25.4.0-beta.31

package/build/esm/index-83b993ca.js

@@ -0,0 +1,131 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject } from './index-273b10aa.js';
+import { useState, useEffect } from 'react';
+import Toggle from './index-febfee5e.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+var wrapper = "wrapper-i5mp2";
+var tabs = "tabs-byZxq";
+var sel = "sel-J1it3";
+var selectionWrapper = "selection-wrapper-BVO4h";
+var selectionText = "selection-text-gO6Tv";
+var selection = "selection-ZoepK";
+var css_248z$1 = ".wrapper-i5mp2 {\n  background-color: rgba(244, 244, 244, 0.8);\n  position: absolute;\n  margin-left: 50px;\n  -webkit-user-select: text;\n     -moz-user-select: text;\n          user-select: text;\n}\n\n.tabs-byZxq {\n  margin: 32px;\n  font-size: 22px;\n  display: flex;\n  gap: 32px;\n}\n\n.tabs-byZxq div {\n  cursor: pointer;\n}\n\n.tabs-byZxq div:hover,\n.sel-J1it3 {\n  border-bottom: var(--primaryColor) 2px solid;\n}\n\n.selection-wrapper-BVO4h {\n  display: flex;\n  position: relative;\n  margin: 8px 32px;\n}\n\n.selection-text-gO6Tv {\n  width: 160px;\n  line-height: 38px;\n}\n.selection-ZoepK {\n  flex-grow: 1;\n}\n\n.selection-wrapper-BVO4h input {\n  flex-grow: 1;\n}\n";
+styleInject(css_248z$1);
+
+var tableWrapper = "table-wrapper-NEM-p";
+var tableCss = "table-css-Qbpn7";
+var css_248z = ".table-wrapper-NEM-p {\n  margin: 16px;\n  overflow: auto;\n  height: calc(100% - 120px);\n}\n.table-css-Qbpn7 {\n}\n.table-css-Qbpn7 td {\n  border: 1px solid black;\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 Table = function Table(_ref) {
+  var properties = _ref.properties,
+    data = _ref.data,
+    id = _ref.id;
+  var _useState = useState({}),
+    _useState2 = _slicedToArray(_useState, 2),
+    overwrittenProps = _useState2[0],
+    setOverwrittenProps = _useState2[1];
+  var _useState3 = useState(properties),
+    _useState4 = _slicedToArray(_useState3, 2),
+    filteredProperties = _useState4[0],
+    setFilteredProperties = _useState4[1];
+  var _useState5 = useState(),
+    _useState6 = _slicedToArray(_useState5, 2),
+    searchText = _useState6[0],
+    setSearchText = _useState6[1];
+  useEffect(function () {
+    if (searchText) {
+      setFilteredProperties(properties.filter(function (p) {
+        return p.codex.toLocaleLowerCase().includes(searchText === null || searchText === void 0 ? void 0 : searchText.toLocaleLowerCase()) || p.type.toLocaleLowerCase().includes(searchText === null || searchText === void 0 ? void 0 : searchText.toLocaleLowerCase());
+      }));
+    } else {
+      setFilteredProperties(properties);
+    }
+  }, [searchText]);
+  useEffect(function () {
+    setSearchText('');
+    setFilteredProperties(properties);
+  }, [id]);
+  var onClick = function onClick(key, newVal, type) {
+    var newVals = _objectSpread({}, overwrittenProps);
+    if (!data) return;
+    newVals[key] = newVal;
+    if (type == 'Array') {
+      data[key] = newVal === null || newVal === void 0 ? void 0 : newVal.split(';');
+    } else {
+      data[key] = newVal;
+    }
+    setOverwrittenProps(newVals);
+  };
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsxs("div", {
+      className: selectionWrapper,
+      children: [/*#__PURE__*/jsx("div", {
+        className: selectionText,
+        children: "Suche:"
+      }), /*#__PURE__*/jsx("input", {
+        type: "text",
+        value: searchText,
+        onChange: function onChange(e) {
+          var _e$target;
+          return setSearchText((_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value);
+        }
+      })]
+    }), /*#__PURE__*/jsx("div", {
+      className: tableWrapper,
+      children: /*#__PURE__*/jsxs("table", {
+        className: tableCss,
+        children: [/*#__PURE__*/jsx("th", {
+          children: "CODEX"
+        }), /*#__PURE__*/jsx("th", {
+          children: "Beschreibung"
+        }), /*#__PURE__*/jsx("th", {
+          children: "Type"
+        }), /*#__PURE__*/jsx("th", {
+          children: "edit"
+        }), filteredProperties.map(function (p) {
+          var _overwrittenProps$p$c, _overwrittenProps$p$c2, _overwrittenProps$p$c3;
+          return /*#__PURE__*/jsxs("tr", {
+            children: [/*#__PURE__*/jsx("td", {
+              children: p.codex
+            }), /*#__PURE__*/jsx("td", {
+              children: p.desc
+            }), /*#__PURE__*/jsx("td", {
+              children: p.type
+            }), /*#__PURE__*/jsxs("td", {
+              children: [p.type == 'boolean' && /*#__PURE__*/jsx(Toggle, {
+                state: (_overwrittenProps$p$c = overwrittenProps[p.catalogKey]) !== null && _overwrittenProps$p$c !== void 0 ? _overwrittenProps$p$c : data === null || data === void 0 ? void 0 : data[p.catalogKey],
+                onChange: function onChange(val) {
+                  return onClick(p.catalogKey, val, p.type);
+                }
+              }), (p.type == 'string' || p.type == 'Array') && /*#__PURE__*/jsx("input", {
+                value: (_overwrittenProps$p$c2 = overwrittenProps[p.catalogKey]) !== null && _overwrittenProps$p$c2 !== void 0 ? _overwrittenProps$p$c2 : data === null || data === void 0 ? void 0 : data[p.catalogKey],
+                onChange: function onChange(e) {
+                  return onClick(p.catalogKey, e.target.value, p.type);
+                },
+                type: "text"
+              }), p.type == 'number' && /*#__PURE__*/jsx("input", {
+                value: (_overwrittenProps$p$c3 = overwrittenProps[p.catalogKey]) !== null && _overwrittenProps$p$c3 !== void 0 ? _overwrittenProps$p$c3 : data === null || data === void 0 ? void 0 : data[p.catalogKey],
+                onChange: function onChange(e) {
+                  return onClick(p.catalogKey, e.target.value, p.type);
+                },
+                type: "number"
+              })]
+            })]
+          }, p.codex);
+        })]
+      })
+    })]
+  });
+};
+
+var index = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  'default': Table
+});
+
+export { Table as T, selectionWrapper as a, selectionText as b, selection as c, index as i, sel as s, tabs as t, wrapper as w };

package/build/esm/index-87726363.js

@@ -0,0 +1,159 @@
+import { s as styleInject, u as useViewHandler } from './index-273b10aa.js';
+import { useEffect } from 'react';
+import Settings from './index-9291abfe.js';
+import TabGroup from './index-a031608b.js';
+import { observer } from 'mobx-react-lite';
+import Inputbox from './index-61d18784.js';
+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 '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import '@crystaldesign/widget-contact-form';
+import './index-89c7406a.js';
+import './index-0b9c6dcf.js';
+import './index-80e60fbc.js';
+import './index-1a0dd518.js';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-fdbd8567.js';
+import 'react-laag';
+import './index-fc1cc190.js';
+import 'classnames';
+import './index-1957307e.js';
+import './index-458c7d0a.js';
+import 'sift';
+import './index-8aff7a21.js';
+import './index-6d0a6965.js';
+import './index-8a56eb96.js';
+import './index-c69c54f2.js';
+import './index.module-09571d1f.js';
+import './index-febfee5e.js';
+import 'react-switch';
+import './index-d83d9482.js';
+import './index-39cb2054.js';
+import './index-e914694d.js';
+import 'react-dropdown';
+import './index-1235251c.js';
+import './index-968e4147.js';
+import './index-d5a5d30c.js';
+import './index-137af628.js';
+import '@crystaldesign/content-box';
+import './index-7a1fa2a3.js';
+import './index-61ea9f54.js';
+import './index-2f66bd2f.js';
+import './index-41019b38.js';
+import './index-7a4380a6.js';
+import './index-badf7df4.js';
+import './index-b0c2adfc.js';
+import './index-7b383432.js';
+import './index-4c40bfc5.js';
+import './index-2be19785.js';
+import './index-663639bf.js';
+import './index-cb7924e3.js';
+import './index-0421908a.js';
+import './index-3e86afd5.js';
+import './index-54bac6d1.js';
+import './index-4b57e569.js';
+import './index.module-ccf4e4f4.js';
+import './index-55bdcfd0.js';
+import './index-f84e1342.js';
+import './index-cd0dcc12.js';
+import './index-0189807f.js';
+import './index-92b4be4d.js';
+import './index-23950bfc.js';
+import './index-bc990761.js';
+import './index.module-a687d981.js';
+import './index-c89918f0.js';
+import './index-cd6bb53e.js';
+import './index-13892626.js';
+import './index-ee181ed9.js';
+import './index.module-498a463d.js';
+import 'react-select';
+import './index-5977f6f5.js';
+import './index-2b62291e.js';
+import './index.module-af50b1be.js';
+import './index-3906f607.js';
+import 'qrcode.react';
+import './index-5c17855d.js';
+import './index-1bb2277d.js';
+import './index-344294c0.js';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import './index-53726249.js';
+import './index-7326be3f.js';
+import './index-58294da5.js';
+import './index-0905bf40.js';
+import './index-f1577599.js';
+import './index-5282cbfe.js';
+import './index-8d9d1d64.js';
+import './index-1195f822.js';
+
+var wcConfigurator = "wcConfigurator-IeI91";
+var wcConfiguratorSteps = "wc-configurator-steps-yPThi";
+var wcConfiguratorSettings = "wc-configurator-Settings-3U39-";
+var tabSearchClass = "tab-search-class-qJEaW";
+var css_248z = "body {\n  margin: 0;\n  overscroll-behavior-x: none;\n}\n\n.wcConfigurator-IeI91 {\n  position: relative;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n  -webkit-font-smoothing: antialiased;\n  -webkit-touch-callout: none; /* iOS Safari */\n  -webkit-user-select: none; /* Safari */ /* Konqueror HTML */\n  -moz-user-select: none; /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently*/\n\n  position: relative;\n  height: 100%;\n  width: 100%;\n  display: flex;\n}\n\n.wcConfigurator-IeI91 *,\n.wcConfigurator-IeI91 *::before,\n.wcConfigurator-IeI91 *::after {\n  box-sizing: content-box;\n  box-sizing: initial;\n}\n\n.wc-configurator-steps-yPThi {\n  border-radius: 8px 0 0 8px;\n  overflow: hidden;\n  width: 350px;\n  position: relative;\n}\n\n.wc-configurator-Settings-3U39- {\n  width: calc(100% - 350px);\n  position: relative;\n  border-right: 1px solid #e6e6e6;\n}\n\n::-webkit-scrollbar {\n  width: 5px;\n  height: 5px;\n}\n::-webkit-scrollbar-track {\n  background: #dfdfdf;\n  border-radius: 3px;\n}\n::-webkit-scrollbar-thumb {\n  background: #b1b1b1;\n  border-radius: 3px;\n}\n\n.tab-search-class-qJEaW {\n  background-color: #0d3040;\n  padding: 12px 16px;\n  position: relative;\n  display: flex;\n}\n\n.tab-search-class-qJEaW input {\n  outline: medium none invert !important;\n  outline: initial !important;\n}\n\n.tab-search-class-qJEaW input {\n  color: #fff;\n  width: 100%;\n  background-color: #0d3040;\n  font-size: 14px;\n  border: 0px solid;\n}\n\n.tab-search-class-qJEaW div {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%2210%22 viewBox%3D%220 0 10 10%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M1 1L9 9M9 1L1 9%22 stroke%3D%22%23eee%22 stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-size: 75%;\n  width: 16px;\n  height: 16px;\n  transition: all 0.15s ease;\n  margin: 0px 3px;\n  border-radius: var(--globalBorderRadius);\n  cursor: pointer;\n}\n\n.tab-search-class-qJEaW div:hover {\n  background-size: 100%;\n}\n";
+styleInject(css_248z);
+
+var Classification = function Classification(props) {
+  var viewHandler = useViewHandler();
+  useEffect(function () {
+    viewHandler.layoutRendered = true;
+    viewHandler.initCSSVariablesObj(cssVariables);
+  }, []);
+  return /*#__PURE__*/jsx(Fragment, {
+    children: /*#__PURE__*/jsxs("div", {
+      ref: function ref(configuratorRef) {
+        return viewHandler.uiState.setConfiguratorRef(configuratorRef);
+      },
+      style: {
+        pointerEvents: viewHandler.uiState.configuratorDisabled ? 'none' : undefined
+      },
+      hidden: viewHandler.uiState.configuratorHidden,
+      id: "wcConfigurator",
+      className: wcConfigurator,
+      children: [/*#__PURE__*/jsx(TabGroup, {
+        className: wcConfiguratorSteps,
+        tabSearchClass: tabSearchClass
+      }), /*#__PURE__*/jsx(Settings, {
+        className: wcConfiguratorSettings
+      }), viewHandler.settingsState.inputBoxVisible && /*#__PURE__*/jsx(Inputbox, {})]
+    })
+  });
+};
+var cssVariables = {
+  '--primaryColor': '#455864',
+  '--secondaryColor': '#404040',
+  '--thirdColor': '#8a8a8a',
+  '--globalBorderRadius': '3px',
+  '--galleryItemRadius': '3px',
+  '--articlePosNrRadius': '3px',
+  '--articlePosNrSize': '20.8px',
+  '--articlePosNrFontSize': '16px',
+  '--settingsBackgroundColor': '#f4f4f4',
+  '--settingsScrollerPaddingTopBottom': '30px',
+  '--settingsScrollerPaddingRight': '30px',
+  '--settingsScrollerPaddingLeft': '30px',
+  '--tabGroupBackground': 'var(--primaryColor)',
+  '--foldArrowMarginRight': '16px',
+  '--configuratorActionWidthForthBackSpacer': '0.1rem',
+  '--configuratorActionForthWidth': 'calc(50% - calc(var(--configuratorActionWidthForthBackSpacer) / 2) - 2px)',
+  '--configuratorActionBackWidth': 'calc(50% - calc(var(--configuratorActionWidthForthBackSpacer) / 2) - 2px)',
+  '--lineHeight1': '36.8px',
+  '--fontWeight1': '600',
+  '--boxShadowHover': '0px 1px 4px rgba(0, 0, 0, 0.15)',
+  '--boxShadowActive': '0px 1px 4px rgba(0, 0, 0, 0.3)',
+  '--itemsMargin': '0.3125rem'
+};
+var index = observer(Classification);
+
+export { index as default };

package/build/esm/index-89c7406a.js

@@ -0,0 +1,63 @@
+import { s as styleInject, u as useViewHandler } from './index-273b10aa.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import SettingsHeader from './index-0b9c6dcf.js';
+import SettingsConfigSingle from './index-80e60fbc.js';
+import SettingsPosNr from './index-1a0dd518.js';
+import classnames from 'classnames';
+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 '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import '@crystaldesign/widget-contact-form';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-fdbd8567.js';
+import 'react-laag';
+import './index-fc1cc190.js';
+
+var wcConfiguratorSettingsFoldConfSettings = "wcConfigurator-settings-FoldConfSettings-hZych";
+var landscape = "landscape-LFbXM";
+var css_248z = ".wcConfigurator-settings-header-9tt3R .wcConfigurator-settings-header-act-elements-38jiy {\n  max-width: 80%;\n  margin-left: 16px;\n  margin-right: 0px;\n  -webkit-line-clamp: 1;\n  display: -webkit-inline-box;\n  float: left;\n}\n\n.wcConfigurator-settings-FoldConfSettings-hZych {\n  display: block;\n  position: absolute;\n  right: 0px;\n  z-index: 700;\n  width: 16px;\n  height: 32px;\n  padding-top: 9.6px;\n  margin-right: var(--foldArrowMarginRight);\n\n  transition: all 0.35s ease;\n  background-repeat: no-repeat;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2216%22 height%3D%2210%22 viewBox%3D%220 0 16 10%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M14.729 1.25L8.30043 9.25L1.229 1.25%22 stroke%3D%22%236F6F6F%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-position: center center;\n  background-size: contain;\n}\n\n.wcConfigurator-settings-header-9tt3R .wcConfigurator-settings-header-act-elements-38jiy {\n  max-width: 83%;\n  margin-right: 24px;\n  margin-left: 0px;\n  margin-top: 14.4px;\n  -webkit-line-clamp: 1;\n  display: -webkit-inline-box;\n  float: right;\n}\n\n.landscape-LFbXM .wcConfigurator-settings-FoldConfSettings-hZych {\n  display: block;\n  position: absolute;\n  width: 16px;\n  right: 0px;\n  height: 32px;\n  padding-top: 9.6px;\n  margin-right: 16px;\n  transition: all 0.35s ease;\n  background-repeat: no-repeat;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2216%22 height%3D%2210%22 viewBox%3D%220 0 16 10%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M14.729 1.25L8.30043 9.25L1.229 1.25%22 stroke%3D%22%236F6F6F%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-position: center center;\n  background-size: contain;\n  cursor: pointer;\n  z-index: 700;\n}\n";
+styleInject(css_248z);
+
+var SettingsHeaderContainer = function SettingsHeaderContainer(_ref) {
+  var _headerPalette$type, _headerPalette$type2;
+  var _ref$isScroller = _ref.isScroller,
+    isScroller = _ref$isScroller === void 0 ? false : _ref$isScroller;
+  var viewHandler = useViewHandler();
+  var headerPalette = viewHandler.settingsState.itemPalettes.get(1);
+  if (!headerPalette) return /*#__PURE__*/jsx(Fragment, {});
+  var showHeader = viewHandler.uiState.ViewConfig.headerInConfigPalette !== 'Hidden' && !((_headerPalette$type = headerPalette.type) !== null && _headerPalette$type !== void 0 && _headerPalette$type.startsWith('PRODUCTS')) && !((_headerPalette$type2 = headerPalette.type) !== null && _headerPalette$type2 !== void 0 && _headerPalette$type2.startsWith('PROMOTED')) && (!viewHandler.getIsInMobileView() || !viewHandler.uiState.ViewConfig.hideTopHeaderInMobile);
+  return /*#__PURE__*/jsxs("header", {
+    ref: function ref(_ref2) {
+      return viewHandler.settingsState.setHeaderElement(_ref2);
+    },
+    className: classnames(viewHandler.uiState.isMobileLandscape ? landscape : undefined),
+    children: [!viewHandler.uiState.ViewConfig.hideMobileFolder && !viewHandler.uiState.configSettingsIsHidden && viewHandler.uiState.isInMobileView && /*#__PURE__*/jsx("div", {
+      className: wcConfiguratorSettingsFoldConfSettings,
+      id: "btnFoldDown",
+      onClick: function onClick() {
+        return viewHandler.uiState.onClickHideConfigSettings();
+      }
+    }), showHeader && /*#__PURE__*/jsx(SettingsHeader, {
+      isInScroller: isScroller,
+      isSettingsHeader: !headerPalette.isHeader,
+      item: headerPalette,
+      specialElement1: viewHandler.settingsState.doShowActElementInfo && !viewHandler.uiState.ViewConfig.hideElementInfo ? /*#__PURE__*/jsx(SettingsPosNr, {}) : undefined,
+      specialElement2: viewHandler.settingsState.doShowConfigSingle ? /*#__PURE__*/jsx(SettingsConfigSingle, {}) : undefined
+    })]
+  });
+};
+var SettingsHeaderContainer$1 = observer(SettingsHeaderContainer);
+
+export { SettingsHeaderContainer$1 as default };

package/build/esm/index-8a56eb96.js

@@ -0,0 +1,28 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import './index-273b10aa.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 '@crystaldesign/widget-contact-form';
+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 SettingsPaletteGroup = function SettingsPaletteGroup(props) {
+  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
+    componentName: "Settings/SettingsScroller/SettingsItem/PaletteGroup"
+  }));
+};
+
+export { SettingsPaletteGroup as default };

package/build/esm/index-8aff7a21.js

@@ -0,0 +1,125 @@
+import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _regeneratorRuntime from '@babel/runtime/regenerator';
+import { s as styleInject, u as useViewHandler } from './index-273b10aa.js';
+import { useRef, useState } from 'react';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import SettingsHeader from './index-0b9c6dcf.js';
+import { jsxs, jsx, 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-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import '@crystaldesign/widget-contact-form';
+
+var wcTextBox = "wcTextBox-S90ki";
+var row = "row-U3gX-";
+var title = "title-Hgohv";
+var left = "left-0Vchg";
+var right = "right-jyg7C";
+var colum = "colum-DdC26";
+var languageWrapper = "language-wrapper-mZdxS";
+var languageTitle = "language-title-OOwzi";
+var css_248z = ".PaletteItem-pPFog {\n  border-radius: var(--globalBorderRadius);\n  background: white;\n  position: relative;\n  display: flex;\n  width: 100%;\n  z-index: 100;\n  transition: all 0.15s ease;\n}\n\n.PaletteItem-pPFog:hover {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n  z-index: 200;\n  transition: 0.15s ease;\n}\n.PaletteItem-pPFog:active {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.6);\n  z-index: 200;\n  transition: 0.15s ease;\n}\n\n.wcTextBox-S90ki {\n  width: 100%;\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}\n\n.row-U3gX- {\n  width: 100%;\n  height: -moz-fit-content;\n  height: fit-content;\n  position: relative;\n  display: flex;\n  padding-bottom: 4px;\n  padding-top: 4px;\n}\n\n.title-Hgohv {\n  display: flex;\n}\n.left-0Vchg {\n  width: 40%;\n}\n.right-jyg7C {\n  width: 60%;\n}\n\n.colum-DdC26 {\n  margin: 8px;\n  white-space: nowrap;\n}\n\n.language-wrapper-mZdxS {\n  display: flex;\n}\n.language-title-OOwzi {\n  width: 50px;\n  line-height: 60px;\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 TextBox = function TextBox(_ref) {
+  var _viewHandler$getViewC, _items$;
+  var item = _ref.item,
+    paletteId = _ref.paletteId,
+    style = _ref.style;
+  var viewHandler = useViewHandler();
+  var throttleRef = useRef(null);
+  var items = item.groups[0].items;
+  var _useState = useState(items[0].freeTextLang),
+    _useState2 = _slicedToArray(_useState, 2),
+    valueLang = _useState2[0],
+    setValueLang = _useState2[1];
+  var handleChange = function handleChange(e) {
+    if (items[0]) {
+      items[0].freeText = e.target.value;
+      viewHandler.paletteViewHandler.clickedOnConfigPalette(items[0], 'inputbox', paletteId);
+    }
+  };
+
+  //for classification
+  var handleLangTextChange = function handleLangTextChange(lang, value) {
+    //delay logic update for 500ms
+    if (throttleRef.current) clearTimeout(throttleRef.current);
+    throttleRef.current = setTimeout(function () {
+      return updateLangLogic(lang, value);
+    }, 500);
+    setValueLang(_objectSpread(_objectSpread({}, valueLang), {}, _defineProperty({}, lang, value)));
+  };
+  var updateLangLogic = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(lang, value) {
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            viewHandler.paletteViewHandler.onFreeTextLangChanged(lang, value, items[0], paletteId);
+          case 1:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function updateLangLogic(_x, _x2) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+  var languages = (_viewHandler$getViewC = viewHandler.getViewConfig().languagesForInput) !== null && _viewHandler$getViewC !== void 0 ? _viewHandler$getViewC : [];
+  return /*#__PURE__*/jsxs("div", {
+    className: row,
+    ref: function ref(_ref3) {
+      return item.htmlRef = _ref3;
+    },
+    style: style,
+    children: [/*#__PURE__*/jsx("div", {
+      className: classnames(colum, title, left),
+      children: /*#__PURE__*/jsx(SettingsHeader, {
+        item: item,
+        isInScroller: true,
+        isSettingsHeader: false
+      })
+    }), /*#__PURE__*/jsx("div", {
+      className: classnames(colum, right),
+      children: languages.length ? /*#__PURE__*/jsx(Fragment, {
+        children: languages.map(function (lang) {
+          return /*#__PURE__*/jsxs("div", {
+            className: languageWrapper,
+            children: [/*#__PURE__*/jsx("div", {
+              className: languageTitle,
+              children: lang
+            }), /*#__PURE__*/jsx("input", {
+              className: wcTextBox,
+              onChange: function onChange(e) {
+                return handleLangTextChange(lang, e.target.value);
+              },
+              type: "text",
+              value: valueLang === null || valueLang === void 0 ? void 0 : valueLang[lang]
+            })]
+          }, lang);
+        })
+      }) : /*#__PURE__*/jsx("div", {
+        children: /*#__PURE__*/jsx("input", {
+          className: wcTextBox,
+          onChange: handleChange,
+          type: "text",
+          value: (_items$ = items[0]) !== null && _items$ !== void 0 && _items$.freeText ? items[0].freeText : ''
+        })
+      })
+    })]
+  });
+};
+var TextBox$1 = observer(TextBox);
+
+export { TextBox$1 as default };