@admin-layout/tailwind-design-pro 10.0.9-alpha.25 → 10.0.9-alpha.26

package/lib/components/UI/LazyLoadingGoogleMarker.js

@@ -0,0 +1,107 @@
+import {jsx,jsxs}from'react/jsx-runtime';import React__default,{useState,useEffect}from'react';import {PropertyCardOnMap}from'./PropertyCardOnMap.js';import ReactDOMServer from'react-dom/server';import*as path from'@pubngo-stack/icons/lib/rifi-maps/index.js';import*as airbnbPath from'@pubngo-stack/icons/lib/airbnb/airbnbIcons-maps/index.js';import {AdvancedMarker}from'@vis.gl/react-google-maps';const getSvgMapIcon = (types, propertyTypes) => {
+  if (!types || types.length === 0) {
+    return 'data:image/svg+xml;charset=UTF-8,';
+  }
+  const icon = propertyTypes.find(item => item.id === types[0])?.icon || '';
+  return types.length > 1 ? `${icon}MultiType` : icon;
+};
+const pricesMarker = (price, isHighlighted) => {
+  const backgroundColor = isHighlighted ? 'rgb(0, 0, 0)' : 'rgb(255,255,255)';
+  const textColor = isHighlighted ? 'rgb(255, 255, 255)' : 'rgb(0, 0, 0)';
+  const borderRadius = isHighlighted ? '20' : '15';
+  const svgString = `<svg width="84" height="55" viewBox="0 0 84 55" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <g filter="url(#filter0_dd_7163_1572)">
+            <path fill-rule="evenodd" clip-rule="evenodd" d="M25 1C13.9543 1 5 9.95431 5 21C5 32.0457 13.9543 41 25 41H39.2222L42 46L44.7778 41H59C70.0457 41 79 32.0457 79 21C79 9.95431 70.0457 1 59 1H25Z" fill="${backgroundColor}"/>
+        </g>
+
+
+        <text x="42" y="26" font-family="Arial" font-size="14" text-anchor="middle" font-weight="bold" fill="${textColor}">${price || ''}</text>
+        <defs>
+            <filter id="filter0_dd_7163_1572" x="0" y="0" width="84" height="55" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+                <feFlood flood-opacity="0" result="BackgroundImageFix"/>
+                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+                <feMorphology radius="${borderRadius}" operator="erode" in="SourceAlpha" result="effect1_dropShadow_7163_1572"/>
+                <feOffset dy="2"/>
+                <feGaussianBlur stdDeviation="2"/>
+                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0"/>
+                <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_7163_1572"/>
+                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+                <feMorphology radius="1" operator="erode" in="SourceAlpha" result="effect2_dropShadow_7163_1572"/>
+                <feOffset dy="4"/>
+                <feGaussianBlur stdDeviation="3"/>
+                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"/>
+                <feBlend mode="normal" in2="effect1_dropShadow_7163_1572" result="effect2_dropShadow_7163_1572"/>
+                <feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_7163_1572" result="shape"/>
+            </filter>
+        </defs>
+    </svg>`;
+  return 'data:image/svg+xml;charset=UTF-8,' + encodeURIComponent(svgString);
+};
+const svgToMarkerIcon = async (types, isHighlighted, propertyTypes) => {
+  const resultantIcon = getSvgMapIcon(types, propertyTypes);
+  let iconPath = resultantIcon.toLowerCase().startsWith('airbnb') ? isHighlighted ? airbnbPath[`${resultantIcon}Dark`] : airbnbPath[`${resultantIcon}Light`] : isHighlighted ? path[`${resultantIcon}Dark`] : path[`${resultantIcon}Light`];
+  // New logic to handle the case when iconPath is not found
+  if (!iconPath) {
+    iconPath = isHighlighted ? airbnbPath['AirbnbApartmentDark'] : airbnbPath['AirbnbApartmentLight'];
+  }
+  if (typeof iconPath !== 'function') return 'data:image/svg+xml;charset=UTF-8,' + encodeURIComponent(iconPath);
+  const svg = ReactDOMServer.renderToString(iconPath({
+    width: '50px',
+    height: '50px'
+  }));
+  return 'data:image/svg+xml;charset=UTF-8,' + encodeURIComponent(svg);
+};
+const getMapMarkerIcons = async (room, showPrices, isHighlighted, propertyTypes) => {
+  return showPrices ? pricesMarker(room?.preferences?.property?.pricing?.price?.price_breakdown?.details?.summary?.totalBeforeDiscount, isHighlighted) : await svgToMarkerIcon(room.types, isHighlighted, propertyTypes);
+};
+const MarkerImage = React__default.memo(({
+  src,
+  showPrices
+}) => jsx("img", {
+  src: src,
+  alt: "Property Marker",
+  className: showPrices ? 'w-[84px] h-[40px]' : 'w-[90px] h-[60px]'
+}));
+const LazyLoadingGoogleMarker = props => {
+  const {
+    property,
+    isHighlighted,
+    showPrices,
+    isActiveMarker,
+    onInfoBoxClose,
+    onMarkerClick,
+    propertyTypes
+  } = props;
+  const [mapIcon, setMapIcon] = useState('');
+  useEffect(() => {
+    (async () => {
+      const icon = await getMapMarkerIcons(property, showPrices, isHighlighted, propertyTypes);
+      setMapIcon(icon);
+    })();
+  }, [isHighlighted, showPrices]);
+  if (!property) {
+    return;
+  }
+  return jsx(AdvancedMarker, {
+    position: {
+      lat: property.address.latitude_around,
+      lng: property.address.longitude_around
+    },
+    title: property.name,
+    onClick: onMarkerClick,
+    zIndex: isHighlighted ? 999 : 1,
+    children: jsxs("div", {
+      className: "relative cursor-pointer transform -translate-x-1/2 -translate-y-1/2",
+      children: [mapIcon && jsx(MarkerImage, {
+        src: mapIcon,
+        showPrices: showPrices
+      }), isActiveMarker && jsx("div", {
+        className: "absolute bottom-0 left-1/2 transform -translate-x-1/2 bg-white p-2.5 rounded-2xl z-[1000] w-[300px] shadow-[0_12px_24px_0_rgba(0,0,0,0.1),_0_2px_8px_0_rgba(0,0,0,0.05)]",
+        children: jsx(PropertyCardOnMap, {
+          room: property,
+          isSaved: false
+        })
+      })]
+    })
+  });
+};export{LazyLoadingGoogleMarker};//# sourceMappingURL=LazyLoadingGoogleMarker.js.map

