@bitrise/bitkit 13.288.0 → 13.288.1-alpha.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitrise/bitkit",
   "description": "Bitrise React component library",
-  "version": "13.288.0",
+  "version": "13.288.1-alpha.0",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@github.com/bitrise-io/bitkit.git"
@@ -32,16 +32,16 @@
     "@floating-ui/react-dom-interactions": "^0.8.1",
     "@fontsource/figtree": "^5.2.8",
     "@fontsource/source-code-pro": "^5.2.6",
-    "chakra-ui-2--react": "npm:@chakra-ui/react@2.10.9",
-    "chakra-ui-2--react-utils": "npm:@chakra-ui/react-utils@2.0.12",
-    "chakra-ui-2--styled-system": "npm:@chakra-ui/styled-system@2.12.4",
-    "chakra-ui-2--theme": "npm:@chakra-ui/theme@3.4.9",
-    "chakra-ui-2--theme-tools": "npm:@chakra-ui/theme-tools@2.2.9",
+    "@chakra-ui/react": "2.10.9",
+    "@chakra-ui/react-utils": "2.0.12",
+    "@chakra-ui/styled-system": "2.12.4",
+    "@chakra-ui/theme": "3.4.9",
+    "@chakra-ui/theme-tools": "2.2.9",
     "clsx": "^2.1.1",
-    "framer-motion": "^12.23.9",
+    "framer-motion": "^12.23.12",
     "luxon": "^3.7.1",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "react-focus-lock": "2.13.6",
     "react-imask": "^7.6.1",
     "react-markdown": "^10.1.0"
@@ -57,10 +57,10 @@
     "@babel/preset-typescript": "^7.27.1",
     "@bitrise/eslint-plugin": "^2.12.0",
     "@google-cloud/storage": "^7.16.0",
-    "@storybook/addon-docs": "^9.0.18",
-    "@storybook/addon-links": "^9.0.18",
+    "@storybook/addon-docs": "^9.1.2",
+    "@storybook/addon-links": "^9.1.2",
     "@storybook/addon-webpack5-compiler-swc": "^3.0.0",
-    "@storybook/react-webpack5": "^9.0.18",
+    "@storybook/react-webpack5": "^9.1.2",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "6.6.4",
     "@testing-library/react": "16.3.0",
@@ -72,7 +72,7 @@
     "@typescript-eslint/eslint-plugin": "^7.18.0",
     "@typescript-eslint/parser": "^7.18.0",
     "axios": "^1.11.0",
-    "chakra-ui-2--cli": "npm:@chakra-ui/cli@2.5.8",
+    "@chakra-ui/cli": "2.5.8",
     "eslint": "^8.57.1",
     "glob": "^11.0.3",
     "jest": "^29.7.0",
@@ -80,11 +80,11 @@
     "jsdom": "26.1.0",
     "lodash": "^4.17.21",
     "prettier": "^3.6.2",
-    "react-hook-form": "^7.61.1",
+    "react-hook-form": "^7.62.0",
     "release-it": "^19.0.4",
