thm-p3-configurator 0.0.396 → 0.0.397

package/dist/src/shared/__components__/ProductCard/ProductCardDiscountAlert.js

@@ -0,0 +1,57 @@
+"use strict";
+
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _helpers__ = require("../../__helpers__");
+function _getRequireWildcardCache(e) {
+  if ("function" != typeof WeakMap) return null;
+  var r = new WeakMap(),
+    t = new WeakMap();
+  return (_getRequireWildcardCache = function _getRequireWildcardCache(e) {
+    return e ? t : r;
+  })(e);
+}
+function _interopRequireWildcard(e, r) {
+  if (!r && e && e.__esModule) return e;
+  if (null === e || "object" != typeof e && "function" != typeof e) return {
+    default: e
+  };
+  var t = _getRequireWildcardCache(r);
+  if (t && t.has(e)) return t.get(e);
+  var n = {
+      __proto__: null
+    },
+    a = Object.defineProperty && Object.getOwnPropertyDescriptor;
+  for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) {
+    var i = a ? Object.getOwnPropertyDescriptor(e, u) : null;
+    i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u];
+  }
+  return n.default = e, t && t.set(e, n), n;
+}
+const ProductCardDiscountAlert = _ref => {
+  let {
+    label,
+    price,
+    discountedPrice
+  } = _ref;
+  if (!discountedPrice || !price || discountedPrice >= price) {
+    return null;
+  }
+  const discountLabel = (0, _react.useMemo)(() => {
+    if (label) {
+      return label;
+    }
+    return "\u20AC".concat((0, _helpers__.formatPrice)(price - discountedPrice), " Korting");
+  }, []);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('alert alert-danger card--discount-label')
+  }, discountLabel);
+};
+var _default = exports.default = ProductCardDiscountAlert;

package/dist/src/shared/__components__/ProductCard/ProductCardImage.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _helpers__ = require("../../__helpers__");
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+const ProductCardImage = _ref => {
+  let {
+    image,
+    isBoardComputer
+  } = _ref;
+  if (!image) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement("img", {
+    src: image,
+    className: (0, _helpers__.withStyle)("card__image img-fluid ".concat(isBoardComputer ? 'mb-2' : '')),
+    alt: "product afbeelding"
+  });
+};
+var _default = exports.default = ProductCardImage;

package/dist/src/shared/__components__/ProductCard/ProductCardPrice.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _helpers__ = require("../../__helpers__");
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+const ProductCardPrice = _ref => {
+  let {
+    price,
+    discountedPrice
+  } = _ref;
+  if (!discountedPrice) {
+    return /*#__PURE__*/_react.default.createElement("span", {
+      className: (0, _helpers__.withStyle)('card__price')
+    }, (0, _helpers__.formatPrice)(price));
+  }
+  if (discountedPrice < price) {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _helpers__.withStyle)('card__price')
+    }, /*#__PURE__*/_react.default.createElement("span", {
+      className: (0, _helpers__.withStyle)('strikethrough card-price-label')
+    }, (0, _helpers__.formatPrice)(price))), /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _helpers__.withStyle)('card__price text-danger')
+    }, (0, _helpers__.formatPrice)(discountedPrice)));
+  }
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('card__price')
+  }, (0, _helpers__.formatPrice)(price));
+};
+var _default = exports.default = ProductCardPrice;

package/dist/src/shared/__components__/ProductCard/ProductCardRibbon.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _labelBesteKeuze = _interopRequireDefault(require("../../../../public/assets/images/label-beste-keuze.png"));
+var _helpers__ = require("../../__helpers__");
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+const ProductCardRibbon = _ref => {
+  let {
+    isRecommended
+  } = _ref;
+  if (!isRecommended) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement("img", {
+    src: _labelBesteKeuze.default,
+    className: (0, _helpers__.withStyle)('card-img__best-choice position-absolute'),
+    alt: "Beste keuze"
+  });
+};
+var _default = exports.default = ProductCardRibbon;

package/dist/src/shared/__components__/ProductCard/ProductCardSpecifications.js

