@bitrise/bitkit 13.205.0 → 13.207.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitrise/bitkit",
   "description": "Bitrise React component library",
-  "version": "13.205.0",
+  "version": "13.207.0",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@github.com/bitrise-io/bitkit.git"
@@ -27,7 +27,7 @@
     "framer-motion": "./node_modules/framer-motion/dist/cjs"
   },
   "dependencies": {
-    "@chakra-ui/react": "^2.10.4",
+    "@chakra-ui/react": "^2.10.5",
     "@chakra-ui/react-utils": "^2.0.12",
     "@chakra-ui/styled-system": "^2.12.1",
     "@chakra-ui/theme": "^3.4.7",
@@ -38,11 +38,11 @@
     "@floating-ui/react-dom-interactions": "^0.8.1",
     "@fontsource/figtree": "^5.1.2",
     "@fontsource/source-code-pro": "^5.1.1",
-    "framer-motion": "^11.16.0",
+    "framer-motion": "^11.18.2",
     "luxon": "^3.5.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-focus-lock": "2.13.5",
+    "react-focus-lock": "2.13.6",
     "react-imask": "^7.6.1",
     "react-markdown": "^9.0.3"
   },
@@ -51,26 +51,26 @@
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.26.0",
-    "@babel/preset-env": "^7.26.0",
+    "@babel/core": "^7.26.8",
+    "@babel/preset-env": "^7.26.8",
     "@babel/preset-react": "^7.26.3",
     "@babel/preset-typescript": "^7.26.0",
     "@bitrise/eslint-plugin": "^2.12.0",
     "@chakra-ui/cli": "^2.5.6",
-    "@google-cloud/storage": "^7.14.0",
-    "@storybook/addon-actions": "^8.4.7",
-    "@storybook/addon-essentials": "^8.4.7",
-    "@storybook/addon-interactions": "^8.4.7",
-    "@storybook/addon-links": "^8.4.7",
+    "@google-cloud/storage": "^7.15.0",
+    "@storybook/addon-actions": "^8.5.3",
+    "@storybook/addon-essentials": "^8.5.3",
+    "@storybook/addon-interactions": "^8.5.3",
+    "@storybook/addon-links": "^8.5.3",
     "@storybook/addon-webpack5-compiler-swc": "^2.0.0",
-    "@storybook/blocks": "^8.4.7",
-    "@storybook/react": "^8.4.7",
-    "@storybook/react-webpack5": "^8.4.7",
-    "@storybook/theming": "^8.4.7",
+    "@storybook/blocks": "^8.5.3",
+    "@storybook/react": "^8.5.3",
+    "@storybook/react-webpack5": "^8.5.3",
+    "@storybook/theming": "^8.5.3",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "6.6.3",
-    "@testing-library/react": "16.1.0",
-    "@testing-library/user-event": "^14.5.2",
+    "@testing-library/react": "16.2.0",
+    "@testing-library/user-event": "^14.6.1",
     "@types/jest": "^29.5.14",
     "@types/luxon": "^3.4.2",
     "@types/react": "^18.3.18",
@@ -79,17 +79,17 @@
     "@typescript-eslint/parser": "^7.18.0",
     "axios": "^1.7.9",
     "eslint": "^8.57.1",
-    "glob": "^11.0.0",
+    "glob": "^11.0.1",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
     "jsdom": "25.0.1",
     "lodash": "^4.17.21",
-    "prettier": "^3.4.2",
+    "prettier": "^3.5.0",
     "react-hook-form": "^7.54.2",
-    "release-it": "^18.0.0",
-    "storybook": "^8.4.7",
+    "release-it": "^18.1.2",
+    "storybook": "^8.5.3",
     "ts-jest": "^29.2.5",
