@wayke-se/components-react 3.0.0 → 3.1.0-beta.2

package/dist-src/components/Gallery/wrapper.js

@@ -99,6 +99,76 @@ export const SliderWrapper = styled.div `
     bottom: 0;
     left: 0;
     right: 0;
+    user-select: none;
+    touch-action: pan-y;
+    -webkit-tap-highlight-color: transparent;
+
+    .slick-list,
+    .slick-track {
+      transform: translate3d(0, 0, 0);
+    }
+  }
+
+  .slick-list {
+    position: relative;
+    display: block;
+    margin: 0;
+    padding: 0;
+    overflow: hidden;
+
+    &:focus {
+      outline: none;
+    }
+
+    &.dragging {
+      cursor: pointer;
+      cursor: hand;
+    }
+  }
+
+  .slick-track {
+    position: relative;
+    top: 0;
+    left: 0;
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+
+    &::before,
+    &::after {
+      content: '';
+      display: table;
+    }
+
+    &::after {
+      clear: both;
+    }
+  }
+
+  .slick-slide {
+    display: none;
+    float: left;
+    min-height: 1px;
+  }
+
+  .slick-loading {
+    .slick-track {
+      visibility: hidden;
+    }
+
+    img {
+      display: none;
+    }
+  }
+
+  .slick-initialized {
+    .slick-slide {
+      display: block;
+    }
+  }
+
+  .slick-slide.dragging img {
+    pointer-events: none;
   }
 
   ${(props) => props.theme.breakpoint.LtMd} {
@@ -111,7 +181,6 @@ export const SliderWrapper = styled.div `
 
     .slick-slide {
       border-right: ${size(1)} solid ${(props) => props.theme.color.bg};
-      //transform: scale(0.95);
       transform-origin: 0 50%;
       transition: transform 150ms ease;
     }

package/dist-src/components/Grid/index.js