package/lib/components/UI/LazyLoadingGoogleMarker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LazyLoadingGoogleMarker.js","sources":["../../../src/components/UI/LazyLoadingGoogleMarker.tsx"],"sourcesContent":[null],"names":["React","_jsx"],"mappings":"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"}

package/lib/components/UI/PropertyCardOnMap.js

@@ -0,0 +1,108 @@
+import {jsxs,jsx}from'react/jsx-runtime';import {useMemo,useState,useEffect}from'react';import {useTranslation}from'react-i18next';import {Link}from'@remix-run/react';import {BsStarFill}from'@react-icons/all-files/bs/BsStarFill.js';import {Splide,SplideSlide}from'@cdmbase/react-splide';import {useLayoutSettings}from'@admin-layout/client';const PropertyCardOnMap = ({
+  room,
+  isSaved,
+  sliderOptions = {},
+  className = '',
+  ...props
+}) => {
+  const images = useMemo(() => room?.images?.data.map(({
+    url
+  }) => ({
+    src: url
+  })), [room]);
+  const {
+    t
+  } = useTranslation();
+  const {
+    settings
+  } = useLayoutSettings();
+  const [star, setStar] = useState(0);
+  useEffect(() => {
+    let temp = room?.totalReview == 0 ? 0 : room?.totalStar / room?.totalReview;
+    setStar(temp);
+  }, [room?.totalReview, room?.totalStar]);
+  // const { color, grayColor } = useColorTheme();
+  return jsxs("div", {
+    className: `flex flex-col flex-wrap mt-4 ${className}`,
+    children: [jsx("div", {
+      className: "w-full",
+      children: jsxs(Splide, {
+        "aria-label": t('property.property_images'),
+        options: {
+          type: 'loop',
+          drag: 'free',
+          height: '230px',
+          perPage: 1,
+          perMove: 1,
+          wheel: true,
+          releaseWheel: true,
+          pagination: false,
+          speed: 500,
+          ...sliderOptions
+        },
+        children: [images && images.length == 0 && jsx(SplideSlide, {
+          children: jsx("div", {
+            className: "w-full h-full",
+            children: jsx("img", {
+              src: room.thumbnailUrl,
+              className: "w-full h-full object-cover cursor-pointer transition-all duration-500 hover:brightness-50",
+              loading: "lazy",
+              alt: room.title || 'Property'
+            })
+          })
+        }), images.map((image, i) => {
+          return jsx(SplideSlide, {
+            children: jsx(Link, {
+              to: '/property/' + room.id,
+              className: "w-full",
+              children: jsx("div", {
+                className: "w-full h-full",
+                children: jsx("img", {
+                  src: image.src,
+                  className: "w-full h-full object-cover cursor-pointer transition-all duration-500 hover:brightness-50",
+                  loading: "lazy",
+                  alt: room.title || 'Property'
+                })
+              })
+            })
+          }, 'sliderImage1_' + i);
+        })]
+      })
+    }), jsxs("div", {
+      className: "w-full flex flex-col mt-2",
+      children: [jsx("div", {
+        className: "font-semibold text-sm",
+        style: {
+          color: settings?.primaryColor
+        },
+        children: room?.title
+      }), jsxs("div", {
+        className: "flex flex-row justify-between",
+        children: [jsxs("div", {
+          className: "flex flex-col",
+          children: [jsx("div", {
+            className: "mt-1 flex text-[9px] font-semibold",
+            style: {
+              color: settings?.primaryColor
+            },
+            children: room?.address && room?.address.city && room?.address.city.state ? room?.address.city.name + ', ' + room?.address.city.state.name : ''
+          }), jsxs("div", {
+            className: "flex items-center",
+            children: [jsx(BsStarFill, {
+              className: "text-yellow-500 w-3 h-3 mr-1"
+            }), jsxs("span", {
+              className: "text-[0.832rem] font-bold",
+              style: {
+                color: settings?.secondaryColor
+              },
+              children: [room?.reviewsOverview ? room.reviewsOverview.rating : 0, " (", room.reviewsOverview ? room.reviewsOverview.ratingCount : 0, " ", t('property.reviews'), ")"]
+            })]
+          })]
+        }), jsx("div", {
+          className: "text-lg font-bold mt-auto mb-[-2px]",
+          children: room.preferences?.property?.pricing?.price?.price_breakdown?.details?.pricing?.finalPrice?.total
+        })]
+      })]
+    })]
+  });
+};export{PropertyCardOnMap};//# sourceMappingURL=PropertyCardOnMap.js.map

