@bitrise/bitkit 13.319.0 → 13.321.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitrise/bitkit",
   "description": "Bitrise React component library",
-  "version": "13.319.0",
+  "version": "13.321.0",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@github.com/bitrise-io/bitkit.git"
@@ -38,11 +38,11 @@
     "chakra-ui-2--theme": "npm:@chakra-ui/theme@3.4.9",
     "chakra-ui-2--theme-tools": "npm:@chakra-ui/theme-tools@2.2.9",
     "clsx": "^2.1.1",
-    "framer-motion": "^12.23.22",
+    "framer-motion": "^12.23.24",
     "luxon": "^3.7.2",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-focus-lock": "2.13.6",
+    "react-focus-lock": "2.13.7",
     "react-imask": "^7.6.1",
     "react-markdown": "^10.1.0"
   },
@@ -51,39 +51,39 @@
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.28.4",
-    "@babel/preset-env": "^7.28.3",
-    "@babel/preset-react": "^7.27.1",
-    "@babel/preset-typescript": "^7.27.1",
+    "@babel/core": "^7.28.5",
+    "@babel/preset-env": "^7.28.5",
+    "@babel/preset-react": "^7.28.5",
+    "@babel/preset-typescript": "^7.28.5",
     "@bitrise/eslint-plugin": "^2.12.0",
-    "@google-cloud/storage": "^7.17.1",
-    "@storybook/addon-docs": "^9.1.10",
-    "@storybook/addon-links": "^9.1.10",
+    "@google-cloud/storage": "^7.17.3",
+    "@storybook/addon-docs": "^9.1.16",
+    "@storybook/addon-links": "^9.1.16",
     "@storybook/addon-webpack5-compiler-swc": "^3.0.0",
-    "@storybook/react-webpack5": "^9.1.10",
+    "@storybook/react-webpack5": "^9.1.16",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "16.3.0",
     "@testing-library/user-event": "^14.6.1",
     "@types/jest": "^29.5.14",
     "@types/luxon": "^3.7.1",
-    "@types/react": "^18.3.25",
+    "@types/react": "^18.3.27",
     "@types/react-dom": "^18.3.7",
     "@typescript-eslint/eslint-plugin": "^7.18.0",
     "@typescript-eslint/parser": "^7.18.0",
-    "axios": "^1.12.2",
+    "axios": "^1.13.2",
     "chakra-ui-2--cli": "npm:@chakra-ui/cli@2.5.8",
     "eslint": "^8.57.1",
-    "glob": "^11.0.3",
+    "glob": "^11.1.0",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
     "jsdom": "26.1.0",
     "lodash": "^4.17.21",
