@redocly/theme 0.6.4 → 0.7.0

package/lib/Navbar/Navbar.js

@@ -8,27 +8,30 @@ const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const Navbar_1 = require("../Navbar");
 const useMobileMenu_1 = require("../hooks/useMobileMenu");
+const utils_1 = require("../utils");
 const MobileNavbarMenuButton_1 = require("../Navbar/MobileNavbarMenuButton");
 const MobileNavbarMenu_1 = require("../Navbar/MobileNavbarMenu");
 const ColorModeSwitcher_1 = require("../ColorModeSwitcher/ColorModeSwitcher");
 const useThemeConfig_1 = require("../hooks/useThemeConfig");
 function Navbar({ menu, logo, search, profile }) {
     const [isOpen, setIsOpen] = (0, useMobileMenu_1.useMobileMenu)(false);
-    const { search: searchSettings, navbar } = (0, useThemeConfig_1.useThemeConfig)();
+    const { search: searchSettings, navbar, userProfile: userProfileSettings } = (0, useThemeConfig_1.useThemeConfig)();
     const hideSearch = (searchSettings === null || searchSettings === void 0 ? void 0 : searchSettings.hide) || ((searchSettings === null || searchSettings === void 0 ? void 0 : searchSettings.placement) && (searchSettings === null || searchSettings === void 0 ? void 0 : searchSettings.placement) !== 'navbar');
+    const hideUserProfile = userProfileSettings === null || userProfileSettings === void 0 ? void 0 : userProfileSettings.hide;
     if (navbar === null || navbar === void 0 ? void 0 : navbar.hide) {
         return null;
     }
     const openMobileMenu = () => setIsOpen(true);
     const closeMobileMenu = () => setIsOpen(false);
+    const menuItemsExist = !(0, utils_1.isPrimitive)(menu) && !(0, utils_1.isEmptyArray)(menu);
     return (react_1.default.createElement(exports.NavbarContainer, { "data-component-name": "Navbar/Navbar" },
-        react_1.default.createElement(MobileNavbarMenuButton_1.MobileNavbarMenuButton, { onClick: openMobileMenu }),
+        menuItemsExist && react_1.default.createElement(MobileNavbarMenuButton_1.MobileNavbarMenuButton, { onClick: openMobileMenu }),
         isOpen && (react_1.default.createElement(MobileNavbarMenu_1.MobileNavbarMenu, { closeMenu: closeMobileMenu, menuItems: menu, search: hideSearch ? null : search })),
         react_1.default.createElement(exports.NavbarRow, null,
             logo,
             react_1.default.createElement(Navbar_1.NavbarMenu, { menuItems: menu }),
             hideSearch ? null : search,
-            profile,
+            hideUserProfile ? null : profile,
             react_1.default.createElement(ColorModeSwitcher_1.ColorModeSwitcher, null))));
 }
 exports.Navbar = Navbar;

package/lib/Pages/Forbidden.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function Forbidden(): JSX.Element;

package/lib/Pages/Forbidden.js

@@ -0,0 +1,39 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Forbidden = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const Button_1 = require("../Button");
+function Forbidden() {
+    return (react_1.default.createElement(Wrapper, { "data-component-name": "Pages/Forbidden" },
+        react_1.default.createElement(Header, null, "403"),
+        react_1.default.createElement(Description, null, "Access forbidden"),
+        react_1.default.createElement(HomeButton, { color: "primary", size: "large", to: "/" }, "Open Homepage")));
+}
+exports.Forbidden = Forbidden;
+const Wrapper = styled_components_1.default.div `
+  margin: 25px auto;
+  font-family: var(--page-403-font-family);
+  text-align: center;
+`;
+const Header = styled_components_1.default.div `
+  color: var(--page-403-header-text-color);
+  margin: var(--page-403-header-margin);
+  font-size: var(--page-403-header-font-size);
+  line-height: var(--page-403-header-line-height);
+  font-weight: var(--page-403-header-font-weight);
+`;
+const Description = styled_components_1.default.div `
+  color: var(--page-403-description-text-color);
+  margin: var(--page-403-description-margin);
+  font-size: var(--page-403-description-font-size);
+  line-height: var(--page-403-description-line-height);
+  font-weight: var(--page-403-description-font-weight);
+`;
+const HomeButton = (0, styled_components_1.default)(Button_1.Button) `
+  margin-top: var(--page-403-button-margin);
+`;
+//# sourceMappingURL=Forbidden.js.map