-    "storybook": "^9.0.18",
-    "ts-jest": "^29.4.0",
-    "typescript": "^5.8.3"
+    "storybook": "^9.1.2",
+    "ts-jest": "^29.4.1",
+    "typescript": "^5.9.2"
   },
   "files": [
     "src",

package/src/Components/Accordion/Accordion.theme.ts

@@ -1,4 +1,4 @@
-import type { ComponentStyleConfig } from 'chakra-ui-2--theme';
+import type { ComponentStyleConfig } from '@chakra-ui/theme';
 
 const AccordionTheme: ComponentStyleConfig = {
   baseStyle: {

package/src/Components/Accordion/Accordion.tsx

@@ -2,7 +2,7 @@ import {
   Accordion as ChakraAccordion,
   AccordionProps as ChakraAccordionProps,
   usePrefersReducedMotion,
-} from 'chakra-ui-2--react';
+} from '@chakra-ui/react';
 
 export type AccordionProps = Omit<ChakraAccordionProps, 'defaultIndex'> & {
   defaultIndex: number[];

package/src/Components/Accordion/AccordionItem.tsx

@@ -7,7 +7,7 @@ import {
   AccordionPanel,
   CollapseProps,
   useAccordionStyles,
-} from 'chakra-ui-2--react';
+} from '@chakra-ui/react';
 
 export interface AccordionItemProps {
   buttonContent: ReactNode | ((props: { isExpanded: boolean; isDisabled: boolean }) => ReactNode);

package/src/Components/AspectRatio/AspectRatio.tsx

@@ -1,4 +1,4 @@
-import { AspectRatio as ChakraAspectRatio, AspectRatioProps, forwardRef } from 'chakra-ui-2--react';
+import { AspectRatio as ChakraAspectRatio, AspectRatioProps, forwardRef } from '@chakra-ui/react';
 
 /**
  * AspectRatio component is used to embed responsive videos and maps, etc.

package/src/Components/Avatar/Avatar.theme.ts

@@ -1,4 +1,4 @@
-import type { ComponentStyleConfig } from 'chakra-ui-2--theme';
+import type { ComponentStyleConfig } from '@chakra-ui/theme';
 import { rem } from '../../utils/utils';
 import { AvatarProps, AvatarSizes, AvatarVariant } from './Avatar';
 

package/src/Components/Avatar/Avatar.tsx

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { Avatar as ChakraAvatar, AvatarProps as ChakraAvatarProps, forwardRef } from 'chakra-ui-2--react';
+import { Avatar as ChakraAvatar, AvatarProps as ChakraAvatarProps, forwardRef } from '@chakra-ui/react';
 import Icon, { TypeIconName } from '../Icon/Icon';
 
 export type AvatarSizes = '24' | '32' | '40' | '48' | '64' | '128';

package/src/Components/Badge/Badge.theme.ts

@@ -1,4 +1,4 @@
-import { SystemStyleObject } from 'chakra-ui-2--styled-system';
+import { SystemStyleObject } from '@chakra-ui/styled-system';
 import { BadgeColorScheme, BadgeProps } from './Badge';
 
 const baseStyle: SystemStyleObject = {

package/src/Components/Badge/Badge.tsx

@@ -1,4 +1,4 @@
-import { Badge as ChakraBadge, BadgeProps as ChakraBadgeProps, forwardRef } from 'chakra-ui-2--react';
+import { Badge as ChakraBadge, BadgeProps as ChakraBadgeProps, forwardRef } from '@chakra-ui/react';
 import Icon, { TypeIconName } from '../Icon/Icon';
 import Text from '../Text/Text';
 

package/src/Components/Box/Box.tsx

@@ -1,4 +1,4 @@
-import { Box as ChakraBox, BoxProps, forwardRef } from 'chakra-ui-2--react';
+import { Box as ChakraBox, BoxProps, forwardRef } from '@chakra-ui/react';
 
 /**
  * Box is the most abstract component on top of which all other components are built. By default, it renders a div element.

package/src/Components/Breadcrumb/Breadcrumb.theme.ts

@@ -1,4 +1,4 @@
-import type { SystemStyleObject } from 'chakra-ui-2--theme-tools';
+import type { SystemStyleObject } from '@chakra-ui/theme-tools';
 
 const BreadcrumbTheme: SystemStyleObject = {
   baseStyle: {

package/src/Components/Breadcrumb/Breadcrumb.tsx

@@ -5,7 +5,7 @@ import {
   BreadcrumbProps as ChakraBreadcrumbProps,
   BreadcrumbSeparator,
   forwardRef,
-} from 'chakra-ui-2--react';
+} from '@chakra-ui/react';
 import Icon, { TypeIconName } from '../Icon/Icon';
 import { useResponsive } from '../../hooks';
 

package/src/Components/Breadcrumb/BreadcrumbLink.tsx

@@ -2,7 +2,7 @@ import {
   BreadcrumbLink as ChakraBreadcrumbLink,
   BreadcrumbLinkProps as ChakraBreadcrumbLinkProps,
   forwardRef,
-} from 'chakra-ui-2--react';
+} from '@chakra-ui/react';
 
 export type BreadcrumbLinkProps = ChakraBreadcrumbLinkProps;
 

package/src/Components/Button/Button.theme.ts

@@ -1,4 +1,4 @@
-import { defineStyle, defineStyleConfig, SystemStyleInterpolation } from 'chakra-ui-2--styled-system';
+import { defineStyle, defineStyleConfig, SystemStyleInterpolation } from '@chakra-ui/styled-system';
 import { rem } from '../../utils/utils';
 import { ButtonProps } from './Button';
 

package/src/Components/Button/Button.tsx

@@ -1,4 +1,4 @@
-import { Button as ChakraButton, ButtonProps as ChakraButtonProps, forwardRef } from 'chakra-ui-2--react';
+import { Button as ChakraButton, ButtonProps as ChakraButtonProps, forwardRef } from '@chakra-ui/react';
 import Icon, { TypeIconName } from '../Icon/Icon';
 
 export interface ButtonProps extends ChakraButtonProps {

package/src/Components/ButtonGroup/ButtonGroup.tsx

@@ -1,4 +1,4 @@
-import { ButtonGroup as ChakraButtonGroup, ButtonGroupProps, forwardRef } from 'chakra-ui-2--react';
+import { ButtonGroup as ChakraButtonGroup, ButtonGroupProps, forwardRef } from '@chakra-ui/react';
 
 export type { ButtonGroupProps };
 

package/src/Components/Card/Card.tsx

@@ -1,4 +1,4 @@
-import { forwardRef, HTMLChakraProps, useStyleConfig } from 'chakra-ui-2--react';
+import { forwardRef, HTMLChakraProps, useStyleConfig } from '@chakra-ui/react';
 import Box, { BoxProps } from '../Box/Box';
 
 export interface CardProps extends BoxProps {

package/src/Components/CloseButton/CloseButton.tsx

@@ -2,7 +2,7 @@ import {
   CloseButton as ChakraCloseButton,
   CloseButtonProps as ChakraCloseButtonProps,
   forwardRef,
-} from 'chakra-ui-2--react';
+} from '@chakra-ui/react';
 import Icon from '../Icon/Icon';
 import CloseButtonTheme from './CloseButton.theme';
 

package/src/Components/CodeSnippet/CodeSnippet.theme.ts

@@ -1,4 +1,4 @@
-import { defineStyle, defineStyleConfig, SystemStyleObject } from 'chakra-ui-2--styled-system';
+import { defineStyle, defineStyleConfig, SystemStyleObject } from '@chakra-ui/styled-system';
 import { rem } from '../../utils/utils';
 import { CodeSnippetProps } from './CodeSnippet';
 

package/src/Components/CodeSnippet/CodeSnippet.tsx

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { CollapseProps, useClipboard, useMultiStyleConfig } from 'chakra-ui-2--react';
+import { CollapseProps, useClipboard, useMultiStyleConfig } from '@chakra-ui/react';
 import Box, { BoxProps } from '../Box/Box';
 import Tooltip from '../Tooltip/Tooltip';
 import Button from '../Button/Button';

package/src/Components/Collapse/Collapse.tsx

@@ -1,4 +1,4 @@
-import { Collapse, CollapseProps } from 'chakra-ui-2--react';
+import { Collapse, CollapseProps } from '@chakra-ui/react';
 
 export type { CollapseProps };
 

package/src/Components/ColorButton/ColorButton.tsx

@@ -1,9 +1,4 @@
-import {
-  Button as ChakraButton,
-  ButtonProps as ChakraButtonProps,
-  forwardRef,
-  useStyleConfig,
-} from 'chakra-ui-2--react';
+import { Button as ChakraButton, ButtonProps as ChakraButtonProps, forwardRef, useStyleConfig } from '@chakra-ui/react';
 import { ColorScheme } from '../../types/bitkit';
 
 export interface ColorButtonProps extends ChakraButtonProps {

package/src/Components/ControlButton/ControlButton.tsx

@@ -1,4 +1,4 @@
-import { forwardRef } from 'chakra-ui-2--react';
+import { forwardRef } from '@chakra-ui/react';
 import IconButton, { IconButtonProps } from '../IconButton/IconButton';
 
 export interface ControlButtonProps extends Omit<IconButtonProps, 'iconSize' | 'size' | 'variant'> {

package/src/Components/DataWidget/DataWidget.theme.ts

@@ -1,4 +1,4 @@
-import { createMultiStyleConfigHelpers } from 'chakra-ui-2--styled-system';
+import { createMultiStyleConfigHelpers } from '@chakra-ui/styled-system';
 import { rem } from '../../utils/utils';
 
 const { defineMultiStyleConfig } = createMultiStyleConfigHelpers(['container', 'title', 'items']);

package/src/Components/DataWidget/DataWidget.tsx

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { useMultiStyleConfig } from 'chakra-ui-2--react';
+import { useMultiStyleConfig } from '@chakra-ui/react';
 import Box from '../Box/Box';
 import Card, { CardProps } from '../Card/Card';
 import Text from '../Text/Text';

package/src/Components/DatePicker/DatePicker.context.ts

@@ -1,4 +1,4 @@
-import { createContext } from 'chakra-ui-2--react-utils';
+import { createContext } from '@chakra-ui/react-utils';
 import { DateTime } from 'luxon';
 import { DateRange } from './useDateRange';
 import type { DatePickerDayViewProps } from './DatePickerDay';

package/src/Components/DatePicker/DatePicker.tsx

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { DateTime } from 'luxon';
 import FocusLock from 'react-focus-lock';
-import { PopoverAnchor } from 'chakra-ui-2--react';
+import { PopoverAnchor } from '@chakra-ui/react';
 import { useObjectMemo } from '../../utils/utils';
 import Popover from '../Popover/Popover';
 import PopoverContent from '../Popover/PopoverContent';

package/src/Components/DatePicker/DatePickerDay.tsx

@@ -1,7 +1,7 @@
 import { ReactNode, useCallback } from 'react';
 import { DateTime, Settings } from 'luxon';
-import { BoxProps, useMultiStyleConfig } from 'chakra-ui-2--react';
-import { createContext } from 'chakra-ui-2--react-utils';
+import { BoxProps, useMultiStyleConfig } from '@chakra-ui/react';
+import { createContext } from '@chakra-ui/react-utils';
 import Box from '../Box/Box';
 import Text from '../Text/Text';
 import Tooltip from '../Tooltip/Tooltip';

package/src/Components/DatePicker/DatePickerHeader.tsx

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { createContext } from 'chakra-ui-2--react-utils';
+import { createContext } from '@chakra-ui/react-utils';
 import { useObjectMemo } from '../../utils/utils';
 import Box, { BoxProps } from '../Box/Box';
 import IconButton from '../IconButton/IconButton';

package/src/Components/DatePicker/DatePickerMonth.tsx

@@ -6,7 +6,7 @@ import {
   NumberInput,
   NumberInputField,
   NumberInputStepper,
-} from 'chakra-ui-2--react';
+} from '@chakra-ui/react';
 import { useObjectMemo } from '../../utils/utils';
 import Button from '../Button/Button';
 import Box from '../Box/Box';

package/src/Components/DatePicker/DatePickerMonthSelector.tsx

@@ -6,7 +6,7 @@ import {
   NumberInputField,
   NumberInputStepper,
   useMultiStyleConfig,
-} from 'chakra-ui-2--react';
+} from '@chakra-ui/react';
 import { DateTime, Info } from 'luxon';
 import Box from '../Box/Box';
 import Text from '../Text/Text';

package/src/Components/DefinitionTooltip/DefinitionTooltip.theme.ts

@@ -1,4 +1,4 @@
-import { createMultiStyleConfigHelpers } from 'chakra-ui-2--styled-system';
+import { createMultiStyleConfigHelpers } from '@chakra-ui/styled-system';
 import { rem } from '../../utils/utils';
 
 const { defineMultiStyleConfig } = createMultiStyleConfigHelpers(['content', 'trigger']);

package/src/Components/DefinitionTooltip/DefinitionTooltip.tsx

@@ -1,4 +1,4 @@
-import { useMultiStyleConfig } from 'chakra-ui-2--react';
+import { useMultiStyleConfig } from '@chakra-ui/react';
 import Popover, { PopoverProps } from '../Popover/Popover';
 import PopoverContent from '../Popover/PopoverContent';
 import PopoverTrigger from '../Popover/PopoverTrigger';

package/src/Components/Dialog/Dialog.theme.ts

@@ -1,4 +1,4 @@
-import type { ComponentStyleConfig } from 'chakra-ui-2--theme';
+import type { ComponentStyleConfig } from '@chakra-ui/theme';
 
 const DialogTheme: ComponentStyleConfig = {
   baseStyle: ({ scrollBehavior }) => ({

package/src/Components/Dialog/Dialog.tsx

@@ -8,7 +8,7 @@ import {
   ModalOverlay,
   useBreakpointValue,
   usePrefersReducedMotion,
-} from 'chakra-ui-2--react';
+} from '@chakra-ui/react';
 import { BREAKPOINTS } from '../../types/bitkit';
 import Icon from '../Icon/Icon';
 import Text from '../Text/Text';

package/src/Components/Dialog/DialogBody.tsx

@@ -1,5 +1,5 @@
 import { useRef, useState, useEffect, useCallback } from 'react';
-import { ModalBody, ModalBodyProps, useModalContext } from 'chakra-ui-2--react';
+import { ModalBody, ModalBodyProps, useModalContext } from '@chakra-ui/react';
 import Box, { BoxProps } from '../Box/Box';
 import Icon from '../Icon/Icon';
 import { useDialogContext } from './Dialog.context';

package/src/Components/Dialog/DialogFooter.tsx

@@ -1,4 +1,4 @@
-import { ModalFooter, ModalFooterProps } from 'chakra-ui-2--react';
+import { ModalFooter, ModalFooterProps } from '@chakra-ui/react';
 
 export type DialogFooterProps = ModalFooterProps;
 

package/src/Components/Dialog/DialogProps.ts

@@ -1,4 +1,4 @@
-import { HTMLChakraProps, ModalProps } from 'chakra-ui-2--react';
+import { HTMLChakraProps, ModalProps } from '@chakra-ui/react';
 
 export interface DialogProps
   extends Omit<HTMLChakraProps<'section'>, 'scrollBehavior'>,

package/src/Components/Divider/Divider.tsx

@@ -1,4 +1,4 @@
-import { Divider as ChakraDivider, DividerProps as ChakraDividerProps } from 'chakra-ui-2--react';
+import { Divider as ChakraDivider, DividerProps as ChakraDividerProps } from '@chakra-ui/react';
 
 export interface DividerProps extends ChakraDividerProps {
   orientation?: 'horizontal' | 'vertical';

package/src/Components/Dot/Dot.tsx

@@ -1,4 +1,4 @@
-import { BoxProps, forwardRef } from 'chakra-ui-2--react';
+import { BoxProps, forwardRef } from '@chakra-ui/react';
 import Box from '../Box/Box';
 
 export interface DotProps extends BoxProps {

package/src/Components/DraggableCard/DraggableCard.theme.ts

@@ -1,5 +1,5 @@
 /* eslint-disable no-underscore-dangle */
-import { createMultiStyleConfigHelpers } from 'chakra-ui-2--styled-system';
+import { createMultiStyleConfigHelpers } from '@chakra-ui/styled-system';
 
 const keys = ['card', 'wrapper', 'handler'];
 const { defineMultiStyleConfig } = createMultiStyleConfigHelpers(keys);

package/src/Components/DraggableCard/DraggableCard.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 /* eslint-disable no-underscore-dangle */
 import { ForwardedRef, forwardRef } from 'react';
-import { useMultiStyleConfig } from 'chakra-ui-2--react';
+import { useMultiStyleConfig } from '@chakra-ui/react';
 import Box from '../Box/Box';
 import Card, { CardProps } from '../Card/Card';
 

package/src/Components/Drawer/Drawer.theme.ts

@@ -1,4 +1,4 @@
-import { createMultiStyleConfigHelpers } from 'chakra-ui-2--styled-system';
+import { createMultiStyleConfigHelpers } from '@chakra-ui/styled-system';
 
 const { defineMultiStyleConfig } = createMultiStyleConfigHelpers([
   'overlay',

package/src/Components/Drawer/Drawer.tsx

@@ -14,7 +14,7 @@ import {
   ModalFooterProps,
   ModalHeaderProps,
   ModalOverlayProps,
-} from 'chakra-ui-2--react';
+} from '@chakra-ui/react';
 import Icon from '../Icon/Icon';
 
 export interface DrawerProps

package/src/Components/Drawer/useDrawer.tsx

@@ -7,7 +7,7 @@ import {
   ModalHeaderProps,
   ModalOverlayProps,
   useDisclosure,
-} from 'chakra-ui-2--react';
+} from '@chakra-ui/react';
 import Drawer from './Drawer';
 
 export type UseDrawerProps = {

package/src/Components/Dropdown/Dropdown.context.tsx

@@ -1,6 +1,6 @@
 import { ComponentProps, ReactNode } from 'react';
-import { createStylesContext } from 'chakra-ui-2--react';
-import { createContext } from 'chakra-ui-2--react-utils';
+import { createStylesContext } from '@chakra-ui/react';
+import { createContext } from '@chakra-ui/react-utils';
 import { DropdownProps } from './DropdownProps';
 
 const [DropdownStylesProvider, useDropdownStyles] = createStylesContext('Dropdown');

package/src/Components/Dropdown/Dropdown.tsx

@@ -20,7 +20,7 @@ import {
   useControllableState,
   useMergeRefs,
   useMultiStyleConfig,
-} from 'chakra-ui-2--react';
+} from '@chakra-ui/react';
 import { FloatingFocusManager } from '@floating-ui/react-dom-interactions';
 import ProgressSpinner from '../ProgressSpinner/ProgressSpinner';
 import SearchInput from '../SearchInput/SearchInput';

package/src/Components/Dropdown/DropdownButton.tsx

@@ -1,5 +1,5 @@
 import { forwardRef, ReactNode } from 'react';
-import { chakra, ChakraProps } from 'chakra-ui-2--react';
+import { chakra, ChakraProps } from '@chakra-ui/react';
 import Icon, { TypeIconName } from '../Icon/Icon';
 import Avatar, { AvatarProps } from '../Avatar/Avatar';
 import { useDropdownStyles } from './Dropdown.context';

package/src/Components/Dropdown/DropdownOption.tsx

@@ -1,5 +1,5 @@
 import { MouseEventHandler, ReactNode, useId } from 'react';
-import { Avatar, AvatarProps, chakra } from 'chakra-ui-2--react';
+import { Avatar, AvatarProps, chakra } from '@chakra-ui/react';
 import clsx from 'clsx';
 import Text, { TextProps } from '../Text/Text';
 import Divider from '../Divider/Divider';

package/src/Components/Dropdown/DropdownProps.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { ChakraProps } from 'chakra-ui-2--react';
+import { ChakraProps } from '@chakra-ui/react';
 import { UseFloatingProps } from '@floating-ui/react-dom-interactions';
 import { TypeIconName } from '../Icon/Icon';
 import { TooltipProps } from '../Tooltip/Tooltip';

package/src/Components/Dropdown/hooks/useFloatingDropdown.ts

@@ -12,8 +12,8 @@ import {
   useListNavigation,
   useRole,
 } from '@floating-ui/react-dom-interactions';
-import { ChakraProps } from 'chakra-ui-2--react';
-import { mergeRefs } from 'chakra-ui-2--react-utils';
+import { ChakraProps } from '@chakra-ui/react';
+import { mergeRefs } from '@chakra-ui/react-utils';
 import useAutoScroll from './useAutoScroll';
 
 type ApplyFnArgs = MiddlewareState & {

package/src/Components/Dropdown/hooks/useSimpleSearch.tsx

@@ -1,5 +1,5 @@
 import { Children, cloneElement, isValidElement, ReactNode, useMemo, useState } from 'react';
-import { chakra } from 'chakra-ui-2--react';
+import { chakra } from '@chakra-ui/react';
 import { useDropdownStyles } from '../Dropdown.context';
 import isNodeMatch from '../isNodeMatch';
 import { DropdownGroup } from '../DropdownOption';

package/src/Components/EmptyState/EmptyState.theme.ts

@@ -1,4 +1,4 @@
-import type { ComponentStyleConfig } from 'chakra-ui-2--theme';
+import type { ComponentStyleConfig } from '@chakra-ui/theme';
 
 const EmptyStateTheme: ComponentStyleConfig = {
   baseStyle: ({ maxContentWidth, colorScheme }) => ({

package/src/Components/EmptyState/EmptyState.tsx

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { useMultiStyleConfig } from 'chakra-ui-2--react';
+import { useMultiStyleConfig } from '@chakra-ui/react';
 import Box, { BoxProps } from '../Box/Box';
 import Icon, { TypeIconName } from '../Icon/Icon';
 import Text from '../Text/Text';

package/src/Components/ExpandableCard/ExpandableCard.theme.ts

@@ -1,4 +1,4 @@
-import { createMultiStyleConfigHelpers } from 'chakra-ui-2--styled-system';
+import { createMultiStyleConfigHelpers } from '@chakra-ui/styled-system';
 
 const { defineMultiStyleConfig } = createMultiStyleConfigHelpers(['button', 'chevron']);
 

package/src/Components/ExpandableCard/ExpandableCard.tsx

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { forwardRef, useDisclosure, useMultiStyleConfig } from 'chakra-ui-2--react';
+import { forwardRef, useDisclosure, useMultiStyleConfig } from '@chakra-ui/react';
 import Box, { BoxProps } from '../Box/Box';
 import Collapse from '../Collapse/Collapse';
 import Card, { CardProps } from '../Card/Card';

package/src/Components/Fade/Fade.tsx

@@ -1,4 +1,4 @@
-import { Fade, FadeProps } from 'chakra-ui-2--react';
+import { Fade, FadeProps } from '@chakra-ui/react';
 
 export type { FadeProps };
 export default Fade;

package/src/Components/Filter/Filter.context.tsx

@@ -1,4 +1,4 @@
-import { createContext } from 'chakra-ui-2--react-utils';
+import { createContext } from '@chakra-ui/react-utils';
 import { FilterContextType } from './Filter.types';
 
 export const [FilterContext, useFilterContext] = createContext<FilterContextType>({

package/src/Components/Filter/Filter.theme.ts

@@ -1,4 +1,4 @@
-import { createMultiStyleConfigHelpers, SystemStyleObject } from 'chakra-ui-2--styled-system';
+import { createMultiStyleConfigHelpers, SystemStyleObject } from '@chakra-ui/styled-system';
 import { rem } from '../../utils/utils';
 
 export const parts = [

package/src/Components/Filter/Filter.tsx

@@ -1,5 +1,5 @@
 import { ReactNode, useMemo, useState } from 'react';
-import { Modal, ModalOverlay, useMultiStyleConfig } from 'chakra-ui-2--react';
+import { Modal, ModalOverlay, useMultiStyleConfig } from '@chakra-ui/react';
 import { isEqual } from '../../utils/utils';
 import Box, { BoxProps } from '../Box/Box';
 import Button from '../Button/Button';

package/src/Components/Filter/FilterAdd/FilterAdd.tsx

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { Menu, MenuButton, MenuList, Portal, useDisclosure } from 'chakra-ui-2--react';
+import { Menu, MenuButton, MenuList, Portal, useDisclosure } from '@chakra-ui/react';
 import Button from '../../Button/Button';
 import MenuItem from '../../Menu/MenuItem';
 import Tooltip from '../../Tooltip/Tooltip';

package/src/Components/Filter/FilterDate/FilterDate.tsx

@@ -1,6 +1,6 @@
 // import { useEffect } from 'react';
 import { useEffect } from 'react';
-import { useDisclosure, useMultiStyleConfig } from 'chakra-ui-2--react';
+import { useDisclosure, useMultiStyleConfig } from '@chakra-ui/react';
 import { DateTime } from 'luxon';
 import Box from '../../Box/Box';
 import DatePicker, { DatePickerProps, DateRange, useDateRange } from '../../DatePicker/DatePicker';

package/src/Components/Filter/FilterForm/FilterForm.tsx

@@ -1,5 +1,5 @@
 import { FormEvent, useEffect, useMemo, useState } from 'react';
-import { useMultiStyleConfig } from 'chakra-ui-2--react';
+import { useMultiStyleConfig } from '@chakra-ui/react';
 import FocusLock from 'react-focus-lock';
 import Tooltip from '../../Tooltip/Tooltip';
 import Badge from '../../Badge/Badge';

package/src/Components/Filter/FilterItem/FilterItem.tsx

@@ -1,5 +1,5 @@
 import { useEffect } from 'react';
-import { useDisclosure, useMultiStyleConfig } from 'chakra-ui-2--react';
+import { useDisclosure, useMultiStyleConfig } from '@chakra-ui/react';
 import Box from '../../Box/Box';
 import Icon from '../../Icon/Icon';
 import IconButton from '../../IconButton/IconButton';