@@ -0,0 +1,77 @@
+"use strict";
+
+require("core-js/modules/es.array.includes.js");
+require("core-js/modules/es.string.includes.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.find.js");
+require("core-js/modules/esnext.iterator.map.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/es.array.includes.js");
+require("core-js/modules/es.string.includes.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.find.js");
+require("core-js/modules/esnext.iterator.map.js");
+var _react = _interopRequireDefault(require("react"));
+var _constants__ = require("../../__constants__");
+var _helpers__ = require("../../__helpers__");
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+const ProductCardSpecifications = _ref => {
+  let {
+    specifications = [],
+    className = '',
+    excludeKeys = []
+  } = _ref;
+  if (!specifications.length) {
+    return null;
+  }
+
+  // convert the key to a human readable format
+  const convertedSpecifications = specifications.filter(_ref2 => {
+    let {
+      key
+    } = _ref2;
+    return key !== 'Weight';
+  }).map(_ref3 => {
+    let {
+      key,
+      value
+    } = _ref3;
+    const translation = _constants__.ARTICLE_SPECS_TRANSLATIONS.find(_ref4 => {
+      let {
+        key: translationKey
+      } = _ref4;
+      return translationKey === key;
+    });
+    return {
+      key: (translation === null || translation === void 0 ? void 0 : translation.value) || key,
+      value
+    };
+  });
+  return /*#__PURE__*/_react.default.createElement("ul", {
+    className: (0, _helpers__.withStyle)("col-md-6 list-unstyled product-critera__text mb-2 ".concat(className))
+  }, convertedSpecifications.filter(_ref5 => {
+    let {
+      key
+    } = _ref5;
+    return !excludeKeys.includes(key);
+  }).map(_ref6 => {
+    let {
+      key,
+      value
+    } = _ref6;
+    return /*#__PURE__*/_react.default.createElement("li", {
+      key: key + value,
+      className: (0, _helpers__.withStyle)('d-flex justify-content-between card-text__criterea')
+    }, Number.isInteger(Number(key)) ? value : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("strong", null, key, ":"), " ", value));
+  }));
+};
+var _default = exports.default = ProductCardSpecifications;

package/dist/src/shared/__components__/ProductCard/ProductCardUsps.js

