thm-p3-configurator 0.0.47 → 0.0.48

package/dist/index.js

@@ -93,6 +93,12 @@ Object.defineProperty(exports, "InternalSessionEditPage", {
     return _index.InternalSessionEditPage;
   }
 });
+Object.defineProperty(exports, "InternalSingleOrderPage", {
+  enumerable: true,
+  get: function get() {
+    return _index.InternalSingleOrderPage;
+  }
+});
 Object.defineProperty(exports, "OrderSessionController", {
   enumerable: true,
   get: function get() {

package/dist/src/shared/__api__/authenticatedProxyApi.js

@@ -29,6 +29,21 @@ authenticateClient.interceptors.request.use(config => {
   return config;
 });
 const authenticatedProxyApi = exports.authenticatedProxyApi = {
+  getArticleTypes: () => authenticateClient("api/v1/articles/types", {
+    method: 'GET'
+  }),
+  getArticleGroups: articleTypeId => authenticateClient("api/v1/articles/groups/".concat(articleTypeId), {
+    method: 'GET'
+  }),
+  getArticleSubGroups: (articleGroupId, formula) => authenticateClient("api/v1/articles/subgroups/".concat(articleGroupId, "?formula=").concat(formula), {
+    method: 'GET'
+  }),
+  getArticles: filtersQueryString => authenticateClient("api/v1/articles?".concat(filtersQueryString), {
+    method: 'GET'
+  }),
+  getBrandsByArticleNumbers: articleNumbersString => authenticateClient("api/v1/articles/brands?".concat(articleNumbersString), {
+    method: 'GET'
+  }),
   deleteLogout: () => authenticateClient("api/v1/auth", {
     method: 'DELETE'
   }),
@@ -57,6 +72,13 @@ const authenticatedProxyApi = exports.authenticatedProxyApi = {
       'Content-Type': 'application/json'
     }
   }),
+  postSingleOrder: singleOrderPayload => authenticateClient("api/v1/single-orders", {
+    method: 'POST',
+    data: singleOrderPayload,
+    headers: {
+      'Content-Type': 'application/json'
+    }
+  }),
   postAppointment: appointmentPayload => authenticateClient("api/v1/appointments", {
     method: 'POST',
     data: appointmentPayload,

package/dist/src/shared/__api__/mutations.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useUpdatePrivateQuotationByIdMutation = exports.useUpdatePrivateAppointmentByIdMutation = exports.useCreateQuotationMutation = exports.useCreatePrivateQuotationMutation = exports.useCreatePrivateAppointmentMutation = exports.useCreateAppointmentRequestMutation = void 0;
+exports.useUpdatePrivateQuotationByIdMutation = exports.useUpdatePrivateAppointmentByIdMutation = exports.useCreateSingleOrderMutation = exports.useCreateQuotationMutation = exports.useCreatePrivateQuotationMutation = exports.useCreatePrivateAppointmentMutation = exports.useCreateAppointmentRequestMutation = void 0;
 var _reactQuery = require("react-query");
 var _authenticatedProxyApi = require("./authenticatedProxyApi");
 var _publicProxyApi = require("./publicProxyApi");
@@ -88,13 +88,47 @@ const useCreateAppointmentRequestMutation = () => {
   };
 };
 
+/**
+ * @description Creates a single order
+ */
+exports.useCreateAppointmentRequestMutation = useCreateAppointmentRequestMutation;
+const useCreateSingleOrderMutation = () => {
+  const createSingleOrderMutation = (0, _reactQuery.useMutation)(_ref3 => {
+    let {
+      licensePlate,
+      model,
+      cart,
+      customer,
+      formula,
+      branchId,
+      channel
+    } = _ref3;
+    return _authenticatedProxyApi.authenticatedProxyApi.postSingleOrder({
+      licensePlate,
+      model,
+      cart,
+      customer,
+      formula,
+      branchId,
+      channel
+    });
+  });
+  return {
+    isCreatingSingleOrder: createSingleOrderMutation.isLoading,
+    isCreateSingleOrderError: createSingleOrderMutation.isError,
+    isCreateSingleOrderSuccess: createSingleOrderMutation.isSuccess,
+    resetSingleOrderCreation: createSingleOrderMutation.reset,
+    createSingleOrder: createSingleOrderMutation.mutate
+  };
+};
+
 /**
  * @description Creates a quotation within the private order API
  * Signs the request with the accessToken
  */
-exports.useCreateAppointmentRequestMutation = useCreateAppointmentRequestMutation;
+exports.useCreateSingleOrderMutation = useCreateSingleOrderMutation;
 const useCreatePrivateQuotationMutation = () => {
-  const createQuotationMutation = (0, _reactQuery.useMutation)(_ref3 => {
+  const createQuotationMutation = (0, _reactQuery.useMutation)(_ref4 => {
     let {
       vehicle,
       customer,
@@ -108,7 +142,7 @@ const useCreatePrivateQuotationMutation = () => {
       formula,
       discount,
       isExitIntent = false
-    } = _ref3;
+    } = _ref4;
     return _authenticatedProxyApi.authenticatedProxyApi.postQuotation({
       isExitIntent,
       model,
@@ -139,7 +173,7 @@ const useCreatePrivateQuotationMutation = () => {
  */
 exports.useCreatePrivateQuotationMutation = useCreatePrivateQuotationMutation;
 const useCreatePrivateAppointmentMutation = () => {
-  const createPlannedAppointmentMutation = (0, _reactQuery.useMutation)(_ref4 => {
+  const createPlannedAppointmentMutation = (0, _reactQuery.useMutation)(_ref5 => {
     let {
       vehicle,
       customer,
@@ -154,7 +188,7 @@ const useCreatePrivateAppointmentMutation = () => {
       formula,
       discount,
       customerAgreed
-    } = _ref4;
+    } = _ref5;
     return _authenticatedProxyApi.authenticatedProxyApi.postAppointment({
       appointment,
       model,
@@ -186,7 +220,7 @@ const useCreatePrivateAppointmentMutation = () => {
  */
 exports.useCreatePrivateAppointmentMutation = useCreatePrivateAppointmentMutation;
 const useUpdatePrivateQuotationByIdMutation = id => {
-  const updateQuotationMutation = (0, _reactQuery.useMutation)(_ref5 => {
+  const updateQuotationMutation = (0, _reactQuery.useMutation)(_ref6 => {
     let {
       vehicle,
       customer,
@@ -200,7 +234,7 @@ const useUpdatePrivateQuotationByIdMutation = id => {
       formula,
       discount,
       priceCalculationDate
-    } = _ref5;
+    } = _ref6;
     return _authenticatedProxyApi.authenticatedProxyApi.putQuotationById({
       id,
       payload: {
@@ -234,7 +268,7 @@ const useUpdatePrivateQuotationByIdMutation = id => {
  */
 exports.useUpdatePrivateQuotationByIdMutation = useUpdatePrivateQuotationByIdMutation;
 const useUpdatePrivateAppointmentByIdMutation = id => {
-  const updateAppointmentByIdMutation = (0, _reactQuery.useMutation)(_ref6 => {
+  const updateAppointmentByIdMutation = (0, _reactQuery.useMutation)(_ref7 => {
     let {
       vehicle,
       customer,
@@ -249,7 +283,7 @@ const useUpdatePrivateAppointmentByIdMutation = id => {
       formula,
       discount,
       priceCalculationDate
-    } = _ref6;
+    } = _ref7;
     return _authenticatedProxyApi.authenticatedProxyApi.putAppointmentById({
       id,
       payload: {

package/dist/src/shared/__api__/orderApi.js

@@ -1,9 +1,11 @@
 "use strict";
 
+require("core-js/modules/es.promise.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.orderApi = void 0;
+require("core-js/modules/es.promise.js");
 var _axios = _interopRequireDefault(require("axios"));
 var _index = require("../__constants__/index.js");
 var _LocalStorageWorker = require("../__services__/LocalStorageWorker.js");
@@ -29,9 +31,23 @@ orderClient.interceptors.request.use(config => {
   config.headers.Authorization = "Bearer ".concat(authSession === null || authSession === void 0 ? void 0 : authSession.accessToken);
   return config;
 });
+
+// Add response interceptor to log 4xx errors
+orderClient.interceptors.response.use(response => response, error => {
+  if (error.response && error.response.status >= 400 && error.response.status < 500) {
+    console.error('4xx Error Response:', {
+      status: error.response.status,
+      url: error.config.url,
+      data: error.response.data
+    });
+  }
+  return Promise.reject(error);
+});
 const orderApi = exports.orderApi = {
   getOrder: orderParameters => orderClient("api".concat(APP_CONFIG.internal ? '' : '/public', "/order?").concat(orderParameters) // Remove the `/public` param if the configurator is internal,
   ),
+  getArticlePrices: partsQueryString => orderClient("api".concat(APP_CONFIG.internal ? '' : '/public', "/prices?").concat(partsQueryString)),
+  getArticles: filters => orderClient("api/public/articles?".concat(filters)),
   getBrands: () => orderClient('api/public/makes'),
   getBuildYears: brand => orderClient("api/public/makes/".concat(brand, "/years")),
   getModels: _ref => {

package/dist/src/shared/__api__/queries.js

@@ -2,25 +2,83 @@
 
 require("core-js/modules/es.symbol.description.js");
 require("core-js/modules/es.json.stringify.js");
+require("core-js/modules/es.object.from-entries.js");
+require("core-js/modules/es.promise.js");
 require("core-js/modules/es.regexp.to-string.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/web.url-search-params.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.useQuestionsQuery = exports.useProductsQuery = exports.useProductFieldLabels = exports.usePrivateDossierByTypeAndIdQuery = exports.useMyBranches = exports.useModelsQuery = exports.useMarketingChannels = exports.useBuildYearsQuery = exports.useBrandsQuery = exports.useBranchesQuery = exports.useBranchTypes = exports.useBranchByIdOrWidgetId = exports.useActiveDiscounts = void 0;
+exports.useSingleOrderCart = exports.useSingleOrderArticles = exports.useQuestionsQuery = exports.useProductsQuery = exports.useProductFieldLabels = exports.usePrivateDossierByTypeAndIdQuery = exports.useMyBranches = exports.useModelsQuery = exports.useMarketingChannels = exports.useBuildYearsQuery = exports.useBrandsQuery = exports.useBranchesQuery = exports.useBranchTypes = exports.useBranchByIdOrWidgetId = exports.useArticleTypes = exports.useArticleSubGroups = exports.useArticleGroups = exports.useActiveDiscounts = void 0;
 require("core-js/modules/es.symbol.description.js");
 require("core-js/modules/es.json.stringify.js");
+require("core-js/modules/es.object.from-entries.js");
+require("core-js/modules/es.promise.js");
 require("core-js/modules/es.regexp.to-string.js");
+require("core-js/modules/esnext.iterator.map.js");
 require("core-js/modules/web.dom-collections.iterator.js");
 require("core-js/modules/web.url-search-params.js");
 var _reactQuery = require("react-query");
 var _constants__ = require("../__constants__");
+var _FormulaContext = require("../__context__/FormulaContext");
+var _OrderSessionContext = require("../__context__/OrderSessionContext");
 var _helpers__ = require("../__helpers__");
+var _singleOrderArticles = require("../__helpers__/singleOrderArticles");
 var _LocalStorageWorker = require("../__services__/LocalStorageWorker");
 var _authenticatedProxyApi = require("./authenticatedProxyApi");
 var _orderApi = require("./orderApi");
 var _publicProxyApi = require("./publicProxyApi");
+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);
+}
 /**
  * @description Retrieves the car brand options
  */
@@ -61,9 +119,59 @@ const useBuildYearsQuery = _ref => {
 };
 
 /**
- * @description Retrieves the product field labels
+ * @description Retrieves the article types
  */
 exports.useBuildYearsQuery = useBuildYearsQuery;
+const useArticleTypes = () => {
+  const articleTypesQuery = (0, _reactQuery.useQuery)('articleTypes', {
+    queryFn: () => _authenticatedProxyApi.authenticatedProxyApi.getArticleTypes().then(res => res.data)
+  });
+  return {
+    isLoadingArticleTypes: articleTypesQuery.isLoading,
+    isArticleTypesError: articleTypesQuery.isError,
+    articleTypes: articleTypesQuery === null || articleTypesQuery === void 0 ? void 0 : articleTypesQuery.data
+  };
+};
+
+/**
+ * @description Retrieves the article groups for a given article type
+ */
+exports.useArticleTypes = useArticleTypes;
+const useArticleGroups = exports.useArticleGroups = function useArticleGroups() {
+  var _articleGroupsQuery$d;
+  let articleTypeId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+  const articleGroupsQuery = (0, _reactQuery.useQuery)(['articleGroups', articleTypeId], {
+    enabled: !!articleTypeId,
+    queryFn: () => _authenticatedProxyApi.authenticatedProxyApi.getArticleGroups(articleTypeId).then(res => res.data)
+  });
+  return {
+    isLoadingArticleGroups: articleGroupsQuery.isLoading,
+    isArticleGroupsError: articleGroupsQuery.isError,
+    articleGroups: (_articleGroupsQuery$d = articleGroupsQuery === null || articleGroupsQuery === void 0 ? void 0 : articleGroupsQuery.data) !== null && _articleGroupsQuery$d !== void 0 ? _articleGroupsQuery$d : []
+  };
+};
+
+/**
+ * @description Retrieves the article sub groups for a given article group
+ */
+const useArticleSubGroups = exports.useArticleSubGroups = function useArticleSubGroups() {
+  var _articleSubGroupsQuer;
+  let articleGroupId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+  let formula = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  const articleSubGroupsQuery = (0, _reactQuery.useQuery)(['articleSubGroups', articleGroupId, formula], {
+    enabled: !!articleGroupId && !!formula,
+    queryFn: () => _authenticatedProxyApi.authenticatedProxyApi.getArticleSubGroups(articleGroupId, formula).then(res => res.data)
+  });
+  return {
+    isLoadingArticleSubGroups: articleSubGroupsQuery.isLoading,
+    isArticleSubGroupsError: articleSubGroupsQuery.isError,
+    articleSubGroups: (_articleSubGroupsQuer = articleSubGroupsQuery === null || articleSubGroupsQuery === void 0 ? void 0 : articleSubGroupsQuery.data) !== null && _articleSubGroupsQuer !== void 0 ? _articleSubGroupsQuer : []
+  };
+};
+
+/**
+ * @description Retrieves the product field labels
+ */
 const useProductFieldLabels = () => {
   const productFieldsQuery = (0, _reactQuery.useQuery)('productFieldLabels', {
     queryFn: () => _publicProxyApi.publicProxyApi.getProductFieldLabels().then(res => res.data)
@@ -123,9 +231,126 @@ const useModelsQuery = _ref2 => {
 };
 
 /**
- * @description Retrieves the products of an order
+ * @description Retrieves the articles for a single order
+ * @param {Object} filters - The filters to apply to the articles
+ * @param {String} formula - The formula to apply to the articles
+ * @param {String} branchId - The branch id to apply to the articles
+ * @returns {Object} The articles and the total count of articles
  */
 exports.useModelsQuery = useModelsQuery;
+const useSingleOrderArticles = exports.useSingleOrderArticles = function useSingleOrderArticles() {
+  let filters = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  let formula = arguments.length > 1 ? arguments[1] : undefined;
+  let branchId = arguments.length > 2 ? arguments[2] : undefined;
+  const articlesQuery = (0, _reactQuery.useQuery)(['singleOrderArticles', filters, branchId], {
+    queryFn: async () => {
+      if (!branchId) {
+        return {
+          articles: [],
+          totalArticles: 0
+        };
+      }
+      const {
+        articleNumber,
+        licensePlate,
+        model
+      } = filters;
+      let articles = [],
+        totalCount = 0;
+      if (!articleNumber && !licensePlate && !model) {
+        ({
+          articles,
+          totalCount
+        } = await (0, _singleOrderArticles.fetchArticlesByFilters)(filters));
+      } else if ((licensePlate || model) && !articleNumber) {
+        ({
+          articles,
+          totalCount
+        } = await (0, _singleOrderArticles.fetchArticlesByLicensePlateAndModel)(filters, formula, branchId));
+      } else if (!licensePlate && !model && articleNumber) {
+        ({
+          articles,
+          totalCount
+        } = await (0, _singleOrderArticles.fetchArticlesByArticleNumbers)([articleNumber]));
+      }
+      if (totalCount === 0) {
+        return {
+          articles: [],
+          totalArticles: 0
+        };
+      }
+      return {
+        articles: await (0, _singleOrderArticles.enrichArticlesWithBrandsAndPrices)(articles, branchId, formula),
+        totalArticles: totalCount
+      };
+    }
+  });
+  return {
+    isLoadingArticles: articlesQuery.isFetching,
+    areArticlesError: articlesQuery.isError,
+    articles: articlesQuery === null || articlesQuery === void 0 ? void 0 : articlesQuery.data
+  };
+};
+
+/**
+ * @description Get the current cart from the custom hyper api
+ */
+const useSingleOrderCart = () => {
+  const [{
+    model,
+    licensePlate,
+    singleOrderCart
+  }] = (0, _OrderSessionContext.useOrderSession)();
+  const formula = (0, _FormulaContext.useFormula)();
+  let cartOrderQuery = new URLSearchParams((0, _helpers__.removeNullishProps)({
+    model,
+    licensePlate,
+    formula,
+    isSingle: true,
+    cart: JSON.stringify(singleOrderCart)
+  })).toString();
+  const cartQuery = (0, _reactQuery.useQuery)(['singleOrderCart', cartOrderQuery], {
+    queryFn: async () => {
+      var _articles$articles;
+      if (!singleOrderCart.length) {
+        return {
+          articles: [],
+          totals: []
+        };
+      }
+      const orderResults = await _orderApi.orderApi.getOrder(cartOrderQuery).then(res => res.data);
+      if (!orderResults.data.cart) {
+        return {
+          cart: []
+        };
+      }
+      const cart = orderResults.data.cart;
+      const articles = await (0, _singleOrderArticles.fetchArticlesByArticleNumbers)(cart.map(article => article.articleNumber));
+      const cartLookup = Object.fromEntries(cart.map(item => [item.articleNumber, item]));
+      const articlesWithPrice = articles === null || articles === void 0 || (_articles$articles = articles.articles) === null || _articles$articles === void 0 ? void 0 : _articles$articles.map(article => {
+        const cartItem = cartLookup[article.articleNumber];
+        return _objectSpread(_objectSpread({}, article), {}, {
+          price: cartItem !== null && cartItem !== void 0 && cartItem.consumerTotal ? Math.round(Number(cartItem === null || cartItem === void 0 ? void 0 : cartItem.consumerTotal) * 100) / 100 : 0,
+          quantity: Number(cartItem === null || cartItem === void 0 ? void 0 : cartItem.quantity)
+        });
+      });
+      return {
+        articles: articlesWithPrice,
+        totals: orderResults.data.totals
+      };
+    }
+  });
+  return {
+    isLoadingCart: cartQuery.isFetching,
+    isCartError: cartQuery.isError,
+    cart: cartQuery === null || cartQuery === void 0 ? void 0 : cartQuery.data
+  };
+};
+
+/**
+ * @description Retrieves the products of an order
+ */
+exports.useSingleOrderCart = useSingleOrderCart;
 const useProductsQuery = orderParameters => {
   var _productsQuery$data, _productsQuery$data2, _productsQuery$data3, _productsQuery$data4, _productsQuery$data5, _productsQuery$data6, _productsQuery$data7, _productsQuery$data8, _productsQuery$data9, _productsQuery$data$a, _productsQuery$data10, _productsQuery$data$c, _productsQuery$data11, _productsQuery$data$a2, _productsQuery$data12, _productsQuery$data$a3, _productsQuery$data13, _productsQuery$data$a4, _productsQuery$data14, _productsQuery$data15, _productsQuery$data16, _productsQuery$data$a5, _productsQuery$data17, _productsQuery$data$t, _productsQuery$data18;
   const {

package/dist/src/shared/__components__/Buttons/OutlinedButton.js

@@ -0,0 +1,61 @@
+"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 OutlinedButton = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+  let {
+    type = 'button',
+    isNarrow = false,
+    isDisabled,
+    onClick,
+    label,
+    icon,
+    className
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("button", {
+    className: (0, _helpers__.withStyle)("btn btn-outline-primary ".concat(isNarrow ? 'btn-narrow' : '', " ").concat(className || '')),
+    type: type,
+    ref: ref,
+    disabled: isDisabled,
+    onClick: onClick
+  }, icon && /*#__PURE__*/_react.default.createElement("i", {
+    className: icon,
+    style: {
+      marginRight: '8px'
+    }
+  }), label);
+});
+var _default = exports.default = OutlinedButton;

package/dist/src/shared/__components__/Buttons/PrimaryButton.js

@@ -41,10 +41,11 @@ const PrimaryButton = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     isNarrow = false,
     isDisabled,
     onClick,
-    label
+    label,
+    className
   } = _ref;
   return /*#__PURE__*/_react.default.createElement("button", {
-    className: (0, _helpers__.withStyle)("btn btn-primary ".concat(isNarrow ? 'btn-narrow' : '')),
+    className: (0, _helpers__.withStyle)("btn btn-primary ".concat(isNarrow ? 'btn-narrow' : '', " ").concat(className)),
     type: type,
     ref: ref,
     disabled: isDisabled,

package/dist/src/shared/__components__/Cards/ExpandableCard.js

@@ -42,6 +42,7 @@ const ExpandableCard = _ref => {
     collapseLabel,
     body,
     expandedBody,
+    isCard = true,
     isDefaultExpanded = false
   } = _ref;
   const [isExpanded, setIsExpanded] = (0, _react.useState)(isDefaultExpanded);
@@ -58,7 +59,7 @@ const ExpandableCard = _ref => {
     "aria-controls": "collapseOne",
     onClick: () => setIsExpanded(prev => !prev)
   }, isExpanded ? collapseLabel : expandLabel)), /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _helpers__.withStyle)('card-body')
+    className: (0, _helpers__.withStyle)("".concat(isCard ? 'card-body' : ''))
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('container-fluid g-0')
   }, /*#__PURE__*/_react.default.createElement("div", {

package/dist/src/shared/__components__/DangerAlert.js

@@ -0,0 +1,23 @@
+"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 DangerAlert = _ref => {
+  let {
+    message,
+    className = ''
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)("alert alert-danger ".concat(className))
+  }, /*#__PURE__*/_react.default.createElement("strong", null, message || 'Er is iets fout gegaan.'));
+};
+var _default = exports.default = DangerAlert;

package/dist/src/shared/__components__/EmptyState.js

@@ -0,0 +1,30 @@
+"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 EmptyState = _ref => {
+  let {
+    message,
+    subMessage,
+    className = ''
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('card__horizontal') + (0, _helpers__.withStyle)(className)
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('card-body')
+  }, /*#__PURE__*/_react.default.createElement("h5", {
+    className: (0, _helpers__.withStyle)('card-title')
+  }, message), subMessage && subMessage.length > 0 && /*#__PURE__*/_react.default.createElement("p", {
+    className: (0, _helpers__.withStyle)('card-text')
+  }, subMessage)));
+};
+var _default = exports.default = EmptyState;

package/dist/src/shared/__components__/Form/DropdownInput.js

@@ -102,7 +102,7 @@ const DropdownInput = _ref => {
     placeholder = 'Maak een keuze',
     onChange,
     form,
-    initialValue,
+    initialValue = '',
     errorMessage = '',
     isClearable = false
   } = _ref;
@@ -126,6 +126,7 @@ const DropdownInput = _ref => {
     isClearable: isClearable,
     name: name,
     form: form,
+    initialValue: initialValue,
     value: value,
     options: options,
     placeholder: placeholder,