@licklist/design 0.71.20 → 0.71.22

package/dist/iframe/activity-card/ActivityCard.d.ts

@@ -6,7 +6,6 @@ export declare const LAYOUT_GRID = "grid";
 export declare const LAYOUT_LIST = "list";
 export type ActivityCardProps = {
     title: ReactNode;
-    duration: ReactNode;
     price: ReactNode;
     description?: ReactNode;
     onSelect: () => void;
@@ -17,5 +16,5 @@ export type ActivityCardProps = {
     resources?: ZoneResourcesAvailability;
     availabilityFormat?: AvailabilityFormat | null;
 };
-export declare const ActivityCard: ({ title, duration, price, description, availableTimes, image, onSelect, isSelected, layout, availabilityFormat, resources, }: ActivityCardProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ActivityCard: ({ title, price, description, availableTimes, image, onSelect, isSelected, layout, availabilityFormat, resources, }: ActivityCardProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ActivityCard.d.ts.map

package/dist/iframe/activity-card/ActivityCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ActivityCard.d.ts","sourceRoot":"","sources":["../../../src/iframe/activity-card/ActivityCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,KAAK,EAAE,MAAM,sDAAsD,CAAA;AAC5E,OAAO,EAAE,yBAAyB,EAAE,MAAM,0EAA0E,CAAA;AACpH,OAAO,EAAE,kBAAkB,EAAE,MAAM,2DAA2D,CAAA;AAG9F,eAAO,MAAM,WAAW,SAAS,CAAA;AACjC,eAAO,MAAM,WAAW,SAAS,CAAA;AAEjC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,SAAS,CAAA;IAChB,QAAQ,EAAE,SAAS,CAAA;IACnB,KAAK,EAAE,SAAS,CAAA;IAChB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,UAAU,EAAE,OAAO,CAAA;IACnB,MAAM,CAAC,EAAE,OAAO,WAAW,GAAG,OAAO,WAAW,CAAA;IAChD,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC9B,KAAK,CAAC,EAAE,KAAK,GAAG,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,yBAAyB,CAAA;IACrC,kBAAkB,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAA;CAC/C,CAAA;AAED,eAAO,MAAM,YAAY,iIAYtB,iBAAiB,4CA6DnB,CAAA"}
+{"version":3,"file":"ActivityCard.d.ts","sourceRoot":"","sources":["../../../src/iframe/activity-card/ActivityCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,KAAK,EAAE,MAAM,sDAAsD,CAAA;AAC5E,OAAO,EAAE,yBAAyB,EAAE,MAAM,0EAA0E,CAAA;AACpH,OAAO,EAAE,kBAAkB,EAAE,MAAM,2DAA2D,CAAA;AAG9F,eAAO,MAAM,WAAW,SAAS,CAAA;AACjC,eAAO,MAAM,WAAW,SAAS,CAAA;AAEjC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,SAAS,CAAA;IAChB,KAAK,EAAE,SAAS,CAAA;IAChB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,UAAU,EAAE,OAAO,CAAA;IACnB,MAAM,CAAC,EAAE,OAAO,WAAW,GAAG,OAAO,WAAW,CAAA;IAChD,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC9B,KAAK,CAAC,EAAE,KAAK,GAAG,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,yBAAyB,CAAA;IACrC,kBAAkB,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAA;CAC/C,CAAA;AAED,eAAO,MAAM,YAAY,uHAWtB,iBAAiB,4CA2DnB,CAAA"}

package/dist/iframe/activity-card/ActivityCard.js

@@ -5,7 +5,7 @@ import { AvailabilityIndicator } from '../../availability-indicator/Availability
 var LAYOUT_GRID = 'grid';
 var LAYOUT_LIST = 'list';
 var ActivityCard = function(param) {
-    var title = param.title, duration = param.duration, price = param.price, description = param.description, availableTimes = param.availableTimes, image = param.image, onSelect = param.onSelect, isSelected = param.isSelected, _param_layout = param.layout, layout = _param_layout === void 0 ? LAYOUT_GRID : _param_layout, availabilityFormat = param.availabilityFormat, resources = param.resources;
+    var title = param.title, price = param.price, description = param.description, availableTimes = param.availableTimes, image = param.image, onSelect = param.onSelect, isSelected = param.isSelected, _param_layout = param.layout, layout = _param_layout === void 0 ? LAYOUT_GRID : _param_layout, availabilityFormat = param.availabilityFormat, resources = param.resources;
     if (layout === LAYOUT_GRID) {
         return /*#__PURE__*/ jsxs("button", {
             type: "button",
@@ -24,9 +24,6 @@ var ActivityCard = function(param) {
                             className: "activity-card-title",
                             children: title
                         }),
-                        duration && /*#__PURE__*/ jsx("div", {
-                            children: duration
-                        }),
                         price && /*#__PURE__*/ jsx("div", {
                             children: price
                         }),
@@ -64,9 +61,6 @@ var ActivityCard = function(param) {
                     availableTimes && /*#__PURE__*/ jsx("div", {
                         children: availableTimes
                     }),
-                    duration && /*#__PURE__*/ jsx("div", {
-                        children: duration
-                    }),
                     price && /*#__PURE__*/ jsx("div", {
                         children: price
                     }),

package/dist/index.js

@@ -130,7 +130,7 @@ export { ManualBookingSummary } from './sales/manual-booking/summary/ManualBooki
 export { SearchUser } from './sales/manual-booking/search-user/SearchUser.js';
 export { SelectDateTypeControl } from './sales/manual-booking/select-date-type-control/SelectDateTypeControl.js';
 export { SelectMenu } from './sales/manual-booking/select-menu/SelectMenu.js';
-export { RefundModal } from './sales/modals/refund-modal/RefundModal.js';
+export { FULL_REFUND_TYPE, NET_REFUND_TYPE, PARTIAL_REFUND_TYPE, RefundModal } from './sales/modals/refund-modal/RefundModal.js';
 export { PaymentModal } from './sales/modals/payment-modal/PaymentModal.js';
 export { SalePaymentForm } from './sales/payment-form/SalePaymentForm.js';
 export { RyftPayment } from './sales/payment-form/components/RyftPayment/RyftPayment.js';

package/dist/product-set/form/ProductCategoriesControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProductCategoriesControl.d.ts","sourceRoot":"","sources":["../../../src/product-set/form/ProductCategoriesControl.tsx"],"names":[],"mappings":"AAYA,OAAO,EAKL,YAAY,EACb,MAAM,kEAAkE,CAAA;AAQzE,OAAO,EAAwB,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAStE,UAAU,6BAA8B,SAAQ,aAAa;IAC3D,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,oBAAoB,CAAC,EAAE,OAAO,CAAA;CAC/B;AA2BD,wBAAgB,wBAAwB,CAAC,EACvC,SAAS,EACT,SAAS,EACT,WAAW,EACX,qBAAqB,EACrB,oBAAoB,GACrB,EAAE,6BAA6B,2CAoT/B;AAED,eAAO,MAAM,cAAc,iBACX,YAAY,SACnB,MAAM,KACZ;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE,GAAG,IAczC,CAAA"}
+{"version":3,"file":"ProductCategoriesControl.d.ts","sourceRoot":"","sources":["../../../src/product-set/form/ProductCategoriesControl.tsx"],"names":[],"mappings":"AAaA,OAAO,EAKL,YAAY,EACb,MAAM,kEAAkE,CAAA;AAQzE,OAAO,EAAwB,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAoCtE,UAAU,6BAA8B,SAAQ,aAAa;IAC3D,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,oBAAoB,CAAC,EAAE,OAAO,CAAA;CAC/B;AA2BD,wBAAgB,wBAAwB,CAAC,EACvC,SAAS,EACT,SAAS,EACT,WAAW,EACX,qBAAqB,EACrB,oBAAoB,GACrB,EAAE,6BAA6B,2CA4T/B;AAED,eAAO,MAAM,cAAc,iBACX,YAAY,SACnB,MAAM,KACZ;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE,GAAG,IAczC,CAAA"}

package/dist/product-set/form/ProductCategoriesControl.js

@@ -1,9 +1,10 @@
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useContext, useState, useEffect } from 'react';
 import HookFormService from '@licklist/plugins/dist/services/Form/HookFormService';
 import { uniqueId } from 'lodash';
 import { Badge } from 'react-bootstrap';
 import { useFormContext, useFieldArray, useWatch, Controller } from 'react-hook-form';
+import { FaTicketAlt, FaCalendar, FaBars, FaBowlingBall } from 'react-icons/fa';
 import { useTranslation } from 'react-i18next';
 import { useSensor, MouseSensor } from '@dnd-kit/core';
 import { CATEGORY_TYPE_GAME, CATEGORY_TYPE_FIXED_DURATION, QUANTITY_TYPE_STANDARD, CATEGORY_TYPE_TICKETS } from '@licklist/core/dist/DataMapper/Product/ProductCategoryDataMapper';
@@ -13,7 +14,7 @@ import { ProductSetModalClasses } from '../../sortable-tree/SortableTreeItem.js'
 import { CreateProductSetItem } from '../item/CreateProductSetItem.js';
 import { ProductCategoryControl } from '../product-category/ProductCategoryControl.js';
 import { ProductsControl } from './ProductsControl.js';
-import { SelectCategoryModal } from './SelectCategoryModal.js';
+import { CATEGORY_TYPES_NAMES, SelectCategoryModal } from './SelectCategoryModal.js';
 import { ProductSetLoadingContext } from './context.js';
 import { VenueMapSetModal } from './VenueMapSetModal.js';
 import { sortArrayByIndex, moveArrayElements } from '../utils/index.js';
@@ -117,6 +118,40 @@ function _unsupported_iterable_to_array(o, minLen) {
     if (n === "Map" || n === "Set") return Array.from(n);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
 }
+var _obj;
+// @TODO not for first release
+// import Popover from "./ProductSetFormPopover";
+var CATEGORIES_TYPE = (_obj = {}, _define_property(_obj, CATEGORY_TYPES_NAMES.tickets, {
+    label: 'tickets',
+    icon: /*#__PURE__*/ jsx(FaTicketAlt, {
+        color: "#0e8ce2",
+        size: 10
+    })
+}), _define_property(_obj, CATEGORY_TYPES_NAMES.bookings, {
+    label: 'bookings',
+    icon: /*#__PURE__*/ jsx(FaCalendar, {
+        color: "#0e8ce2",
+        size: 10
+    })
+}), _define_property(_obj, CATEGORY_TYPES_NAMES.menuItems, {
+    label: 'menuItems',
+    icon: /*#__PURE__*/ jsx(FaBars, {
+        color: "#0e8ce2",
+        size: 10
+    })
+}), _define_property(_obj, CATEGORY_TYPES_NAMES.game, {
+    label: 'game',
+    icon: /*#__PURE__*/ jsx(FaBowlingBall, {
+        color: "#0e8ce2",
+        size: 10
+    })
+}), _define_property(_obj, CATEGORY_TYPES_NAMES.fixedDuration, {
+    label: 'fixedDuration',
+    icon: /*#__PURE__*/ jsx(FaCalendar, {
+        color: "#0e8ce2",
+        size: 10
+    })
+}), _obj);
 var getCategoryDefaultValue = function(categoryType, sort) {
     return {
         id: null,
@@ -251,6 +286,7 @@ function ProductCategoriesControl(param) {
                     var onSetIsExpanded = function() {
                         setIsExpanded(productCategoryId);
                     };
+                    var categoryType = CATEGORIES_TYPE[productCategory.type];
                     return /*#__PURE__*/ jsx(Controller, {
                         name: "".concat(productCategoriesFieldName, ".").concat(index, ".name"),
                         control: control,
@@ -300,6 +336,16 @@ function ProductCategoriesControl(param) {
                                 secondaryBadge: getBadgeConfig(productCategory.type, t(productCategory.type)),
                                 modalClass: ProductSetModalClasses.category,
                                 isNewAdded: showCategoryModal,
+                                itemButton: /*#__PURE__*/ jsxs("div", {
+                                    className: "btn-outline-primary item-icon sm border border-primary rounded-sm",
+                                    children: [
+                                        categoryType.icon,
+                                        /*#__PURE__*/ jsx("span", {
+                                            className: "ml-2",
+                                            children: t(categoryType.label)
+                                        })
+                                    ]
+                                }),
                                 body: /*#__PURE__*/ jsx(ProductCategoryControl, {
                                     isLoading: isLoading,
                                     onCategoryNameChange: onChange,

package/dist/product-set/form/SelectCategoryModal.d.ts

@@ -1,4 +1,16 @@
+import { ReactElement } from 'react';
 import { CategoryType } from '@licklist/core/dist/DataMapper/Product/ProductCategoryDataMapper';
+export declare const CATEGORY_TYPES_NAMES: {
+    readonly menuItems: "menuItems";
+    readonly tickets: "tickets";
+    readonly bookings: "bookings";
+    readonly game: "game";
+    readonly fixedDuration: "fixedDuration";
+};
+export type CategoryConfig = {
+    label: string;
+    icon: ReactElement;
+};
 export interface SelectCategoryModalProps {
     isVisible: boolean;
     onHide: () => void;

package/dist/product-set/form/SelectCategoryModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectCategoryModal.d.ts","sourceRoot":"","sources":["../../../src/product-set/form/SelectCategoryModal.tsx"],"names":[],"mappings":"AAIA,OAAO,EAML,YAAY,EACb,MAAM,kEAAkE,CAAA;AAoDzE,MAAM,WAAW,wBAAwB;IACvC,SAAS,EAAE,OAAO,CAAA;IAClB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,gBAAgB,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAA;CACnD;AAED,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,MAAM,EACN,gBAAgB,GACjB,EAAE,wBAAwB,2CAyH1B"}
+{"version":3,"file":"SelectCategoryModal.d.ts","sourceRoot":"","sources":["../../../src/product-set/form/SelectCategoryModal.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAwB,MAAM,OAAO,CAAA;AAG1D,OAAO,EAML,YAAY,EACb,MAAM,kEAAkE,CAAA;AAgBzE,eAAO,MAAM,oBAAoB;;;;;;CAMvB,CAAA;AAEV,MAAM,MAAM,cAAc,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,YAAY,CAAA;CAAE,CAAA;AA4BlE,MAAM,WAAW,wBAAwB;IACvC,SAAS,EAAE,OAAO,CAAA;IAClB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,gBAAgB,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAA;CACnD;AAED,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,MAAM,EACN,gBAAgB,GACjB,EAAE,wBAAwB,2CAyH1B"}

package/dist/product-set/form/SelectCategoryModal.js

@@ -242,4 +242,4 @@ function SelectCategoryModal(param) {
     });
 }
 
-export { SelectCategoryModal };
+export { CATEGORY_TYPES_NAMES, SelectCategoryModal };

package/dist/report/ReportRunnerModal/ReportRunnerModal.d.ts

@@ -17,6 +17,6 @@ export type ReportRunnerModalProps = {
     reports?: Report[] | null;
     providerId?: number;
 };
-export declare const ReportRunnerModal: ({ reportId, show, onHide, useShowReportFields, reports, generate, download, onEdit, providerId }: ReportRunnerModalProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ReportRunnerModal: ({ reportId, show, onHide, useShowReportFields, reports, generate, download, onEdit, providerId, }: ReportRunnerModalProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=ReportRunnerModal.d.ts.map

package/dist/report/ReportRunnerModal/ReportRunnerModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReportRunnerModal.d.ts","sourceRoot":"","sources":["../../../src/report/ReportRunnerModal/ReportRunnerModal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,MAAM,EAEN,UAAU,EACX,MAAM,uCAAuC,CAAA;AAM9C,OAAO,EAAE,SAAS,EAAE,MAAM,+CAA+C,CAAA;AACzE,OAAO,EAAE,uBAAuB,EAAE,MAAM,qDAAqD,CAAA;AAG7F,UAAU,WAAW;IACnB,EAAE,EAAE,MAAM,CAAA;IACV,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;CACd;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,QAAQ,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;IAC7B,IAAI,EAAE,OAAO,CAAA;IACb,mBAAmB,EAAE,CACnB,UAAU,CAAC,EAAE,UAAU,KACpB,uBAAuB,CAAC,WAAW,EAAE,EAAE,OAAO,CAAC,CAAA;IACpD,QAAQ,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,GAAG,IAAI,CAAC,CAAA;IACrD,QAAQ,CAAC,EAAE,SAAS,CAAC,IAAI,GAAG,IAAI,CAAC,CAAA;IACjC,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,EAAE,GAAG,IAAI,CAAA;IACzB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,CAAA;AASD,eAAO,MAAM,iBAAiB,qGAU3B,sBAAsB,4CA8KxB,CAAA"}
+{"version":3,"file":"ReportRunnerModal.d.ts","sourceRoot":"","sources":["../../../src/report/ReportRunnerModal/ReportRunnerModal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,MAAM,EAEN,UAAU,EACX,MAAM,uCAAuC,CAAA;AAM9C,OAAO,EAAE,SAAS,EAAE,MAAM,+CAA+C,CAAA;AACzE,OAAO,EAAE,uBAAuB,EAAE,MAAM,qDAAqD,CAAA;AAG7F,UAAU,WAAW;IACnB,EAAE,EAAE,MAAM,CAAA;IACV,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;CACd;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,QAAQ,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;IAC7B,IAAI,EAAE,OAAO,CAAA;IACb,mBAAmB,EAAE,CACnB,UAAU,CAAC,EAAE,UAAU,KACpB,uBAAuB,CAAC,WAAW,EAAE,EAAE,OAAO,CAAC,CAAA;IACpD,QAAQ,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,GAAG,IAAI,CAAC,CAAA;IACrD,QAAQ,CAAC,EAAE,SAAS,CAAC,IAAI,GAAG,IAAI,CAAC,CAAA;IACjC,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,EAAE,GAAG,IAAI,CAAA;IACzB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,CAAA;AASD,eAAO,MAAM,iBAAiB,sGAU3B,sBAAsB,4CA8KxB,CAAA"}

package/dist/sales/modals/refund-modal/RefundModal.d.ts

@@ -1,7 +1,11 @@
 import { OrderPaymentType } from '@licklist/core/dist/DataMapper/Order/OrderPaymentDataMapper';
+export declare const FULL_REFUND_TYPE = "fullRefund";
+export declare const PARTIAL_REFUND_TYPE = "partialRefund";
+export declare const NET_REFUND_TYPE = "netRefund";
+export type RefundType = typeof FULL_REFUND_TYPE | typeof PARTIAL_REFUND_TYPE | typeof NET_REFUND_TYPE;
 export interface RefundModalProps {
     isVisible: boolean;
-    isFullRefund?: boolean;
+    refundType?: RefundType;
     onHide: () => void;
     onSubmit: (amount?: number) => void;
     isLoading?: boolean;
@@ -9,5 +13,5 @@ export interface RefundModalProps {
     defaultValue?: number;
     maxValue?: number;
 }
-export declare const RefundModal: ({ isVisible, onHide, onSubmit, isLoading, isFullRefund, paymentType, defaultValue, maxValue, }: RefundModalProps) => import("react/jsx-runtime").JSX.Element;
+export declare const RefundModal: ({ isVisible, onHide, onSubmit, isLoading, refundType, paymentType, defaultValue, maxValue, }: RefundModalProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=RefundModal.d.ts.map

package/dist/sales/modals/refund-modal/RefundModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RefundModal.d.ts","sourceRoot":"","sources":["../../../../src/sales/modals/refund-modal/RefundModal.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,gBAAgB,EAAE,MAAM,6DAA6D,CAAA;AAK9F,MAAM,WAAW,gBAAgB;IAC/B,SAAS,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,QAAQ,EAAE,CAAC,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,EAAE,gBAAgB,CAAA;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAMD,eAAO,MAAM,WAAW,mGASrB,gBAAgB,4CAoGlB,CAAA"}
+{"version":3,"file":"RefundModal.d.ts","sourceRoot":"","sources":["../../../../src/sales/modals/refund-modal/RefundModal.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,gBAAgB,EAAE,MAAM,6DAA6D,CAAA;AAK9F,eAAO,MAAM,gBAAgB,eAAe,CAAA;AAC5C,eAAO,MAAM,mBAAmB,kBAAkB,CAAA;AAClD,eAAO,MAAM,eAAe,cAAc,CAAA;AAE1C,MAAM,MAAM,UAAU,GAClB,OAAO,gBAAgB,GACvB,OAAO,mBAAmB,GAC1B,OAAO,eAAe,CAAA;AAE1B,MAAM,WAAW,gBAAgB;IAC/B,SAAS,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,UAAU,CAAA;IACvB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,QAAQ,EAAE,CAAC,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,EAAE,gBAAgB,CAAA;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAMD,eAAO,MAAM,WAAW,iGASrB,gBAAgB,4CAoGlB,CAAA"}

package/dist/sales/modals/refund-modal/RefundModal.js

@@ -61,13 +61,17 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
+var FULL_REFUND_TYPE = 'fullRefund';
+var PARTIAL_REFUND_TYPE = 'partialRefund';
+var NET_REFUND_TYPE = 'netRefund';
 var RefundModal = function(param) {
-    var isVisible = param.isVisible, onHide = param.onHide, onSubmit = param.onSubmit, _param_isLoading = param.isLoading, isLoading = _param_isLoading === void 0 ? false : _param_isLoading, _param_isFullRefund = param.isFullRefund, isFullRefund = _param_isFullRefund === void 0 ? false : _param_isFullRefund, paymentType = param.paymentType, _param_defaultValue = param.defaultValue, defaultValue = _param_defaultValue === void 0 ? 0 : _param_defaultValue, maxValue = param.maxValue;
+    var isVisible = param.isVisible, onHide = param.onHide, onSubmit = param.onSubmit, _param_isLoading = param.isLoading, isLoading = _param_isLoading === void 0 ? false : _param_isLoading, _param_refundType = param.refundType, refundType = _param_refundType === void 0 ? PARTIAL_REFUND_TYPE : _param_refundType, paymentType = param.paymentType, _param_defaultValue = param.defaultValue, defaultValue = _param_defaultValue === void 0 ? 0 : _param_defaultValue, maxValue = param.maxValue;
     var _errors_amount;
     var t = useTranslation([
         'Design',
         'Validation'
     ]).t;
+    var isInputDisabled = isLoading || refundType === 'fullRefund' || refundType === 'netRefund';
     var _useForm = useForm(), handleSubmit = _useForm.handleSubmit, register = _useForm.register, errors = _useForm.formState.errors, reset = _useForm.reset;
     var onModalSubmit = function(param) {
         var amount = param.amount;
@@ -97,7 +101,7 @@ var RefundModal = function(param) {
                     children: [
                         /*#__PURE__*/ jsx(ModalTitle, {
                             as: "h5",
-                            children: t(isFullRefund ? 'Design:fullRefund' : 'Design:partialRefund')
+                            children: t("Design:".concat(refundType))
                         }),
                         /*#__PURE__*/ jsx(Button, {
                             variant: "danger",
@@ -150,7 +154,7 @@ var RefundModal = function(param) {
                                             }
                                         })), {
                                             step: 0.01,
-                                            disabled: isLoading || isFullRefund,
+                                            disabled: isInputDisabled,
                                             isInvalid: !!errors.amount,
                                             min: 0
                                         })),
@@ -186,4 +190,4 @@ var RefundModal = function(param) {
     });
 };
 
-export { RefundModal };
+export { FULL_REFUND_TYPE, NET_REFUND_TYPE, PARTIAL_REFUND_TYPE, RefundModal };

package/dist/sales/modals/refund-modal/index.d.ts

@@ -1,3 +1,3 @@
-export { RefundModal } from './RefundModal';
-export type { RefundModalProps } from './RefundModal';
+export { RefundModal, FULL_REFUND_TYPE, NET_REFUND_TYPE, PARTIAL_REFUND_TYPE, } from './RefundModal';
+export type { RefundModalProps, RefundType } from './RefundModal';
 //# sourceMappingURL=index.d.ts.map

package/dist/sales/modals/refund-modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/sales/modals/refund-modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/sales/modals/refund-modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,gBAAgB,EAChB,eAAe,EACf,mBAAmB,GACpB,MAAM,eAAe,CAAA;AACtB,YAAY,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA"}

package/dist/sortable-tree/SortableTreeItem.d.ts

@@ -14,6 +14,7 @@ export interface SortableTreeItemProps {
     body: ReactNode;
     children?: ReactNode;
     preItem?: ReactNode;
+    itemButton?: ReactNode;
     postItem?: ReactNode;
     sortableItems?: string[];
     isExpanded?: boolean;
@@ -36,5 +37,5 @@ export interface SortableTreeItemProps {
     setIsExpanded?: () => void;
     isOverride?: boolean;
 }
-export declare function SortableTreeItem({ id, title, badge, subTitle, body, children, preItem, postItem, sortableItems, isExpanded, shouldExpand, isInvalid, isIconInHeader, treeLineIconColor, modalLabel, modalClass, isNewAdded, onDelete, validate, cancelChanges, saveValidField, edit, secondaryBadge, setIsExpanded, isOverride, }: SortableTreeItemProps): import("react/jsx-runtime").JSX.Element;
+export declare function SortableTreeItem({ id, title, badge, subTitle, body, children, preItem, postItem, sortableItems, isExpanded, shouldExpand, isInvalid, isIconInHeader, treeLineIconColor, modalLabel, modalClass, isNewAdded, onDelete, validate, cancelChanges, saveValidField, edit, secondaryBadge, setIsExpanded, isOverride, itemButton, }: SortableTreeItemProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=SortableTreeItem.d.ts.map

package/dist/sortable-tree/SortableTreeItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SortableTreeItem.d.ts","sourceRoot":"","sources":["../../src/sortable-tree/SortableTreeItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAoC,MAAM,OAAO,CAAA;AAiBnE,eAAO,MAAM,sBAAsB;;;;;CAKzB,CAAA;AAEV,MAAM,MAAM,0BAA0B,GACpC,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,OAAO,sBAAsB,CAAC,CAAA;AAEtE,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,IAAI,EAAE,SAAS,CAAA;IACf,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,IAAI,CAAC,EAAE,MAAM,IAAI,CAAA;IACjB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;IAC3B,UAAU,CAAC,EAAE,0BAA0B,CAAA;IACvC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAA;IACjC,cAAc,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAA;QACb,SAAS,EAAE,MAAM,CAAA;KAClB,CAAA;IACD,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,EAAE,EACF,KAAK,EACL,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,aAAa,EACb,UAAkB,EAClB,YAAmB,EACnB,SAAiB,EACjB,cAAqB,EACrB,iBAAsB,EACtB,UAAe,EACf,UAAU,EACV,UAAkB,EAClB,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,cAAc,EACd,IAAI,EACJ,cAAc,EACd,aAAa,EACb,UAAU,GACX,EAAE,qBAAqB,2CA2TvB"}
+{"version":3,"file":"SortableTreeItem.d.ts","sourceRoot":"","sources":["../../src/sortable-tree/SortableTreeItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EAIV,MAAM,OAAO,CAAA;AAiBd,eAAO,MAAM,sBAAsB;;;;;CAKzB,CAAA;AAEV,MAAM,MAAM,0BAA0B,GACpC,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,OAAO,sBAAsB,CAAC,CAAA;AAEtE,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,IAAI,EAAE,SAAS,CAAA;IACf,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,IAAI,CAAC,EAAE,MAAM,IAAI,CAAA;IACjB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;IAC3B,UAAU,CAAC,EAAE,0BAA0B,CAAA;IACvC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAA;IACjC,cAAc,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAA;QACb,SAAS,EAAE,MAAM,CAAA;KAClB,CAAA;IACD,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,EAAE,EACF,KAAK,EACL,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,aAAa,EACb,UAAkB,EAClB,YAAmB,EACnB,SAAiB,EACjB,cAAqB,EACrB,iBAAsB,EACtB,UAAe,EACf,UAAU,EACV,UAAkB,EAClB,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,cAAc,EACd,IAAI,EACJ,cAAc,EACd,aAAa,EACb,UAAU,EACV,UAAU,GACX,EAAE,qBAAqB,2CA+TvB"}

package/dist/sortable-tree/SortableTreeItem.js

@@ -240,7 +240,7 @@ var ProductSetModalClasses = {
     productZones: 'edit-product-zone'
 };
 function SortableTreeItem(param) {
-    var id = param.id, title = param.title, badge = param.badge, subTitle = param.subTitle, body = param.body, children = param.children, preItem = param.preItem, postItem = param.postItem, sortableItems = param.sortableItems, _param_isExpanded = param.isExpanded, isExpanded = _param_isExpanded === void 0 ? false : _param_isExpanded, _param_shouldExpand = param.shouldExpand, shouldExpand = _param_shouldExpand === void 0 ? true : _param_shouldExpand, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, _param_isIconInHeader = param.isIconInHeader, isIconInHeader = _param_isIconInHeader === void 0 ? true : _param_isIconInHeader, _param_treeLineIconColor = param.treeLineIconColor, treeLineIconColor = _param_treeLineIconColor === void 0 ? '' : _param_treeLineIconColor, _param_modalLabel = param.modalLabel, modalLabel = _param_modalLabel === void 0 ? '' : _param_modalLabel, modalClass = param.modalClass, _param_isNewAdded = param.isNewAdded, isNewAdded = _param_isNewAdded === void 0 ? false : _param_isNewAdded, onDelete = param.onDelete, validate = param.validate, cancelChanges = param.cancelChanges, saveValidField = param.saveValidField, edit = param.edit, secondaryBadge = param.secondaryBadge, setIsExpanded = param.setIsExpanded, isOverride = param.isOverride;
+    var id = param.id, title = param.title, badge = param.badge, subTitle = param.subTitle, body = param.body, children = param.children, preItem = param.preItem, postItem = param.postItem, sortableItems = param.sortableItems, _param_isExpanded = param.isExpanded, isExpanded = _param_isExpanded === void 0 ? false : _param_isExpanded, _param_shouldExpand = param.shouldExpand, shouldExpand = _param_shouldExpand === void 0 ? true : _param_shouldExpand, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, _param_isIconInHeader = param.isIconInHeader, isIconInHeader = _param_isIconInHeader === void 0 ? true : _param_isIconInHeader, _param_treeLineIconColor = param.treeLineIconColor, treeLineIconColor = _param_treeLineIconColor === void 0 ? '' : _param_treeLineIconColor, _param_modalLabel = param.modalLabel, modalLabel = _param_modalLabel === void 0 ? '' : _param_modalLabel, modalClass = param.modalClass, _param_isNewAdded = param.isNewAdded, isNewAdded = _param_isNewAdded === void 0 ? false : _param_isNewAdded, onDelete = param.onDelete, validate = param.validate, cancelChanges = param.cancelChanges, saveValidField = param.saveValidField, edit = param.edit, secondaryBadge = param.secondaryBadge, setIsExpanded = param.setIsExpanded, isOverride = param.isOverride, itemButton = param.itemButton;
     var _useState = _sliced_to_array(useState(isExpanded), 2), expanded = _useState[0], setExpanded = _useState[1];
     var _useState1 = _sliced_to_array(useState(isNewAdded), 2), isModalVisible = _useState1[0], setIsModalVisible = _useState1[1];
     var t = useTranslation('Design').t;
@@ -433,9 +433,15 @@ function SortableTreeItem(param) {
                                                 /*#__PURE__*/ jsxs("div", {
                                                     className: clsx(modalLabel ? 'sortable-tree-product-set-title-container' : 'sortable-tree-title-container'),
                                                     children: [
-                                                        /*#__PURE__*/ jsx("span", {
-                                                            className: clsx('sortable-tree-item-title', modalLabel && 'sortable-tree-product-set-element-title'),
-                                                            children: title
+                                                        /*#__PURE__*/ jsxs("span", {
+                                                            className: clsx('sortable-tree-item-title', modalLabel && 'sortable-tree-product-set-element-title', 'd-flex justify-content-between'),
+                                                            children: [
+                                                                title,
+                                                                /*#__PURE__*/ jsx("div", {
+                                                                    className: "sortable-tree-item-subtitle",
+                                                                    children: itemButton
+                                                                })
+                                                            ]
                                                         }),
                                                         !expanded && /*#__PURE__*/ jsx("span", {
                                                             className: "sortable-tree-item-subtitle",

package/dist/styles/date-time-button/DateTimeButton.scss

@@ -33,7 +33,7 @@
 
   &.disabled {
     border: 2px solid $snippet-calendar-disabled-button-border-color;
-    background-color:transparent;
+    background-color: transparent;
     border: none;
     color: $snippet-calendar-disabled-button-font-color;
     cursor: not-allowed;

package/dist/styles/product-set/ProductSetForm.scss

@@ -1,4 +1,5 @@
 .product-set-form {
+
   input,
   textarea,
   select,
@@ -15,10 +16,12 @@
     height: 2.5rem;
     border-width: 2px;
     padding: 2px;
+
     label,
     .btn-switch-indicator {
       border-radius: 0.375rem !important;
     }
+
     label {
       height: 2rem;
     }
@@ -34,6 +37,7 @@
       margin-top: 1.5rem;
       margin-bottom: 1.5rem;
     }
+
     @include media-breakpoint-down(sm) {
       padding: 1.5rem 1rem;
       margin-top: 0.5rem;
@@ -59,10 +63,21 @@
     background-color: #ffdbdb;
     color: #d52902;
   }
+
   .category-badge {
     background-color: #e8f4f6;
     color: #1a93aa;
   }
+
+  .item-icon {
+    display: flex;
+    justify-items: center;
+    align-items: center;
+    font-size: 0.65rem;
+    padding: 0.2rem;
+    margin-right: 1rem;
+  }
+
   .product-badge {
     background-color: #e9f5ea;
     color: #269b36;
@@ -75,10 +90,12 @@
 
 .product-set-mobile-modal {
   margin: 0;
+
   .modal-content {
     border-radius: 1rem 1rem 0 0;
     border-width: 0;
     margin: 0;
+
     .modal-body {
       padding: 1rem 0;
     }
@@ -100,18 +117,22 @@
     font-weight: 600;
     font-size: 0.625rem;
   }
+
   .product-set-subtitle-dot {
     margin-right: 0.375rem;
     width: 0.375rem;
     height: 0.375rem;
     border-radius: 3px;
   }
+
   .product-set-subtitle-category-dot {
     background-color: #269b36;
   }
+
   .product-set-subtitle-step-dot {
     background-color: #1a93aa;
   }
+
   .product-set-subtitle-product-dot {
     background-color: #269b36;
   }
@@ -156,6 +177,7 @@
     justify-self: flex-end;
     align-items: flex-end;
   }
+
   .small-badge {
     font-size: 0.5rem;
     height: 1rem;
@@ -163,6 +185,7 @@
     padding: 0 0.2rem;
     margin-bottom: 0.2rem;
   }
+
   .product-set-save-btn-wrapper {
     padding-left: 0 !important;
     display: flex;
@@ -177,8 +200,8 @@
 
 .sortable-tree-item-toggle {
   .product-zone-badge {
-    background-color: #efe9f5;
-    color: #84269b;
+    background-color: #EFE9F5;
+    color: #84269B;
     font-size: 0.875rem;
     font-weight: 600;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@licklist/design",
-  "version": "0.71.20",
+  "version": "0.71.22",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"
@@ -206,4 +206,4 @@
     "node": "20.9.0",
     "yarn": "4.4.0"
   }
-}
+}

package/src/iframe/activity-card/ActivityCard.stories.tsx

@@ -27,7 +27,6 @@ export const GridView: Story<ActivityCardProps> = (props) => {
 GridView.args = {
   layout: LAYOUT_GRID,
   title: 'Clay Pigeons & Axe Thowing',
-  duration: '60 mins',
   price: 'from £20',
 }
 
@@ -46,6 +45,5 @@ export const ListView: Story<ActivityCardProps> = (props) => {
 ListView.args = {
   layout: LAYOUT_LIST,
   title: 'Clay Pigeons & Axe Thowing',
-  duration: '60 mins',
   price: 'from £20',
 }

package/src/iframe/activity-card/ActivityCard.tsx

@@ -10,7 +10,6 @@ export const LAYOUT_LIST = 'list'
 
 export type ActivityCardProps = {
   title: ReactNode
-  duration: ReactNode
   price: ReactNode
   description?: ReactNode
   onSelect: () => void
@@ -24,7 +23,6 @@ export type ActivityCardProps = {
 
 export const ActivityCard = ({
   title,
-  duration,
   price,
   description,
   availableTimes,
@@ -48,7 +46,6 @@ export const ActivityCard = ({
 
         <div>
           <div className='activity-card-title'>{title}</div>
-          {duration && <div>{duration}</div>}
           {price && <div>{price}</div>}
           {description && (
             <div className='mt-2 activity-card-description'>{description}</div>
@@ -79,7 +76,6 @@ export const ActivityCard = ({
       <div className='activity-card-info'>
         <div className='activity-card-title mb-2'>{title}</div>
         {availableTimes && <div>{availableTimes}</div>}
-        {duration && <div>{duration}</div>}
         {price && <div>{price}</div>}
         {description && (
           <div className='mt-2 activity-card-description'>{description}</div>

package/src/product-set/form/ProductCategoriesControl.tsx

@@ -8,6 +8,7 @@ import {
   useFormContext,
   useWatch,
 } from 'react-hook-form'
+import { FaBars, FaBowlingBall, FaCalendar, FaTicketAlt } from 'react-icons/fa'
 import { useTranslation } from 'react-i18next'
 import { useSensor, MouseSensor } from '@dnd-kit/core'
 import {
@@ -25,7 +26,11 @@ import { ProductCategoryControl } from '../product-category'
 import { ProductCategory } from '../types'
 import { ProductsControl } from './ProductsControl'
 import { ProductSetFormValues, WithIsLoading } from './ProductSetForm'
-import { SelectCategoryModal } from './SelectCategoryModal'
+import {
+  SelectCategoryModal,
+  CATEGORY_TYPES_NAMES,
+  CategoryConfig,
+} from './SelectCategoryModal'
 import { ProductSetLoadingContext } from './context'
 import { VenueMapSetModal } from './VenueMapSetModal'
 import { moveArrayElements, sortArrayByIndex } from '../utils'
@@ -33,6 +38,29 @@ import { useSortableTreeFunctions } from '../hooks/useSortableTreeFunctions'
 // @TODO not for first release
 // import Popover from "./ProductSetFormPopover";
 
+const CATEGORIES_TYPE: Partial<Record<CategoryType, CategoryConfig>> = {
+  [CATEGORY_TYPES_NAMES.tickets]: {
+    label: 'tickets',
+    icon: <FaTicketAlt color='#0e8ce2' size={10} />,
+  },
+  [CATEGORY_TYPES_NAMES.bookings]: {
+    label: 'bookings',
+    icon: <FaCalendar color='#0e8ce2' size={10} />,
+  },
+  [CATEGORY_TYPES_NAMES.menuItems]: {
+    label: 'menuItems',
+    icon: <FaBars color='#0e8ce2' size={10} />,
+  },
+  [CATEGORY_TYPES_NAMES.game]: {
+    label: 'game',
+    icon: <FaBowlingBall color='#0e8ce2' size={10} />,
+  },
+  [CATEGORY_TYPES_NAMES.fixedDuration]: {
+    label: 'fixedDuration',
+    icon: <FaCalendar color='#0e8ce2' size={10} />,
+  },
+}
+
 interface ProductCategoriesControlProps extends WithIsLoading {
   stepIndex: number
   isOverrides?: boolean
@@ -229,6 +257,8 @@ export function ProductCategoriesControl({
             setIsExpanded(productCategoryId)
           }
 
+          const categoryType = CATEGORIES_TYPE[productCategory.type]
+
           return (
             <Controller
               key={`product-category-${productCategory._id}`}
@@ -273,6 +303,12 @@ export function ProductCategoriesControl({
                   )}
                   modalClass={ProductSetModalClasses.category}
                   isNewAdded={showCategoryModal}
+                  itemButton={
+                    <div className='btn-outline-primary item-icon sm border border-primary rounded-sm'>
+                      {categoryType.icon}
+                      <span className='ml-2'>{t(categoryType.label)}</span>
+                    </div>
+                  }
                   body={
                     <ProductCategoryControl
                       isLoading={isLoading}

package/src/product-set/form/SelectCategoryModal.tsx

@@ -25,7 +25,7 @@ import {
 } from 'react-icons/fa'
 import { ProductSetLoadingContext } from './context'
 
-const CATEGORY_TYPES_NAMES = {
+export const CATEGORY_TYPES_NAMES = {
   menuItems: CATEGORY_TYPE_MENU_ITEMS,
   tickets: CATEGORY_TYPE_TICKETS,
   bookings: CATEGORY_TYPE_BOOKINGS,
@@ -33,7 +33,7 @@ const CATEGORY_TYPES_NAMES = {
   fixedDuration: CATEGORY_TYPE_FIXED_DURATION,
 } as const
 
-type CategoryConfig = { label: string; icon: ReactElement }
+export type CategoryConfig = { label: string; icon: ReactElement }
 
 const MAIN_CATEGORIES: Partial<Record<CategoryType, CategoryConfig>> = {
   [CATEGORY_TYPES_NAMES.tickets]: {

package/src/report/ReportRunnerModal/ReportRunnerModal.tsx

@@ -52,7 +52,7 @@ export const ReportRunnerModal = ({
   generate,
   download,
   onEdit,
-  providerId
+  providerId,
 }: ReportRunnerModalProps) => {
   const { t } = useTranslation(['App', 'Design'])
   const report = reports?.find((report) => report.id === reportId)