@apify/ui-library 1.148.0 → 1.148.1-featuremigrateapifyuilibrary-48563e.21

package/src/components/browser_window/browser_window.tsx

@@ -2,8 +2,8 @@ import clsx from 'clsx';
 import type { ReactNode } from 'react';
 import styled from 'styled-components';
 
-import { theme } from '../../design_system/theme.js';
-import { Badge } from '../badge/index.js';
+import { theme } from '../../design_system/theme';
+import { Badge } from '../badge';
 
 const classNames = {
     ROOT: 'browser-window',

package/src/components/browser_window/index.ts

@@ -1 +1 @@
-export * from './browser_window.js';
+export * from './browser_window';

package/src/components/button/button.stories.tsx

@@ -5,8 +5,8 @@ import styled from 'styled-components';
 
 import { CrossIcon } from '@apify/ui-icons';
 
-import { theme } from '../../design_system/theme.js';
-import { Button, type ButtonProps } from './button.js';
+import { theme } from '../../design_system/theme';
+import { Button, type ButtonProps } from './button';
 
 export default {
     title: 'UI-Library/Button',

package/src/components/button/button.tsx

@@ -5,11 +5,11 @@ import styled, { css } from 'styled-components';
 
 import { ExternalLinkIcon, type IconSize } from '@apify/ui-icons';
 
-import { theme } from '../../design_system/theme.js';
-import { type WithRequired, type WithTransientProps } from '../../type_utils.js';
-import { useSharedUiDependencies } from '../../ui_dependency_provider.js';
-import { Box, type MarginSpacingProps, type RegularBoxProps } from '../box/index.js';
-import { isUrlExternal, Link, type LinkProps } from '../link/index.js';
+import { theme } from '../../design_system/theme';
+import { type WithRequired, type WithTransientProps } from '../../type_utils';
+import { useSharedUiDependencies } from '../../ui_dependency_provider';
+import { Box, type MarginSpacingProps, type RegularBoxProps } from '../box';
+import { isUrlExternal, Link, type LinkProps } from '../link';
 
 export type ButtonSize = 'extraLarge' | 'large' | 'medium' | 'small' | 'extraSmall';
 type ButtonColor = 'default' | 'success' | 'danger' | 'primaryBlack';

package/src/components/button/index.ts

@@ -1 +1 @@
-export * from './button.js';
+export * from './button';

package/src/components/card/card.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
 
-import { Button } from '../button/index.js';
-import { Card, type CardProps } from './card.js';
+import { Button } from '../button';
+import { Card, type CardProps } from './card';
 
 export default {
     title: 'UI-Library/Cards/Card',

package/src/components/card/card.tsx

@@ -3,11 +3,11 @@ import type React from 'react';
 import { forwardRef } from 'react';
 import styled, { css } from 'styled-components';
 
-import { theme } from '../../design_system/theme.js';
+import { theme } from '../../design_system/theme';
 import type { WithTransientProps } from '../../type_utils';
 import type { BoxProps } from '../box';
-import { Box } from '../box/index.js';
-import { Text } from '../text/index.js';
+import { Box } from '../box';
+import { Text } from '../text';
 
 export const cardClassNames = {
     WRAPPER: 'Card',

package/src/components/card/index.ts

@@ -1 +1 @@
-export * from './card.js';
+export * from './card';

package/src/components/card_container/card_container.stories.tsx

@@ -4,8 +4,8 @@ import styled from 'styled-components';
 
 import { DragIndicatorIcon } from '@apify/ui-icons';
 
-import { IconButton } from '../icon_button/index.js';
-import { CardContainer, cardContainerClassNames, type CardContainerProps } from './card_container.js';
+import { IconButton } from '../icon_button';
+import { CardContainer, cardContainerClassNames, type CardContainerProps } from './card_container';
 
 export default {
     title: 'UI-Library/Cards/CardContainer',

package/src/components/card_container/card_container.tsx

@@ -3,9 +3,9 @@ import styled from 'styled-components';
 
 import type { ValueOf } from '@apify-packages/types';
 
-import { theme } from '../../design_system/theme.js';
+import { theme } from '../../design_system/theme';
 import type { Size } from '../../design_system/tokens';
-import { Box, type BoxProps } from '../box/index.js';
+import { Box, type BoxProps } from '../box';
 
 export const cardContainerClassNames = {
     CONTENT: 'CardContainer-Content',

package/src/components/card_container/index.ts

@@ -1 +1 @@
-export * from './card_container.js';
+export * from './card_container';

package/src/components/checkbox/checkbox.stories.tsx

@@ -1,7 +1,7 @@
 import { type ComponentProps, useState } from 'react';
 import styled from 'styled-components';
 
-import { CheckboxPrimitive, IndeterminateCheckbox } from './checkbox.js';
+import { CheckboxPrimitive, IndeterminateCheckbox } from './checkbox';
 
 export default {
     title: 'UI-Library/Inputs/CheckboxPrimitive',

package/src/components/checkbox/checkbox.style.ts

@@ -1,6 +1,6 @@
 import { css } from 'styled-components';
 
-import { theme } from '../../design_system/theme.js';
+import { theme } from '../../design_system/theme';
 
 export const checkboxStyle = css`
     overflow: hidden;

package/src/components/checkbox/checkbox.tsx

@@ -5,8 +5,8 @@ import styled from 'styled-components';
 
 import { CheckIcon, MinusIcon } from '@apify/ui-icons';
 
-import { theme } from '../../design_system/theme.js';
-import { checkboxStyle } from './checkbox.style.js';
+import { theme } from '../../design_system/theme';
+import { checkboxStyle } from './checkbox.style';
 
 const StyledCheckbox = styled(CheckboxPrimitiveReact.Root)`
     all: unset;

package/src/components/checkbox/index.ts

@@ -1 +1 @@
-export * from './checkbox.js';
+export * from './checkbox';

package/src/components/chip/chip.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
 
-import { Chip, CHIP_SIZES, CHIP_TYPES, type ChipProps } from './chip.js';
+import { Chip, CHIP_SIZES, CHIP_TYPES, type ChipProps } from './chip';
 
 const mockIcons = {
     star: <span style={{ fontSize: '14px' }}>⭐</span>,

package/src/components/chip/chip.tsx

@@ -6,7 +6,7 @@ import styled, { css } from 'styled-components';
 
 import type { ValueOf } from '@apify-packages/types';
 
-import { theme } from '../../design_system/theme.js';
+import { theme } from '../../design_system/theme';
 import type { RegularBoxProps } from '../box';
 
 export const CHIP_SIZES = {

package/src/components/chip/index.ts

@@ -1 +1 @@
-export * from './chip.js';
+export * from './chip';

package/src/components/code/action_button.tsx

@@ -3,10 +3,10 @@ import styled, { css } from 'styled-components';
 
 import { CheckIcon, CopyIcon } from '@apify/ui-icons';
 
-import { theme } from '../../design_system/theme.js';
-import { useSharedUiDependencies } from '../../ui_dependency_provider.js';
-import { useCopyToClipboard } from '../../utils/index.js';
-import { Text } from '../text/index.js';
+import { theme } from '../../design_system/theme';
+import { useSharedUiDependencies } from '../../ui_dependency_provider';
+import { useCopyToClipboard } from '../../utils';
+import { Text } from '../text';
 
 interface StyledButtonProps {
     $successStyle?: boolean;

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

@@ -1,7 +1,7 @@
 import styled, { css } from 'styled-components';
 
-import { theme } from '../../../design_system/theme.js';
-import { Box } from '../../box/index.js';
+import { theme } from '../../../design_system/theme';
+import { Box } from '../../box';
 import type { SharedTextProps, SharedTextSize } from '../../text/text_shared';
 
 export type SyntaxHighlighterBaseStylesWrapperProps = SharedTextProps & {

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

@@ -3,14 +3,14 @@ import type React from 'react';
 import { useMemo, useRef, useState } from 'react';
 
 import type { RegularBoxProps } from '../../box';
-import { ColorWheelGradient } from '../../color_wheel_gradient/index.js';
-import { Link } from '../../link/index.js';
-import { Text } from '../../text/index.js';
+import { ColorWheelGradient } from '../../color_wheel_gradient';
+import { Link } from '../../link';
+import { Text } from '../../text';
 import type { SharedTextSize } from '../../text/text_shared';
-import { ActionButton, CopyButton } from '../action_button.js';
-import { PrismSyntaxHighlighter } from '../prism_highlighter.js';
-import { CodeBlockWrapper } from './code_block.styled.js';
-import { getBashLinePrefixes, getNumberLinePrefixes } from './utils.js';
+import { ActionButton, CopyButton } from '../action_button';
+import { PrismSyntaxHighlighter } from '../prism_highlighter';
+import { CodeBlockWrapper } from './code_block.styled';
+import { getBashLinePrefixes, getNumberLinePrefixes } from './utils';
 
 type CodeTab = {
     key: string;

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

@@ -1,8 +1,8 @@
 import { useMemo, useState } from 'react';
 import styled from 'styled-components';
 
-import { theme } from '../../../design_system/theme.js';
-import { type CodeBlockTabKey, CodeBlockWithTabs, type CodeBlockWithTabsProps } from './code_block_with_tabs.js';
+import { theme } from '../../../design_system/theme';
+import { type CodeBlockTabKey, CodeBlockWithTabs, type CodeBlockWithTabsProps } from './code_block_with_tabs';
 
 export default {
     title: 'UI-Library/Code/CodeBlockWithTabs',

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

@@ -5,12 +5,12 @@ import styled from 'styled-components';
 
 import { CodeIcon, HttpIcon, type IconComponent, McpIcon } from '@apify/ui-icons';
 
-import { theme } from '../../../design_system/theme.js';
-import { useSharedUiDependencies } from '../../../ui_dependency_provider.js';
-import { Box, type MarginSpacingProps, type RegularBoxProps } from '../../box/index.js';
-import { Link, type RegularLinkProps } from '../../link/index.js';
-import { HeadingShared } from '../../text/heading_shared.js';
-import { CodeBlock, type CodeBlockProps } from './code_block.js';
+import { theme } from '../../../design_system/theme';
+import { useSharedUiDependencies } from '../../../ui_dependency_provider';
+import { Box, type MarginSpacingProps, type RegularBoxProps } from '../../box';
+import { Link, type RegularLinkProps } from '../../link';
+import { HeadingShared } from '../../text/heading_shared';
+import { CodeBlock, type CodeBlockProps } from './code_block';
 
 export type CodeBlockTabKey = 'cli' | 'http' | 'javascript' | 'mcp' | 'openapi' | 'python' | 'typescript';
 type CodeBlockTabConfig = {

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

@@ -1,7 +1,7 @@
 import type { ReactNode } from 'react';
 
-import { theme } from '../../../design_system/theme.js';
-import { CodeHighlighterLineBashPrefix, CodeHighlighterLinePrefix } from '../prism_highlighter.js';
+import { theme } from '../../../design_system/theme';
+import { CodeHighlighterLineBashPrefix, CodeHighlighterLinePrefix } from '../prism_highlighter';
 
 // input: [2, 4, 5, 6, 8, 10, 11, 12]
 // returns string indicating what type of line it is (bashStartCommand, bashCommand, bashEmptyLine)

package/src/components/code/index.ts

@@ -1,5 +1,5 @@
-export * from './code_block/code_block.js';
-export * from './code_block/code_block_with_tabs.js';
-export * from './one_line_code/one_line_code.js';
-export * from './inline_code/inline_code.js';
-export * from './prism_highlighter.js';
+export * from './code_block/code_block';
+export * from './code_block/code_block_with_tabs';
+export * from './one_line_code/one_line_code';
+export * from './inline_code/inline_code';
+export * from './prism_highlighter';

package/src/components/code/inline_code/inline_code.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import type { InlineCodeProps } from './inline_code';
-import { InlineCode } from './inline_code.js';
+import { InlineCode } from './inline_code';
 
 /**
  * Stories for the InlineCode component. This file showcases the

package/src/components/code/inline_code/inline_code.tsx

@@ -3,10 +3,10 @@ import styled, { css } from 'styled-components';
 
 import { CheckIcon, CopyIcon } from '@apify/ui-icons';
 
-import { theme } from '../../../design_system/theme.js';
-import { useCopyToClipboard } from '../../../utils/copy_to_clipboard.js';
+import { theme } from '../../../design_system/theme';
+import { useCopyToClipboard } from '../../../utils/copy_to_clipboard';
 import type { RegularBoxProps } from '../../box';
-import { Text } from '../../text/index.js';
+import { Text } from '../../text';
 import type { SharedTextSize } from '../../text/text_shared';
 
 // TODO: We should not need to export these once we consolidate Markdown

package/src/components/code/one_line_code/one_line_code.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
 
-import { OneLineCode, type OneLineCodeProps } from './one_line_code.js';
+import { OneLineCode, type OneLineCodeProps } from './one_line_code';
 
 /**
  * Stories for the OneLineCode component. This file showcases the

package/src/components/code/one_line_code/one_line_code.tsx

@@ -5,15 +5,15 @@ import { EyeIcon, EyeOffIcon } from '@apify/ui-icons';
 
 import type { HttpMethod } from '@apify-packages/types';
 
-import { theme } from '../../../design_system/theme.js';
+import { theme } from '../../../design_system/theme';
 import type { BoxProps } from '../../box';
-import { Text } from '../../text/index.js';
+import { Text } from '../../text';
 import type { SharedTextSize } from '../../text/text_shared';
-import { ActionButton, CopyButton } from '../action_button.js';
+import { ActionButton, CopyButton } from '../action_button';
 import type { SyntaxHighlighterBaseStylesWrapperProps } from '../code_block/code_block.styled';
-import { SyntaxHighlighterBaseStylesWrapper } from '../code_block/code_block.styled.js';
-import { getBashLinePrefixes } from '../code_block/utils.js';
-import { PrismSyntaxHighlighter } from '../prism_highlighter.js';
+import { SyntaxHighlighterBaseStylesWrapper } from '../code_block/code_block.styled';
+import { getBashLinePrefixes } from '../code_block/utils';
+import { PrismSyntaxHighlighter } from '../prism_highlighter';
 
 export const oneLineCodeClassNames = {
     gradientWrapper: 'OneLineCode-GradientWrapper',

package/src/components/code/prism_highlighter.tsx

@@ -6,11 +6,11 @@ import type { ReactNode } from 'react';
 import { forwardRef, useMemo, useRef } from 'react';
 import styled, { css } from 'styled-components';
 
-import { theme } from '../../design_system/theme.js';
-import { useSharedUiDependencies } from '../../ui_dependency_provider.js';
+import { theme } from '../../design_system/theme';
+import { useSharedUiDependencies } from '../../ui_dependency_provider';
 import type { SharedTextSize } from '../text';
-import { Text } from '../text/index.js';
-import { oneLightTheme } from './one_light_theme.js';
+import { Text } from '../text';
+import { oneLightTheme } from './one_light_theme';
 
 (typeof global !== 'undefined' ? global : window).Prism = Prism;
 
@@ -41,7 +41,7 @@ const loadLanguages = async () => {
         // @ts-expect-error The library is badly typed and does not export the type
         import('prismjs/components/prism-yaml.js'),
         // @ts-expect-error The library is badly typed and does not export the type
-        import('./prism_python.js'),
+        import('./prism_python'),
     ]);
 };
 

package/src/components/collapsible_card/collapsible_card.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
 
-import { CollapsibleCard, type CollapsibleCardProps } from './collapsible_card.js';
+import { CollapsibleCard, type CollapsibleCardProps } from './collapsible_card';
 
 export default {
     title: 'UI-Library/Cards/CollapsibleCard',

package/src/components/collapsible_card/collapsible_card.tsx

@@ -5,9 +5,9 @@ import styled, { css } from 'styled-components';
 
 import { ChevronDownIcon } from '@apify/ui-icons';
 
-import { theme } from '../../design_system/theme.js';
+import { theme } from '../../design_system/theme';
 import type { WithTransientProps } from '../../type_utils';
-import { Box } from '../box/index.js';
+import { Box } from '../box';
 
 interface TransientWrapperProps {
     hideOuterBorder?: boolean;

package/src/components/collapsible_card/index.ts

@@ -1 +1 @@
-export * from './collapsible_card.js';
+export * from './collapsible_card';

package/src/components/color_wheel_gradient/color_wheel_gradient.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryContext, StoryObj } from '@storybook/react-vite';
 import type { ElementType } from 'react';
 
-import { ColorWheelGradient, type ColorWheelGradientProps } from './color_wheel_gradient.js';
+import { ColorWheelGradient, type ColorWheelGradientProps } from './color_wheel_gradient';
 
 const Wrapper = ({ children }: { children: React.ReactNode }) => (
     <div

package/src/components/color_wheel_gradient/index.ts

@@ -1 +1 @@
-export * from './color_wheel_gradient.js';
+export * from './color_wheel_gradient';

package/src/components/dropdown/dropdown.stories.tsx

@@ -3,9 +3,9 @@ import styled from 'styled-components';
 
 import { AnalyticsIcon, ArrowRightIcon, PeopleIcon, UnlockIcon } from '@apify/ui-icons';
 
-import { Dropdown } from './dropdown.js';
-import { DropdownButton } from './dropdown_button.js';
-import { DropdownShell } from './dropdown_shell.js';
+import { Dropdown } from './dropdown';
+import { DropdownButton } from './dropdown_button';
+import { DropdownShell } from './dropdown_shell';
 
 const CLASS_NAME_PREFIX = 'Dropdown';
 const elementClass = (name: string) => `${CLASS_NAME_PREFIX}-${name}`;

package/src/components/dropdown/dropdown.styled.ts

@@ -1,7 +1,7 @@
 import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
 import styled from 'styled-components';
 
-import { theme } from '../../design_system/theme.js';
+import { theme } from '../../design_system/theme';
 
 export const DROPDOWN_ELEMENT_CLASSES = {
     WRAPPER: 'dropdown-wrapper',

package/src/components/dropdown/dropdown.tsx

@@ -6,10 +6,10 @@ import styled from 'styled-components';
 
 import { CheckIcon } from '@apify/ui-icons';
 
-import { theme } from '../../design_system/theme.js';
-import { CheckboxPrimitive } from '../checkbox/checkbox.js';
-import { radioButtonStyle } from '../radio_button/radio_button.style.js';
-import { useDropdownContext } from './dropdown.context.js';
+import { theme } from '../../design_system/theme';
+import { CheckboxPrimitive } from '../checkbox/checkbox';
+import { radioButtonStyle } from '../radio_button/radio_button.style';
+import { useDropdownContext } from './dropdown.context';
 import {
     DROPDOWN_ELEMENT_CLASSES,
     StyledCheckboxIconWrapper,
@@ -25,9 +25,9 @@ import {
     StyledLabel,
     StyledSeparator,
     StyledTagWrapper,
-} from './dropdown.styled.js';
-import type { BaseDropdownItemProps } from './dropdown.types.js';
-import { DropdownRoot } from './dropdown_root.js';
+} from './dropdown.styled';
+import type { BaseDropdownItemProps } from './dropdown.types';
+import { DropdownRoot } from './dropdown_root';
 
 type DropdownItemProps = React.ComponentPropsWithRef<typeof DropdownMenu.Item> &
     BaseDropdownItemProps & {

package/src/components/dropdown/dropdown_button.tsx

@@ -1,10 +1,10 @@
 import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
 import { useState } from 'react';
 
-import { Button } from '../button/button.js';
-import { ScrollableContent, StyledContent } from './dropdown.styled.js';
-import type { BaseDropdownContentProps } from './dropdown.types.js';
-import { DropdownRoot } from './dropdown_root.js';
+import { Button } from '../button/button';
+import { ScrollableContent, StyledContent } from './dropdown.styled';
+import type { BaseDropdownContentProps } from './dropdown.types';
+import { DropdownRoot } from './dropdown_root';
 
 type DropdownButtonProps = BaseDropdownContentProps & {
     buttonProps?: Partial<React.ComponentPropsWithoutRef<typeof Button>>;

package/src/components/dropdown/dropdown_root.tsx

@@ -1,7 +1,7 @@
 import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
 import { useCallback, useState } from 'react';
 
-import { DropdownContext } from './dropdown.context.js';
+import { DropdownContext } from './dropdown.context';
 
 type DropdownRootProps = React.ComponentPropsWithRef<typeof DropdownMenu.Root> & {
     closeOnSelect?: boolean;

package/src/components/dropdown/dropdown_shell.tsx

@@ -10,10 +10,10 @@ import {
 import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
 import { type ReactNode, type RefObject, useCallback, useLayoutEffect } from 'react';
 
-import { theme } from '../../design_system/theme.js';
-import { DropdownContext } from './dropdown.context.js';
-import { ScrollableContent, StyledContent } from './dropdown.styled.js';
-import type { BaseDropdownContentProps } from './dropdown.types.js';
+import { theme } from '../../design_system/theme';
+import { DropdownContext } from './dropdown.context';
+import { ScrollableContent, StyledContent } from './dropdown.styled';
+import type { BaseDropdownContentProps } from './dropdown.types';
 
 export type DropdownShellProps = BaseDropdownContentProps & {
     children: ReactNode;

package/src/components/dropdown/index.ts

@@ -1,6 +1,6 @@
-export { Dropdown } from './dropdown.js';
-export { DropdownButton } from './dropdown_button.js';
-export { DropdownShell } from './dropdown_shell.js';
-export type { DropdownShellProps } from './dropdown_shell.js';
-export { DROPDOWN_ELEMENT_CLASSES } from './dropdown.styled.js';
-export type { BaseDropdownItemProps, BaseDropdownContentProps } from './dropdown.types.js';
+export { Dropdown } from './dropdown';
+export { DropdownButton } from './dropdown_button';
+export { DropdownShell } from './dropdown_shell';
+export type { DropdownShellProps } from './dropdown_shell';
+export { DROPDOWN_ELEMENT_CLASSES } from './dropdown.styled';
+export type { BaseDropdownItemProps, BaseDropdownContentProps } from './dropdown.types';

package/src/components/floating/floating_component_base.tsx

@@ -21,7 +21,7 @@ import {
 } from 'react';
 import styled from 'styled-components';
 
-import { theme } from '../../design_system/theme.js';
+import { theme } from '../../design_system/theme';
 
 export const classNames = {
     CHILDREN: 'FloatingComponent-children',

package/src/components/floating/index.ts

@@ -1,5 +1,5 @@
-export * from './menu.js';
-export * from './menu_components.js';
-export * from './menu_common.js';
-export * from './tooltip.js';
-export { FLOATING_PLACEMENT, type FloatingPlacement } from './floating_component_base.js';
+export * from './menu';
+export * from './menu_components';
+export * from './menu_common';
+export * from './tooltip';
+export { FLOATING_PLACEMENT, type FloatingPlacement } from './floating_component_base';

package/src/components/floating/menu.stories.tsx

@@ -3,7 +3,7 @@ import { forwardRef, useState } from 'react';
 import styled, { css } from 'styled-components';
 
 import { CheckboxPrimitive, RadioButtonPrimitive, Text } from '../';
-import { theme } from '../../design_system/theme.js';
+import { theme } from '../../design_system/theme';
 import {
     DropdownMenuBaseComponentWithCount,
     ListMenuComponent,

package/src/components/floating/menu.tsx

@@ -13,10 +13,10 @@ import clsx from 'clsx';
 import type React from 'react';
 import { useCallback, useMemo, useRef, useState } from 'react';
 
-import { Box, type BoxProps } from '../box/index.js';
-import { Text } from '../text/index.js';
-import { useFloatingMenu } from './menu_common.js';
-import { DropdownMenuBaseComponent, ListMenuComponent, ListMenuItemComponent } from './menu_components.js';
+import { Box, type BoxProps } from '../box';
+import { Text } from '../text';
+import { useFloatingMenu } from './menu_common';
+import { DropdownMenuBaseComponent, ListMenuComponent, ListMenuItemComponent } from './menu_components';
 
 export const menuClassNames = {
     WRAPPER: 'menu-wrapper',

package/src/components/floating/menu_components.tsx

@@ -5,10 +5,10 @@ import styled, { css } from 'styled-components';
 
 import { ChevronDownIcon, CrossIcon } from '@apify/ui-icons';
 
-import { theme } from '../../design_system/theme.js';
-import { Badge } from '../badge/index.js';
+import { theme } from '../../design_system/theme';
+import { Badge } from '../badge';
 import type { BoxProps } from '../box';
-import { Box } from '../box/index.js';
+import { Box } from '../box';
 
 export type FloatingContext = Pick<UseFloatingReturn<ReferenceType>, 'context'>['context'];
 

package/src/components/floating/tooltip.tsx

@@ -2,15 +2,15 @@ import { FloatingPortal, useHover, useInteractions } from '@floating-ui/react';
 import { type ComponentType, type ElementType, forwardRef, type ReactNode, useState } from 'react';
 import styled, { css } from 'styled-components';
 
-import { theme } from '../../design_system/theme.js';
-import { useSharedUiDependencies } from '../../ui_dependency_provider.js';
+import { theme } from '../../design_system/theme';
+import { useSharedUiDependencies } from '../../ui_dependency_provider';
 import {
     type FloatingComponentBaseProps,
     FloatingComponentWrapper,
     getFloatingPopupStyle,
     useFloatingPopup,
-} from './floating_component_base.js';
-import { TooltipContent } from './tooltip_content.js';
+} from './floating_component_base';
+import { TooltipContent } from './tooltip_content';
 
 export const TOOLTIP_TEXT_ALIGNS = {
     LEFT: 'left',

package/src/components/floating/tooltip_content.tsx

@@ -1,9 +1,9 @@
 import styled, { css } from 'styled-components';
 
-import { theme } from '../../design_system/theme.js';
-import { Shortcut } from '../shortcut/index.js';
+import { theme } from '../../design_system/theme';
+import { Shortcut } from '../shortcut';
 import type { TooltipProps, TooltipSize, TooltipTextAlign } from './tooltip';
-import { TOOLTIP_SIZES, TOOLTIP_TEXT_ALIGNS } from './tooltip.js';
+import { TOOLTIP_SIZES, TOOLTIP_TEXT_ALIGNS } from './tooltip';
 
 type ContentProps = Pick<TooltipProps, 'content' | 'shortcuts' | 'imageUrl' | 'subtleText' | 'size' | 'textAlign'>;