package/lib/Pages/NotFound.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function NotFound(): JSX.Element;

package/lib/Pages/NotFound.js

@@ -0,0 +1,39 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NotFound = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const Button_1 = require("../Button");
+function NotFound() {
+    return (react_1.default.createElement(Wrapper, { "data-component-name": "Pages/NotFound" },
+        react_1.default.createElement(Header, null, "404"),
+        react_1.default.createElement(Description, null, "It looks like you're lost"),
+        react_1.default.createElement(HomeButton, { color: "primary", size: "large", to: "/" }, "Open Homepage")));
+}
+exports.NotFound = NotFound;
+const Wrapper = styled_components_1.default.div `
+  margin: 25px auto;
+  font-family: var(--page-404-font-family);
+  text-align: center;
+`;
+const Header = styled_components_1.default.div `
+  color: var(--page-404-header-text-color);
+  margin: var(--page-404-header-margin);
+  font-size: var(--page-404-header-font-size);
+  line-height: var(--page-404-header-line-height);
+  font-weight: var(--page-404-header-font-weight);
+`;
+const Description = styled_components_1.default.div `
+  color: var(--page-404-description-text-color);
+  margin: var(--page-404-description-margin);
+  font-size: var(--page-404-description-font-size);
+  line-height: var(--page-404-description-line-height);
+  font-weight: var(--page-404-description-font-weight);
+`;
+const HomeButton = (0, styled_components_1.default)(Button_1.Button) `
+  margin-top: var(--page-404-button-margin);
+`;
+//# sourceMappingURL=NotFound.js.map

package/lib/Pages/index.d.ts

@@ -0,0 +1 @@
+export * from '../Pages/NotFound';

package/lib/Pages/index.js

@@ -0,0 +1,18 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("../Pages/NotFound"), exports);
+//# sourceMappingURL=index.js.map

package/lib/Profile/LoginLink.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export interface LoginLinkProps {
+    href: string;
+}
+export declare function LoginLink({ href }: LoginLinkProps): JSX.Element;

package/lib/Profile/LoginLink.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LoginLink = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const useThemeConfig_1 = require("../hooks/useThemeConfig");
+function LoginLink({ href }) {
+    const { userProfile } = (0, useThemeConfig_1.useThemeConfig)();
+    return react_1.default.createElement(StyledLink, { href: href }, (userProfile === null || userProfile === void 0 ? void 0 : userProfile.loginLabel) || 'Login');
+}
+exports.LoginLink = LoginLink;
+const StyledLink = styled_components_1.default.a.attrs(() => ({
+    'data-component-name': 'Profile/LoginLink',
+})) `
+  display: inline-block;
+  color: var(--navbar-text-color);
+  text-decoration: none;
+  padding: 0 var(--navbar-item-padding-horizontal);
+  text-align: center;
+  line-height: 1;
+  font-size: var(--navbar-item-font-size);
+  font-weight: var(--navbar-item-font-weight);
+  &:hover {
+    color: var(--navbar-item-hover-text-color);
+  }
+`;
+//# sourceMappingURL=LoginLink.js.map

package/lib/Profile/Profile.js

@@ -42,7 +42,9 @@ function ProfileComponent({ name, imageUrl, onClick, color }) {
             react_1.default.createElement("span", null, avatarLetters))));
 }
 exports.Profile = (0, react_1.memo)(ProfileComponent);
