pixelize-design-library 2.2.90 → 2.2.91

package/dist/index.d.ts

@@ -59,6 +59,5 @@ import PaymentCard from "./Components/Card/PaymentCard/PaymentCard";
 import ApexLineChart from "./Components/Apexcharts/ApexLineChart/ApexLineChart";
 import Notification from "./Components/Notification/Notification";
 import DatePicker from "./Components/DatePicker/ThemeDatePicker";
-import ShopMap from "./Components/Map/ShopMap";
-export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexPolarChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, ContactForm, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, FileUpload, FileUploader, FormWrapper, Header, HeaderActions, InputTextArea, InputSwitch, KanbanBoard, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, Notification, NoteTextArea, MultiSelect, NumberInput, PaymentCard, PhoneNumberInput, PinInput, ProductCard, ProductDetails, ProfileCard, ProfileCardHeader, ProfileCardBody, ProfileCardFooter, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Reorder, Search, Select, SearchSelect, SelectSearch, SideBar, Slider, Skeletons, ShopMap, Switch, Table, TableToggle, Tag, TextInput, Timeline, Toaster, ToolTip, useToaster, VerifyEmailOtp, useCustomTheme, ThemesList, debounce, };
+export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexPolarChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, ContactForm, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, FileUpload, FileUploader, FormWrapper, Header, HeaderActions, InputTextArea, InputSwitch, KanbanBoard, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, Notification, NoteTextArea, MultiSelect, NumberInput, PaymentCard, PhoneNumberInput, PinInput, ProductCard, ProductDetails, ProfileCard, ProfileCardHeader, ProfileCardBody, ProfileCardFooter, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Reorder, Search, Select, SearchSelect, SelectSearch, SideBar, Slider, Skeletons, Switch, Table, TableToggle, Tag, TextInput, Timeline, Toaster, ToolTip, useToaster, VerifyEmailOtp, useCustomTheme, ThemesList, debounce, };
 export default withTheme;

package/dist/index.js

@@ -28,7 +28,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RadioButtonGroup = exports.RadioButton = exports.ProgressBar = exports.ProfilePhotoViewer = exports.ProfileCardFooter = exports.ProfileCardBody = exports.ProfileCardHeader = exports.ProfileCard = exports.ProductDetails = exports.ProductCard = exports.PinInput = exports.PhoneNumberInput = exports.PaymentCard = exports.NumberInput = exports.MultiSelect = exports.NoteTextArea = exports.Notification = exports.NavigationBar = exports.ModalFooter = exports.ModalBody = exports.ModalHeader = exports.Modal = exports.Loading = exports.KanbanBoard = exports.InputSwitch = exports.InputTextArea = exports.HeaderActions = exports.Header = exports.FormWrapper = exports.FileUploader = exports.FileUpload = exports.Editor = exports.Dropdown = exports.DrawerFooter = exports.DrawerBody = exports.DrawerHeader = exports.Drawer = exports.DatePicker = exports.ContactForm = exports.Checkbox = exports.Card = exports.ButtonGroupIcon = exports.Button = exports.Breadcrumbs = exports.ApexLineChart = exports.ApexPolarChart = exports.ApexPieChart = exports.ApexBarChart = exports.AlertDialog = exports.Accordian = void 0;
-exports.debounce = exports.ThemesList = exports.useCustomTheme = exports.VerifyEmailOtp = exports.useToaster = exports.ToolTip = exports.Toaster = exports.Timeline = exports.TextInput = exports.Tag = exports.TableToggle = exports.Table = exports.Switch = exports.ShopMap = exports.Skeletons = exports.Slider = exports.SideBar = exports.SelectSearch = exports.SearchSelect = exports.Select = exports.Search = exports.Reorder = void 0;
+exports.debounce = exports.ThemesList = exports.useCustomTheme = exports.VerifyEmailOtp = exports.useToaster = exports.ToolTip = exports.Toaster = exports.Timeline = exports.TextInput = exports.Tag = exports.TableToggle = exports.Table = exports.Switch = exports.Skeletons = exports.Slider = exports.SideBar = exports.SelectSearch = exports.SearchSelect = exports.Select = exports.Search = exports.Reorder = void 0;
 var Accordion_1 = __importDefault(require("./Components/Accordion/Accordion"));
 exports.Accordian = Accordion_1.default;
 var AlertDialog_1 = __importDefault(require("./Components/AlertDialog/AlertDialog"));
