@crystaldesign/diva-web-planner-react 26.13.0-beta.33 → 26.13.0-beta.35

package/build/esm/index-07f28ae2.js

@@ -1,87 +0,0 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler, b as PriceCounter } from './index-069dfa13.js';
-import { observer } from 'mobx-react-lite';
-import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
-import { useState, useEffect } from 'react';
-import classnames from 'classnames';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/web-planner-logic';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'react-switch';
-import 'react-countup';
-
-var wrapper = "wrapper-1wXYE";
-var priceWrapper = "priceWrapper-oLrQ1";
-var price = "price-aaYz6";
-var rabattVisible = "rabattVisible-npE0I";
-var brutto = "brutto-T4loO";
-var title = "title-1Yq19";
-var mobile = "mobile-Oy5-9";
-var small = "small-2vDXh";
-var percentage = "percentage--8-xl";
-var css_248z = ".wrapper-1wXYE {\n  position: sticky;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  margin-bottom: 8px;\n  white-space: nowrap;\n}\n\n.priceWrapper-oLrQ1 {\n  display: flex;\n  flex-direction: row;\n  gap: 16px;\n  width: 100%;\n  justify-content: space-between;\n  flex-wrap: nowrap;\n}\n\n.price-aaYz6 {\n  font-size: 18px;\n  line-height: 18px;\n  font-size: 24px;\n  line-height: 24px;\n  color: rgba(17, 24, 39, 1);\n  font-weight: 700;\n}\n.rabattVisible-npE0I .price-aaYz6 {\n  color: rgb(220, 38, 38);\n}\n\n.brutto-T4loO {\n  font-size: 18px;\n  line-height: 24px;\n  font-weight: 300;\n  color: rgba(107, 114, 128, 1);\n  -webkit-text-decoration-line: line-through;\n          text-decoration-line: line-through;\n  display: none;\n}\n.rabattVisible-npE0I .brutto-T4loO {\n  display: block;\n}\n\n.title-1Yq19 {\n  width: auto;\n  font-weight: 500;\n  font-size: 22px;\n  line-height: 24px;\n  color: var(--secondaryColor);\n  margin-top: 18px;\n  float: left;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n          user-select: none;\n}\n\n.mobile-Oy5-9 .title-1Yq19,\n.small-2vDXh .title-1Yq19 {\n  font-size: 20px;\n  line-height: 22px;\n}\n\n.percentage--8-xl {\n  font-size: 16px;\n  font-weight: 700;\n  line-height: 16px;\n  color: #fff;\n  padding: 4px 8px;\n  border-radius: 40px;\n  background-color: rgb(220, 38, 38);\n}\n";
-styleInject(css_248z);
-
-var SummaryHeader = function SummaryHeader(props) {
-  var _viewHandler$settings, _viewHandler$settings2, _viewHandler$getViewC, _viewHandler$productS, _viewHandler$productS2;
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var viewHandler = useViewHandler();
-  var _useDivaCore = useDivaCore(),
-    hidePrices = _useDivaCore.state.hidePrices;
-  var _useState = useState(Math.round(viewHandler.productState.formatedCurSetPrice * 100 / viewHandler.productState.formatedBruttoPrice) - 100),
-    _useState2 = _slicedToArray(_useState, 2),
-    rabattPercentage = _useState2[0],
-    setRabattPercentage = _useState2[1];
-  useEffect(function () {
-    var percentage = Math.round(viewHandler.productState.formatedCurSetPrice * 100 / viewHandler.productState.formatedBruttoPrice) - 100;
-    if (percentage !== rabattPercentage) setRabattPercentage(percentage);
-  }, [viewHandler.productState.formatedCurSetPrice, viewHandler.productState.formatedBruttoPrice]);
-  var showRabatt = viewHandler.productState.formatedBruttoPrice !== undefined && !viewHandler.getViewConfig().hideRabattPrice;
-  return /*#__PURE__*/jsxs("div", {
-    className: classnames(wrapper, viewHandler.getIsInMobileView() ? mobile : undefined, showRabatt ? rabattVisible : undefined, ((_viewHandler$settings = (_viewHandler$settings2 = viewHandler.settingsState.settingsScrollerElement) === null || _viewHandler$settings2 === void 0 ? void 0 : _viewHandler$settings2.getBoundingClientRect().width) !== null && _viewHandler$settings !== void 0 ? _viewHandler$settings : 400) < 400 ? small : undefined),
-    children: [/*#__PURE__*/jsx("div", {
-      className: title,
-      children: t((_viewHandler$getViewC = viewHandler.getViewConfig().summaryHeaderTitle) !== null && _viewHandler$getViewC !== void 0 ? _viewHandler$getViewC : 'configurator.summary.header.title')
-    }), !hidePrices && /*#__PURE__*/jsxs("div", {
-      className: priceWrapper,
-      children: [/*#__PURE__*/jsx("div", {
-        className: brutto,
-        children: /*#__PURE__*/jsx(PriceCounter, {
-          price: (_viewHandler$productS = viewHandler.productState.formatedBruttoPrice) !== null && _viewHandler$productS !== void 0 ? _viewHandler$productS : 0,
-          duration: 1.5
-        })
-      }), /*#__PURE__*/jsx("div", {
-        className: price,
-        children: /*#__PURE__*/jsx(PriceCounter, {
-          price: (_viewHandler$productS2 = viewHandler.productState.formatedCurSetPrice) !== null && _viewHandler$productS2 !== void 0 ? _viewHandler$productS2 : 0,
-          duration: 1.5
-        })
-      }), showRabatt && /*#__PURE__*/jsx("div", {
-        className: percentage,
-        children: /*#__PURE__*/jsx(PriceCounter, {
-          price: rabattPercentage,
-          formattingFn: function formattingFn(n) {
-            return n + '%';
-          },
-          duration: 1.5
-        })
-      })]
-    })]
-  });
-};
-var SummaryHeader$1 = observer(SummaryHeader);
-
-export { SummaryHeader$1 as default };