-const ProfileWrapper = styled_components_1.default.div `
+const ProfileWrapper = styled_components_1.default.div.attrs(() => ({
+    'data-component-name': 'Profile/Profile',
+})) `
   display: flex;
   align-items: center;
   cursor: pointer;

package/lib/Profile/UserProfile.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+export interface UserProfileProps {
+    userInfo: {
+        isAuthenticated: boolean;
+        name: string;
+        picture: string;
+        logoutDisabled?: boolean;
+    };
+    handleLogout: (logoutRedirect?: string) => void;
+    hasDeveloperOnboarding?: boolean;
+    hasApiLogs?: boolean;
+}
+export declare function UserProfile({ userInfo, handleLogout, hasDeveloperOnboarding, hasApiLogs, }: UserProfileProps): JSX.Element;

package/lib/Profile/UserProfile.js

@@ -0,0 +1,82 @@
+"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 });
+exports.UserProfile = void 0;
+const react_1 = __importStar(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const Link_1 = require("../mocks/Link");
+const Profile_1 = require("../Profile/Profile");
+const Tooltip_1 = require("../Tooltip/Tooltip");
+const useThemeConfig_1 = require("../hooks/useThemeConfig");
+function UserProfile({ userInfo, handleLogout, hasDeveloperOnboarding = false, hasApiLogs = false, }) {
+    const [isOpened, setIsOpened] = (0, react_1.useState)(false);
+    const { userProfile: userProfileSettings } = (0, useThemeConfig_1.useThemeConfig)();
+    const logoutRedirect = (userProfileSettings === null || userProfileSettings === void 0 ? void 0 : userProfileSettings.logoutRedirect) || '/';
+    return (react_1.default.createElement(StyledTooltip, { isOpen: isOpened, withArrow: false, className: "copy-button", placement: "bottom", width: "100%", tip: react_1.default.createElement(StyledUl, null,
+            hasDeveloperOnboarding ? (react_1.default.createElement(Link_1.Link, { to: "/apps" },
+                react_1.default.createElement(StyledLi, null, "My Apps"))) : null,
+            hasApiLogs ? (react_1.default.createElement(Link_1.Link, { to: "/api-logs" },
+                react_1.default.createElement(StyledLi, null, "API logs"))) : null,
+            react_1.default.createElement(StyledLi, { onClick: () => handleLogout(logoutRedirect) }, (userProfileSettings === null || userProfileSettings === void 0 ? void 0 : userProfileSettings.logoutLabel) || 'Log out')) },
+        react_1.default.createElement(Profile_1.Profile, { name: userInfo.name, imageUrl: userInfo.picture, onClick: userInfo.logoutDisabled ? undefined : () => setIsOpened(!isOpened) })));
+}
+exports.UserProfile = UserProfile;
+const StyledTooltip = (0, styled_components_1.default)(Tooltip_1.Tooltip) `
+  > span {
+    padding: 0;
+  }
+`;
+const StyledUl = styled_components_1.default.ul `
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  text-align: left;
+  background-color: var(--search-modal-background);
+  color: var(--search-modal-text-color);
+  min-width: 100px;
+  a {
+    text-decoration: none;
+    &:hover {
+      color: inherit;
+    }
+    &:visited {
+      color: inherit;
+    }
+  }
+`;
+const StyledLi = styled_components_1.default.li `
+  cursor: pointer;
+  font-size: 16px;
+  list-style: none;
+  padding: 15px 20px;
+  transition: background-color 0.25s ease 0s;
+  &:hover {
+    background-color: rgba(0, 0, 0, 0.1);
+  }
+`;
+//# sourceMappingURL=UserProfile.js.map

package/lib/Profile/index.d.ts

@@ -1,2 +1,6 @@
 export { Profile } from './Profile';
 export type { ProfileProps } from './Profile';
+export { LoginLink } from './LoginLink';
+export type { LoginLinkProps } from './LoginLink';
+export { UserProfile } from './UserProfile';
+export type { UserProfileProps } from './UserProfile';

package/lib/Profile/index.js

@@ -1,6 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Profile = void 0;
+exports.UserProfile = exports.LoginLink = exports.Profile = void 0;
 var Profile_1 = require("./Profile");
 Object.defineProperty(exports, "Profile", { enumerable: true, get: function () { return Profile_1.Profile; } });
+var LoginLink_1 = require("./LoginLink");
+Object.defineProperty(exports, "LoginLink", { enumerable: true, get: function () { return LoginLink_1.LoginLink; } });
+var UserProfile_1 = require("./UserProfile");
+Object.defineProperty(exports, "UserProfile", { enumerable: true, get: function () { return UserProfile_1.UserProfile; } });
 //# sourceMappingURL=index.js.map

package/lib/Search/Autocomplete.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { ReactNode } from 'react';
 import type { ActiveItem } from '../mocks/types';
 interface AutocompleteProps<T> {
@@ -8,6 +9,8 @@ interface AutocompleteProps<T> {
     change(value: string): void;
     select(item: T): void;
     children?(isOpen: boolean, close: () => void): ReactNode;
+    inputRef?: React.RefObject<HTMLInputElement>;
+    keyShortcuts?: string[];
 }
-export declare function Autocomplete<T>({ placeholder, value, items, change, select, renderItem, children, }: AutocompleteProps<T>): JSX.Element;
+export declare function Autocomplete<T>({ placeholder, value, items, change, select, renderItem, children, keyShortcuts, }: AutocompleteProps<T>): JSX.Element;
 export {};

package/lib/Search/Autocomplete.js

@@ -30,12 +30,26 @@ exports.Autocomplete = void 0;
 const react_1 = __importStar(require("react"));
 const react_router_dom_1 = require("react-router-dom");
 const styled_components_1 = __importDefault(require("styled-components"));
+const hotkeys_js_1 = __importDefault(require("hotkeys-js"));
 const Input_1 = require("../Search/Input");
 const Popover_1 = require("../Search/Popover");
-function Autocomplete({ placeholder, value, items, change, select, renderItem, children, }) {
+const ShortcutKey_1 = require("../Search/ShortcutKey");
+function Autocomplete({ placeholder, value, items, change, select, renderItem, children, keyShortcuts, }) {
     const location = (0, react_router_dom_1.useLocation)();
     const [isOpen, setIsOpen] = (0, react_1.useState)(false);
     const [activeIdx, setActiveIdx] = (0, react_1.useState)(-1);
+    const refInput = (0, react_1.useRef)(null);
+    const hotkeysKeys = keyShortcuts === null || keyShortcuts === void 0 ? void 0 : keyShortcuts.join(',');
+    (0, react_1.useEffect)(() => {
+        if (hotkeysKeys) {
+            (0, hotkeys_js_1.default)(hotkeysKeys, (ev) => {
+                var _a;
+                (_a = refInput.current) === null || _a === void 0 ? void 0 : _a.focus();
+                ev.preventDefault();
+            });
+            return () => hotkeys_js_1.default.unbind(hotkeysKeys);
+        }
+    }, [hotkeysKeys]);
     const open = () => setIsOpen(true);
     const close = () => {
         setIsOpen(false);
@@ -66,6 +80,7 @@ function Autocomplete({ placeholder, value, items, change, select, renderItem, c
                 break;
             case 'Enter':
                 if (activeIdx > -1) {
+                    reset();
                     select(items[activeIdx]);
                 }
                 break;
@@ -78,9 +93,10 @@ function Autocomplete({ placeholder, value, items, change, select, renderItem, c
     (0, react_1.useEffect)(close, [location]);
     return (react_1.default.createElement(Wrapper, { "data-component-name": "Search/Autocomplete" },
         isOpen ? react_1.default.createElement(Overlay, { onClick: close }) : null,
-        react_1.default.createElement(AutocompleteBox, { onKeyDown: onKeydown },
-            react_1.default.createElement(Input_1.FormInput, { value: value, placeholder: placeholder, onChange: onChange, onFocus: open, onClick: stopPropagation }), children === null || children === void 0 ? void 0 :
+        react_1.default.createElement(AutocompleteBox, { onKeyDown: onKeydown }, children === null || children === void 0 ? void 0 :
             children(isOpen, reset),
+            react_1.default.createElement(Input_1.FormInput, { value: value, placeholder: placeholder, onChange: onChange, onFocus: open, onClick: stopPropagation, ref: refInput }),
+            !isOpen && react_1.default.createElement(ShortcutKey_1.ShortcutKey, { keyShortcuts: keyShortcuts }),
             isOpen && value ? (react_1.default.createElement(Popover_1.Popover, null, items.length ? items.map(mapItem) : react_1.default.createElement(Message, null, "No results"))) : null)));
 }
 exports.Autocomplete = Autocomplete;

package/lib/Search/ClearIcon.js

@@ -15,7 +15,7 @@ exports.ClearIcon = (0, styled_components_1.default)(Icon).attrs(() => ({
   cursor: pointer;
   width: 0.5em;
   height: 0.5em;
-  right: 1.2em;
+  left: 1.2em;
   fill: var(--search-input-text-color);
 
   ${({ theme }) => theme.mediaQueries.medium} {

package/lib/Search/Input.js

@@ -8,7 +8,7 @@ const styled_components_1 = __importDefault(require("styled-components"));
 exports.FormInput = styled_components_1.default.input.attrs(() => ({
     'data-component-name': 'Search/Input',
 })) `
-  padding: 1em 2.5em 1em 1em;
+  padding: 1em 2.5em 1em 2.5em;
   background-color: var(--search-input-background-color);
   border-radius: var(--search-input-border-radius);
   border: var(--search-input-border);

package/lib/Search/Search.js

@@ -35,12 +35,17 @@ const Autocomplete_1 = require("../Search/Autocomplete");
 const ClearIcon_1 = require("../Search/ClearIcon");
 const SearchIcon_1 = require("../Search/SearchIcon");
 const SearchItem_1 = require("../Search/SearchItem");
+const hooks_1 = require("../hooks");
 function Search() {
     const history = (0, usePreloadHistory_1.usePreloadHistory)();
     const { query, setQuery, items } = (0, search_1.useFuseSearch)();
+    const themeSettings = (0, hooks_1.useThemeConfig)();
     // TODO: ask somebody about typings
     const navigate = (item) => history.push(item.url);
-    const renderAutocomplete = () => (React.createElement(Autocomplete_1.Autocomplete, { items: items, value: query, change: setQuery, select: navigate, placeholder: "Search the docs", renderItem: (item) => React.createElement(SearchItem_1.SearchItem, { key: item.id, item: item }) }, (isOpen, reset) => (isOpen ? React.createElement(ClearIcon_1.ClearIcon, { onClick: reset }) : React.createElement(SearchIcon_1.SearchIcon, null))));
+    const renderAutocomplete = () => {
+        var _a, _b;
+        return (React.createElement(Autocomplete_1.Autocomplete, { items: items, value: query, change: setQuery, select: navigate, placeholder: "Search the docs", keyShortcuts: (_b = (_a = themeSettings === null || themeSettings === void 0 ? void 0 : themeSettings.search) === null || _a === void 0 ? void 0 : _a.shortcuts) !== null && _b !== void 0 ? _b : ['/'], renderItem: (item) => React.createElement(SearchItem_1.SearchItem, { key: item.id, item: item }) }, (isOpen, reset) => (isOpen ? React.createElement(ClearIcon_1.ClearIcon, { onClick: reset }) : React.createElement(SearchIcon_1.SearchIcon, null))));
+    };
     return React.createElement(Wrapper, { "data-component-name": "Search/Search" }, renderAutocomplete());
 }
 exports.Search = Search;

package/lib/Search/SearchIcon.js

@@ -15,7 +15,7 @@ exports.SearchIcon = (0, styled_components_1.default)(Icon).attrs(() => ({
   cursor: pointer;
   width: 1em;
   height: 1em;
-  right: 1em;
+  left: 0.8em;
   fill: var(--search-input-text-color);
   z-index: -1;
 

package/lib/Search/ShortcutKey.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+interface ShortcutKeyProps {
+    keyShortcuts?: string | string[];
+}
+export declare function ShortcutKey(props: ShortcutKeyProps): JSX.Element;
+export declare const Wrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export {};

package/lib/Search/ShortcutKey.js

@@ -0,0 +1,35 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Wrapper = exports.ShortcutKey = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+function ShortcutKey(props) {
+    let mainShortcutKey = null;
+    if (props.keyShortcuts) {
+        if (Array.isArray(props.keyShortcuts)) {
+            mainShortcutKey = props.keyShortcuts[0];
+        }
+        else {
+            mainShortcutKey = props.keyShortcuts;
+        }
+    }
+    mainShortcutKey = mainShortcutKey === null || mainShortcutKey === void 0 ? void 0 : mainShortcutKey.toUpperCase();
+    return react_1.default.createElement(exports.Wrapper, null, mainShortcutKey);
+}
+exports.ShortcutKey = ShortcutKey;
+exports.Wrapper = styled_components_1.default.div `
+  position: absolute;
+  cursor: pointer;
+  font-size: 0.8em;
+  height: 2em;
+  line-height: 2em;
+  right: 1em;
+  fill: var(--search-input-text-color);
+  color: var(--search-input-placeholder-color);
+  opacity: 0.5;
+  z-index: -1;
+`;
+//# sourceMappingURL=ShortcutKey.js.map

package/lib/config.d.ts

@@ -228,16 +228,33 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
         title?: string | undefined;
         href: string;
     }>, "many">>;
+    feedback: z.ZodOptional<z.ZodDefault<z.ZodObject<z.extendShape<{
+        type: z.ZodDefault<z.ZodString>;
+        settings: z.ZodOptional<z.ZodString>;
+    }, {
+        hide: z.ZodOptional<z.ZodBoolean>;
+    }>, "strict", z.ZodTypeAny, {
+        hide?: boolean | undefined;
+        settings?: string | undefined;
+        type: string;
+    }, {
+        type?: string | undefined;
+        hide?: boolean | undefined;
+        settings?: string | undefined;
+    }>>>;
     search: z.ZodOptional<z.ZodDefault<z.ZodObject<z.extendShape<{
         placement: z.ZodOptional<z.ZodDefault<z.ZodString>>;
+        shortcuts: z.ZodOptional<z.ZodDefault<z.ZodArray<z.ZodString, "many">>>;
     }, {
         hide: z.ZodOptional<z.ZodBoolean>;
     }>, "strict", z.ZodTypeAny, {
         hide?: boolean | undefined;
         placement?: string | undefined;
+        shortcuts?: string[] | undefined;
     }, {
         hide?: boolean | undefined;
         placement?: string | undefined;
+        shortcuts?: string[] | undefined;
     }>>>;
     colorMode: z.ZodDefault<z.ZodOptional<z.ZodObject<z.extendShape<{
         ignoreDetection: z.ZodOptional<z.ZodBoolean>;
@@ -415,6 +432,23 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
     }>>>;
     openapi: z.ZodOptional<z.ZodObject<{}, "passthrough", z.ZodTypeAny, {}, {}>>;
     graphql: z.ZodOptional<z.ZodObject<{}, "passthrough", z.ZodTypeAny, {}, {}>>;
+    userProfile: z.ZodDefault<z.ZodOptional<z.ZodObject<z.extendShape<{
+        loginLabel: z.ZodOptional<z.ZodDefault<z.ZodString>>;
+        logoutLabel: z.ZodOptional<z.ZodDefault<z.ZodString>>;
+        logoutRedirect: z.ZodOptional<z.ZodDefault<z.ZodString>>;
+    }, {
+        hide: z.ZodOptional<z.ZodBoolean>;
+    }>, "strip", z.ZodTypeAny, {
+        hide?: boolean | undefined;
+        loginLabel?: string | undefined;
+        logoutLabel?: string | undefined;
+        logoutRedirect?: string | undefined;
+    }, {
+        hide?: boolean | undefined;
+        loginLabel?: string | undefined;
+        logoutLabel?: string | undefined;
+        logoutRedirect?: string | undefined;
+    }>>>;
 }, "passthrough", z.ZodTypeAny, {
     imports?: string[] | undefined;
     logo?: {
@@ -480,9 +514,15 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
         title?: string | undefined;
         href: string;
     }[] | undefined;
+    feedback?: {
+        hide?: boolean | undefined;
+        settings?: string | undefined;
+        type: string;
+    } | undefined;
     search?: {
         hide?: boolean | undefined;
         placement?: string | undefined;
+        shortcuts?: string[] | undefined;
     } | undefined;
     markdown?: {
         frontMatterKeysToResolve?: string[] | undefined;
@@ -527,6 +567,12 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
             text: string;
         };
     };
+    userProfile: {
+        hide?: boolean | undefined;
+        loginLabel?: string | undefined;
+        logoutLabel?: string | undefined;
+        logoutRedirect?: string | undefined;
+    };
 }, {
     imports?: string[] | undefined;
     logo?: {
@@ -592,9 +638,15 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
         title?: string | undefined;
         href: string;
     }[] | undefined;
+    feedback?: {
+        type?: string | undefined;
+        hide?: boolean | undefined;
+        settings?: string | undefined;
+    } | undefined;
     search?: {
         hide?: boolean | undefined;
         placement?: string | undefined;
+        shortcuts?: string[] | undefined;
     } | undefined;
     colorMode?: {
         hide?: boolean | undefined;
@@ -639,6 +691,12 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
     } | undefined;
     openapi?: {} | undefined;
     graphql?: {} | undefined;
+    userProfile?: {
+        hide?: boolean | undefined;
+        loginLabel?: string | undefined;
+        logoutLabel?: string | undefined;
+        logoutRedirect?: string | undefined;
+    } | undefined;
 }>>;
 export type ThemeConfig = z.infer<typeof ThemeConfig>;
 export type ThemeUIConfig = Omit<ThemeConfig, 'navbar' | 'footer' | 'links' | 'scripts'> & {
@@ -652,4 +710,7 @@ export type ThemeUIConfig = Omit<ThemeConfig, 'navbar' | 'footer' | 'links' | 's
         }[];
         devLogin?: boolean;
     };
+    search?: {
+        shortcuts?: string[];
+    };
 };

package/lib/config.js

@@ -74,9 +74,19 @@ exports.ThemeConfig = zod_1.z
     })
         .optional(),
     links: zod_1.z.array(LinksConfig).optional(),
+    feedback: zod_1.z
+        .object({
+        type: zod_1.z.string().default('sentiment'),
+        settings: zod_1.z.string().optional(),
+    })
+        .extend(HideConfig.shape)
+        .strict()
+        .default({})
+        .optional(),
     search: zod_1.z
         .object({
         placement: zod_1.z.string().default('navbar').optional(),
+        shortcuts: zod_1.z.array(zod_1.z.string()).default(['/']).optional(),
     })
         .extend(HideConfig.shape)
         .strict()
@@ -151,6 +161,15 @@ exports.ThemeConfig = zod_1.z
         .optional(),
     openapi: zod_1.z.object({}).passthrough().optional(),
     graphql: zod_1.z.object({}).passthrough().optional(),
+    userProfile: zod_1.z
+        .object({
+        loginLabel: zod_1.z.string().default('Login').optional(),
+        logoutLabel: zod_1.z.string().default('Logout').optional(),
+        logoutRedirect: zod_1.z.string().default('/').optional(),
+    })
+        .extend(HideConfig.shape)
+        .optional()
+        .default({}),
 })
     .passthrough()
     .default({});