@bitrise/bitkit 13.49.0 → 13.51.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitrise/bitkit",
   "description": "Bitrise React component library",
-  "version": "13.49.0",
+  "version": "13.51.0",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@github.com/bitrise-io/bitkit.git"
@@ -38,11 +38,11 @@
     "@floating-ui/react-dom-interactions": "^0.8.1",
     "@fontsource/figtree": "^5.0.19",
     "@fontsource/source-code-pro": "^5.0.17",
-    "framer-motion": "^11.0.27",
+    "framer-motion": "^11.1.2",
     "luxon": "^3.4.4",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-focus-lock": "^2.11.2",
+    "react-focus-lock": "^2.11.3",
     "react-imask": "^7.6.0",
     "react-markdown": "^9.0.1"
   },
@@ -57,26 +57,26 @@
     "@babel/preset-typescript": "^7.24.1",
     "@bitrise/eslint-plugin": "^2.10.2",
     "@chakra-ui/cli": "^2.4.1",
-    "@google-cloud/storage": "^7.9.0",
-    "@storybook/addon-actions": "^8.0.6",
-    "@storybook/addon-essentials": "^8.0.6",
-    "@storybook/addon-interactions": "^8.0.6",
-    "@storybook/addon-links": "^8.0.6",
+    "@google-cloud/storage": "^7.10.0",
+    "@storybook/addon-actions": "^8.0.8",
+    "@storybook/addon-essentials": "^8.0.8",
+    "@storybook/addon-interactions": "^8.0.8",
+    "@storybook/addon-links": "^8.0.8",
     "@storybook/addon-webpack5-compiler-swc": "^1.0.2",
-    "@storybook/blocks": "^8.0.6",
-    "@storybook/react": "^8.0.6",
-    "@storybook/react-webpack5": "^8.0.6",
-    "@storybook/theming": "^8.0.6",
+    "@storybook/blocks": "^8.0.8",
+    "@storybook/react": "^8.0.8",
+    "@storybook/react-webpack5": "^8.0.8",
+    "@storybook/theming": "^8.0.8",
     "@testing-library/dom": "^9.3.4",
     "@testing-library/jest-dom": "^6.4.2",
-    "@testing-library/react": "^14.3.0",
+    "@testing-library/react": "^14.3.1",
     "@testing-library/user-event": "^14.5.2",
     "@types/jest": "^29.5.12",
     "@types/luxon": "^3.4.2",
-    "@types/react": "^18.2.75",
-    "@types/react-dom": "^18.2.24",
-    "@typescript-eslint/eslint-plugin": "^7.6.0",
-    "@typescript-eslint/parser": "^7.6.0",
+    "@types/react": "^18.2.79",
+    "@types/react-dom": "^18.2.25",
+    "@typescript-eslint/eslint-plugin": "^7.7.0",
+    "@typescript-eslint/parser": "^7.7.0",
     "axios": "^1.6.8",
     "eslint": "^8.57.0",
     "glob": "^10.3.12",
@@ -84,9 +84,9 @@
     "jest-environment-jsdom": "^29.7.0",
     "jsdom": "^24.0.0",
     "prettier": "^3.2.5",
-    "react-hook-form": "^7.51.2",
-    "release-it": "^17.1.1",
-    "storybook": "^8.0.6",
+    "react-hook-form": "^7.51.3",
+    "release-it": "^17.2.0",
+    "storybook": "^8.0.8",
     "ts-jest": "^29.1.2",
     "typescript": "^5.4.5"
   },

package/src/Components/Dropdown/Dropdown.tsx

@@ -250,6 +250,7 @@ const Dropdown = forwardRef<Element, DropdownProps<string | null>>(
     {
       'aria-label': ariaLabel,
       buttonProps = {},
+      'data-testid': dataTestid,
       defaultValue,
       disabled,
       dropdownMaxHeight,
@@ -344,6 +345,7 @@ const Dropdown = forwardRef<Element, DropdownProps<string | null>>(
               {...referenceProps}
               {...buttonProps}
               aria-label={ariaLabel}
+              data-testid={dataTestid}
               id={buttonId}
               iconName={iconName}
               blurHandler={blurHandler}

package/src/Components/Dropdown/DropdownProps.ts

@@ -11,6 +11,7 @@ export interface DropdownProps<T> extends ChakraProps {
   'aria-label'?: string;
   buttonProps?: ChakraProps;
   children?: ReactNode;
+  'data-testid'?: string;
   defaultValue?: T;
   disabled?: boolean;
   dropdownMinHeight?: ChakraProps['minH'];

package/src/Components/ProgressIndicator/ProgressIndicator.tsx

@@ -5,11 +5,14 @@ import Icon, { IconProps } from '../Icon/Icon';
 import Text, { TextProps } from '../Text/Text';
 import Divider, { DividerProps } from '../Divider/Divider';
 import Link, { LinkProps } from '../Link/Link';
+import Tooltip, { TooltipProps } from '../Tooltip/Tooltip';
 
 type ProgressStage = {
   label: string;
   isInvalid?: boolean;
   isDisabled?: boolean;
+  isSkipped?: boolean;
+  tooltip?: Omit<TooltipProps, 'children'>;
   helperText?: string;
   action?: {
     onClick?: () => void;
@@ -74,7 +77,7 @@ const RealStage = ({
   extendLines,
   lastBlock,
   segmentIndex,
-  stage: { action, helperText, isDisabled, isInvalid, label },
+  stage: { action, tooltip, helperText, isDisabled, isInvalid, isSkipped, label },
   variant,
 }: Pick<ProgressIndicatorProps, 'variant'> & {
   segmentIndex: number;
@@ -106,6 +109,10 @@ const RealStage = ({
     iconColor = 'icon.disabled';
     textColor = 'text.disabled';
   }
+  if (isSkipped) {
+    iconName = 'StepstatusSkip';
+    textColor = 'text.disabled';
+  }
   const style = useMultiStyleConfig('ProgressIndicator', { variant });
 
   return (
@@ -121,7 +128,9 @@ const RealStage = ({
           ) : (
             <div />
           ))}
-        <Icon color={iconColor} name={iconName} transform={iconTransform} />
+        <Tooltip isDisabled={!tooltip} {...tooltip}>
+          <Icon color={iconColor} name={iconName} transform={iconTransform} />
+        </Tooltip>
         {lastBlock ? (
           <div />
         ) : (