package/build/esm/index-089c0352.js

@@ -1,285 +0,0 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler } from './index-069dfa13.js';
-import { useState } from 'react';
-import { observer } from 'mobx-react-lite';
-import { useTranslation, getLogger } from '@crystaldesign/diva-core';
-import { u as useViewerButtons, R as RoundToggle, l as label, S as StrokeIcon } from './RoundToggle-155ee330.js';
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-
-/** The props that make a focusable element a keyboard-accessible button. */
-
-/** Button semantics for an element labelled `label`: a click, Enter or Space runs `onActivate`, once per key press. */
-function buttonControlProps(label, onActivate) {
-  return {
-    role: 'button',
-    tabIndex: 0,
-    'aria-label': label,
-    title: label,
-    onClick: onActivate,
-    onKeyDown: function onKeyDown(event) {
-      // `event.repeat`: a held key fires keydown over and over.
-      if (event.repeat || event.key !== 'Enter' && event.key !== ' ') return;
-      event.preventDefault();
-      onActivate();
-    }
-  };
-}
-
-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; }
-
-/** The a11y-complete props every dim-line control spreads onto its own focusable element. */
-
-/** State, action and button semantics of every dimension-lines control - callers must be `observer`s. */
-function useDimensionLinesToggle() {
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var active = viewHandler.productState.doShow3DDimensionLines;
-  var label = t('configurator.NAV3DDIMLINE_TT');
-  var toggle = function toggle() {
-    return viewHandler.productState.onNav3DMenuSelect('Nav3DDimLine');
-  };
-  return {
-    enabled: viewHandler.productState.doEnableToShow3DDimensionLines && !viewHandler.productState.poolPlanning,
-    active: active,
-    controlProps: _objectSpread(_objectSpread({}, buttonControlProps(label, toggle)), {}, {
-      'aria-pressed': active
-    })
-  };
-}
-
-/** The views the switch leads to. */
-
-/** The switch's title (`configurator.viewToggle.to<view>`) and short text (`…label<view>`) per view, German defaults. */
-var VIEW_SWITCH_TEXTS_DE = {
-  'viewToggle.to2D': 'Zur 2D-Ansicht',
-  'viewToggle.to3D': 'Zur 3D-Ansicht',
-  'viewToggle.toAI': 'Zur KI-Ansicht',
-  'viewToggle.label2D': '2D',
-  'viewToggle.label3D': '3D',
-  'viewToggle.labelAI': 'KI'
-};
-/** The 2D / 3D (/ AI room) switch of the mobile icons and the rtv-next desktop column — callers must be `observer`s. */
-function useViewSwitcher() {
-  var _viewHandler$aiState;
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var productState = viewHandler.productState;
-  var doShowGrid = productState.doShowGrid,
-    doShowAIRoom = productState.doShowAIRoom,
-    allow3DComb = productState.allow3DComb,
-    allowRTV = productState.allowRTV,
-    allowGrid = productState.allowGrid,
-    footerVisible = productState.footerVisible;
-  var doAllowAI = !!((_viewHandler$aiState = viewHandler.aiState) !== null && _viewHandler$aiState !== void 0 && _viewHandler$aiState.doAllowAI);
-  var target3DView = allow3DComb ? '3DCOMB' : allowRTV ? 'RTV' : '3D';
-  var from3D = allowGrid ? '2D' : doAllowAI ? 'AI' : undefined;
-  var next = doShowAIRoom ? '3D' : doShowGrid ? doAllowAI ? 'AI' : '3D' : from3D;
-  var view = next !== null && next !== void 0 ? next : '2D';
-  var onClick = function onClick() {
-    if (view === 'AI') productState.showAIRoom();else productState.onChangePlannerView(view === '3D' ? target3DView : '2D');
-  };
-  return {
-    visible: footerVisible.length > 1 && next !== undefined,
-    view: view,
-    label: t("configurator.viewToggle.label".concat(view), VIEW_SWITCH_TEXTS_DE["viewToggle.label".concat(view)]),
-    title: t("configurator.viewToggle.to".concat(view), VIEW_SWITCH_TEXTS_DE["viewToggle.to".concat(view)]),
-    onClick: onClick
-  };
-}
-
-var RoofIcon = function RoofIcon() {
-  return /*#__PURE__*/jsxs(StrokeIcon, {
-    children: [/*#__PURE__*/jsx("path", {
-      d: "M2.5 13 12 5l9.5 8"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M5 11v8.5h14V11"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M15.5 6.5V4h2v4.2"
-    })]
-  });
-};
-var DoorIcon = function DoorIcon() {
-  return /*#__PURE__*/jsxs(StrokeIcon, {
-    children: [/*#__PURE__*/jsx("path", {
-      d: "M5 21V4.5A1.5 1.5 0 0 1 6.5 3h11A1.5 1.5 0 0 1 19 4.5V21"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M3 21h18"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M12 3v18"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M9.5 11.5v1.5M14.5 11.5v1.5"
-    })]
-  });
-};
-
-/**
- * Doors (or what the catalog's `TOGGLE.<KIND>` names, e.g. a roof) on or off in the 3D view (`getDoorsToggle`); locked in
- * the steps that decide themselves (the shelf planner hides them, the door swap shows them).
- */
-var DoorsToggle = observer(function () {
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var visible = useViewerButtons();
-  var doors = viewHandler.getDoorsToggle();
-  if (!visible || !viewHandler.productState.doShowRTV || !doors) return null;
-  return /*#__PURE__*/jsx(RoundToggle, {
-    label: doors.kind === 'roof' ? t('configurator.viewToggle.roof') : t('configurator.viewToggle.doors'),
-    pressed: doors.hidden,
-    locked: doors.forced,
-    onToggle: function onToggle() {
-      return viewHandler.setDoorsHidden(!doors.hidden);
-    },
-    children: doors.kind === 'roof' ? /*#__PURE__*/jsx(RoofIcon, {}) : /*#__PURE__*/jsx(DoorIcon, {})
-  });
-});
-var LOG = getLogger('Planner', 'ViewerToggles');
-
-/** The state buttons' icons by the catalog's keys (`VIEWER_TOGGLE` "icons"); `toggle` stands in for an unknown key. */
-var STATE_ICONS = {
-  'door-closed': /*#__PURE__*/jsxs(StrokeIcon, {
-    children: [/*#__PURE__*/jsx("path", {
-      d: "M6 20V5a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v15"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M3 20h18"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M14.5 11.5v1.5"
-    })]
-  }),
-  'door-open': /*#__PURE__*/jsxs(StrokeIcon, {
-    children: [/*#__PURE__*/jsx("path", {
-      d: "M6 20V4h12v16"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M3 20h18"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M6 4l6 2.5v15L6 20"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M10 12.5V14"
-    })]
-  }),
-  'umbrella-closed': /*#__PURE__*/jsxs(StrokeIcon, {
-    children: [/*#__PURE__*/jsx("path", {
-      d: "M12 3c-1.5 3-2 7-1.5 12h3c.5-5 0-9-1.5-12Z"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M12 15v6M9 21h6"
-    })]
-  }),
-  'umbrella-open': /*#__PURE__*/jsxs(StrokeIcon, {
-    children: [/*#__PURE__*/jsx("path", {
-      d: "M3 11a9 7 0 0 1 18 0Z"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M12 2.5V4M12 11v10M9 21h6"
-    })]
-  }),
-  toggle: /*#__PURE__*/jsxs(StrokeIcon, {
-    children: [/*#__PURE__*/jsx("rect", {
-      x: "3",
-      y: "7",
-      width: "18",
-      height: "10",
-      rx: "5"
-    }), /*#__PURE__*/jsx("circle", {
-      cx: "8",
-      cy: "12",
-      r: "2.5"
-    })]
-  })
-};
-
-/** One state option's round button: a tap switches the option on every article of the planning carrying it. */
-var StateToggle = observer(function (_ref) {
-  var state = _ref.state;
-  var viewHandler = useViewHandler();
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    busy = _useState2[0],
-    setBusy = _useState2[1];
-  var toggle = function toggle() {
-    if (busy) return;
-    setBusy(true);
-    viewHandler.setStateToggle(state.optionCodex, state.next)["catch"](function (error) {
-      return LOG.warn("State toggle ".concat(state.optionCodex, " failed: ").concat(String(error)));
-    })["finally"](function () {
-      return setBusy(false);
-    });
-  };
-  return /*#__PURE__*/jsx(RoundToggle, {
-    label: state.label,
-    pressed: state.pressed,
-    locked: state.locked,
-    busy: busy,
-    onToggle: toggle,
-    children: STATE_ICONS[state.icon]
-  });
-});
-
-/**
- * The planning's state options (`getStateToggles`, catalog `VIEWER_TOGGLE`), e.g. a parasol open or closed, one round
- * button each; locked in the steps that lock the door toggle.
- */
-var StateToggles = observer(function () {
-  var viewHandler = useViewHandler();
-  var visible = useViewerButtons();
-  if (!visible || !viewHandler.productState.doShowRTV) return null;
-  return /*#__PURE__*/jsx(Fragment, {
-    children: viewHandler.getStateToggles().map(function (state) {
-      return /*#__PURE__*/jsx(StateToggle, {
-        state: state
-      }, state.optionCodex);
-    })
-  });
-});
-var DimensionLinesIcon = function DimensionLinesIcon() {
-  return /*#__PURE__*/jsx("svg", {
-    viewBox: "4 4 24 24",
-    fill: "currentColor",
-    "aria-hidden": true,
-    children: /*#__PURE__*/jsx("path", {
-      d: "M8.31 21.5c-.5 0-.93-.18-1.28-.53-.35-.35-.53-.78-.53-1.28v-7.38c0-.5.18-.93.53-1.28.35-.35.78-.53 1.28-.53h15.38c.5 0 .93.18 1.28.53.35.35.53.78.53 1.28v7.38c0 .5-.18.93-.53 1.28-.35.35-.78.53-1.28.53H8.31Zm0-1.5h15.38c.08 0 .15-.03.21-.1.06-.06.1-.13.1-.21v-7.38c0-.08-.03-.15-.1-.21-.06-.06-.13-.1-.21-.1h-2.94v3.62h-1.5V12h-2.5v3.62h-1.5V12h-2.5v3.62h-1.5V12H8.31c-.08 0-.15.03-.21.1-.06.06-.1.13-.1.21v7.38c0 .08.03.15.1.21.06.06.13.1.21.1Z"
-    })
-  });
-};
-
-/** The dimension lines on or off in the 3D view (`useDimensionLinesToggle`), where the catalog allows them. */
-var DimensionLinesRoundToggle = observer(function () {
-  var _useViewHandler = useViewHandler(),
-    productState = _useViewHandler.productState;
-  var visible = useViewerButtons();
-  var dimensionLines = useDimensionLinesToggle();
-  if (!visible || !dimensionLines.enabled || productState.doShowGrid || !(productState.doShowRTV || productState.doShow3DComb)) return null;
-  return /*#__PURE__*/jsx(RoundToggle, {
-    label: dimensionLines.controlProps['aria-label'],
-    pressed: dimensionLines.active,
-    onToggle: dimensionLines.controlProps.onClick,
-    children: /*#__PURE__*/jsx(DimensionLinesIcon, {})
-  });
-});
-
-/** The 2D / 3D switch of the rtv-next desktop column, as on mobile (`useViewSwitcher`); it names the view it switches to. */
-var ViewModeToggle = observer(function () {
-  var visible = useViewerButtons();
-  var switcher = useViewSwitcher();
-  if (!visible || !switcher.visible) return null;
-  return /*#__PURE__*/jsx(RoundToggle, {
-    label: switcher.title,
-    onToggle: switcher.onClick,
-    children: /*#__PURE__*/jsx("span", {
-      className: label,
-      children: switcher.label
-    })
-  });
-});
-
-var index = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  DoorsToggle: DoorsToggle,
-  StateToggles: StateToggles,
-  DimensionLinesRoundToggle: DimensionLinesRoundToggle,
-  ViewModeToggle: ViewModeToggle
-});
-
-export { DoorsToggle as D, StateToggles as S, ViewModeToggle as V, useViewSwitcher as a, DimensionLinesRoundToggle as b, index as i, useDimensionLinesToggle as u };