@@ -0,0 +1,82 @@
+"use strict";
+
+require("core-js/modules/esnext.iterator.map.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/esnext.iterator.map.js");
+var _react = _interopRequireDefault(require("react"));
+var _helpers__ = require("../../__helpers__");
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+const ProductCardUspInclude = _ref => {
+  let {
+    text
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("li", null, "Geschikt voor ", text);
+};
+const ProductCardUspRemark = _ref2 => {
+  let {
+    text
+  } = _ref2;
+  return /*#__PURE__*/_react.default.createElement("li", {
+    className: (0, _helpers__.withStyle)('info')
+  }, "Opmerking ", text);
+};
+const ProductCardUspExclude = _ref3 => {
+  let {
+    text
+  } = _ref3;
+  return /*#__PURE__*/_react.default.createElement("li", {
+    className: (0, _helpers__.withStyle)('x-mark')
+  }, "Niet geschikt voor ", text);
+};
+const ProductCardUSPS = _ref4 => {
+  let {
+    usps = [],
+    className = ''
+  } = _ref4;
+  if (!usps.length) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement("ul", {
+    className: (0, _helpers__.withStyle)("list-check mt-2 col-12 col-md-6 ".concat(className))
+  }, usps.map((usp, key) => {
+    const {
+      type,
+      text
+    } = usp;
+    if (!type || !text) {
+      return null;
+    }
+    switch (type) {
+      case 'incl':
+        {
+          return /*#__PURE__*/_react.default.createElement(ProductCardUspInclude, {
+            key: text,
+            text: text
+          });
+        }
+      case 'excl':
+        {
+          return /*#__PURE__*/_react.default.createElement(ProductCardUspExclude, {
+            key: text,
+            text: text
+          });
+        }
+      default:
+      case 'remark':
+        {
+          return /*#__PURE__*/_react.default.createElement(ProductCardUspRemark, {
+            key: text,
+            text: text
+          });
+        }
+    }
+  }));
+};
+var _default = exports.default = ProductCardUSPS;

package/dist/src/shared/__components__/ProductCard/index.js

@@ -0,0 +1,228 @@
+"use strict";
+
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.for-each.js");
+require("core-js/modules/esnext.iterator.map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.for-each.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/esnext.iterator.map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+var _react = _interopRequireWildcard(require("react"));
+var _queries = require("../../__api__/queries");
+var _constants__ = require("../../__constants__");
+var _helpers__ = require("../../__helpers__");
+var _singleOrderArticles = require("../../__helpers__/singleOrderArticles");
+var _ProductCardCheckbox = _interopRequireDefault(require("./ProductCardCheckbox"));
+var _ProductCardDescription = _interopRequireDefault(require("./ProductCardDescription"));
+var _ProductCardDiscountAlert = _interopRequireDefault(require("./ProductCardDiscountAlert"));
+var _ProductCardImage = _interopRequireDefault(require("./ProductCardImage"));
+var _ProductCardPrice = _interopRequireDefault(require("./ProductCardPrice"));
+var _ProductCardRibbon = _interopRequireDefault(require("./ProductCardRibbon"));
+var _ProductCardSpecifications = _interopRequireDefault(require("./ProductCardSpecifications"));
+var _ProductCardUsps = _interopRequireDefault(require("./ProductCardUsps"));
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+function _getRequireWildcardCache(e) {
+  if ("function" != typeof WeakMap) return null;
+  var r = new WeakMap(),
+    t = new WeakMap();
+  return (_getRequireWildcardCache = function _getRequireWildcardCache(e) {
+    return e ? t : r;
+  })(e);
+}
+function _interopRequireWildcard(e, r) {
+  if (!r && e && e.__esModule) return e;
+  if (null === e || "object" != typeof e && "function" != typeof e) return {
+    default: e
+  };
+  var t = _getRequireWildcardCache(r);
+  if (t && t.has(e)) return t.get(e);
+  var n = {
+      __proto__: null
+    },
+    a = Object.defineProperty && Object.getOwnPropertyDescriptor;
+  for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) {
+    var i = a ? Object.getOwnPropertyDescriptor(e, u) : null;
+    i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u];
+  }
+  return n.default = e, t && t.set(e, n), n;
+}
+function ownKeys(e, r) {
+  var t = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    r && (o = o.filter(function (r) {
+      return Object.getOwnPropertyDescriptor(e, r).enumerable;
+    })), t.push.apply(t, o);
+  }
+  return t;
+}
+function _objectSpread(e) {
+  for (var r = 1; r < arguments.length; r++) {
+    var t = null != arguments[r] ? arguments[r] : {};
+    r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
+      _defineProperty(e, r, t[r]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
+      Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+    });
+  }
+  return e;
+}
+function _defineProperty(e, r, t) {
+  return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+    value: t,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : e[r] = t, e;
+}
+function _toPropertyKey(t) {
+  var i = _toPrimitive(t, "string");
+  return "symbol" == typeof i ? i : i + "";
+}
+function _toPrimitive(t, r) {
+  if ("object" != typeof t || !t) return t;
+  var e = t[Symbol.toPrimitive];
+  if (void 0 !== e) {
+    var i = e.call(t, r || "default");
+    if ("object" != typeof i) return i;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return ("string" === r ? String : Number)(t);
+}
+const ProductCard = _ref => {
+  var _normalizedStock$quan, _normalizedStock$quan2;
+  let {
+    hasCheckbox = true,
+    isRecommended = false,
+    productId,
+    productTitle,
+    productDescription,
+    stock = null,
+    productUsps = [],
+    productImage = null,
+    isDisabled = false,
+    defaultSelected = false,
+    productPrice = null,
+    productDiscountedPrice = null,
+    productDiscountedLabel = null,
+    productSpecifications = [],
+    showPrice = false,
+    canUnselect = true,
+    onSelect = () => {},
+    onDescriptionToggle = () => {},
+    isOnlyProductInCategory = false,
+    isAnotherProductSelected = true,
+    isTmg = false,
+    isBoardComputer = false
+  } = _ref;
+  const [isSelected, setIsSelected] = (0, _react.useState)(defaultSelected);
+  const {
+    productFieldLabels
+  } = (0, _queries.useProductFieldLabels)();
+  const normalizedStock = stock && stock.status ? _objectSpread(_objectSpread({}, stock), {}, {
+    status: (0, _singleOrderArticles.mapApiStockStatusToStockStatus)(stock.status)
+  }) : stock;
+  const handleSelected = isSelected => {
+    if (!canUnselect && !isSelected) {
+      // Do not update local state, only call onSelect
+      onSelect({
+        isSelected: isSelected
+      });
+      return;
+    }
+    setIsSelected(isSelected);
+    onSelect({
+      productId,
+      isSelected: isSelected
+    });
+  };
+  (0, _react.useEffect)(() => {
+    setIsSelected(defaultSelected);
+  }, [defaultSelected]);
+  (0, _react.useEffect)(() => {
+    if (isOnlyProductInCategory || !isAnotherProductSelected && isRecommended) {
+      handleSelected(true);
+    }
+  }, [isOnlyProductInCategory, isRecommended]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    key: productId,
+    className: (0, _helpers__.withStyle)("card card__horizontal card__link ".concat(isSelected ? 'active' : '', " container-fluid g-0")),
+    disabled: isDisabled,
+    onClick: () => handleSelected(!isSelected)
+  }, /*#__PURE__*/_react.default.createElement(_ProductCardRibbon.default, {
+    isRecommended: isRecommended
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('row g-0')
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('col-md-4 d-flex justify-content-center position-relative')
+  }, /*#__PURE__*/_react.default.createElement(_ProductCardImage.default, {
+    image: productImage,
+    isBoardComputer: isBoardComputer
+  }), /*#__PURE__*/_react.default.createElement(_ProductCardDiscountAlert.default, {
+    label: productDiscountedLabel,
+    price: productDiscountedPrice,
+    discountedPrice: productPrice
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)("".concat(productImage ? 'col-md-8' : 'col-12', " d-flex flex-wrap"))
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('card-body')
+  }, /*#__PURE__*/_react.default.createElement("h5", {
+    className: (0, _helpers__.withStyle)('card-title')
+  }, productTitle, showPrice && /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('col-12 col-md-auto d-flex flex-xxl-column my-2 my-xxl-0')
+  }, /*#__PURE__*/_react.default.createElement(_ProductCardPrice.default, {
+    price: productDiscountedPrice < productPrice ? productPrice : productDiscountedPrice,
+    discountedPrice: productDiscountedPrice < productPrice ? productDiscountedPrice : productPrice
+  }))), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('card-text row no-gutters flex-wrap align-items-bottom justify-content-start')
+  }, /*#__PURE__*/_react.default.createElement(_ProductCardUsps.default, {
+    usps: productUsps
+  }), /*#__PURE__*/_react.default.createElement(_ProductCardSpecifications.default, {
+    specifications: [...(productId ? [{
+      key: 'Artikel',
+      value: productId
+    }] : []), ...productSpecifications.map(_ref2 => {
+      let {
+        key,
+        value
+      } = _ref2;
+      return {
+        key: (productFieldLabels === null || productFieldLabels === void 0 ? void 0 : productFieldLabels[key]) || key,
+        value
+      };
+    })],
+    excludeKeys: ['brand', 'brandName']
+  }), /*#__PURE__*/_react.default.createElement(_ProductCardDescription.default, {
+    description: productDescription,
+    onDescriptionToggle: onDescriptionToggle
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('card-footer pt-2 col-12 col-md-8 col-xxl-6 pb-0 justify-content-end')
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('d-flex flex-column align-items-end')
+  }, showPrice && normalizedStock && /*#__PURE__*/_react.default.createElement("div", null, normalizedStock.status === _constants__.StockStatus.OutOfStock ? /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('text-danger mb-1')
+  }, "Niet op voorraad") : normalizedStock.status === _constants__.StockStatus.InsufficientStock ? /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('text-warning mb-1')
+  }, isTmg ? "".concat((_normalizedStock$quan = normalizedStock.quantity) !== null && _normalizedStock$quan !== void 0 ? _normalizedStock$quan : 0, " op voorraad") : 'Weinig op voorraad') : /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('text-success mb-1')
+  }, isTmg ? "".concat((_normalizedStock$quan2 = normalizedStock.quantity) !== null && _normalizedStock$quan2 !== void 0 ? _normalizedStock$quan2 : 0, " op voorraad") : 'Op voorraad')), hasCheckbox && /*#__PURE__*/_react.default.createElement(_ProductCardCheckbox.default, {
+    id: productId,
+    isDisabled: isDisabled,
+    defaultChecked: isSelected,
+    isTmg: isTmg
+  })))))));
+};
+var _default = exports.default = ProductCard;

