@bitrise/bitkit 13.251.0 → 13.253.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitrise/bitkit",
   "description": "Bitrise React component library",
-  "version": "13.251.0",
+  "version": "13.253.0",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@github.com/bitrise-io/bitkit.git"

package/src/Components/Dropdown/Dropdown.tsx

@@ -37,7 +37,7 @@ import { NoResultsFound, useSimpleSearch } from './hooks/useSimpleSearch';
 import { isSearchable } from './isNodeMatch';
 import { DropdownProps } from './DropdownProps';
 
-const MultiSelectContext = createContext(false);
+const MultiSelectContext = createContext<{ invalidValues?: string[] } | undefined>(undefined);
 
 type DropdownSearchCustomProps = {
   value: string;
@@ -174,7 +174,8 @@ function useDropdown<T>({
     setSelectedIndex,
   } = useFloatingDropdown({ dropdownWidth, enabled: !readOnly, optionsRef, placement });
 
-  const isMultiSelect = useContext(MultiSelectContext);
+  const multiSelectContext = useContext(MultiSelectContext);
+  const isMultiSelect = Boolean(multiSelectContext);
 
   const [formValue, setFormValue] = useControllableState<T>({
     defaultValue: isMultiSelect ? defaultValue || ([] as T) : defaultValue,
@@ -291,9 +292,10 @@ function useDropdown<T>({
                     return <>{formValueItem}</>;
                   }
 
+                  const colors = multiSelectContext?.invalidValues?.includes(formValueItem) ? 'red' : 'neutral';
                   return (
                     <Tag
-                      colorScheme="neutral"
+                      colorScheme={colors}
                       isDisabled={disabled}
                       key={formValueItem}
                       onClose={(event) => {
@@ -556,13 +558,14 @@ export function typedDropdown<T>() {
   };
 }
 
-export const MultiSelectDropdown = (props: DropdownProps<(string | null)[]>) => {
+export const MultiSelectDropdown = (props: DropdownProps<(string | null)[]> & { invalidValues?: string[] }) => {
   const { Dropdown: TypedDropdown } = typedDropdown<(string | null)[]>();
 
-  const { children, ...rest } = props;
+  const { children, invalidValues, ...rest } = props;
+  const contextValue = useMemo(() => ({ invalidValues }), [invalidValues]);
 
   return (
-    <MultiSelectContext.Provider value>
+    <MultiSelectContext.Provider value={contextValue}>
       <TypedDropdown {...rest}>{children}</TypedDropdown>
     </MultiSelectContext.Provider>
   );

package/src/Components/Icons/16x16/Git.tsx

@@ -0,0 +1,14 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const Git = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <path
+      clipRule="evenodd"
+      d="M14.7362 7.37647L8.62353 1.2643C8.53985 1.18052 8.44048 1.11405 8.3311 1.0687C8.22172 1.02334 8.10446 1 7.98605 1C7.86764 1 7.75039 1.02334 7.641 1.0687C7.53162 1.11405 7.43225 1.18052 7.34858 1.2643L6.07911 2.53375L7.68895 4.14357C7.87821 4.0793 8.08169 4.06926 8.27636 4.1146C8.47103 4.15995 8.64913 4.25886 8.79051 4.40015C8.93265 4.54248 9.03191 4.7219 9.07698 4.91794C9.12205 5.11398 9.11111 5.31874 9.04541 5.50886L10.5969 7.06047C10.787 6.99441 10.9918 6.98327 11.188 7.02833C11.3841 7.07339 11.5636 7.17282 11.7058 7.31522C11.8054 7.41482 11.8844 7.53307 11.9383 7.66322C11.9923 7.79337 12.02 7.93286 12.02 8.07373C12.02 8.21461 11.9923 8.3541 11.9383 8.48425C11.8844 8.6144 11.8054 8.73265 11.7058 8.83225C11.5045 9.03345 11.2315 9.14647 10.9469 9.14647C10.6623 9.14647 10.3894 9.03345 10.1881 8.83225C10.0383 8.68252 9.93616 8.49178 9.89462 8.28407C9.85308 8.07637 9.87399 7.86102 9.9547 7.66519L8.50728 6.21824V10.0267C8.66005 10.1022 8.79265 10.213 8.89408 10.3499C8.99552 10.4868 9.06287 10.6459 9.09057 10.8141C9.11827 10.9822 9.10552 11.1545 9.05336 11.3167C9.00121 11.4789 8.91116 11.6264 8.79067 11.7469C8.69106 11.8465 8.57281 11.9255 8.44266 11.9794C8.31251 12.0333 8.17302 12.0611 8.03214 12.0611C7.89126 12.0611 7.75177 12.0333 7.62162 11.9794C7.49147 11.9255 7.37322 11.8465 7.27361 11.7469C7.17397 11.6473 7.09492 11.529 7.04099 11.3988C6.98706 11.2687 6.9593 11.1292 6.9593 10.9883C6.9593 10.8474 6.98706 10.7079 7.04099 10.5777C7.09492 10.4475 7.17397 10.3293 7.27361 10.2297C7.3741 10.129 7.49364 10.0492 7.62526 9.9952V6.15166C7.49363 6.09792 7.37407 6.0184 7.27361 5.91779C7.12317 5.76715 7.02089 5.57521 6.97976 5.36632C6.93864 5.15744 6.96052 4.94105 7.04264 4.74463L5.45535 3.15736L1.26422 7.34782C1.18045 7.43155 1.11401 7.53097 1.06867 7.64039C1.02333 7.7498 1 7.86708 1 7.98552C1 8.10396 1.02333 8.22123 1.06867 8.33065C1.11401 8.44007 1.18045 8.53948 1.26422 8.62322L7.37707 14.7361C7.54619 14.9051 7.77548 15 8.01454 15C8.25361 15 8.48289 14.9051 8.65202 14.7361L14.7362 8.65186C14.9051 8.48262 15 8.25327 15 8.01416C15 7.77505 14.9051 7.54571 14.7362 7.37647Z"
+      fill="currentColor"
+      fillRule="evenodd"
+    />
+  </Icon>
+));
+
+export default Git;

package/src/Components/Icons/16x16/index.ts

@@ -109,6 +109,7 @@ export { default as Folder } from './Folder';
 export { default as Fullscreen } from './Fullscreen';
 export { default as FullscreenExit } from './FullscreenExit';
 export { default as Gauge } from './Gauge';
+export { default as Git } from './Git';
 export { default as Github } from './Github';
 export { default as GitlabColor } from './GitlabColor';
 export { default as GitlabPlain } from './GitlabPlain';

package/src/Components/Icons/24x24/Git.tsx

@@ -0,0 +1,14 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const Git = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 24 24" {...props}>
+    <path
+      clipRule="evenodd"
+      d="M21.6232 11.1092L12.8908 2.37758C12.7712 2.25788 12.6293 2.16292 12.473 2.09814C12.3167 2.03335 12.1492 2 11.9801 2C11.8109 2 11.6434 2.03335 11.4871 2.09814C11.3309 2.16292 11.1889 2.25788 11.0694 2.37758L9.25587 4.19108L11.5556 6.49082C11.826 6.399 12.1167 6.38466 12.3948 6.44943C12.6729 6.51421 12.9273 6.65551 13.1293 6.85735C13.3324 7.06069 13.4742 7.31701 13.5385 7.59706C13.6029 7.87711 13.5873 8.16963 13.4934 8.44122L15.7099 10.6578C15.9814 10.5634 16.2741 10.5475 16.5543 10.6119C16.8344 10.6763 17.0908 10.8183 17.294 11.0217C17.4363 11.164 17.5492 11.333 17.6262 11.5189C17.7032 11.7048 17.7429 11.9041 17.7429 12.1053C17.7429 12.3066 17.7032 12.5059 17.6262 12.6918C17.5492 12.8777 17.4363 13.0466 17.294 13.1889C17.0064 13.4764 16.6165 13.6378 16.2099 13.6378C15.8034 13.6378 15.4134 13.4764 15.1259 13.1889C14.9118 12.975 14.7659 12.7025 14.7066 12.4058C14.6473 12.1091 14.6771 11.8015 14.7924 11.5217L12.7247 9.45463V14.8953C12.9429 15.0032 13.1324 15.1614 13.2773 15.357C13.4222 15.5526 13.5184 15.7799 13.558 16.0201C13.5975 16.2603 13.5793 16.5064 13.5048 16.7382C13.4303 16.9699 13.3017 17.1805 13.1295 17.3527C12.9872 17.495 12.8183 17.6079 12.6324 17.6849C12.4464 17.7619 12.2472 17.8016 12.0459 17.8016C11.8447 17.8016 11.6454 17.7619 11.4595 17.6849C11.2735 17.6079 11.1046 17.495 10.9623 17.3527C10.82 17.2104 10.707 17.0414 10.63 16.8555C10.5529 16.6695 10.5133 16.4702 10.5133 16.269C10.5133 16.0677 10.5529 15.8684 10.63 15.6824C10.707 15.4965 10.82 15.3276 10.9623 15.1853C11.1059 15.0414 11.2766 14.9275 11.4647 14.8503V9.35951C11.2766 9.28274 11.1058 9.16914 10.9623 9.02541C10.7474 8.81022 10.6013 8.53601 10.5425 8.2376C10.4838 7.9392 10.515 7.63007 10.6323 7.34947L8.36478 5.08194L2.37746 11.0683C2.25779 11.1879 2.16287 11.33 2.0981 11.4863C2.03333 11.6426 2 11.8101 2 11.9793C2 12.1485 2.03333 12.316 2.0981 12.4724C2.16287 12.6287 2.25779 12.7707 2.37746 12.8903L11.1101 21.6231C11.3517 21.8644 11.6793 22 12.0208 22C12.3623 22 12.6898 21.8644 12.9315 21.6231L21.6232 12.9312C21.8645 12.6895 22 12.3618 22 12.0202C22 11.6786 21.8645 11.351 21.6232 11.1092Z"
+      fill="currentColor"
+      fillRule="evenodd"
+    />
+  </Icon>
+));
+
+export default Git;

package/src/Components/Icons/24x24/index.ts

@@ -107,6 +107,7 @@ export { default as Folder } from './Folder';
 export { default as Fullscreen } from './Fullscreen';
 export { default as FullscreenExit } from './FullscreenExit';
 export { default as Gauge } from './Gauge';
+export { default as Git } from './Git';
 export { default as Github } from './Github';
 export { default as GitlabColor } from './GitlabColor';
 export { default as GitlabPlain } from './GitlabPlain';