package/lib/components/UI/PropertyCardOnMap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropertyCardOnMap.js","sources":["../../../src/components/UI/PropertyCardOnMap.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":"0VAkBa,iBAAiB,GAAG,CAAC;AAO9B,EAAA,IAAA;AACA,EAAA,OAAA;AACA,EAAA,aAAgB,GAAA,EAAA;WAET,GAAI,EAAA;KACF;;QAEL,MAAO,GAAK,OAAE,CAAA,MAAA,IAAA,EAAA,MAAA,EAAA,IAAA,CAAA,GAAA,CAAA,CAAA;IAClB;SAEgD;IAEhD,GAAO,EAAA;AAMa,GAAA,CAAA,CAAA,EAAA,CAAA,IAAA,CAAA,CAAA;AACA,EAAA,MAAA;AACA,IAAA;AACA,GAAA,GAAA,cAAA,EAAA;AACA,EAAA,MAAA;AACA,IAAA;AACA,GAAA,GAAA,iBAAA,EAAA;AACA,EAAA,MAAA,CAAA,IAAA,EAAA,OAAA,CAAA,GAAA,QAAU,EAAE,CAAK;AACjB,EAAA,SAAA,CAAA,MAAA;AACA,IAAA,IAAA,IAAA,GAAA,IAAA,EAAA,WAAgB,IAAA,CAAA,GAAA,CAAA,GAAA,IAAA,EAAA,SAAA,GAAA,IAAA,EAAA,WAAA;;6BAgBT,EAAA,SACF,CAAA,CAAA;AAaT;AAWY,EAAA,OAAAA,IAAA,CAAA,KAAA,EAAA;6CACC;AAaD,IAAA,QAAA,EAAA,CAAAC,GAAA,CAAA,KAAA,EAAA;AAOhC,MAAE,SAAA,EAAA,QAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/UI/index.d.ts