package/dist/src/shared/__components__/ProductTable/ProductTableEditableRow.js

@@ -0,0 +1,66 @@
+"use strict";
+
+require("core-js/modules/esnext.iterator.map.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/esnext.iterator.map.js");
+var _react = _interopRequireDefault(require("react"));
+var _logoPrimary = _interopRequireDefault(require("../../../../public/assets/images/logo-primary.svg"));
+var _helpers__ = require("../../__helpers__");
+var _NumericInput = _interopRequireDefault(require("../Form/NumericInput"));
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+const ProductTableEditableRow = _ref => {
+  let {
+    productImage,
+    productTitle,
+    productAmount = 1,
+    extraCells = [],
+    onEdit,
+    onRemove,
+    isDisabled,
+    canAlterQuantity = true
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("tr", {
+    className: (0, _helpers__.withStyle)('cart__table-product')
+  }, /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('cart__product row align-items-center justify-content-between')
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('col-12')
+  }, /*#__PURE__*/_react.default.createElement("img", {
+    className: (0, _helpers__.withStyle)('img-fluid rounded-1'),
+    src: productImage || _logoPrimary.default,
+    alt: "product"
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('col')
+  }, /*#__PURE__*/_react.default.createElement("p", null, productTitle), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('row mt-0 flex-row flex-md-column flex-wrap flex-md-nowrap')
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('d-flex col-12 align-items-center')
+  }, canAlterQuantity && /*#__PURE__*/_react.default.createElement(_NumericInput.default, {
+    defaultValue: productAmount,
+    isDisabled: false,
+    onChange: onEdit,
+    min: 0,
+    max: 99
+  }), /*#__PURE__*/_react.default.createElement("button", {
+    onClick: onRemove,
+    disabled: isDisabled,
+    className: (0, _helpers__.withStyle)('link-primary license-plate__edit')
+  }, "Verwijder")))))), extraCells.map((_ref2, index) => {
+    let {
+      className = '',
+      text = ''
+    } = _ref2;
+    return /*#__PURE__*/_react.default.createElement("td", {
+      key: "product-table-product-static-".concat(text, "-").concat(index),
+      className: (0, _helpers__.withStyle)(className)
+    }, text);
+  }));
+};
+var _default = exports.default = ProductTableEditableRow;