-    "prettier": "^3.6.2",
-    "react-hook-form": "^7.63.0",
-    "release-it": "^19.0.5",
-    "storybook": "^9.1.10",
-    "ts-jest": "^29.4.4",
+    "prettier": "^3.7.3",
+    "react-hook-form": "^7.67.0",
+    "release-it": "^19.0.6",
+    "storybook": "^9.1.16",
+    "ts-jest": "^29.4.5",
     "typescript": "^5.9.3"
   },
   "files": [

package/src/Components/Dialog/DialogProps.ts

@@ -1,8 +1,7 @@
 import { HTMLChakraProps, ModalProps } from 'chakra-ui-2--react';
 
 export interface DialogProps
-  extends Omit<HTMLChakraProps<'section'>, 'scrollBehavior'>,
-    Pick<ModalProps, 'returnFocusOnClose'> {
+  extends Omit<HTMLChakraProps<'section'>, 'scrollBehavior'>, Pick<ModalProps, 'returnFocusOnClose'> {
   isClosable?: boolean;
   isOpen: boolean;
   onClose(): void;

package/src/Components/Drawer/Drawer.tsx

@@ -17,8 +17,10 @@ import {
 } from 'chakra-ui-2--react';
 import Icon from '../Icon/Icon';
 
-export interface DrawerProps
-  extends Pick<ChakraDrawerProps, 'finalFocusRef' | 'initialFocusRef' | 'isOpen' | 'onClose' | 'onCloseComplete'> {
+export interface DrawerProps extends Pick<
+  ChakraDrawerProps,
+  'finalFocusRef' | 'initialFocusRef' | 'isOpen' | 'onClose' | 'onCloseComplete'
+> {
   blockScrollOnMount?: boolean;
   bodyRef?: React.RefObject<HTMLDivElement>;
   children: DrawerContentProps['children'];

package/src/Components/ExpandableCard/ExpandableCard.tsx

@@ -5,30 +5,29 @@ import Collapse from '../Collapse/Collapse';
 import Card, { CardProps } from '../Card/Card';
 import Icon from '../Icon/Icon';
 
-export interface ExpandableCardProps
-  extends Omit<
-    CardProps,
-    | 'p'
-    | 'pt'
-    | 'paddingTop'
-    | 'pr'
-    | 'paddingRight'
-    | 'pe'
-    | 'paddingEnd'
-    | 'pb'
-    | 'paddingBottom'
-    | 'pl'
-    | 'paddingLeft'
-    | 'ps'
-    | 'paddingStart'
-    | 'px'
-    | 'paddingX'
-    | 'py'
-    | 'paddingY'
-    | 'paddingInlineStart'
-    | 'paddingInlineEnd'
-    | 'onChange'
-  > {
+export interface ExpandableCardProps extends Omit<
+  CardProps,
+  | 'p'
+  | 'pt'
+  | 'paddingTop'
+  | 'pr'
+  | 'paddingRight'
+  | 'pe'
+  | 'paddingEnd'
+  | 'pb'
+  | 'paddingBottom'
+  | 'pl'
+  | 'paddingLeft'
+  | 'ps'
+  | 'paddingStart'
+  | 'px'
+  | 'paddingX'
+  | 'py'
+  | 'paddingY'
+  | 'paddingInlineStart'
+  | 'paddingInlineEnd'
+  | 'onChange'
+> {
   buttonContent: ReactNode;
   buttonPadding?: BoxProps['padding'];
   isExpanded?: boolean;

package/src/Components/Filter/Mobile/Filter.tsx

@@ -9,6 +9,7 @@ import FilterForm from './FilterForm';
 
 const Filter = ({ isLoading, showAdd = true }: FilterProps) => {
   const {
+    data,
     isPopoverOpen,
     onClearFilters,
     selectedCategory,
@@ -18,7 +19,11 @@ const Filter = ({ isLoading, showAdd = true }: FilterProps) => {
     state,
   } = useFilterContext();
 
-  const count = Object.values(state).filter((item) => item?.length > 0).length;
+  const isAllOptionForSwitch = (category: string) => {
+    return data[category].type === 'switch' && state[category]?.[0] === 'all';
+  };
+
+  const count = Object.entries(state).filter(([name, item]) => item?.length > 0 && !isAllOptionForSwitch(name)).length;
 
   return (
     <>

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

@@ -66,8 +66,10 @@ const FilterForm = ({ isOpen, onClose, selectedCategory }: FilterFormProps) => {
     onChange,
   });
 
+  const adjustedItems = type === 'switch' ? items.filter((item) => item !== 'all') : items;
+
   const { isScrollable } = useIsScrollable({
-    items,
+    items: adjustedItems,
     hasNotFilteredOption,
     ref: bodyRef,
   });
@@ -198,7 +200,7 @@ const FilterForm = ({ isOpen, onClose, selectedCategory }: FilterFormProps) => {
               currentOptionMap={currentOptionMap}
               emptyText={getEmptyText()}
               isLoading={isLoading}
-              items={items}
+              items={adjustedItems}
               onChange={setSelected}
               selectedItems={selected}
             />
@@ -209,7 +211,7 @@ const FilterForm = ({ isOpen, onClose, selectedCategory }: FilterFormProps) => {
               emptyText={getEmptyText()}
               hasNotFilteredOption={hasNotFilteredOption}
               isLoading={isLoading}
-              items={items}
+              items={adjustedItems}
               onChange={(option: string) => {
                 onChange(selectedCategory, [option]);
               }}

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

@@ -34,6 +34,10 @@ const FilterItem = ({ category }: FilterItemProps) => {
       return `${value.length} ${pluralCategoryString}`;
     }
 
+    if (type === 'switch' && value[0] === 'all') {
+      return `All ${pluralCategoryString}`;
+    }
+
     return getOptionLabel(value[0], optionsMap);
   };
 

package/src/Components/Filter/hooks/useFilterForm.ts

@@ -65,8 +65,12 @@ const useFilterForm = (props: Omit<FilterFormProps, 'onCancel'>) => {
   };
 
   const onClearClick = () => {
-    setSelected([]);
-    onChange(category, [], value);
+    let newValue: FilterValue = [];
+    if (data[category]?.type === 'switch') {
+      newValue = ['all'];
+    }
+    setSelected(newValue);
+    onChange(category, newValue, value);
   };
 
   const getEmptyText = () => {

package/src/Components/Form/Checkbox/Checkbox.tsx

@@ -15,8 +15,10 @@ type CheckboxInputProps = ChakraCheckboxProps['inputProps'] & {
   'data-testid'?: string;
 };
 
-export interface CheckboxProps
-  extends Omit<FormControlProps, 'icon' | 'iconColor' | 'iconSize' | 'inputProps' | 'value' | 'onChange'> {
+export interface CheckboxProps extends Omit<
+  FormControlProps,
+  'icon' | 'iconColor' | 'iconSize' | 'inputProps' | 'value' | 'onChange'
+> {
   inputProps?: CheckboxInputProps;
   helperText?: ReactNode;
   errorText?: string;

package/src/Components/Form/Radio/Radio.tsx

@@ -13,8 +13,10 @@ type RadioInputProps = ChakraRadioProps['inputProps'] & {
   'data-testid'?: string;
 };
 
-export interface RadioProps
-  extends Omit<FormControlProps, 'icon' | 'iconColor' | 'iconSize' | 'inputProps' | 'value' | 'onChange'> {
+export interface RadioProps extends Omit<
+  FormControlProps,
+  'icon' | 'iconColor' | 'iconSize' | 'inputProps' | 'value' | 'onChange'
+> {
   inputProps?: RadioInputProps;
   helperText?: ReactNode;
   errorText?: string;