@jetbrains/kotlin-web-site-ui 4.2.0-alpha.3 → 4.2.0

package/out/components/header/quick-search/list/list.js

@@ -4,17 +4,19 @@ import { useTextStyles } from '@rescui/typography';
 import classNames from 'classnames';
 import { isMacOs } from '../../is-macos.js';
 import styles from './list.module.pcss.js';
+import { SearchResultView } from '../../header.js';
 
 const ResultsList = ({
   results,
   searchString,
-  toggleFullSearch
+  toggleFullSearch,
+  resultListViewType
 }) => {
   const textCn = useTextStyles();
   return React__default.createElement("div", {
-    className: styles.results,
+    className: classNames(styles.results),
     "data-test": 'quick-search-results'
-  }, results.length ? React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
+  }, results.length ? React__default.createElement(React__default.Fragment, null, resultListViewType === SearchResultView.Narrow && React__default.createElement("div", {
     className: styles.topBar
   }, React__default.createElement("div", {
     className: classNames(textCn('rs-text-3'), styles.searchString)

package/out/components/header/quick-search/quick-search.js

@@ -1,5 +1,6 @@
 import React__default from 'react';
 import { ThemeProvider } from '@rescui/ui-contexts';
+import classNames from 'classnames';
 import { ResultsList } from './list/list.js';
 import { EmptyResult } from './empty/empty.js';
 import { LoadingResults } from './loading/loading.js';
@@ -9,13 +10,18 @@ const QuickSearch = ({
   results,
   searchString,
   toggleFullSearch,
-  placeholder
+  placeholder,
+  quickSearchBoxViewType
 }) => {
+  const wrapperClassName = classNames(styles.wrapper, {
+    [styles.apiReferenceWrapper]: quickSearchBoxViewType
+  });
+
   if (placeholder) {
     return React__default.createElement(ThemeProvider, {
       theme: 'dark'
     }, React__default.createElement("div", {
-      className: styles.wrapper
+      className: wrapperClassName
     }, React__default.createElement(EmptyResult, {
       placeholder: placeholder
     })));
@@ -25,16 +31,17 @@ const QuickSearch = ({
     return React__default.createElement(ThemeProvider, {
       theme: 'dark'
     }, React__default.createElement("div", {
-      className: styles.wrapper
+      className: wrapperClassName
     }, React__default.createElement(ResultsList, {
       results: results,
       searchString: searchString,
-      toggleFullSearch: toggleFullSearch
+      toggleFullSearch: toggleFullSearch,
+      resultListViewType: quickSearchBoxViewType
     })));
   }
 
   return React__default.createElement("div", {
-    className: styles.wrapper
+    className: wrapperClassName
   }, React__default.createElement(LoadingResults, null));
 };
 

package/out/components/header/quick-search/quick-search.module.pcss.js

@@ -1,4 +1,5 @@
 var styles = {
-  "wrapper": "ktl-quick-search-module_wrapper_kkbQQ"
+  "wrapper": "ktl-quick-search-module_wrapper_kkbQQ",
+  "apiReferenceWrapper": "ktl-quick-search-module_apiReferenceWrapper_jv98t"
 };
 export { styles as default };

package/out/components/header/quick-search/result/result.js

@@ -6,7 +6,7 @@ const Result = ({
   hit
 }) => {
   const textCn = useTextStyles();
-  const hitTitle = hit.title === hit.mainTitle ? hit.highlightedTitle : `${hit.mainTitle}: ${hit.highlightedTitle}`;
+  const hitTitle = !hit.mainTitle || hit.title === hit.mainTitle ? hit.highlightedTitle : `${hit.mainTitle}: ${hit.highlightedTitle}`;
   return React__default.createElement("a", {
     className: styles.result,
     href: hit.url

package/out/components/header/search-box/search-box.js

@@ -11,13 +11,14 @@ const SearchBox = ({
   closeHandler,
   isMobile,
   fullSearchActive,
-  setFullSearchActive
+  setFullSearchActive,
+  searchBoxViewType
 }) => {
   const [searchInput, setSearchInput] = useState('');
   const {
     hits,
     placeholder
-  } = useSearch(searchInput, 25);
+  } = useSearch(searchInput, fullSearchActive ? 25 : 75);
   const escHandler = useCallback(event => {
     if (event.keyCode === ESC_CODE) {
       closeHandler();
@@ -62,7 +63,8 @@ const SearchBox = ({
     results: hits,
     searchString: searchInput,
     toggleFullSearch: toggleFullSearch,
-    placeholder: placeholder
+    placeholder: placeholder,
+    quickSearchBoxViewType: searchBoxViewType
   }), fullSearchActive && React__default.createElement(FullSearch, {
     toggleFullSearch: toggleFullSearch,
     searchString: searchInput,

package/out/components/header/search-button/search-button.js

@@ -2,15 +2,13 @@ import React__default from 'react';
 import styles from './search-button.module.pcss.js';
 import classNames from 'classnames';
 import SvgSearch from './search.svg.js';
-import { SearchIcon } from '@rescui/icons';
-import Button from '@rescui/button';
 const DATA_TEST_HEADER_SEARCH_BUTTON = 'header-search-button';
 
 const SearchButton = ({
   onClick,
   isActive
 }) => {
-  return React__default.createElement(React__default.Fragment, null, React__default.createElement("button", {
+  return React__default.createElement("button", {
     type: "button",
     className: classNames(styles.button, {
       [styles.active]: isActive
@@ -18,16 +16,7 @@ const SearchButton = ({
     "data-test": DATA_TEST_HEADER_SEARCH_BUTTON,
     "aria-label": "Search",
     onClick: onClick
-  }, React__default.createElement(SvgSearch, null)), React__default.createElement("div", {
-    className: styles.mobileButton
-  }, React__default.createElement(Button, {
-    "data-test": DATA_TEST_HEADER_SEARCH_BUTTON,
-    "aria-label": "Search",
-    onClick: onClick,
-    mode: 'clear',
-    size: 'l',
-    icon: React__default.createElement(SearchIcon, null)
-  })));
+  }, React__default.createElement(SvgSearch, null));
 };
 
 export { DATA_TEST_HEADER_SEARCH_BUTTON, SearchButton };

package/out/components/header/search-button/search-button.module.pcss.js

@@ -1,6 +1,5 @@
 var styles = {
   "button": "ktl-search-button-module_button_YHJPv",
-  "active": "ktl-search-button-module_active_lUmdh",
-  "mobileButton": "ktl-search-button-module_mobileButton_KT2YP"
+  "active": "ktl-search-button-module_active_lUmdh"
 };
 export { styles as default };

package/out/components/top-menu/dropdown-menu/dropdown-menu.js

@@ -1,13 +1,10 @@
-import React__default, { useState, useRef, useEffect, useCallback } from 'react';
+import React__default, { useState } from 'react';
 import ReactDOM from 'react-dom';
 import classNames from 'classnames';
 import styles from './dropdown-menu.module.pcss.js';
 import { useTextStyles } from '@rescui/typography';
 import SvgArrowDropdownIcon from './arrow-dropdown-icon.svg.js';
 import { useTheme } from '@rescui/ui-contexts';
-import Button from '@rescui/button';
-import { CloseIcon } from '@rescui/icons';
-import { clearAllBodyScrollLocks, enableBodyScroll, disableBodyScroll } from 'body-scroll-lock';
 
 const DropdownMenu = ({
   homeUrl,
@@ -20,14 +17,11 @@ const DropdownMenu = ({
 }) => {
   const theme = useTheme();
   const textCn = useTextStyles();
-  const [portalRoot, setPortalRoot] = useState(null);
-  const navRef = useRef(null);
-  useEffect(() => {
+  const [portalRoot, setPortalRoot] = React__default.useState(null);
+  React__default.useEffect(() => {
     if (typeof document !== `undefined`) {
       setPortalRoot(document.body);
     }
-
-    return clearAllBodyScrollLocks;
   }, []);
 
   let _items = (mobileOverview ? [{
@@ -39,43 +33,29 @@ const DropdownMenu = ({
 
   const activeItem = _items[_activeIndex];
   const [isExpanded, setIsExpanded] = useState(false);
-  const handleClick = useCallback(() => {
-    if (navRef.current) {
-      isExpanded ? enableBodyScroll(navRef.current) : disableBodyScroll(navRef.current);
-    }
 
-    setIsExpanded(!isExpanded);
-  }, [isExpanded, navRef]);
+  const handleClick = () => setIsExpanded(!isExpanded);
+
   return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
     className: classNames(styles.dropdownMenu, {
       [styles.dropdownMenuExpanded]: isExpanded
-    })
+    }),
+    onClick: handleClick
   }, React__default.createElement("button", {
     className: classNames(styles.button, textCn('rs-text-2')),
-    "aria-haspopup": "true",
-    onClick: handleClick
+    "aria-haspopup": "true"
   }, React__default.createElement("span", {
     className: styles.buttonText
   }, activeItem.title), React__default.createElement(SvgArrowDropdownIcon, {
     className: styles.icon
   })), React__default.createElement("nav", {
-    ref: navRef,
     className: classNames(styles.dropdownList, {
       [styles.dropdownListDarkTheme]: theme === 'dark'
     })
-  }, React__default.createElement("div", {
-    className: styles.dropdownHeader
-  }, React__default.createElement("div", {
-    className: textCn('rs-text-2')
-  }, title), React__default.createElement(Button, {
-    mode: 'clear',
-    size: 'l',
-    icon: React__default.createElement(CloseIcon, null),
-    onClick: handleClick
-  })), _items.map((item, index) => React__default.createElement("a", {
+  }, _items.map((item, index) => React__default.createElement("a", {
     key: item.url,
     href: item.url,
-    className: classNames(styles.dropdownItem, textCn('rs-text-1'), {
+    className: classNames(styles.dropdownItem, textCn('rs-text-2'), {
       [styles.dropdownItemActive]: index === _activeIndex
     }),
     onClick: event => linkHandler?.(event, item.url),

package/out/components/top-menu/dropdown-menu/dropdown-menu.module.pcss.js

@@ -1,14 +1,13 @@
 var styles = {
-  "overlay": "ktl-dropdown-menu-module_overlay_segRo",
-  "fadein": "ktl-dropdown-menu-module_fadein_MySnq",
   "dropdownMenu": "ktl-dropdown-menu-module_dropdown-menu_tq2uU",
   "button": "ktl-dropdown-menu-module_button_OYsuv",
   "buttonText": "ktl-dropdown-menu-module_button-text_SJmh-",
   "icon": "ktl-dropdown-menu-module_icon_GGhMI",
-  "dropdownHeader": "ktl-dropdown-menu-module_dropdown-header_fa92T",
   "dropdownList": "ktl-dropdown-menu-module_dropdown-list_Ylkvt",
+  "fadein": "ktl-dropdown-menu-module_fadein_MySnq",
   "dropdownItem": "ktl-dropdown-menu-module_dropdown-item_X3tZ-",
   "dropdownItemActive": "ktl-dropdown-menu-module_dropdown-item-active_99q9X",
+  "overlay": "ktl-dropdown-menu-module_overlay_segRo",
   "overlayVisible": "ktl-dropdown-menu-module_overlay-visible_MjwEF",
   "dropdownMenuExpanded": "ktl-dropdown-menu-module_dropdown-menu-expanded_EQefy",
   "dropdownListDarkTheme": "ktl-dropdown-menu-module_dropdown-list-dark-theme_P60ol"

package/out/components/top-menu/index.css

@@ -13,8 +13,7 @@
   --ktl-overlay-z-index: 900;
   --ktl-top-menu-z-index: 905;
   --ktl-header-z-index: 906;
-  --ktl-mobile-dropdown-list-z-index: 907;
-  --ktl-header-height-mobile: 52px;
+  --ktl-header-height-mobile: 48px;
   --ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
   --rs-font-family-ui: var(--ktl-font-family-inter);
 }
@@ -30,6 +29,7 @@
   height: 64px;
   background: #ffffff;
   padding: 0 32px;
+  z-index: var(--ktl-top-menu-z-index);
   box-shadow: inset 0 -1px 0 0 var(--ktl-light-dark-20);
   transition: color var(--ktl-transition-fast),
   background-color var(--ktl-transition-fast);
@@ -48,7 +48,7 @@
 
 @media (max-width: 640px) {
   .ktl-top-menu-module_top-menu_PRX9X {
-    height: var(--ktl-header-height-mobile);
+    height: 48px;
     padding: 0 16px;
     grid-gap: 16px;
     grid-template-columns: 1fr auto;
@@ -75,6 +75,12 @@
   color: var(--ktl-color-primary-light-theme);
 }
 
+@media (max-width: 640px) {
+  .ktl-horizontal-menu-module_horizontal-menu_pB2-S {
+    display: none;
+  }
+}
+
 :root {
   --ktl-light-grey: #f4f4f4;
   --ktl-dark-100: rgba(39, 40, 44, 1);
@@ -90,149 +96,140 @@
   --ktl-overlay-z-index: 900;
   --ktl-top-menu-z-index: 905;
   --ktl-header-z-index: 906;
-  --ktl-mobile-dropdown-list-z-index: 907;
-  --ktl-header-height-mobile: 52px;
+  --ktl-header-height-mobile: 48px;
   --ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
   --rs-font-family-ui: var(--ktl-font-family-inter);
 }
 
-.ktl-dropdown-menu-module_overlay_segRo {
-    display: none;
-    position: fixed;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    opacity: 0;
-    background-color: var(--ktl-color-dark-40);
-    z-index: var(--ktl-overlay-z-index);
-    -webkit-animation: ktl-dropdown-menu-module_fadein_MySnq ease-out var(--ktl-transition-fast) forwards;
-            animation: ktl-dropdown-menu-module_fadein_MySnq ease-out var(--ktl-transition-fast) forwards;
-}
-
 .ktl-dropdown-menu-module_dropdown-menu_tq2uU {
-    display: block;
-    height: 100%;
-    justify-self: flex-start;
-    white-space: nowrap;
-    width: 100%;
-    min-width: 0;
-    max-width: 100%;
+  display: none;
+  height: 100%;
+  justify-self: flex-start;
+  white-space: nowrap;
+  min-width: 0;
+  max-width: 100%;
 }
 
 .ktl-dropdown-menu-module_button_OYsuv {
-    border: none;
-    background: none;
-    height: 100%;
-    width: 100%;
-    max-width: 100%;
-    padding: 0;
-    margin: 0;
-    display: flex;
-    align-items: center;
-    cursor: pointer;
+  border: none;
+  background: none;
+  height: 100%;
+  max-width: 100%;
+  padding: 0;
+  margin: 0;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  cursor: pointer;
 }
 
 .ktl-dropdown-menu-module_button-text_SJmh- {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    flex: 0 1 auto;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  flex: 0 1 auto;
 }
 
 .ktl-dropdown-menu-module_icon_GGhMI {
-    width: 12px;
-    height: 6px;
-    margin-left: 6px;
-    transition: transform ease-in-out var(--ktl-transition-xfast);
-    flex: 0 0 auto;
-}
-
-.ktl-dropdown-menu-module_dropdown-header_fa92T {
-    display: flex;
-    color: #ffffff;
-    align-items: center;
-    height: var(--ktl-header-height-mobile);
-    padding: 0 0 0 16px;
-    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
-    justify-content: space-between;
+  width: 12px;
+  height: 6px;
+  margin-left: 6px;
+  transition: transform ease-in-out var(--ktl-transition-xfast);
+  flex: 0 0 auto;
 }
 
 .ktl-dropdown-menu-module_dropdown-list_Ylkvt {
-    display: none;
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    background: #ffffff;
-    opacity: 0;
-    -webkit-animation: ktl-dropdown-menu-module_fadein_MySnq ease-out var(--ktl-transition-fast) forwards;
-            animation: ktl-dropdown-menu-module_fadein_MySnq ease-out var(--ktl-transition-fast) forwards;
-    z-index: var(--ktl-mobile-dropdown-list-z-index);
+  display: none;
+  position: absolute;
+  left: 0;
+  right: 0;
+  background: #ffffff;
+  opacity: 0;
+  -webkit-animation: ktl-dropdown-menu-module_fadein_MySnq ease-out var(--ktl-transition-fast) forwards;
+          animation: ktl-dropdown-menu-module_fadein_MySnq ease-out var(--ktl-transition-fast) forwards;
 }
 
 .ktl-dropdown-menu-module_dropdown-item_X3tZ- {
-    padding: 12px 16px;
-    text-decoration: none;
-    transition: color var(--ktl-transition-xfast),
+  padding: 8px 16px;
+  text-decoration: none;
+  transition: color var(--ktl-transition-xfast),
     background-color var(--ktl-transition-xfast);
 }
 
 .ktl-dropdown-menu-module_dropdown-item_X3tZ-:hover {
-        background: rgba(39, 40, 44, 0.1);
-        color: #27282c;
-    }
+    background: rgba(39, 40, 44, 0.1);
+    color: #27282c;
+  }
 
 .ktl-dropdown-menu-module_dropdown-item_X3tZ-.ktl-dropdown-menu-module_dropdown-item-active_99q9X {
-        background: var(--ktl-dark-100);
-        color: #ffffff;
-    }
+    background: var(--ktl-dark-100);
+    color: #ffffff;
+  }
+
+.ktl-dropdown-menu-module_overlay_segRo {
+  display: none;
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0;
+  background-color: var(--ktl-color-dark-40);
+  z-index: var(--ktl-overlay-z-index);
+  -webkit-animation: ktl-dropdown-menu-module_fadein_MySnq ease-out var(--ktl-transition-fast) forwards;
+          animation: ktl-dropdown-menu-module_fadein_MySnq ease-out var(--ktl-transition-fast) forwards;
+}
 
 .ktl-dropdown-menu-module_overlay-visible_MjwEF {
-    display: block;
-    opacity: 1;
+  display: block;
+  opacity: 1;
 }
 
 .ktl-dropdown-menu-module_dropdown-menu-expanded_EQefy .ktl-dropdown-menu-module_icon_GGhMI {
-        transform: scale(1, -1);
-    }
+    transform: scale(1, -1);
+  }
 
 .ktl-dropdown-menu-module_dropdown-menu-expanded_EQefy .ktl-dropdown-menu-module_dropdown-list_Ylkvt {
-        display: flex;
-        flex-direction: column;
-        opacity: 1;
-    }
+    display: flex;
+    flex-direction: column;
+    opacity: 1;
+  }
 
 .ktl-dropdown-menu-module_dropdown-list-dark-theme_P60ol {
-    background: rgba(39, 40, 44, 1);
+  background: var(--ktl-dark-bg-hard);
 }
 
 .ktl-dropdown-menu-module_dropdown-list-dark-theme_P60ol .ktl-dropdown-menu-module_dropdown-item_X3tZ-:hover {
-            background: rgba(255, 255, 255, 0.1);
-            color: #ffffff;
-        }
+      background: rgba(255, 255, 255, 0.1);
+      color: #ffffff;
+    }
 
 .ktl-dropdown-menu-module_dropdown-list-dark-theme_P60ol .ktl-dropdown-menu-module_dropdown-item_X3tZ-.ktl-dropdown-menu-module_dropdown-item-active_99q9X {
-            color: var(--ktl-light-text-hard);
-            background: #ffffff;
-        }
+      color: var(--ktl-light-text-hard);
+      background: #ffffff;
+    }
+
+@media (max-width: 640px) {
+  .ktl-dropdown-menu-module_dropdown-menu_tq2uU {
+    display: block;
+  }
+}
 
 @-webkit-keyframes ktl-dropdown-menu-module_fadein_MySnq {
-    0% {
-        opacity: 0;
-    }
-    100% {
-        opacity: 1;
-    }
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
 }
 
 @keyframes ktl-dropdown-menu-module_fadein_MySnq {
-    0% {
-        opacity: 0;
-    }
-    100% {
-        opacity: 1;
-    }
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
 }

package/out/components/top-menu/top-menu.js

@@ -1,13 +1,12 @@
-import React__default, { forwardRef, useRef, useImperativeHandle, useState, useLayoutEffect } from 'react';
+import React__default from 'react';
 import { useTheme } from '@rescui/ui-contexts';
 import classNames from 'classnames';
 import styles from './top-menu.module.pcss.js';
 import { useTextStyles } from '@rescui/typography';
 import { HorizontalMenu } from './horizontal-menu/horizontal-menu.js';
 import { DropdownMenu } from './dropdown-menu/dropdown-menu.js';
-import useResizeObserver from '@react-hook/resize-observer';
-const BREAKPOINT_XS = 640;
-const TopMenu = forwardRef(({
+
+const TopMenu = ({
   homeUrl,
   title,
   mobileTitle,
@@ -16,27 +15,21 @@ const TopMenu = forwardRef(({
   linkHandler = () => {},
   className,
   children,
+  forwardedRef,
   mobileOverview
-}, forwardedRef) => {
+}) => {
   const theme = useTheme();
   const textCn = useTextStyles();
-  const menuRef = useRef(null);
-  useImperativeHandle(forwardedRef, () => menuRef.current);
-  const [isMobileMenuVisible, setMobileMenuVisible] = useState(false);
-  useLayoutEffect(() => {
-    setMobileMenuVisible((menuRef.current?.getBoundingClientRect?.().width ?? 0) <= BREAKPOINT_XS);
-  }, [menuRef]);
-  useResizeObserver(menuRef, entry => setMobileMenuVisible(entry.contentRect.width <= BREAKPOINT_XS));
   return React__default.createElement("div", {
-    ref: menuRef,
     className: classNames(styles.topMenu, className, {
       [styles.topMenuDarkTheme]: theme === 'dark'
-    })
+    }),
+    ref: forwardedRef
   }, React__default.createElement("a", {
     href: homeUrl,
     className: classNames(styles.logo, textCn('rs-h3')),
     onClick: event => linkHandler(event, homeUrl)
-  }, title), isMobileMenuVisible ? React__default.createElement(DropdownMenu, {
+  }, title), React__default.createElement(DropdownMenu, {
     items: items,
     activeIndex: activeIndex,
     linkHandler: linkHandler,
@@ -44,10 +37,11 @@ const TopMenu = forwardRef(({
     mobileTitle: mobileTitle,
     homeUrl: homeUrl,
     mobileOverview: mobileOverview
-  }) : React__default.createElement(HorizontalMenu, {
+  }), React__default.createElement(HorizontalMenu, {
     items: items,
     activeIndex: activeIndex,
     linkHandler: linkHandler
   }), children);
-});
+};
+
 export { TopMenu };

package/out/components/typography/index.css

@@ -13,8 +13,7 @@
   --ktl-overlay-z-index: 900;
   --ktl-top-menu-z-index: 905;
   --ktl-header-z-index: 906;
-  --ktl-mobile-dropdown-list-z-index: 907;
-  --ktl-header-height-mobile: 52px;
+  --ktl-header-height-mobile: 48px;
   --ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
   --rs-font-family-ui: var(--ktl-font-family-inter);
 }

package/out/components/youtube-player/index.css

@@ -13,8 +13,7 @@
   --ktl-overlay-z-index: 900;
   --ktl-top-menu-z-index: 905;
   --ktl-header-z-index: 906;
-  --ktl-mobile-dropdown-list-z-index: 907;
-  --ktl-header-height-mobile: 52px;
+  --ktl-header-height-mobile: 48px;
   --ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
   --rs-font-family-ui: var(--ktl-font-family-inter);
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@jetbrains/kotlin-web-site-ui",
   "description": "UI components for Kotlin web sites development",
-  "version": "4.2.0-alpha.3",
+  "version": "4.2.0",
   "license": "Apache-2.0",
   "author": "JetBrains",
   "files": [
@@ -47,7 +47,7 @@
     "@babel/preset-typescript": "^7.13.0",
     "@babel/register": "^7.11.5",
     "@react-hook/resize-observer": "^1.2.5",
-    "@rescui/button": "^0.6.9",
+    "@rescui/button": "^0.2.1",
     "@rescui/checkbox": "^0.1.0",
     "@rescui/focus-manager": "^0.1.1",
     "@rescui/icons": "^0.8.2",