package/dist/src/shared/__components__/ProductTable/ProductTableHead.js

@@ -0,0 +1,32 @@
+"use strict";
+
+require("core-js/modules/esnext.iterator.map.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/esnext.iterator.map.js");
+var _react = _interopRequireDefault(require("react"));
+var _helpers__ = require("../../__helpers__");
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+const ProductTableHead = _ref => {
+  let {
+    columns
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("thead", null, /*#__PURE__*/_react.default.createElement("tr", null, columns.map((_ref2, index) => {
+    let {
+      className = '',
+      text = ''
+    } = _ref2;
+    return /*#__PURE__*/_react.default.createElement("th", {
+      key: "".concat(text, "-table-head-").concat(index),
+      className: (0, _helpers__.withStyle)(className),
+      scope: "col"
+    }, text);
+  })));
+};
+var _default = exports.default = ProductTableHead;

package/dist/src/shared/__components__/ProductTable/ProductTableSection.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _helpers__ = require("../../__helpers__");
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+const ProductTableSection = _ref => {
+  let {
+    heading,
+    children
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("tr", {
+    className: (0, _helpers__.withStyle)('cart__table-heading')
+  }, /*#__PURE__*/_react.default.createElement("th", {
+    scope: "row"
+  }, /*#__PURE__*/_react.default.createElement("h5", null, heading))), children);
+};
+var _default = exports.default = ProductTableSection;