@@ -1,2 +1,4 @@
 export * from './CategoriesTypeList';
+export * from './PropertyCardOnMap';
+export * from './LazyLoadingGoogleMarker';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/UI/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/UI/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/UI/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,2BAA2B,CAAC"}

package/lib/components/index.js

@@ -1 +1 @@
-export{CategoriesTypeList}from'./UI/CategoriesTypeList.js';export{MainHeader,defaultRenderLogo,defaultRenderLogoAndTitle}from'./Layout/GlobalHeader/MainHeader.js';export{Logo}from'./Layout/GlobalHeader/Logo.js';export{RightMenu}from'./Layout/GlobalHeader/RightMenu.js';export{ThemeContext,ThemeProvider,useTheme}from'./ThemeProvider/ThemeProvider.js';export{ThemeToggle}from'./ThemeProvider/ThemeToggle.js';export{applyTheme,generateColorPalette,hslToHex}from'./ThemeProvider/themeUtils.js';export{themeRegistry}from'./ThemeProvider/themeRegistry.js';//# sourceMappingURL=index.js.map
+export{CategoriesTypeList}from'./UI/CategoriesTypeList.js';export{PropertyCardOnMap}from'./UI/PropertyCardOnMap.js';export{LazyLoadingGoogleMarker}from'./UI/LazyLoadingGoogleMarker.js';export{MainHeader,defaultRenderLogo,defaultRenderLogoAndTitle}from'./Layout/GlobalHeader/MainHeader.js';export{Logo}from'./Layout/GlobalHeader/Logo.js';export{RightMenu}from'./Layout/GlobalHeader/RightMenu.js';export{ThemeContext,ThemeProvider,useTheme}from'./ThemeProvider/ThemeProvider.js';export{ThemeToggle}from'./ThemeProvider/ThemeToggle.js';export{applyTheme,generateColorPalette,hslToHex}from'./ThemeProvider/themeUtils.js';export{themeRegistry}from'./ThemeProvider/themeRegistry.js';//# sourceMappingURL=index.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@admin-layout/tailwind-design-pro",
-    "version": "10.0.9-alpha.25",
+    "version": "10.0.9-alpha.26",
     "description": "Sample core for higher packages to depend on",
     "license": "ISC",
     "author": "CDMBase LLC",
@@ -58,7 +58,7 @@
             }
         }
     },
-    "gitHead": "a1a2257fd1abb615fa04e46ebb3b266c517c2107",
+    "gitHead": "e7dc256d48c03cb457c180d0313038e135134fd9",
     "typescript": {
         "definition": "lib/index.d.ts"
     }