@ludo.ninja/components 2.3.52 → 2.3.54

package/build/components/search/searchSuggestions/index.js

@@ -81,7 +81,7 @@ const SearchSuggestions = ({ searchTerm, assets = [], profiles = [], collections
                                                 caption: "Projects",
                                                 children: projects.map((project) => ((0, jsx_runtime_1.jsx)(searchSuggestionsItem_1.default, { name: project?.name, link: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["welcome"]}/x/${project?.slug}`, 
                                                     // imgUrl={`${staticLink}/public/noContent/noContent.svg`}
-                                                    searchTerm: searchTerm }, `${project?.id}.${Math.random()}`))),
+                                                    searchTerm: searchTerm, projectRank: project?.ludoRank }, `${project?.id}.${Math.random()}`))),
                                             },
                                         ]
                                         : []),

package/build/components/search/searchSuggestions/searchSuggestionsItem/index.d.ts

@@ -7,6 +7,7 @@ interface Props {
     additionalHTML?: React.ReactNode;
     afterText?: React.ReactNode;
     searchTerm?: string;
+    projectRank?: number | null;
 }
 declare const SearchSuggestionsItem: React.FC<Props>;
 export default SearchSuggestionsItem;

package/build/components/search/searchSuggestions/searchSuggestionsItem/index.js

@@ -11,6 +11,7 @@ const ScreenWidth_1 = require("../../../../styles/ScreenWidth");
 const colors_1 = require("../../../../styles/colors");
 const typography_1 = require("../../../../styles/typography");
 const ImageInterceptor_1 = require("../../../../system/Img/ImageInterceptor");
+const ui_1 = require("@ludo.ninja/ui");
 // Styles
 const StyledSearchSuggestionsItem = styled_components_1.default.div `
   user-select: none;
@@ -41,6 +42,12 @@ const StyledSearchSuggestionsItem = styled_components_1.default.div `
       color: ${colors_1.TextDarkGrayColor};
       margin-left: auto;
     }
+      
+    .ludo-rank {
+      color: ${colors_1.TextGrayColor};
+      flex-grow: 1;
+      text-align: end;
+    }
 
     .text {
       display: flex;
@@ -119,10 +126,10 @@ const StyledSearchSuggestionsItem = styled_components_1.default.div `
   }
 `;
 // Components
-const SearchSuggestionsItem = ({ name, link, imgUrl, borderRadius, additionalHTML, searchTerm, afterText }) => ((0, jsx_runtime_1.jsx)(StyledSearchSuggestionsItem, { borderRadius: borderRadius, children: (0, jsx_runtime_1.jsxs)("a", { href: link, className: 'link', children: [Boolean(imgUrl) && ((0, jsx_runtime_1.jsx)(ImageInterceptor_1.ImageInterceptor, { borderRadiusSkeleton: borderRadius && 16, children: (0, jsx_runtime_1.jsx)("img", { src: imgUrl, alt: 'pirate', width: 32, height: 32 }) })), (0, jsx_runtime_1.jsxs)("div", { className: 'text', children: [(0, jsx_runtime_1.jsx)("p", { className: 'regular', children: (0, utils_1.searchQueryLetters)({
+const SearchSuggestionsItem = ({ name, link, imgUrl, borderRadius, additionalHTML, searchTerm, projectRank, afterText }) => ((0, jsx_runtime_1.jsx)(StyledSearchSuggestionsItem, { borderRadius: borderRadius, children: (0, jsx_runtime_1.jsxs)("a", { href: link, className: 'link', children: [Boolean(imgUrl) && ((0, jsx_runtime_1.jsx)(ImageInterceptor_1.ImageInterceptor, { borderRadiusSkeleton: borderRadius && 16, children: (0, jsx_runtime_1.jsx)("img", { src: imgUrl, alt: 'pirate', width: 32, height: 32 }) })), (0, jsx_runtime_1.jsxs)("div", { className: 'text', children: [(0, jsx_runtime_1.jsx)("p", { className: 'regular', children: (0, utils_1.searchQueryLetters)({
                             text: name,
                             searchQuery: searchTerm,
                             className: 'strong',
-                        }) }), afterText] }), additionalHTML] }) }));
+                        }) }), afterText] }), (0, jsx_runtime_1.jsx)(ui_1.H5, { className: 'ludo-rank', children: projectRank ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["LR ", (0, jsx_runtime_1.jsx)("span", { style: { color: (0, utils_1.getRankColor)(projectRank), fontWeight: 700 }, children: projectRank })] })) : ((0, jsx_runtime_1.jsx)("span", { style: { color: colors_1.ErrorColor }, children: "Rugged" })) }), additionalHTML] }) }));
 // Export
 exports.default = SearchSuggestionsItem;

package/build/system/Overlay/index.js

@@ -4,6 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const styled_components_1 = __importDefault(require("styled-components"));
 const ui_1 = require("../../store/ui");
 const colors_1 = require("../../styles/colors");
@@ -35,6 +36,17 @@ const Overlay = () => {
         closeOverlay: state.closeOverlay,
         isOverlayActive: state.isOverlayActive,
     }));
+    (0, react_1.useEffect)(() => {
+        const handleEsc = (event) => {
+            if (event.key === 'Escape') {
+                closeOverlay();
+            }
+        };
+        window.addEventListener('keydown', handleEsc);
+        return () => {
+            window.removeEventListener('keydown', handleEsc);
+        };
+    }, []);
     return ((0, jsx_runtime_1.jsx)(StyledOverlay, { isActive: isOverlayActive, onClick: closeOverlay, children: (0, jsx_runtime_1.jsx)("div", { className: 'blur' }) }));
 };
 // Export

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ludo.ninja/components",
-  "version": "2.3.52",
+  "version": "2.3.54",
   "private": false,
   "main": "build/index.js",
   "types": "build/index.d.ts",