@apify/docs-search-modal - npm Package Compare versions

Comparing version 1.0.9 to 1.0.10

dist/components/ApifySearch.js

@@ -35,2 +35,3 @@ var __assign = (this && this.__assign) || function () {
 import { render } from 'react-dom';
+import { FiSearch } from 'react-icons/fi';
 var collapseResults = (function () {
@@ -54,3 +55,3 @@ return {
         }
-        var search = autocomplete(__assign({ container: containerRef.current, renderer: { createElement: createElement, Fragment: Fragment, render: render }, defaultActiveItemId: 0, detachedMediaQuery: '', placeholder: 'Search Apify Docs...', getSources: function (_a) {
+        var search = autocomplete(__assign({ container: containerRef.current, renderer: { createElement: createElement, Fragment: Fragment, render: render }, defaultActiveItemId: 0, detachedMediaQuery: '', placeholder: 'Search Apify Docs...', openOnFocus: false, getSources: function (_a) {
                 var query = _a.query;
@@ -119,2 +120,16 @@ return [
             } }, props));
+        window.addEventListener('keydown', function (e) {
+            var _a, _b;
+            if (e.key === 'Escape') {
+                (_a = document.querySelector('.aa-Input')) === null || _a === void 0 ? void 0 : _a.blur();
+                search.setIsOpen(false);
+                return false;
+            }
+            if (e.ctrlKey && e.key === 'k') {
+                (_b = document.querySelector('.aa-DetachedSearchButton')) === null || _b === void 0 ? void 0 : _b.click();
+                e.preventDefault();
+                e.stopPropagation();
+                return false;
+            }
+        });
         return function () {
@@ -124,3 +139,6 @@ search.destroy();
     }, [props]);
-    return _jsx("div", { ref: containerRef });
+    return (_jsxs(_Fragment, { children: [_jsxs("button", __assign({ onClick: function () {
+                    var _a;
+                    (_a = document.querySelector('.aa-DetachedSearchButton')) === null || _a === void 0 ? void 0 : _a.click();
+                }, className: "hover:cursor-pointer md:px-2 md:pr-4 md:py-1 border-none md:border-solid border-slate-300 border-1 bg-transparent text-slate-500 dark:bg-slate-800 rounded-md flex items-center space-x-2 dark:hover:bg-slate-700 dark:text-slate-50 dark:border-slate-400" }, { children: [_jsx(FiSearch, { size: 24 }), _jsx("span", __assign({ className: 'mx-3 text-sm hidden md:block' }, { children: "Search" }))] })), _jsx("div", { className: 'hidden', ref: containerRef })] }));
 }
@@ -127,0 +145,0 @@ export function ApifySearch(_a) {

dist/components/Footer.js

@@ -17,3 +17,5 @@ var __assign = (this && this.__assign) || function () {
 export function Footer() {
-    return (_jsx("div", __assign({ className: 'hidden lg:block' }, { children: _jsx("div", __assign({ className: "flex flex-row-reverse h-16 w-full items-center px-5 shadow-inner" }, { children: _jsx("img", { style: { height: '24px' }, alt: "Apify logo", src: "https://upload.wikimedia.org/wikipedia/commons/2/28/Apify-logo.svg" }) })) })));
+    return (_jsx("div", __assign({ className: 'hidden lg:block bg-white dark:bg-slate-900' }, { children: _jsx("div", __assign({ className: "flex flex-row-reverse h-16 w-full items-center px-5 shadow-inner" }, { children: _jsx("img", { style: { height: '24px' }, alt: "Apify logo", src: document.querySelector('[data-theme="dark"') ?
+                    "https://cdn.hashnode.com/res/hashnode/image/upload/v1668430709262/I6SM9Q_Ej.png" :
+                    "https://upload.wikimedia.org/wikipedia/commons/2/28/Apify-logo.svg" }) })) })));
 }

dist/components/PreviewPanel.js

@@ -24,2 +24,4 @@ var __assign = (this && this.__assign) || function () {
 // @ts-ignore
+import darcula from 'react-syntax-highlighter/dist/esm/styles/prism/darcula';
+// @ts-ignore
 import python from 'react-syntax-highlighter/dist/esm/languages/prism/python';
@@ -62,3 +64,3 @@ // @ts-ignore
     var items = _a.items;
-    return (_jsx("ul", __assign({ className: 'pl-5' }, { children: items.map(function (item, i) { return (_jsxs("div", __assign({ style: { marginTop: '1em' } }, { children: [_jsxs("a", __assign({ href: item.href, className: "aa-ItemLink", style: { color: 'slategray' } }, { children: [i + 1, ". ", item.title] })), item.children && Toc({ items: item.children })] }), i)); }) })));
+    return (_jsx("ul", __assign({ className: 'pl-5' }, { children: items.map(function (item, i) { return (_jsxs("div", __assign({ style: { marginTop: '1em' } }, { children: [_jsxs("a", __assign({ href: item.href, className: "text-slate-500 dark:text-slate-300" }, { children: [i + 1, ". ", item.title] })), item.children && Toc({ items: item.children })] }), i)); }) })));
 }
@@ -68,3 +70,3 @@ export function PreviewPanel(_a) {
     var preview = _a.preview, components = _a.components;
-    return (_jsxs("div", __assign({ className: "h-full p-5 hidden lg:block bg-slate-50 shadow-inner overflow-y-scroll" }, { children: [_jsx(Breadcrumbs, { item: preview, highlight: components.Highlight }, "breadcrumbs"), _jsx("div", __assign({ className: 'w-full text-center text-slate-800 text-2xl p-7 font-semibold' }, { children: _jsx(components.Highlight, { hit: preview, attribute: ["name"] }) }), "title"), _jsx("div", __assign({ className: "px-6 pb-6 text-slate-600 mb-10 border-b-2 border-neutral-200 leading-6" }, { children: parseIntoBlocks(preview.content).map(function (block, i) {
+    return (_jsxs("div", __assign({ className: "h-full p-5 hidden lg:block bg-slate-50 dark:bg-slate-700 shadow-inner overflow-y-scroll" }, { children: [_jsx(Breadcrumbs, { item: preview, highlight: components.Highlight }, "breadcrumbs"), _jsx("div", __assign({ className: 'w-full text-center text-slate-800 dark:text-slate-100 text-2xl p-7 font-semibold' }, { children: _jsx(components.Highlight, { hit: preview, attribute: ["name"] }) }), "title"), _jsx("div", __assign({ className: "px-6 pb-6 text-slate-600 dark:text-slate-200 mb-10 border-none border-b-solid border-b-2 border-b-neutral-200  leading-6" }, { children: parseIntoBlocks(preview.content).map(function (block, i) {
                     if (block.type === 'text') {
@@ -74,10 +76,17 @@ return _jsx("p", __assign({ className: 'mb-3' }, { children: block.value.split('`').map(function (x, i) {
                                     return x;
-                                return _jsx("code", __assign({ className: 'bg-slate-200 px-1 py-0.5 mx-0.5 rounded' }, { children: x }), x);
+                                return _jsx("code", __assign({ className: 'bg-slate-200 dark:bg-slate-600 px-1 py-0.5 mx-0.5 rounded' }, { children: x }), x);
                             }) }), i);
                     }
                     else {
-                        return _jsx("div", __assign({ className: 'mb-3 px-3 bg-slate-100 py-3 rounded-l' }, { children: _jsx("code", __assign({ className: "select-all border-0 p-0" }, { children: _jsx(SyntaxHighlighter, __assign({ language: block.lang, style: prism, customStyle: { background: 'rgba(0,0,0,0)', 'padding': '0px', 'margin': '0px' } }, { children: block.value })) })) }), i);
+                        return _jsx("div", __assign({ className: 'mb-3 px-3 bg-slate-100 dark:bg-slate-800 py-3 rounded-l box-border' }, { children: _jsx("code", __assign({ className: "select-all border-0 p-0" }, { children: _jsx(SyntaxHighlighter, __assign({ language: block.lang, style: document.querySelector('[data-theme="dark"]') ? darcula : prism, customStyle: {
+                                        background: 'rgba(0,0,0,0)',
+                                        padding: '0px',
+                                        margin: '0px',
+                                        border: '0px',
+                                        boxShadow: 'none',
+                                        paddingBottom: '5px'
+                                    } }, { children: block.value })) })) }), i);
                     }
                 }) }), "preview"), ((_b = preview.toc) === null || _b === void 0 ? void 0 : _b.length) && preview.toc.length > 0 &&
-                (_jsxs("div", __assign({ className: 'px-6' }, { children: [_jsx("div", __assign({ className: 'text-slate-600 font-normal' }, { children: "On this page:" })), _jsx(Toc, { items: preview.toc })] }), "toc"))] })));
+                (_jsxs("div", __assign({ className: 'px-6' }, { children: [_jsx("div", __assign({ className: 'text-slate-600 dark:text-slate-200 font-normal' }, { children: "On this page:" })), _jsx(Toc, { items: preview.toc })] }), "toc"))] })));
 }

dist/components/ResultsItems.js

@@ -19,5 +19,5 @@ var __assign = (this && this.__assign) || function () {
     var _b;
-    var item = _a.item, components = _a.components;
+    var item = _a.item, components = _a.components, className = _a.className, onMouseEnter = _a.onMouseEnter;
     item = __assign(__assign({}, item), { name: getTitle(item) });
-    return (_jsx("a", __assign({ className: "aa-ItemLink", href: item.url }, { children: _jsxs("div", __assign({ className: "aa-ItemContent flex flex-row align-center" }, { children: [_jsx("div", { children: (_b = getIcon({ item: item })) === null || _b === void 0 ? void 0 : _b({ size: 24, color: 'slategray' }) }, "icon"), _jsxs("div", __assign({ className: "aa-ItemContentBody", style: { paddingLeft: '10px' } }, { children: [_jsx("div", __assign({ className: "aa-ItemContentTitle", style: { fontSize: '90%' } }, { children: _jsx(components.Highlight, { hit: item, attribute: "name" }) }), "title"), _jsx("div", __assign({ className: "aa-ItemContentDescription" }, { children: _jsx(Breadcrumbs, { item: item, highlight: components.Highlight }) }), "breadcrumbs")] }))] })) })));
+    return (_jsx("a", __assign({ className: "aa-ItemLink bg-white dark:bg-slate-800 dark:text-white ".concat(className), href: item.url, onMouseEnter: onMouseEnter }, { children: _jsxs("div", __assign({ className: "aa-ItemContent flex flex-row align-center" }, { children: [_jsx("div", { children: (_b = getIcon({ item: item })) === null || _b === void 0 ? void 0 : _b({ size: 24, color: 'slategray' }) }, "icon"), _jsxs("div", __assign({ className: "aa-ItemContentBody", style: { paddingLeft: '10px' } }, { children: [_jsx("div", __assign({ className: "aa-ItemContentTitle", style: { fontSize: '90%' } }, { children: _jsx(components.Highlight, { hit: item, attribute: "name" }) }), "title"), _jsx("div", __assign({ className: "aa-ItemContentDescription" }, { children: _jsx(Breadcrumbs, { item: item, highlight: components.Highlight }) }), "breadcrumbs")] }))] })) })));
 }
@@ -29,8 +29,8 @@ export function ResultsItems(_a) {
         return (_jsxs("div", { children: [(((_b = (_a = a === null || a === void 0 ? void 0 : a[i - 1]) === null || _a === void 0 ? void 0 : _a.hierarchy) === null || _b === void 0 ? void 0 : _b.lvl0) !== ((_c = item === null || item === void 0 ? void 0 : item.hierarchy) === null || _c === void 0 ? void 0 : _c.lvl0) &&
-                    _jsx("div", __assign({ className: 'text-white bg-slate-400 font-medium text-sm px-3 py-1' }, { children: (_d = item === null || item === void 0 ? void 0 : item.hierarchy) === null || _d === void 0 ? void 0 : _d.lvl0 }), 'heading')), _jsx("div", __assign({ className: "p-2 hover:cursor-pointer \n          ".concat(a.slice(0, i).some(function (x) { return (countFamily(x, item) === 2); }) ? 'pl-10' : 'pl-3', "\n          ").concat(state.activeItemId === i ? 'bg-slate-100' : '', "\n        "), onMouseEnter: function () {
+                    _jsx("div", __assign({ className: 'text-white bg-slate-400 dark:bg-slate-500 font-medium text-sm px-3 py-1' }, { children: (_d = item === null || item === void 0 ? void 0 : item.hierarchy) === null || _d === void 0 ? void 0 : _d.lvl0 }), 'heading')), _jsx(ResultsItem, { item: item, components: components, className: "p-2 hover:cursor-pointer \n            ".concat(a.slice(0, i).some(function (x) { return (countFamily(x, item) === 2); }) ? 'pl-10' : 'pl-3', "\n            ").concat(state.activeItemId === i ? 'dark:hover:bg-slate-700 hover:bg-slate-100' : '', "\n          "), onMouseEnter: function () {
                         var _a, _b;
                         (_b = (_a = state === null || state === void 0 ? void 0 : state.collections) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.source.onActive({ setContext: setContext, item: item });
                         setActiveItemId(i);
-                    } }, { children: _jsx(ResultsItem, { item: item, components: components }) }), item.objectID)] }, item.objectID));
+                    } }, item.objectID)] }, item.objectID));
     });
 }

package.json

 {
   "name": "@apify/docs-search-modal",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "description": "A custom implementation of the modal search for Apify Docs.",
@@ -27,3 +27,4 @@ "author": "Jindřich Bär",
     "clean": "rimraf dist",
-    "build": "yarn clean && tsc && npx tailwindcss -i ./src/index.css -o ./dist/index.css"
+    "build": "yarn clean && tsc && npx tailwindcss -i ./src/index.css -o ./dist/index.css",
+    "inject": "yarn build && cp -r ./dist ./../apify-docs/node_modules/@apify/docs-search-modal"
   },
@@ -30,0 +31,0 @@ "main": "dist/index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

41420

increased by17.97%

Lines of code

1034

increased by18.58%

No dependency changes