@bitrise/bitkit 12.24.0 → 12.26.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitrise/bitkit",
   "description": "Bitrise React component library",
-  "version": "12.24.0",
+  "version": "12.26.0",
   "repository": "git@github.com:bitrise-io/bitkit.git",
   "main": "src/index.ts",
   "license": "UNLICENSED",

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

@@ -0,0 +1,14 @@
+import { Icon, IconProps, forwardRef } from '@chakra-ui/react';
+
+const Replace = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M2.00001 0.666586H0.666672L0.666672 4.66659H0.834695H2.22761H4.66667V3.33325H3.01853C3.75096 2.51492 4.81534 1.99992 6 1.99992C8.20914 1.99992 10 3.79078 10 5.99992H11.3333C11.3333 3.0544 8.94552 0.666586 6 0.666586C4.40708 0.666586 2.97726 1.36493 2.00001 2.47215L2.00001 0.666586ZM9.7724 7.33325H7.33334V8.66659H8.98148C8.24905 9.48492 7.18467 9.99992 6 9.99992C3.79087 9.99992 2.00001 8.20906 2.00001 5.99992H0.666672C0.666672 8.94544 3.05449 11.3333 6 11.3333C7.59293 11.3333 9.02275 10.6349 10 9.52768V11.3333H11.3333V7.33325H11.1653H9.7724Z"
+      fill="currentColor"
+    />
+  </Icon>
+));
+
+export default Replace;

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

@@ -146,6 +146,7 @@ export { default as Pull } from './Pull';
 export { default as Push } from './Push';
 export { default as ReactIcon } from './ReactIcon';
 export { default as Refresh } from './Refresh';
+export { default as Replace } from './Replace';
 export { default as Request } from './Request';
 export { default as Responsiveness } from './Responsiveness';
 export { default as Save } from './Save';

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

@@ -0,0 +1,14 @@
+import { Icon, IconProps, forwardRef } from '@chakra-ui/react';
+
+const Replace = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 24 24" {...props}>
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M2 0H0L0 6H0.252035H2.34141H6V4H3.52779C4.62643 2.7725 6.223 2 8 2C11.3137 2 14 4.68629 14 8H16C16 3.58172 12.4183 0 8 0C5.61061 0 3.46589 1.04751 2 2.70835V0ZM13.6586 10H10V12H12.4722C11.3736 13.2275 9.777 14 8 14C4.68629 14 2 11.3137 2 8H0C0 12.4183 3.58172 16 8 16C10.3894 16 12.5341 14.9525 14 13.2916V16H16V10H15.748H13.6586Z"
+      fill="currentColor"
+    />
+  </Icon>
+));
+
+export default Replace;

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

@@ -146,6 +146,7 @@ export { default as Pull } from './Pull';
 export { default as Push } from './Push';
 export { default as ReactIcon } from './ReactIcon';
 export { default as Refresh } from './Refresh';
+export { default as Replace } from './Replace';
 export { default as Request } from './Request';
 export { default as Responsiveness } from './Responsiveness';
 export { default as Save } from './Save';

package/src/theme.ts

@@ -36,7 +36,6 @@ import Sidebar from './Components/Sidebar/Sidebar.theme';
 import SidebarItem from './Components/Sidebar/SidebarItem.theme';
 import SegmentedControl from './Components/SegmentedControl/SegmentedControl.theme';
 import Tag from './Components/Tag/Tag.theme';
-import Annotation from './Components/Annotation/Annotation.theme';
 
 import breakpoints from './Foundations/Breakpoints/Breakpoints';
 import colors from './Foundations/Colors/Colors';
@@ -82,7 +81,6 @@ const theme = {
     },
   },
   components: {
-    Annotation,
     Accordion,
     Avatar,
     Badge,

package/src/Components/Annotation/Annotation.theme.ts

@@ -1,58 +0,0 @@
-import { Status } from './Annotation';
-
-const borderColor = {
-  info: 'separator.primary',
-  error: 'red.80',
-  warning: 'yellow.80',
-  success: 'green.80',
-};
-
-const decorationBackground = {
-  info: 'neutral.95',
-  error: 'red.95',
-  warning: 'yellow.95',
-  success: 'green.95',
-};
-
-const decorationColor = {
-  info: 'neutral.10',
-  error: 'red.50',
-  warning: 'yellow.50',
-  success: 'green.50',
-};
-const AnnotationTheme = {
-  parts: ['container', 'icon', 'body'],
-  baseStyle({ status }: { status: Status }) {
-    return {
-      wrapper: {
-        display: 'flex',
-        boxShadow: 'large',
-      },
-      decoration: {
-        color: decorationColor[status],
-        display: 'flex',
-        width: '32',
-        borderTopLeftRadius: '8',
-        borderBottomLeftRadius: '8',
-        borderWidth: '1px',
-        px: '4',
-        py: '12',
-        borderColor: borderColor[status],
-        bg: decorationBackground[status],
-      },
-      container: {
-        flexGrow: 1,
-        paddingLeft: '24',
-        paddingRight: '16',
-        py: '16',
-        borderTopRightRadius: '8',
-        borderBottomRightRadius: '8',
-        borderWidth: '1px',
-        borderLeft: 'none',
-        borderColor: borderColor[status],
-      },
-    };
-  },
-};
-
-export default AnnotationTheme;

package/src/Components/Annotation/Annotation.tsx

@@ -1,25 +0,0 @@
-import { ReactNode } from 'react';
-import { useMultiStyleConfig } from '@chakra-ui/react';
-import Box from '../Box/Box';
-import Icon from '../Icon/Icon';
-
-export type Status = 'info' | 'success' | 'error' | 'warning';
-const iconNames = {
-  info: 'Info',
-  success: 'Tick',
-  error: 'ErrorGeneral',
-  warning: 'Warning',
-} as const;
-const Annotation = ({ children, status }: { children: ReactNode; status: Status }) => {
-  const { container, decoration, wrapper } = useMultiStyleConfig('Annotation', { status });
-  return (
-    <Box __css={wrapper}>
-      <Box __css={decoration}>
-        <Icon size="24" name={iconNames[status]} />
-      </Box>
-      <Box __css={container}>{children}</Box>
-    </Box>
-  );
-};
-
-export default Annotation;