-    "typescript": "^5.7.2"
+    "typescript": "^5.7.3"
   },
   "files": [
     "src",

package/src/Components/Form/Input/Input.tsx

@@ -20,6 +20,7 @@ import {
 import Icon, { TypeIconName } from '../../Icon/Icon';
 import { TooltipProps } from '../../Tooltip/Tooltip';
 import FormLabel, { FormLabelProps } from '../FormLabel';
+import { getDataAttributes } from '../../../utils/utils';
 
 type UsedFormControlProps = Omit<FormControlProps, 'label' | 'onBlur' | 'onChange'>;
 type UsedChakraInputProps = Pick<
@@ -42,7 +43,6 @@ type UsedChakraInputProps = Pick<
 >;
 export interface InputProps extends UsedFormControlProps, UsedChakraInputProps {
   badge?: FormLabelProps['badge'];
-  'data-testid'?: string;
   errorText?: ReactNode;
   infoTooltipLabel?: string;
   infoTooltipProps?: TooltipProps;
@@ -74,7 +74,6 @@ const Input = forwardRef<InputProps, 'div'>((props, ref) => {
     autoComplete,
     autoFocus,
     badge,
-    'data-testid': dataTestid,
     defaultValue,
     errorText,
     helperText,
@@ -124,7 +123,6 @@ const Input = forwardRef<InputProps, 'div'>((props, ref) => {
   const inputProps = {
     autoComplete,
     autoFocus,
-    'data-testid': dataTestid,
     defaultValue,
     max,
     maxLength,
@@ -142,6 +140,8 @@ const Input = forwardRef<InputProps, 'div'>((props, ref) => {
     value,
   };
 
+  const dataAttributes = getDataAttributes(rest);
+
   const inputInlinePadding = size === 'lg' ? '15' : '11';
 
   const RightContentWrapper = rightAddonPlacement === 'inside' ? InputRightElement : InputRightAddon;
@@ -193,6 +193,7 @@ const Input = forwardRef<InputProps, 'div'>((props, ref) => {
           paddingLeft={inputLeftPadding}
           paddingRight={inputRightPadding}
           {...inputProps}
+          {...dataAttributes}
           onChange={onInputChange}
         />
         {rightAddon && <RightContentWrapper>{rightAddon}</RightContentWrapper>}

package/src/Components/Form/Textarea/Textarea.tsx

@@ -10,6 +10,7 @@ import {
 } from '@chakra-ui/react';
 import { TooltipProps } from '../../Tooltip/Tooltip';
 import FormLabel, { FormLabelProps } from '../FormLabel';
+import { getDataAttributes } from '../../../utils/utils';
 
 type UsedFormControlProps = Omit<FormControlProps, 'label' | 'onBlur' | 'onChange'>;
 type UsedChakraTextProps = Pick<
@@ -28,7 +29,6 @@ type UsedChakraTextProps = Pick<
 
 export interface TextareaProps extends UsedFormControlProps, UsedChakraTextProps {
   badge?: FormLabelProps['badge'];
-  'data-testid'?: string;
   errorText?: string;
   infoTooltipLabel?: string;
   infoTooltipProps?: TooltipProps;
@@ -50,7 +50,6 @@ const Textarea = forwardRef<TextareaProps, 'div'>((props, ref) => {
     autoComplete,
     autoFocus,
     badge,
-    'data-testid': dataTestid,
     errorText,
     helperText,
     infoTooltipLabel,
@@ -80,7 +79,6 @@ const Textarea = forwardRef<TextareaProps, 'div'>((props, ref) => {
   const textareaProps = {
     autoComplete,
     autoFocus,
-    'data-testid': dataTestid,
     maxLength,
     minLength,
     name,
@@ -101,6 +99,8 @@ const Textarea = forwardRef<TextareaProps, 'div'>((props, ref) => {
     }
   };
 
+  const dataAttributes = getDataAttributes(props);
+
   return (
     <FormControl {...formControlProps}>
       <FormLabel
@@ -114,7 +114,7 @@ const Textarea = forwardRef<TextareaProps, 'div'>((props, ref) => {
         {label}
       </FormLabel>
 
-      <ChakraTextarea {...textareaProps} onChange={onTextareaChange} />
+      <ChakraTextarea {...textareaProps} {...dataAttributes} onChange={onTextareaChange} />
       {errorText && <FormErrorMessage as="p">{errorText}</FormErrorMessage>}
       {helperText && <FormHelperText as="p">{helperText}</FormHelperText>}
     </FormControl>

package/src/Components/Select/Select.tsx

@@ -14,6 +14,7 @@ import Icon from '../Icon/Icon';
 import ProgressSpinner from '../ProgressSpinner/ProgressSpinner';
 import FormLabel, { FormLabelProps } from '../Form/FormLabel';
 import { TooltipProps } from '../Tooltip/Tooltip';
+import { getDataAttributes } from '../../utils/utils';
 
 export interface SelectProps extends Omit<FormControlProps, 'label' | 'onBlur' | 'onChange'> {
   badge?: FormLabelProps['badge'];
@@ -72,6 +73,9 @@ const Select = forwardRef<SelectProps, 'div'>((props, ref) => {
     size,
     value,
   };
+
+  const dataAttributes = getDataAttributes(props);
+
   if (placeholder) {
     if ('value' in props) {
       selectProperties.value = selectProperties.value ?? '';
@@ -92,7 +96,7 @@ const Select = forwardRef<SelectProps, 'div'>((props, ref) => {
         {label}
       </FormLabel>
       <Box sx={style.selectContainer}>
-        <ChakraSelect ref={ref} {...selectProperties} sx={style.field}>
+        <ChakraSelect ref={ref} {...selectProperties} {...dataAttributes} sx={style.field}>
           {placeholder && (
             <option disabled value="">
               {placeholder}