package/build/esm/index-0a231aac.js

@@ -1,275 +0,0 @@
-import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import _regeneratorRuntime from '@babel/runtime/regenerator';
-import { s as styleInject, u as useViewHandler } from './index-069dfa13.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import { useState } from 'react';
-import { getLogger, useTranslation, useDivaCore } from '@crystaldesign/diva-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/web-planner-logic';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'react-switch';
-import 'react-countup';
-
-var container = "container-5GMrB";
-var buttonDropdown = "button-dropdown-hJTTc";
-var open = "open-cFdzA";
-var icon = "icon-7uXLI";
-var column = "column-SanUs";
-var button = "button-qcl7w";
-var actionButton = "action-button-nTgLc";
-var actionButtonDisabled = "action-button-disabled--LWWq";
-var secondButton = "second-button-KGVxc";
-var row = "row-bjrma";
-var iconColor = "icon-color-hyBQn";
-var saveIcon = "save-icon-s5mPx";
-var sendIcon = "send-icon-O6d2-";
-var css_248z = ".container-5GMrB {\n  display: flex;\n  flex-direction: row;\n  margin-left: 16px;\n}\n\n.button-dropdown-hJTTc {\n  border: 1px solid #cacaca;\n  border-radius: 4px;\n  position: absolute;\n  bottom: 105%;\n  left: 0;\n  right: -5px;\n  padding: 0.84em 1em;\n  color: #000;\n  color: initial;\n  display: none;\n  flex-direction: column;\n}\n\n.button-dropdown-hJTTc.open-cFdzA {\n  display: flex;\n}\n\n.button-dropdown-hJTTc .icon-7uXLI {\n  filter: brightness(0.1);\n}\n.button-dropdown-hJTTc .column-SanUs:hover {\n  color: var(--primaryColor);\n}\n\n.button-qcl7w {\n  position: relative;\n  font-weight: 100;\n  border-radius: 32px;\n  transition: background-color 0.25s ease-out, color 0.25s ease-out;\n  font-size: 0.9rem;\n  line-height: 18px;\n  text-align: center;\n  cursor: pointer;\n  box-sizing: border-box;\n  display: inline-block;\n  vertical-align: middle;\n  margin: 0 0.5rem 1rem 0;\n  padding: 0.85em 1em;\n  -webkit-appearance: none;\n  border: 1px solid transparent;\n}\n\n.action-button-nTgLc {\n  background-color: var(--primaryColor);\n  color: #fefefe;\n}\n\n.action-button-disabled--LWWq {\n  opacity: 0.25;\n  cursor: not-allowed;\n}\n\n.action-button-nTgLc:hover {\n  filter: brightness(0.9);\n}\n\n.second-button-KGVxc {\n  background-color: transparent;\n  border-color: var(--primaryColor);\n  color: var(--primaryColor);\n  padding: 0.85em 1em 0.85em 0.25em;\n}\n\n.second-button-KGVxc:hover {\n  fill: #202020 !important;\n}\n\n.second-button-KGVxc:hover {\n  border-color: #202020;\n  color: #202020;\n}\n\n.row-bjrma {\n  float: left;\n}\n.second-button-KGVxc .row-bjrma {\n  padding-left: 0.5em;\n}\n\n.column-SanUs {\n  margin: 0.5em 0;\n}\n\n.icon-7uXLI {\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-size: contain;\n  width: 20px;\n  height: 20px;\n}\n.icon-color-hyBQn {\n  fill: var(--primaryColor);\n  transition: fill 0.25s ease-out, color 0.25s ease-out;\n}\n\n.second-button-KGVxc:hover .icon-color-hyBQn {\n  fill: black;\n}\n\n.save-icon-s5mPx {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2242%22 height%3D%2242%22 viewBox%3D%220 0 3400 3400%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E  %3Cpath    fill%3D%22white%22    transform%3D%22scale(1%2C-1) translate(450%2C-2600)%22    strokeWidth%3D%221%22    d%3D%22M783 255l-325 325l-70 70l-391 391q-14 15 -14 35.5t14 35.5l325 325q14 14 35 14t35 -14l391 -391q15 -15 35.5 -15t35.5 15l1049 1049q15 15 35.5 15t35.5 -15l327 -322q15 -15 15 -35q0 -21 -15 -35l-1447 -1448q-15 -14 -35.5 -14t-35.5 14z%22     %2F%3E%3C%2Fsvg%3E\");\n}\n.send-icon-O6d2- {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2242%22 height%3D%2242%22 viewBox%3D%220 0 3400 3400%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E  %3Cpath    fill%3D%22white%22    transform%3D%22scale(1%2C-1) translate(450%2C-2600)%22    strokeWidth%3D%221%22d%3D%22M921 89q-43 -54 -75 -54q-22 0 -34 25.5t-12 72.5v767h-708q-91 0 -91 31q0 26 63 65l2063 1278q42 26 79 26q42 0 68 -32t26 -88v-1800q0 -57 -26.5 -89.5t-69.5 -32.5q-37 0 -78 25l-712 425zM1000 480l1186 1700l-1186 -1300v-400z%22%2F%3E%3C%2Fsvg%3E\");\n}\n\n.reset-icon-HqNs3 path {\n  background-color: var(--primaryColor);\n}\n";
-styleInject(css_248z);
-
-var LOG = getLogger('Planner', 'BasketActionSerious');
-var BasketActionSerious = function BasketActionSerious(_ref) {
-  var saveIsDisabled = _ref.saveIsDisabled,
-    sendEmailIsDisabled = _ref.sendEmailIsDisabled,
-    onSave = _ref.onSave;
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    openDropdown = _useState2[0],
-    setOpen = _useState2[1];
-  var _useDivaCore = useDivaCore(),
-    _useDivaCore$actions = _useDivaCore.actions,
-    userHasPermission = _useDivaCore$actions.userHasPermission,
-    openSnackBar = _useDivaCore$actions.openSnackBar;
-  var onClickReset = function onClickReset() {
-    var _viewHandler$actions;
-    (_viewHandler$actions = viewHandler.actions) === null || _viewHandler$actions === void 0 || _viewHandler$actions.openModal({
-      title: t('modals.reset'),
-      accept: true,
-      reject: true,
-      text: t('modals.are_you_sure_to_reset'),
-      callback: function callback(accepted) {
-        if (accepted) {
-          viewHandler.productState.onClickReset();
-        }
-      }
-    });
-  };
-  var onClickSave = /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(type) {
-      var _viewHandler$getViewC, _viewHandler$getViewC2, _viewHandler$divaWebP, url, _viewHandler$getViewC3, _viewHandler$getViewC4;
-      return _regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            _context.t0 = type;
-            _context.next = _context.t0 === 'email' ? 3 : _context.t0 === 'save' ? 8 : 13;
-            break;
-          case 3:
-            if (!(!saveIsDisabled && !sendEmailIsDisabled)) {
-              _context.next = 7;
-              break;
-            }
-            onSave();
-            _context.next = 7;
-            return viewHandler.actionButtonState.onClickAddToBasket(viewHandler, 'onSendEmail');
-          case 7:
-            return _context.abrupt("break", 13);
-          case 8:
-            if (saveIsDisabled) {
-              _context.next = 12;
-              break;
-            }
-            onSave();
-            _context.next = 12;
-            return viewHandler.actionButtonState.onClickAddToBasket(viewHandler);
-          case 12:
-            return _context.abrupt("break", 13);
-          case 13:
-            if (!viewHandler.getViewConfig().showPdfQR) {
-              _context.next = 22;
-              break;
-            }
-            if (!(typeof viewHandler.getViewConfig().showPdfQR == 'boolean')) {
-              _context.next = 18;
-              break;
-            }
-            if (viewHandler.divaWebPlanner.getBasket().PDFDocumentURL) {
-              openSnackBar({
-                type: 'big',
-                qrCode: viewHandler.divaWebPlanner.getBasket().PDFDocumentURL,
-                message: t('basket.checkout.pdfqr'),
-                autoHideDuration: (_viewHandler$getViewC = viewHandler.getViewConfig().pdfQRAutoHideDuration) !== null && _viewHandler$getViewC !== void 0 ? _viewHandler$getViewC : 1000 * 60 * 2,
-                clickable: !((_viewHandler$getViewC2 = viewHandler.getViewConfig().pdfQRNotClickable) !== null && _viewHandler$getViewC2 !== void 0 ? _viewHandler$getViewC2 : false),
-                qrCodeSize: 312
-              });
-            } else {
-              LOG.warn('Basket is missing a pdf, no QR-Code displayed');
-            }
-            _context.next = 22;
-            break;
-          case 18:
-            _context.next = 20;
-            return (_viewHandler$divaWebP = viewHandler.divaWebPlanner.actSet()) === null || _viewHandler$divaWebP === void 0 ? void 0 : _viewHandler$divaWebP.api.createBasketReport(viewHandler.divaWebPlanner.getBasket(), viewHandler.getViewConfig().showPdfQR, viewHandler.getViewConfig().savePdfQR);
-          case 20:
-            url = _context.sent;
-            if (url) {
-              openSnackBar({
-                type: 'big',
-                qrCode: url,
-                qrCodeSize: 312,
-                message: t('basket.checkout.pdfqr'),
-                autoHideDuration: (_viewHandler$getViewC3 = viewHandler.getViewConfig().pdfQRAutoHideDuration) !== null && _viewHandler$getViewC3 !== void 0 ? _viewHandler$getViewC3 : 1000 * 60 * 2,
-                clickable: !((_viewHandler$getViewC4 = viewHandler.getViewConfig().pdfQRNotClickable) !== null && _viewHandler$getViewC4 !== void 0 ? _viewHandler$getViewC4 : false)
-              });
-            } else {
-              LOG.warn('Could not generate PDF, no QR-Code displayed');
-            }
-          case 22:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee);
-    }));
-    return function onClickSave(_x) {
-      return _ref2.apply(this, arguments);
-    };
-  }();
-  var onClickFavorites = function onClickFavorites() {
-    var _viewHandler$actions2;
-    (_viewHandler$actions2 = viewHandler.actions) === null || _viewHandler$actions2 === void 0 || _viewHandler$actions2.openModal({
-      title: t('modals.favorite'),
-      accept: true,
-      reject: true,
-      text: t('modals.are_you_sure_favorite'),
-      callback: function () {
-        var _callback = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(accepted) {
-          var _viewHandler$actions3;
-          return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-            while (1) switch (_context2.prev = _context2.next) {
-              case 0:
-                if (!accepted) {
-                  _context2.next = 5;
-                  break;
-                }
-                onSave();
-                _context2.next = 4;
-                return viewHandler.actionButtonState.onClickAddToBasket(viewHandler, 'onSaveProduct');
-              case 4:
-                (_viewHandler$actions3 = viewHandler.actions) === null || _viewHandler$actions3 === void 0 || _viewHandler$actions3.openModal({
-                  title: t('modals.favorite'),
-                  accept: true,
-                  text: t('modals.favorites_saved')
-                });
-              case 5:
-              case "end":
-                return _context2.stop();
-            }
-          }, _callee2);
-        }));
-        function callback(_x2) {
-          return _callback.apply(this, arguments);
-        }
-        return callback;
-      }()
-    });
-  };
-  return /*#__PURE__*/jsxs("div", {
-    className: container,
-    children: [/*#__PURE__*/jsxs("div", {
-      className: classnames(button, actionButton, saveIsDisabled ? actionButtonDisabled : undefined),
-      onClick: function onClick() {
-        if (!saveIsDisabled) setOpen(!openDropdown);
-      },
-      children: [/*#__PURE__*/jsx("div", {
-        className: classnames(row, icon, saveIcon)
-      }), /*#__PURE__*/jsxs("div", {
-        className: classnames(row),
-        children: [" ", t('configurator.ADD_TO_BASKET')]
-      }), /*#__PURE__*/jsxs("div", {
-        className: classnames(openDropdown ? open : undefined, buttonDropdown),
-        children: [/*#__PURE__*/jsxs("div", {
-          className: column,
-          onClick: function onClick() {
-            return onClickSave('save');
-          },
-          id: "wcConfigurator-action-tobasket",
-          children: [/*#__PURE__*/jsx("div", {
-            className: classnames(row, icon, saveIcon)
-          }), /*#__PURE__*/jsxs("div", {
-            className: classnames(row),
-            children: [" ", t('configurator.ADD_TO_BASKET')]
-          })]
-        }), /*#__PURE__*/jsxs("div", {
-          className: classnames(column, sendEmailIsDisabled ? actionButtonDisabled : undefined),
-          onClick: function onClick() {
-            return onClickSave('email');
-          },
-          children: [/*#__PURE__*/jsx("div", {
-            className: classnames(row, icon, sendIcon)
-          }), /*#__PURE__*/jsxs("div", {
-            className: classnames(row),
-            children: [" ", t('configurator.SendToClient')]
-          })]
-        })]
-      })]
-    }), /*#__PURE__*/jsxs("div", {
-      onClick: onClickReset,
-      className: classnames(button, secondButton),
-      children: [/*#__PURE__*/jsx("div", {
-        className: classnames(row, icon),
-        children: /*#__PURE__*/jsx("svg", {
-          width: "26",
-          height: "22",
-          viewBox: "0 0 3400 3400",
-          xmlns: "http://www.w3.org/2000/svg",
-          children: /*#__PURE__*/jsx("path", {
-            className: iconColor,
-            transform: "scale(1,-1) translate(450,-2600)",
-            strokeWidth: "1",
-            d: "M935 2061l-114 277q135 45 279 57v-300q-85 -9 -165 -34zM1435 2069q-71 19 -135 26v300q131 -11 251 -48zM615 1884l-211 212q119 105 260 176l114 -276q-87 -47 -163 -112zM1737 1921q-43 32 -89 59l115 279q99 -53 187 -125zM2007 -3l-148 204l-6 -4 q-146 -95 -321 -145t-332 -51q-172 0 -331.5 43t-291 120.5t-240 188t-182.5 242.5t-114.5 287t-40.5 318q0 225 80 429.5t224 367.5l212 -212q-103 -120 -159.5 -270t-56.5 -314q0 -123 32 -239.5t90 -215t140.5 -181.5t181.5 -141t216 -90.5t240 -31.5q146 0 256.5 34 t226.5 109l-151 212q-8 11 -8 20q0 20 29 19h683q17 0 27.5 -10t10.5 -25q0 -6 -3 -13l-220 -644q-7 -22 -22 -22q-12 0 -22 15zM1964 1673q-20 32 -43 64l213 213q61 -75 109 -161zM2085 1400q-4 0 -10 27l279 126q4 -14 8.5 -35.5t8 -41t6.5 -37.5t6 -28.5t5 -10.5h-303z "
-          })
-        })
-      }), /*#__PURE__*/jsxs("div", {
-        className: classnames(row),
-        children: [" ", t('configurator.ConfigReset')]
-      })]
-    }), userHasPermission('favorites_lueck') && /*#__PURE__*/jsxs("div", {
-      onClick: onClickFavorites,
-      className: classnames(button, secondButton),
-      children: [/*#__PURE__*/jsx("div", {
-        className: classnames(row, icon),
-        children: /*#__PURE__*/jsx("svg", {
-          width: "26",
-          height: "22",
-          viewBox: "0 0 3400 3400",
-          xmlns: "http://www.w3.org/2000/svg",
-          children: /*#__PURE__*/jsx("path", {
-            className: iconColor,
-            transform: "scale(1,-1) translate(450,-2600)",
-            strokeWidth: "1",
-            d: "M2491 1500l-765 -541l291 -885l-768 551l-764 -554l291 883l-776 546h958l294 900h3l292 -900h944zM484 68h-3l4 3z"
-          })
-        })
-      }), /*#__PURE__*/jsxs("div", {
-        className: classnames(row),
-        children: [" ", t('configurator.Favorites')]
-      })]
-    })]
-  });
-};
-var BasketActionSerious$1 = observer(BasketActionSerious);
-
-export { BasketActionSerious$1 as default };