@@ -15,13 +15,28 @@ const Grid = ({ documents, placeholderImage, hashRoute, pathRoute, onClickItem }
     }
     return (React.createElement(Wrapper, null,
         React.createElement(List, null, documents.map((document) => {
+            /*
             const _path = pathRoute?.replace(/^\/|\/$/g, '');
+  
             const prefix = _path ? `/${_path}/` : '/';
-            const pathRouteUrl = window.location.pathname === '/'
+  
+            const pathRouteUrl =
+              window.location.pathname === '/'
                 ? `${prefix}${document._id}`
                 : `${window.location.pathname}${prefix}${document._id}`;
+            */
+            /*
+            const _pathRoute = pathRoute
+              ? pathRoute.startsWith('/')
+                ? `${location.pathname}${pathRoute}/${document._id}`
+                : `${pathRoute}/${document._id}`
+              : undefined;
+  
+            console.log(_pathRoute);
+            */
+            const _pathRoute = pathRoute ? `${pathRoute}/${document._id}` : undefined;
             return (React.createElement(Item, { key: document._id },
-                React.createElement(ProductCard, { id: document._id, onClick: onClickItem, title: document.title, pathRoute: pathRoute, href: pathRoute ? pathRouteUrl : hashRoute ? `#${document._id}` : undefined, image: resolveImage(document), placeholderImage: placeholderImage, description: document.shortDescription, uspList: [
+                React.createElement(ProductCard, { id: document._id, onClick: onClickItem, title: document.title, pathRoute: pathRoute, href: _pathRoute ? _pathRoute : hashRoute ? `#${document._id}` : undefined, image: resolveImage(document), placeholderImage: placeholderImage, description: document.shortDescription, uspList: [
                         {
                             title: document.modelYear,
                         },

package/dist-src/components/ProductCard/index.js

@@ -8,9 +8,12 @@ const ProductCard = ({ id, title, href, image, pathRoute, placeholderImage, desc
     const { pushState } = usePath();
     const _onClick = useMemo(() => (onClick ? () => onClick(id) : undefined), [id]);
     const onHrefClick = useCallback((e) => {
-        if (!!pathRoute && href) {
-            e.preventDefault();
-            pushState(href);
+        if (pathRoute && href) {
+            const reg = new RegExp('^((http|https)://)|//');
+            if (!pathRoute.match(reg) && !pathRoute.startsWith(location.origin)) {
+                e.preventDefault();
+                pushState(href);
+            }
         }
     }, [id, pathRoute, href]);
     return (React.createElement(Wrapper, { onClick: _onClick },

package/dist-src/layouts/searchItem/Related.js

@@ -36,11 +36,11 @@ const Related = ({ id, hashRoute, pathRoute, onClickSearchItem }) => {
                 React.createElement(OverflowGrid, null,
                     React.createElement(OverflowGridList, null, response?.documentList.documents.map((document) => {
                         const prefix = pathRoute ? `/${pathRoute}` : '/';
-                        const r = regexPathGuid(pathRoute);
+                        const r = regexPathGuid();
                         const pathRouteUrl = window.location.pathname === '/'
                             ? `${prefix}${document._id}`
                             : r.test(`${pathRoute}${id}`)
-                                ? window.location.pathname.replace(r, `${pathRoute}${document._id}`)
+                                ? window.location.pathname.replace(r, document._id)
                                 : `${window.location.pathname}${prefix}${document._id}`;
                         return (React.createElement(OverflowGridItem, { key: document._id },
                             React.createElement(ProductCard, { id: document._id, onClick: onItemClicked, title: document.title, href: pathRoute ? pathRouteUrl : hashRoute ? `#${document._id}` : undefined, image: document.featuredImage?.files?.[0]?.url, description: document.shortDescription, uspList: [

package/dist-src/utils/regex.js

@@ -2,7 +2,7 @@ export const regexGuid = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-5][0-9a-f]{3}-[089ab][0-9a
 const regexEndGuid = /[0-9a-f]{8}-[0-9a-f]{4}-[0-5][0-9a-f]{3}-[089ab][0-9a-f]{3}-[0-9a-f]{12}$/;
 export const escapeRegExpString = (s) => s.replace(/[-[\]/{}()*+?.\\^$|]/g, '\\$&');
 export const regexPathGuid = (path) => {
-    if (!path) {
+    if (!path || path) {
         return regexEndGuid;
     }
     const r = new RegExp(`${escapeRegExpString(path)}${regexEndGuid.source}`, 'gi');

package/dist-web/index.js

@@ -1956,9 +1956,12 @@ const ProductCard = ({ id, title, href, image, pathRoute, placeholderImage, desc
     const { pushState } = usePath();
     const _onClick = useMemo(() => (onClick ? () => onClick(id) : undefined), [id]);
     const onHrefClick = useCallback((e) => {
-        if (!!pathRoute && href) {
-            e.preventDefault();
-            pushState(href);
+        if (pathRoute && href) {
+            const reg = new RegExp('^((http|https)://)|//');
+            if (!pathRoute.match(reg) && !pathRoute.startsWith(location.origin)) {
+                e.preventDefault();
+                pushState(href);
+            }
         }
     }, [id, pathRoute, href]);
     return (React__default.createElement(Wrapper$8, { onClick: _onClick },
@@ -1997,13 +2000,28 @@ const Grid = ({ documents, placeholderImage, hashRoute, pathRoute, onClickItem }
     }
     return (React__default.createElement(Wrapper$7, null,
         React__default.createElement(List$4, null, documents.map((document) => {
+            /*
             const _path = pathRoute?.replace(/^\/|\/$/g, '');
+  
             const prefix = _path ? `/${_path}/` : '/';
-            const pathRouteUrl = window.location.pathname === '/'
+  
+            const pathRouteUrl =
+              window.location.pathname === '/'
                 ? `${prefix}${document._id}`
                 : `${window.location.pathname}${prefix}${document._id}`;
+            */
+            /*
+            const _pathRoute = pathRoute
+              ? pathRoute.startsWith('/')
+                ? `${location.pathname}${pathRoute}/${document._id}`
+                : `${pathRoute}/${document._id}`
+              : undefined;
+  
+            console.log(_pathRoute);
+            */
+            const _pathRoute = pathRoute ? `${pathRoute}/${document._id}` : undefined;
             return (React__default.createElement(Item$4, { key: document._id },
-                React__default.createElement(ProductCard, { id: document._id, onClick: onClickItem, title: document.title, pathRoute: pathRoute, href: pathRoute ? pathRouteUrl : hashRoute ? `#${document._id}` : undefined, image: resolveImage(document), placeholderImage: placeholderImage, description: document.shortDescription, uspList: [
+                React__default.createElement(ProductCard, { id: document._id, onClick: onClickItem, title: document.title, pathRoute: pathRoute, href: _pathRoute ? _pathRoute : hashRoute ? `#${document._id}` : undefined, image: resolveImage(document), placeholderImage: placeholderImage, description: document.shortDescription, uspList: [
                         {
                             title: document.modelYear,
                         },
@@ -2778,6 +2796,76 @@ const SliderWrapper = styled.div `
     bottom: 0;
     left: 0;
     right: 0;
+    user-select: none;
+    touch-action: pan-y;
+    -webkit-tap-highlight-color: transparent;
+
+    .slick-list,
+    .slick-track {
+      transform: translate3d(0, 0, 0);
+    }
+  }
+
+  .slick-list {
+    position: relative;
+    display: block;
+    margin: 0;
+    padding: 0;
+    overflow: hidden;
+
+    &:focus {
+      outline: none;
+    }
+
+    &.dragging {
+      cursor: pointer;
+      cursor: hand;
+    }
+  }
+
+  .slick-track {
+    position: relative;
+    top: 0;
+    left: 0;
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+
+    &::before,
+    &::after {
+      content: '';
+      display: table;
+    }
+
+    &::after {
+      clear: both;
+    }
+  }
+
+  .slick-slide {
+    display: none;
+    float: left;
+    min-height: 1px;
+  }
+
+  .slick-loading {
+    .slick-track {
+      visibility: hidden;
+    }
+
+    img {
+      display: none;
+    }
+  }
+
+  .slick-initialized {
+    .slick-slide {
+      display: block;
+    }
+  }
+
+  .slick-slide.dragging img {
+    pointer-events: none;
   }
 
   ${(props) => props.theme.breakpoint.LtMd} {
@@ -2790,7 +2878,6 @@ const SliderWrapper = styled.div `
 
     .slick-slide {
       border-right: ${size(1)} solid ${(props) => props.theme.color.bg};
-      //transform: scale(0.95);
       transform-origin: 0 50%;
       transition: transform 150ms ease;
     }
@@ -5762,7 +5849,7 @@ const useRelatedSearch = (id) => {
 const regexEndGuid = /[0-9a-f]{8}-[0-9a-f]{4}-[0-5][0-9a-f]{3}-[089ab][0-9a-f]{3}-[0-9a-f]{12}$/;
 const escapeRegExpString = (s) => s.replace(/[-[\]/{}()*+?.\\^$|]/g, '\\$&');
 const regexPathGuid = (path) => {
-    if (!path) {
+    if (!path || path) {
         return regexEndGuid;
     }
     const r = new RegExp(`${escapeRegExpString(path)}${regexEndGuid.source}`, 'gi');
@@ -5794,11 +5881,11 @@ const Related = ({ id, hashRoute, pathRoute, onClickSearchItem }) => {
                 React__default.createElement(OverflowGrid, null,
                     React__default.createElement(OverflowGridList, null, response?.documentList.documents.map((document) => {
                         const prefix = pathRoute ? `/${pathRoute}` : '/';
-                        const r = regexPathGuid(pathRoute);
+                        const r = regexPathGuid();
                         const pathRouteUrl = window.location.pathname === '/'
                             ? `${prefix}${document._id}`
                             : r.test(`${pathRoute}${id}`)
-                                ? window.location.pathname.replace(r, `${pathRoute}${document._id}`)
+                                ? window.location.pathname.replace(r, document._id)
                                 : `${window.location.pathname}${prefix}${document._id}`;
                         return (React__default.createElement(OverflowGridItem, { key: document._id },
                             React__default.createElement(ProductCard, { id: document._id, onClick: onItemClicked, title: document.title, href: pathRoute ? pathRouteUrl : hashRoute ? `#${document._id}` : undefined, image: document.featuredImage?.files?.[0]?.url, description: document.shortDescription, uspList: [