@licklist/design 0.66.11 → 0.66.12-dev.1

package/dist/events/event-venue-map/components/MapPoint/components/ProductIcon/ProductIcon.js

@@ -1 +1,194 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var o,t=require("tslib"),e=require("react"),r=(o=e)&&"object"==typeof o&&"default"in o?o.default:o,n=require("react-konva"),i=require("../ProductTooltip/ProductTooltip.js"),a="#FFFFFF",c="#FFFFFF80",l="#0E8CE2",u="#878787",d=function(o,t){void 0===t&&(t=!1);var e=document.getElementById("snippet-template-context");if(e){var r=getComputedStyle(e).getPropertyValue(o);return!r||r&&!t?r:"".concat(r,"80")}};exports.ProductIcon=function(o){var s,p,v=o.x,C=o.y,f=o.isActive,F=o.isSoldOut,P=o.isErrorOnChoosedProduct,k=o.isProductChoosed,g=-28,h=t.__read(e.useState(!1),2),y=h[0],m=h[1],x=e.useMemo((function(){return{pointBackgroundColor:d("--snippet-canvas-point-background-color")||a,pointBorderColor:d("--snippet-canvas-point-border-color",!0)||c,pointFontColor:d("--snippet-canvas-point-font-color")||l,activePointBackgroundColor:d("--snippet-canvas-active-point-background-color")||l,activePointBorderColor:d("--snippet-canvas-active-point-border-color",!0)||c,activePointFontColor:d("--snippet-canvas-active-point-font-color")||a}}),[f,P,k]);return r.createElement(n.Group,{x:v,y:C,onMouseEnter:function(){return m(!0)},onMouseLeave:function(){return m(!1)}},r.createElement(n.Circle,t.__assign({radius:14,strokeWidth:2,x:0,y:-21},(s=x.pointBackgroundColor,p=x.pointBorderColor,f&&(p=x.activePointBorderColor),k&&(s=x.activePointBackgroundColor),P&&(p="#ff000080"),F&&(p=u,s=u),{fill:s,stroke:p}))),y&&F&&r.createElement(i.ProductTooltip,{x:-7,y:g,text:"Sold out"}),k?r.createElement(n.Path,{x:-7,y:g,data:"M1.5 6L5.5 10L13.5 2",width:28,height:28,fill:x.activePointBackgroundColor,stroke:x.activePointFontColor,strokeWidth:3}):r.createElement(n.Path,{x:-7,y:g,data:"M14 0C9.3569 0.6633 4.6431 0.6633 0 0L6 7V13H3V14H11V13H8V7L14 0Z",width:28,height:28,strokeWidth:1,fill:x.pointFontColor,stroke:x.pointFontColor}))};
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useMemo } from 'react';
+import { Group, Circle, Path } from 'react-konva';
+import { ProductTooltip } from '../ProductTooltip/ProductTooltip.js';
+
+function _array_like_to_array(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _array_with_holes(arr) {
+    if (Array.isArray(arr)) return arr;
+}
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _iterable_to_array_limit(arr, i) {
+    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+    if (_i == null) return;
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _s, _e;
+    try {
+        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
+            _arr.push(_s.value);
+            if (i && _arr.length === i) break;
+        }
+    } catch (err) {
+        _d = true;
+        _e = err;
+    } finally{
+        try {
+            if (!_n && _i["return"] != null) _i["return"]();
+        } finally{
+            if (_d) throw _e;
+        }
+    }
+    return _arr;
+}
+function _non_iterable_rest() {
+    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function _sliced_to_array(arr, i) {
+    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
+}
+function _unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    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 ICON_DATA = "M14 0C9.3569 0.6633 4.6431 0.6633 0 0L6 7V13H3V14H11V13H8V7L14 0Z";
+var CHOOSED_ICON_DATA = "M1.5 6L5.5 10L13.5 2";
+var ICON_WIDTH = 28;
+var ICON_HEIGHT = 28;
+var CIRCLE_RADIUS = ICON_WIDTH / 2;
+var X_OFFSET = ICON_WIDTH / 4;
+var Y_OFFSET = ICON_HEIGHT;
+var DEFAULT_STROKE_WIDTH = 1;
+var POINT_STROKE_WIDTH = 2;
+var CHOOSED_PRODUCT_STROKE_WIDTH = 2;
+var BACKGROUND_COLOR = "#FFFFFF";
+var BACKGROUND_COLOR_TRANSPARENT = "#FFFFFF80";
+var FILL_COLOR = "#0E8CE2";
+var ERROR_COLOR_TRANSPARENT = "#ff000080";
+var NO_PRODUCT_ON_POINT = "#878787";
+var SNIPPET_TEMPLATE_ID = "snippet-template-context";
+var getTransparentColorByValue = function(color) {
+    return "".concat(color, "80");
+};
+var getSnippetCssStyleVariableValue = function(name) {
+    var transparent = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
+    var element = document.getElementById(SNIPPET_TEMPLATE_ID);
+    if (!element) return undefined;
+    var value = getComputedStyle(element).getPropertyValue(name);
+    if (!value || value && !transparent) {
+        return value;
+    }
+    return getTransparentColorByValue(value);
+};
+var ProductIcon = function(param) {
+    var x = param.x, y = param.y, isActive = param.isActive, isSoldOut = param.isSoldOut, isErrorOnChoosedProduct = param.isErrorOnChoosedProduct, isProductChoosed = param.isProductChoosed;
+    var defaultX = -X_OFFSET;
+    var defaultY = -Y_OFFSET;
+    var _useState = _sliced_to_array(useState(false), 2), hovered = _useState[0], setHovered = _useState[1];
+    var cssVariableValues = useMemo(function() {
+        return {
+            pointBackgroundColor: getSnippetCssStyleVariableValue("--snippet-canvas-point-background-color") || BACKGROUND_COLOR,
+            pointBorderColor: getSnippetCssStyleVariableValue("--snippet-canvas-point-border-color", true) || BACKGROUND_COLOR_TRANSPARENT,
+            pointFontColor: getSnippetCssStyleVariableValue("--snippet-canvas-point-font-color") || FILL_COLOR,
+            activePointBackgroundColor: getSnippetCssStyleVariableValue("--snippet-canvas-active-point-background-color") || FILL_COLOR,
+            activePointBorderColor: getSnippetCssStyleVariableValue("--snippet-canvas-active-point-border-color", true) || BACKGROUND_COLOR_TRANSPARENT,
+            activePointFontColor: getSnippetCssStyleVariableValue("--snippet-canvas-active-point-font-color") || BACKGROUND_COLOR
+        };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [
+        isActive,
+        isErrorOnChoosedProduct,
+        isProductChoosed
+    ]);
+    var circleColors = function() {
+        var fill = cssVariableValues.pointBackgroundColor;
+        var stroke = cssVariableValues.pointBorderColor;
+        if (isActive) {
+            stroke = cssVariableValues.activePointBorderColor;
+        }
+        if (isProductChoosed) {
+            fill = cssVariableValues.activePointBackgroundColor;
+        }
+        if (isErrorOnChoosedProduct) {
+            stroke = ERROR_COLOR_TRANSPARENT;
+        }
+        if (isSoldOut) {
+            stroke = NO_PRODUCT_ON_POINT;
+            fill = NO_PRODUCT_ON_POINT;
+        }
+        return {
+            fill: fill,
+            stroke: stroke
+        };
+    };
+    return /*#__PURE__*/ jsxs(Group, {
+        x: x,
+        y: y,
+        onMouseEnter: function() {
+            return setHovered(true);
+        },
+        onMouseLeave: function() {
+            return setHovered(false);
+        },
+        children: [
+            /*#__PURE__*/ jsx(Circle, _object_spread({
+                radius: CIRCLE_RADIUS,
+                strokeWidth: POINT_STROKE_WIDTH,
+                x: 0,
+                y: defaultY * 0.75
+            }, circleColors())),
+            hovered && isSoldOut && /*#__PURE__*/ jsx(ProductTooltip, {
+                x: defaultX,
+                y: defaultY,
+                text: "Sold out"
+            }),
+            isProductChoosed ? /*#__PURE__*/ jsx(Path, {
+                x: defaultX,
+                y: defaultY,
+                data: CHOOSED_ICON_DATA,
+                width: ICON_WIDTH,
+                height: ICON_HEIGHT,
+                fill: cssVariableValues.activePointBackgroundColor,
+                stroke: cssVariableValues.activePointFontColor,
+                strokeWidth: CHOOSED_PRODUCT_STROKE_WIDTH * 1.5
+            }) : /*#__PURE__*/ jsx(Path, {
+                x: defaultX,
+                y: defaultY,
+                data: ICON_DATA,
+                width: ICON_WIDTH,
+                height: ICON_HEIGHT,
+                strokeWidth: DEFAULT_STROKE_WIDTH,
+                fill: cssVariableValues.pointFontColor,
+                stroke: cssVariableValues.pointFontColor
+            })
+        ]
+    });
+};
+
+export { ProductIcon };

package/dist/events/event-venue-map/components/MapPoint/components/ProductIcon/index.d.ts

@@ -1,3 +1,3 @@
-export { ProductIcon } from "./ProductIcon";
-export type { ProductIconProps } from "./ProductIcon";
+export { ProductIcon } from "./ProductIcon";
+export type { ProductIconProps } from "./ProductIcon";
 //# sourceMappingURL=index.d.ts.map

package/dist/events/event-venue-map/components/MapPoint/components/ProductTooltip/ProductTooltip.d.ts

@@ -1,9 +1,8 @@
-/// <reference types="react" />
-type ProductTooltipProps = {
-    x: number;
-    y: number;
-    text: string;
-};
-export declare const ProductTooltip: ({ x, y, text }: ProductTooltipProps) => JSX.Element;
-export {};
+type ProductTooltipProps = {
+    x: number;
+    y: number;
+    text: string;
+};
+export declare const ProductTooltip: ({ x, y, text }: ProductTooltipProps) => import("react/jsx-runtime").JSX.Element;
+export {};
 //# sourceMappingURL=ProductTooltip.d.ts.map

package/dist/events/event-venue-map/components/MapPoint/components/ProductTooltip/ProductTooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProductTooltip.d.ts","sourceRoot":"","sources":["../../../../../../src/events/event-venue-map/components/MapPoint/components/ProductTooltip/ProductTooltip.tsx"],"names":[],"mappings":";AAkBA,KAAK,mBAAmB,GAAG;IACzB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,eAAO,MAAM,cAAc,mBAAoB,mBAAmB,gBA2CjE,CAAC"}
+{"version":3,"file":"ProductTooltip.d.ts","sourceRoot":"","sources":["../../../../../../src/events/event-venue-map/components/MapPoint/components/ProductTooltip/ProductTooltip.tsx"],"names":[],"mappings":"AAiBA,KAAK,mBAAmB,GAAG;IACzB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,eAAO,MAAM,cAAc,mBAAoB,mBAAmB,4CA2CjE,CAAC"}

package/dist/events/event-venue-map/components/MapPoint/components/ProductTooltip/ProductTooltip.js

@@ -1 +1,61 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,i=require("react-konva"),l="#000";exports.ProductTooltip=function(e){var t=e.x,o=e.y,c=e.text;return r.createElement(i.Group,{width:60,height:20,x:t+30,y:o-1},r.createElement(i.Rect,{x:-5,y:5,sceneFunc:function(e){e.beginPath(),e.moveTo(0,5),e.lineTo(5,0),e.lineTo(5,10),e.closePath(),e.fill()},fill:l,borderColor:l,opacity:.8}),r.createElement(i.Rect,{x:0,y:0,width:60,height:20,fill:l,cornerRadius:5,opacity:.8}),r.createElement(i.Text,{y:4,text:c,strokeWidth:5,width:60,align:"center",verticalAlign:"middle",fill:"#FFF"}))};
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Group, Rect, Text } from 'react-konva';
+
+var TOOLTIP_WIDTH = 60;
+var TOOLTIP_HEIGHT = 20;
+var BACKGROUND_COLOR = "#000";
+var BACKGROUND_Y_OFFSET = 1;
+var BACKGROUND_X_OFFSET = 30;
+var BACKGROUND_RADIUS = 5;
+var BACKGROUND_OPACITY = 0.8;
+var TEXT_Y_OFFSET = 4;
+var TEXT_STROKE_WIDTH = 5;
+var TEXT_COLOR = "#FFF";
+var TEXT_ALIGN = "center";
+var TEXT_VERTICAL_ALIGN = "middle";
+var ProductTooltip = function(param) {
+    var x = param.x, y = param.y, text = param.text;
+    return /*#__PURE__*/ jsxs(Group, {
+        width: TOOLTIP_WIDTH,
+        height: TOOLTIP_HEIGHT,
+        x: x + BACKGROUND_X_OFFSET,
+        y: y - BACKGROUND_Y_OFFSET,
+        children: [
+            /*#__PURE__*/ jsx(Rect, {
+                x: -5,
+                y: 5,
+                sceneFunc: function(context) {
+                    context.beginPath();
+                    context.moveTo(0, 5);
+                    context.lineTo(5, 0);
+                    context.lineTo(5, 10);
+                    context.closePath();
+                    context.fill();
+                },
+                fill: BACKGROUND_COLOR,
+                borderColor: BACKGROUND_COLOR,
+                opacity: BACKGROUND_OPACITY
+            }),
+            /*#__PURE__*/ jsx(Rect, {
+                x: 0,
+                y: 0,
+                width: TOOLTIP_WIDTH,
+                height: TOOLTIP_HEIGHT,
+                fill: BACKGROUND_COLOR,
+                cornerRadius: BACKGROUND_RADIUS,
+                opacity: BACKGROUND_OPACITY
+            }),
+            /*#__PURE__*/ jsx(Text, {
+                y: TEXT_Y_OFFSET,
+                text: text,
+                strokeWidth: TEXT_STROKE_WIDTH,
+                width: TOOLTIP_WIDTH,
+                align: TEXT_ALIGN,
+                verticalAlign: TEXT_VERTICAL_ALIGN,
+                fill: TEXT_COLOR
+            })
+        ]
+    });
+};
+
+export { ProductTooltip };

package/dist/events/event-venue-map/components/MapPoint/components/ProductTooltip/index.d.ts

@@ -1,2 +1,2 @@
-export { ProductTooltip } from "./ProductTooltip";
+export { ProductTooltip } from "./ProductTooltip";
 //# sourceMappingURL=index.d.ts.map

package/dist/events/event-venue-map/components/MapPoint/index.d.ts

@@ -1,2 +1,2 @@
-export { MapPoint } from "./MapPoint";
+export { MapPoint } from "./MapPoint";
 //# sourceMappingURL=index.d.ts.map

package/dist/events/event-venue-map/components/Scrollbars/Scrollbars.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
-import { CanvasRefs } from "../../types";
-export declare const Scrollbars: ({ stageRef, imageRef, layerRef }: CanvasRefs) => JSX.Element;
+import { CanvasRefs } from "../../types";
+export declare const Scrollbars: ({ stageRef, imageRef, layerRef }: CanvasRefs) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Scrollbars.d.ts.map

package/dist/events/event-venue-map/components/Scrollbars/Scrollbars.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Scrollbars.d.ts","sourceRoot":"","sources":["../../../../../src/events/event-venue-map/components/Scrollbars/Scrollbars.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAIzC,eAAO,MAAM,UAAU,qCAAsC,UAAU,gBAkHtE,CAAC"}
+{"version":3,"file":"Scrollbars.d.ts","sourceRoot":"","sources":["../../../../../src/events/event-venue-map/components/Scrollbars/Scrollbars.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAIzC,eAAO,MAAM,UAAU,qCAAsC,UAAU,4CAkHtE,CAAC"}

package/dist/events/event-venue-map/components/Scrollbars/Scrollbars.js

@@ -1 +1,106 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,a=require("@licklist/plugins/dist/hooks/Media/useWindowDimensions"),l=require("../../../../iframe/order-process/components/BookingSummary/types/index.js"),i=require("@licklist/plugins/dist/context/event/EventVenueMapContext"),o=require("../../utils/index.js"),s=require("../../hooks/useDrag.js");exports.Scrollbars=function(e){var n=e.stageRef,c=e.imageRef,h=e.layerRef,u=a.useWindowDimensions().width,d=t.useContext(i.EventVenueMapContext).stage,m=s.useDrag({stageRef:n,imageRef:c,layerRef:h}),g=m.onDragX,f=m.onDragY,p=l.MOBILE_WIDTH<=u;return r.createElement("div",{className:"canvas-scrollbars"},r.createElement("div",{className:"scrollbar-wrapper scrollbar-wrapper-horizontal"},p&&r.createElement("div",{className:"scroll-element horizontal-scroll",onPointerDown:g,style:function(){if(!n||!c||!h)return{width:0,left:0};var e=d.x,t=d.y,r=n.attrs,a=r.width,l=r.height,i=o.getElementParameters({x:e,y:t,width:a,height:l,layer:h}),s=i.totalLayerWidth,u=i.maxXOverflowNumber;if(Math.round(s)<=Math.round(a)||2*u>=s)return{width:0,left:0};var m=o.calculateHorizontalScrollParameters({x:e,width:a,totalLayerWidth:s});return{width:m.width,left:m.left}}()})),r.createElement("div",{className:"scrollbar-wrapper scrollbar-wrapper-vertical"},p&&r.createElement("div",{className:"scroll-element vertical-scroll",onPointerDown:f,style:function(){if(!n||!c||!h)return{height:0,top:0};var e=d.x,t=d.y,r=n.attrs,a=r.width,l=r.height,i=o.getElementParameters({x:e,y:t,width:a,height:l,layer:h}),s=i.totalLayerHeight,u=i.maxYOverflowNumber;if(Math.round(s)<=Math.round(l)||2*u>=s)return{height:0,top:0};var m=o.calculateVerticalScrollParameters({y:t,height:l,totalLayerHeight:s});return{height:m.height,top:m.top}}()})))};
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useContext } from 'react';
+import { EventVenueMapContext } from '@licklist/plugins/dist/context/event/EventVenueMapContext';
+import { useWindowDimensions } from '@licklist/plugins/dist/hooks/Media/useWindowDimensions';
+import { getElementParameters, calculateHorizontalScrollParameters, calculateVerticalScrollParameters } from '../../utils/index.js';
+import { useDrag } from '../../hooks/useDrag.js';
+import { MOBILE_WIDTH } from '../../../../iframe/order-process/components/BookingSummary/types/index.js';
+
+var Scrollbars = function(param) {
+    var stageRef = param.stageRef, imageRef = param.imageRef, layerRef = param.layerRef;
+    var width = useWindowDimensions().width;
+    var stage = useContext(EventVenueMapContext).stage;
+    var _useDrag = useDrag({
+        stageRef: stageRef,
+        imageRef: imageRef,
+        layerRef: layerRef
+    }), onDragX = _useDrag.onDragX, onDragY = _useDrag.onDragY;
+    var isMobileView = MOBILE_WIDTH <= width;
+    var horizontalScrollbarStyles = function() {
+        if (!stageRef || !imageRef || !layerRef) {
+            return {
+                width: 0,
+                left: 0
+            };
+        }
+        var x = stage.x, y = stage.y;
+        var _stageRef_attrs = stageRef.attrs, width = _stageRef_attrs.width, height = _stageRef_attrs.height;
+        var _getElementParameters = getElementParameters({
+            x: x,
+            y: y,
+            width: width,
+            height: height,
+            layer: layerRef
+        }), totalLayerWidth = _getElementParameters.totalLayerWidth, maxXOverflowNumber = _getElementParameters.maxXOverflowNumber;
+        if (Math.round(totalLayerWidth) <= Math.round(width) || 2 * maxXOverflowNumber >= totalLayerWidth) {
+            return {
+                width: 0,
+                left: 0
+            };
+        }
+        var _calculateHorizontalScrollParameters = calculateHorizontalScrollParameters({
+            x: x,
+            width: width,
+            totalLayerWidth: totalLayerWidth
+        }), calculatedWidth = _calculateHorizontalScrollParameters.width, left = _calculateHorizontalScrollParameters.left;
+        return {
+            width: calculatedWidth,
+            left: left
+        };
+    };
+    var verticalScrollbarStyles = function() {
+        if (!stageRef || !imageRef || !layerRef) {
+            return {
+                height: 0,
+                top: 0
+            };
+        }
+        var x = stage.x, y = stage.y;
+        var _stageRef_attrs = stageRef.attrs, width = _stageRef_attrs.width, height = _stageRef_attrs.height;
+        var _getElementParameters = getElementParameters({
+            x: x,
+            y: y,
+            width: width,
+            height: height,
+            layer: layerRef
+        }), totalLayerHeight = _getElementParameters.totalLayerHeight, maxYOverflowNumber = _getElementParameters.maxYOverflowNumber;
+        if (Math.round(totalLayerHeight) <= Math.round(height) || 2 * maxYOverflowNumber >= totalLayerHeight) {
+            return {
+                height: 0,
+                top: 0
+            };
+        }
+        var _calculateVerticalScrollParameters = calculateVerticalScrollParameters({
+            y: y,
+            height: height,
+            totalLayerHeight: totalLayerHeight
+        }), calculatedHeight = _calculateVerticalScrollParameters.height, top = _calculateVerticalScrollParameters.top;
+        return {
+            height: calculatedHeight,
+            top: top
+        };
+    };
+    return /*#__PURE__*/ jsxs("div", {
+        className: "canvas-scrollbars",
+        children: [
+            /*#__PURE__*/ jsx("div", {
+                className: "scrollbar-wrapper scrollbar-wrapper-horizontal",
+                children: isMobileView && /*#__PURE__*/ jsx("div", {
+                    className: "scroll-element horizontal-scroll",
+                    onPointerDown: onDragX,
+                    style: horizontalScrollbarStyles()
+                })
+            }),
+            /*#__PURE__*/ jsx("div", {
+                className: "scrollbar-wrapper scrollbar-wrapper-vertical",
+                children: isMobileView && /*#__PURE__*/ jsx("div", {
+                    className: "scroll-element vertical-scroll",
+                    onPointerDown: onDragY,
+                    style: verticalScrollbarStyles()
+                })
+            })
+        ]
+    });
+};
+
+export { Scrollbars };

package/dist/events/event-venue-map/components/Scrollbars/index.d.ts

@@ -1,2 +1,2 @@
-export { Scrollbars } from "./Scrollbars";
+export { Scrollbars } from "./Scrollbars";
 //# sourceMappingURL=index.d.ts.map

package/dist/events/event-venue-map/components/VenueMap/VenueMap.d.ts

@@ -1,17 +1,16 @@
-import React from "react";
-import { EventVenueMapContextProps } from "@licklist/plugins/dist/context/event/EventVenueMapContext";
-import { QuantityCheckProductInfo } from "@licklist/plugins/dist/types/Api/verifyStock";
-export type VenueMapRef = Pick<EventVenueMapContextProps, "activeElementKey" | "setActiveElementKey">;
-export type VenueMapProps = {
-    url: string;
-    name: string;
-    width: number;
-    height: number;
-    onPointClick?: (pointId?: number) => void;
-    usedInIframe?: boolean;
-    choosedProductUuids?: string[];
-    errorOnChoosedProductUuids?: string[];
-    soldOutProducts?: QuantityCheckProductInfo[];
-};
-export declare const VenueMap: React.ForwardRefExoticComponent<VenueMapProps & React.RefAttributes<VenueMapRef>>;
+import { EventVenueMapContextProps } from "@licklist/plugins/dist/context/event/EventVenueMapContext";
+import { QuantityCheckProductInfo } from "@licklist/plugins/dist/types/Api/verifyStock";
+export type VenueMapRef = Pick<EventVenueMapContextProps, "activeElementKey" | "setActiveElementKey">;
+export type VenueMapProps = {
+    url: string;
+    name: string;
+    width: number;
+    height: number;
+    onPointClick?: (pointId?: number) => void;
+    usedInIframe?: boolean;
+    choosedProductUuids?: string[];
+    errorOnChoosedProductUuids?: string[];
+    soldOutProducts?: QuantityCheckProductInfo[];
+};
+export declare const VenueMap: import("react").ForwardRefExoticComponent<VenueMapProps & import("react").RefAttributes<VenueMapRef>>;
 //# sourceMappingURL=VenueMap.d.ts.map

package/dist/events/event-venue-map/components/VenueMap/VenueMap.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VenueMap.d.ts","sourceRoot":"","sources":["../../../../../src/events/event-venue-map/components/VenueMap/VenueMap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAGf,OAAO,EAEL,yBAAyB,EAC1B,MAAM,2DAA2D,CAAC;AACnE,OAAO,EAAE,wBAAwB,EAAE,MAAM,8CAA8C,CAAC;AAQxF,MAAM,MAAM,WAAW,GAAG,IAAI,CAC5B,yBAAyB,EACzB,kBAAkB,GAAG,qBAAqB,CAC3C,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC/B,0BAA0B,CAAC,EAAE,MAAM,EAAE,CAAC;IACtC,eAAe,CAAC,EAAE,wBAAwB,EAAE,CAAC;CAC9C,CAAC;AAEF,eAAO,MAAM,QAAQ,mFAiKpB,CAAC"}
+{"version":3,"file":"VenueMap.d.ts","sourceRoot":"","sources":["../../../../../src/events/event-venue-map/components/VenueMap/VenueMap.tsx"],"names":[],"mappings":"AASA,OAAO,EAEL,yBAAyB,EAC1B,MAAM,2DAA2D,CAAC;AACnE,OAAO,EAAE,wBAAwB,EAAE,MAAM,8CAA8C,CAAC;AAQxF,MAAM,MAAM,WAAW,GAAG,IAAI,CAC5B,yBAAyB,EACzB,kBAAkB,GAAG,qBAAqB,CAC3C,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC/B,0BAA0B,CAAC,EAAE,MAAM,EAAE,CAAC;IACtC,eAAe,CAAC,EAAE,wBAAwB,EAAE,CAAC;CAC9C,CAAC;AAEF,eAAO,MAAM,QAAQ,uGAiKpB,CAAC"}