@@ -162,6 +162,4 @@ var Notification_1 = __importDefault(require("./Components/Notification/Notifica
 exports.Notification = Notification_1.default;
 var ThemeDatePicker_1 = __importDefault(require("./Components/DatePicker/ThemeDatePicker"));
 exports.DatePicker = ThemeDatePicker_1.default;
-var ShopMap_1 = __importDefault(require("./Components/Map/ShopMap"));
-exports.ShopMap = ShopMap_1.default;
 exports.default = withTheme_1.default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixelize-design-library",
-  "version": "2.2.90",
+  "version": "2.2.91",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -10,8 +10,6 @@
     "@hello-pangea/dnd": "^18.0.1",
     "framer-motion": "^11.2.2",
     "jodit-react": "^5.2.38",
-    "leaflet": "^1.9.4",
-    "leaflet-routing-machine": "^3.2.12",
     "lucide-react": "^0.487.0",
     "react": "^18.3.1",
     "react-apexcharts": "^1.4.1",

package/dist/Components/Map/ShopMap.d.ts

@@ -1,22 +0,0 @@
-import React from "react";
-import "leaflet-routing-machine";
-export type ShopLocation = {
-    id: string | number;
-    name: string;
-    lat: number;
-    lng: number;
-    address?: string;
-};
-export type ShopMapProps = {
-    shops: ShopLocation[];
-    selectedShopId?: string | number;
-    userLocation?: {
-        lat: number;
-        lng: number;
-    };
-    height?: string | number;
-    onSelectShop?: (shop: ShopLocation) => void;
-    navigateToShopId?: string | number;
-};
-declare const ShopMap: React.FC<ShopMapProps>;
-export default ShopMap;

package/dist/Components/Map/ShopMap.js

@@ -1,205 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var leaflet_1 = __importDefault(require("leaflet"));
-require("leaflet-routing-machine");
-var tileUrl = "https://tile.openstreetmap.org/{z}/{x}/{y}.png";
-function directionsUrl(dest, origin) {
-    var base = "https://www.google.com/maps/dir/?api=1";
-    var destination = "destination=".concat(dest.lat, ",").concat(dest.lng);
-    var o = origin ? "&origin=".concat(origin.lat, ",").concat(origin.lng) : "";
-    return "".concat(base, "&").concat(destination).concat(o);
-}
-var ShopMap = function (_a) {
-    var shops = _a.shops, selectedShopId = _a.selectedShopId, userLocation = _a.userLocation, _b = _a.height, height = _b === void 0 ? 360 : _b, onSelectShop = _a.onSelectShop, navigateToShopId = _a.navigateToShopId;
-    var mapElRef = (0, react_1.useRef)(null);
-    var mapRef = (0, react_1.useRef)(null);
-    var markersRef = (0, react_1.useRef)(new Map());
-    var routeLayerRef = (0, react_1.useRef)(null);
-    var routingControlRef = (0, react_1.useRef)(null);
-    var internalOriginRef = (0, react_1.useRef)(null);
-    var bounds = (0, react_1.useMemo)(function () {
-        var b = leaflet_1.default.latLngBounds([]);
-        shops.forEach(function (s) { return b.extend([s.lat, s.lng]); });
-        return b;
-    }, [shops]);
-    (0, react_1.useEffect)(function () {
-        if (!mapElRef.current)
-            return;
-        if (!mapRef.current) {
-            mapRef.current = leaflet_1.default.map(mapElRef.current);
-            leaflet_1.default.tileLayer(tileUrl, {
-                attribution: "© OpenStreetMap contributors",
-            }).addTo(mapRef.current);
-        }
-        markersRef.current.forEach(function (layer) {
-            if (mapRef.current && mapRef.current.hasLayer(layer))
-                mapRef.current.removeLayer(layer);
-        });
-        markersRef.current.clear();
-        shops.forEach(function (shop) {
-            var marker = leaflet_1.default.circleMarker([shop.lat, shop.lng], {
-                radius: 7,
-                color: "#2563eb",
-                weight: 2,
-                fillColor: "#60a5fa",
-                fillOpacity: 0.8,
-            });
-            var html = "<div style=\"min-width:220px;line-height:1.4\">".concat(shop.name).concat(shop.address ? "<br/><small>".concat(shop.address, "</small>") : "", "<br/><div style=\"display:flex;gap:8px;margin-top:6px\"><button data-id=\"").concat(shop.id, "\" data-action=\"navigate\" style=\"padding:6px 10px;border-radius:6px;background:#7c3aed;color:#fff;border:none;cursor:pointer\">Navigate</button><button data-id=\"").concat(shop.id, "\" data-action=\"gmaps\" style=\"padding:6px 10px;border-radius:6px;background:#9333ea;color:#fff;border:none;cursor:pointer\">Google Maps</button></div></div>");
-            marker.bindPopup(html, { autoPan: false });
-            marker.on("click", function () { return onSelectShop && onSelectShop(shop); });
-            marker.on("popupopen", function () {
-                var _a;
-                var el = (_a = marker.getPopup()) === null || _a === void 0 ? void 0 : _a.getElement();
-                if (!el)
-                    return;
-                var navBtn = el.querySelector("button[data-id='".concat(shop.id, "'][data-action='navigate']"));
-                var gmapsBtn = el.querySelector("button[data-id='".concat(shop.id, "'][data-action='gmaps']"));
-                if (navBtn) {
-                    navBtn.addEventListener("click", function () {
-                        if (!mapRef.current)
-                            return;
-                        var proceed = function (origin) {
-                            if (routingControlRef.current) {
-                                mapRef.current.removeControl(routingControlRef.current);
-                                routingControlRef.current = null;
-                            }
-                            var dest = leaflet_1.default.latLng(shop.lat, shop.lng);
-                            var plan = leaflet_1.default.Routing.plan([origin, dest], {
-                                draggableWaypoints: false,
-                                addWaypoints: false,
-                                createMarker: function (_i, wp) { return leaflet_1.default.marker(wp.latLng, { opacity: 0, interactive: false }); },
-                            });
-                            routingControlRef.current = leaflet_1.default.Routing.control({
-                                plan: plan,
-                                router: leaflet_1.default.Routing.osrmv1({ serviceUrl: "https://router.project-osrm.org/route/v1" }),
-                                fitSelectedRoutes: true,
-                                routeWhileDragging: false,
-                                showAlternatives: false,
-                            });
-                            routingControlRef.current.addTo(mapRef.current);
-                        };
-                        var originSource = userLocation || internalOriginRef.current;
-                        if (originSource) {
-                            proceed(leaflet_1.default.latLng(originSource.lat, originSource.lng));
-                        }
-                        else if (navigator.geolocation) {
-                            navigator.geolocation.getCurrentPosition(function (pos) {
-                                internalOriginRef.current = { lat: pos.coords.latitude, lng: pos.coords.longitude };
-                                proceed(leaflet_1.default.latLng(pos.coords.latitude, pos.coords.longitude));
-                            });
-                        }
-                    });
-                }
-                if (gmapsBtn) {
-                    gmapsBtn.addEventListener("click", function () {
-                        var originSource = userLocation || internalOriginRef.current || undefined;
-                        var link = directionsUrl({ lat: shop.lat, lng: shop.lng }, originSource ? { lat: originSource.lat, lng: originSource.lng } : undefined);
-                        window.open(link, "_blank", "noopener");
-                    });
-                }
-            });
-            marker.addTo(mapRef.current);
-            markersRef.current.set(shop.id, marker);
-        });
-        if (shops.length) {
-            mapRef.current.fitBounds(bounds.pad(0.2));
-        }
-        return function () {
-            if (routingControlRef.current && mapRef.current) {
-                mapRef.current.removeControl(routingControlRef.current);
-            }
-            routingControlRef.current = null;
-            if (routeLayerRef.current && mapRef.current && mapRef.current.hasLayer(routeLayerRef.current)) {
-                mapRef.current.removeLayer(routeLayerRef.current);
-            }
-            routeLayerRef.current = null;
-            markersRef.current.clear();
-            if (mapRef.current) {
-                mapRef.current.off();
-                mapRef.current.remove();
-                mapRef.current = null;
-            }
-        };
-    }, [shops, bounds, userLocation]);
-    (0, react_1.useEffect)(function () {
-        var _a, _b;
-        if (!selectedShopId || !mapRef.current)
-            return;
-        var layer = markersRef.current.get(selectedShopId);
-        if (!layer)
-            return;
-        (_b = (_a = layer).openPopup) === null || _b === void 0 ? void 0 : _b.call(_a);
-    }, [selectedShopId]);
-    (0, react_1.useEffect)(function () {
-        var _a, _b, _c, _d;
-        if (!navigateToShopId || !mapRef.current)
-            return;
-        var layer = markersRef.current.get(navigateToShopId);
-        if (!layer)
-            return;
-        var center = (_b = (_a = layer).getLatLng) === null || _b === void 0 ? void 0 : _b.call(_a);
-        if (!center)
-            return;
-        var build = function (origin) {
-            if (routingControlRef.current) {
-                mapRef.current.removeControl(routingControlRef.current);
-                routingControlRef.current = null;
-            }
-            var plan = leaflet_1.default.Routing.plan([origin, center], {
-                draggableWaypoints: false,
-                addWaypoints: false,
-                createMarker: function (_i, wp) { return leaflet_1.default.marker(wp.latLng, { opacity: 0, interactive: false }); },
-            });
-            routingControlRef.current = leaflet_1.default.Routing.control({
-                plan: plan,
-                router: leaflet_1.default.Routing.osrmv1({ serviceUrl: "https://router.project-osrm.org/route/v1" }),
-                fitSelectedRoutes: true,
-                routeWhileDragging: false,
-                showAlternatives: false,
-            });
-            routingControlRef.current.addTo(mapRef.current);
-        };
-        var originSrc = userLocation || internalOriginRef.current;
-        if (originSrc) {
-            build(leaflet_1.default.latLng(originSrc.lat, originSrc.lng));
-        }
-        else if (navigator.geolocation) {
-            navigator.geolocation.getCurrentPosition(function (pos) {
-                internalOriginRef.current = { lat: pos.coords.latitude, lng: pos.coords.longitude };
-                build(leaflet_1.default.latLng(pos.coords.latitude, pos.coords.longitude));
-            });
-        }
-        (_d = (_c = layer).openPopup) === null || _d === void 0 ? void 0 : _d.call(_c);
-    }, [navigateToShopId, userLocation]);
-    return react_1.default.createElement(react_2.Box, { w: "100%", h: height },
-        react_1.default.createElement("div", { ref: mapElRef, style: { width: "100%", height: "100%" } }));
-};
-exports.default = ShopMap;