@apify/ui-library 0.74.2-featCodeBlockWithTabsoptimis-e30911.3 → 0.75.0

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@apify/ui-library",
-    "version": "0.74.2-featCodeBlockWithTabsoptimis-e30911.3+cef0941ab85",
+    "version": "0.75.0",
     "description": "React UI library used by apify.com",
     "license": "Apache-2.0",
     "type": "module",
@@ -66,5 +66,5 @@
         "typescript": "^5.1.6",
         "typescript-eslint": "^8.24.0"
     },
-    "gitHead": "cef0941ab85d9a8d282c8e4e7fee14500fb39fe9"
+    "gitHead": "a4c4ceee13ae2580b5fc2257759fc60eadf010c9"
 }

package/src/components/code/code_block/code_block_with_tabs.tsx

@@ -74,8 +74,6 @@ type CodeBlockWithTabsProps = SharedBoxProps & {
     codeBlockProps: SharedCodeBlockProps;
     currentTabKey: CodeBlockTabKey;
     tabs: CodeBlockTabProps[];
-    // Optional prop to set the selected tab, does not influence the content of the code block, used to improve interactivity
-    optimisticCurrentTabKey?: CodeBlockTabKey;
 };
 
 export const CODE_BLOCK_WITH_TABS_CLASSNAMES = {
@@ -192,7 +190,7 @@ const IMG_RESIZE = {
     height: 20,
 };
 
-export const CodeBlockWithTabs = ({ className, codeBlockProps, currentTabKey, tabs, optimisticCurrentTabKey, ...props }: CodeBlockWithTabsProps) => {
+export const CodeBlockWithTabs = ({ className, codeBlockProps, currentTabKey, tabs, ...props }: CodeBlockWithTabsProps) => {
     const { generateProxyImageUrl } = useSharedUiDependencies();
     const currentTab = tabs.find((tab) => tab.key === currentTabKey) ?? tabs[0];
 
@@ -201,7 +199,7 @@ export const CodeBlockWithTabs = ({ className, codeBlockProps, currentTabKey, ta
             <div className={CODE_BLOCK_WITH_TABS_CLASSNAMES.TABS}>
                 {tabs.map((tab) => {
                     const { label, src } = CODE_BLOCK_TAB_CATALOG[tab.key];
-                    const selected = (optimisticCurrentTabKey ?? currentTabKey) === tab.key;
+                    const selected = tab.key === currentTab?.key;
 
                     const commonProps = {
                         className: clsx(CODE_BLOCK_WITH_TABS_CLASSNAMES.TAB, { selected }),

package/src/components/readme_renderer/index.ts

@@ -1,3 +1,3 @@
 export { useActorTitleHeadingFilter } from './utils.js';
 export { pythonizeValue } from './pythonize_value.js';
-export { TableOfContents } from './table_of_contents.js';
+export { TableOfContents, useShowTableOfContents } from './table_of_contents.js';

package/src/components/readme_renderer/table_of_contents.tsx

@@ -14,6 +14,8 @@ import { Link } from '../link.js';
 import { Text } from '../text/index.js';
 import { cleanMarkdown, slugifyHeadingChildren } from './utils.js';
 
+export const useShowTableOfContents = (markdown: string | null | undefined) => useMemo(() => markdown && !!markdown.match(/^(#{1,3})\s.+$/m), [markdown]);
+
 const TOC_HEADING_ID = 'Contents';
 
 const StyledTOCLink = styled(Text)`