@bitrise/bitkit 13.157.1-alpha.0 → 13.158.0

package/package.json

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

package/src/Components/DataWidget/DataWidgetItem.tsx

@@ -14,7 +14,7 @@ const DataWidgetItem = (props: DataWidgetItemProps) => {
   const { hasWarning, label, labelTooltip, value, valueTooltip } = props;
   return (
     <div>
-      {hasWarning && <Icon name="WarningYellow" size="16" marginInlineEnd="4" />}
+      {hasWarning && <Icon name="WarningColored" size="16" marginInlineEnd="4" />}
       <Text as="dt" color="text/primary" textStyle="body/md/semibold">
         {labelTooltip ? <DefinitionTooltip label={labelTooltip}>{label}</DefinitionTooltip> : label}
       </Text>

package/src/Components/Dropdown/DropdownButton.tsx

@@ -68,7 +68,7 @@ const DropdownButton = forwardRef<HTMLButtonElement, DropdownButtonProps>(
         >
           {formLabel || placeholder}
         </chakra.span>
-        {!isError && isWarning && <Icon aria-hidden="true" name="WarningYellow" size={iconSize} />}
+        {!isError && isWarning && <Icon aria-hidden="true" name="WarningColored" size={iconSize} />}
         {isError && <Icon aria-hidden="true" color="icon/negative" name="ErrorCircleFilled" size={iconSize} />}
         <Icon
           __css={chevronStyle}

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

@@ -34,7 +34,7 @@ const CustomIcon = (props: CheckboxIconProps) => {
   if (!isChecked) {
     return null;
   }
-  return <Icon __css={__css} name={isIndeterminate ? 'MinusClose' : 'Check'} />;
+  return <Icon __css={__css} name={isIndeterminate ? 'MinusClose' : 'Tick'} />;
 };
 
 /**

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

@@ -208,7 +208,7 @@ const Input = forwardRef<InputProps, 'div'>((props, ref) => {
               />
             )}
             {!isInvalid && (isWarning || warningText) && (
-              <Icon aria-hidden="true" name="WarningYellow" size={iconSize} sx={style.stateIcon} />
+              <Icon aria-hidden="true" name="WarningColored" size={iconSize} sx={style.stateIcon} />
             )}
             {isInvalid && (
               <Icon

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

@@ -0,0 +1,20 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const BuildstatusAborted = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <path
+      clipRule="evenodd"
+      d="M0 8a8 8 0 1 0 16 0A8 8 0 0 0 0 8Zm14.667 0A6.667 6.667 0 1 1 1.333 8a6.667 6.667 0 0 1 13.334 0Z"
+      fill="currentColor"
+      fillRule="evenodd"
+    />
+    <path
+      clipRule="evenodd"
+      d="m5.172 9.886 4.714-4.714.942.942-4.714 4.714-.942-.942Z"
+      fill="currentColor"
+      fillRule="evenodd"
+    />
+  </Icon>
+));
+
+export default BuildstatusAborted;

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

@@ -0,0 +1,14 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const BuildstatusAbortedSolid = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <path
+      clipRule="evenodd"
+      d="M8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16ZM9.886 5.172 5.172 9.886l.942.942 4.714-4.714-.942-.942Z"
+      fill="currentColor"
+      fillRule="evenodd"
+    />
+  </Icon>
+));
+
+export default BuildstatusAbortedSolid;

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

@@ -0,0 +1,20 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const BuildstatusLoading = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <path
+      clipRule="evenodd"
+      d="M8 14.667A6.667 6.667 0 1 0 8 1.333a6.667 6.667 0 0 0 0 13.334ZM8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16Z"
+      fill="currentColor"
+      fillRule="evenodd"
+    />
+    <path
+      clipRule="evenodd"
+      d="M8 11.333a3.333 3.333 0 1 0 0-6.666 3.333 3.333 0 0 0 0 6.666Zm0 1.334a4.667 4.667 0 1 1 0-9.334 4.667 4.667 0 0 1 0 9.334Z"
+      fill="currentColor"
+      fillRule="evenodd"
+    />
+  </Icon>
+));
+
+export default BuildstatusLoading;

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

@@ -0,0 +1,30 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const BuildstatusLoadingAnimated = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <circle cx={8} cy={8} fill="none" r={7} stroke="currentColor" strokeDasharray={48} strokeWidth={1.1}>
+      <animate attributeName="stroke-dashoffset" dur="3.5s" from={96} repeatCount="indefinite" to={0} />
+      <animateTransform
+        attributeName="transform"
+        dur="2s"
+        from="0 8 8"
+        repeatCount="indefinite"
+        to="360 8 8"
+        type="rotate"
+      />
+    </circle>
+    <circle cx={8} cy={8} fill="none" r={4} stroke="currentColor" strokeDasharray={48} strokeWidth={1.1}>
+      <animate attributeName="stroke-dashoffset" dur="3.5s" from={96} repeatCount="indefinite" to={0} />
+      <animateTransform
+        attributeName="transform"
+        dur="2s"
+        from="0 8 8"
+        repeatCount="indefinite"
+        to="360 8 8"
+        type="rotate"
+      />
+    </circle>
+  </Icon>
+));
+
+export default BuildstatusLoadingAnimated;

package/src/Components/Icons/16x16/{Circle.tsx → BuildstatusNeverbuilt.tsx}

@@ -1,6 +1,6 @@
 import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
 
-const Circle = forwardRef<IconProps, 'svg'>((props, ref) => (
+const BuildstatusNeverbuilt = forwardRef<IconProps, 'svg'>((props, ref) => (
   <Icon ref={ref} viewBox="0 0 16 16" {...props}>
     <path
       clipRule="evenodd"
@@ -11,4 +11,4 @@ const Circle = forwardRef<IconProps, 'svg'>((props, ref) => (
   </Icon>
 ));
 
-export default Circle;
+export default BuildstatusNeverbuilt;

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

@@ -0,0 +1,37 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+import { useIconId } from '../utils';
+
+const BuildstatusProgressEggplant = forwardRef<IconProps, 'svg'>((props, ref) => {
+  const iconPrefix = useIconId();
+  return (
+    <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+      <path
+        clipRule="evenodd"
+        d="M0 8a8 8 0 1 0 16 0A8 8 0 0 0 0 8Zm14.667 0A6.667 6.667 0 1 1 1.333 8a6.667 6.667 0 0 1 13.334 0Z"
+        fill={`url(#${iconPrefix}__a)`}
+        fillRule="evenodd"
+      />
+      <path
+        clipRule="evenodd"
+        d="M3.333 8a4.667 4.667 0 1 0 9.334 0 4.667 4.667 0 0 0-9.334 0Zm8 0a3.333 3.333 0 1 1-6.666 0 3.333 3.333 0 0 1 6.666 0Z"
+        fill="#7B3BA5"
+        fillRule="evenodd"
+      />
+      <defs>
+        <radialGradient
+          cx={0}
+          cy={0}
+          gradientTransform="matrix(8 0 0 8 8 8)"
+          gradientUnits="userSpaceOnUse"
+          id={`${iconPrefix}__a`}
+          r={1}
+        >
+          <stop stopColor="#683D87" stopOpacity={0.01} />
+          <stop offset={1} stopColor="#683D87" />
+        </radialGradient>
+      </defs>
+    </Icon>
+  );
+});
+
+export default BuildstatusProgressEggplant;

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

@@ -0,0 +1,20 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const BuildstatusProgressWhite = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <path
+      clipRule="evenodd"
+      d="M0 8a8 8 0 1 0 16 0A8 8 0 0 0 0 8Zm14.667 0A6.667 6.667 0 1 1 1.333 8a6.667 6.667 0 0 1 13.334 0Z"
+      fill="#fff"
+      fillRule="evenodd"
+    />
+    <path
+      clipRule="evenodd"
+      d="M3.333 8a4.667 4.667 0 1 0 9.334 0 4.667 4.667 0 0 0-9.334 0Zm8 0a3.333 3.333 0 1 1-6.666 0 3.333 3.333 0 0 1 6.666 0Z"
+      fill="#fff"
+      fillRule="evenodd"
+    />
+  </Icon>
+));
+
+export default BuildstatusProgressWhite;

package/src/Components/Icons/16x16/{DoubleCircle.tsx → BuildstatusSuccessful.tsx}

@@ -1,20 +1,20 @@
 import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
 
-const DoubleCircle = forwardRef<IconProps, 'svg'>((props, ref) => (
+const BuildstatusSuccessful = forwardRef<IconProps, 'svg'>((props, ref) => (
   <Icon ref={ref} viewBox="0 0 16 16" {...props}>
     <path
-      fillRule="evenodd"
       clipRule="evenodd"
-      d="M11.5 8C11.5 9.933 9.933 11.5 8 11.5C6.067 11.5 4.5 9.933 4.5 8C4.5 6.067 6.067 4.5 8 4.5C9.933 4.5 11.5 6.067 11.5 8ZM10 8C10 9.10457 9.10457 10 8 10C6.89543 10 6 9.10457 6 8C6 6.89543 6.89543 6 8 6C9.10457 6 10 6.89543 10 8Z"
+      d="M11.5644 6.49388L10.4356 5.50612L7.40814 8.96604L5.46852 7.41435L4.53148 8.58565L7.59186 11.034L11.5644 6.49388Z"
       fill="currentColor"
+      fillRule="evenodd"
     />
     <path
-      fillRule="evenodd"
       clipRule="evenodd"
       d="M15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8ZM13.5 8C13.5 11.0376 11.0376 13.5 8 13.5C4.96243 13.5 2.5 11.0376 2.5 8C2.5 4.96243 4.96243 2.5 8 2.5C11.0376 2.5 13.5 4.96243 13.5 8Z"
       fill="currentColor"
+      fillRule="evenodd"
     />
   </Icon>
 ));
 
-export default DoubleCircle;
+export default BuildstatusSuccessful;

package/src/Components/Icons/16x16/{CheckCircleFilled.tsx → BuildstatusSuccessfulSolid.tsx}

@@ -1,6 +1,6 @@
 import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
 
-const CheckCircleFilled = forwardRef<IconProps, 'svg'>((props, ref) => (
+const BuildstatusSuccessfulSolid = forwardRef<IconProps, 'svg'>((props, ref) => (
   <Icon ref={ref} viewBox="0 0 16 16" {...props}>
     <path
       clipRule="evenodd"
@@ -11,4 +11,4 @@ const CheckCircleFilled = forwardRef<IconProps, 'svg'>((props, ref) => (
   </Icon>
 ));
 
-export default CheckCircleFilled;
+export default BuildstatusSuccessfulSolid;

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

@@ -3,14 +3,14 @@ import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
 const CheckCircle = forwardRef<IconProps, 'svg'>((props, ref) => (
   <Icon ref={ref} viewBox="0 0 16 16" {...props}>
     <path
-      d="M11.5644 6.49388L10.4356 5.50612L7.40814 8.96604L5.46852 7.41435L4.53148 8.58565L7.59186 11.034L11.5644 6.49388Z"
+      d="M4.33334 7.99985L5.27615 7.05704L7.16177 8.94265L10.4616 5.64282L11.4044 6.58563L7.16177 10.8283L4.33334 7.99985Z"
       fill="currentColor"
     />
     <path
-      fillRule="evenodd"
       clipRule="evenodd"
-      d="M15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8ZM13.5 8C13.5 11.0376 11.0376 13.5 8 13.5C4.96243 13.5 2.5 11.0376 2.5 8C2.5 4.96243 4.96243 2.5 8 2.5C11.0376 2.5 13.5 4.96243 13.5 8Z"
+      d="M14.6667 7.99992C14.6667 11.6818 11.6819 14.6666 8.00001 14.6666C4.31811 14.6666 1.33334 11.6818 1.33334 7.99992C1.33334 4.31802 4.31811 1.33325 8.00001 1.33325C11.6819 1.33325 14.6667 4.31802 14.6667 7.99992ZM13.3333 7.99992C13.3333 10.9454 10.9455 13.3333 8.00001 13.3333C5.05449 13.3333 2.66668 10.9454 2.66668 7.99992C2.66668 5.0544 5.05449 2.66659 8.00001 2.66659C10.9455 2.66659 13.3333 5.0544 13.3333 7.99992Z"
       fill="currentColor"
+      fillRule="evenodd"
     />
   </Icon>
 ));

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

@@ -0,0 +1,31 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+import { useIconId } from '../utils';
+
+const ProgressEggplant = forwardRef<IconProps, 'svg'>((props, ref) => {
+  const iconPrefix = useIconId();
+  return (
+    <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+      <path
+        clipRule="evenodd"
+        d="M2 8a6 6 0 1 0 12 0A6 6 0 0 0 2 8Zm10.667 0a4.667 4.667 0 1 1-9.334 0 4.667 4.667 0 0 1 9.334 0Z"
+        fill={`url(#${iconPrefix}__a)`}
+        fillRule="evenodd"
+      />
+      <defs>
+        <radialGradient
+          cx={0}
+          cy={0}
+          gradientTransform="matrix(6 0 0 6 8 8)"
+          gradientUnits="userSpaceOnUse"
+          id={`${iconPrefix}__a`}
+          r={1}
+        >
+          <stop offset={0.002} stopColor="#683D87" stopOpacity={0.01} />
+          <stop offset={1} stopColor="#683D87" />
+        </radialGradient>
+      </defs>
+    </Icon>
+  );
+});
+
+export default ProgressEggplant;

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

@@ -0,0 +1,31 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+import { useIconId } from '../utils';
+
+const ProgressViolet = forwardRef<IconProps, 'svg'>((props, ref) => {
+  const iconPrefix = useIconId();
+  return (
+    <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+      <path
+        clipRule="evenodd"
+        d="M2 8a6 6 0 1 0 12 0A6 6 0 0 0 2 8Zm10.667 0a4.667 4.667 0 1 1-9.334 0 4.667 4.667 0 0 1 9.334 0Z"
+        fill={`url(#${iconPrefix}__a)`}
+        fillRule="evenodd"
+      />
+      <defs>
+        <radialGradient
+          cx={0}
+          cy={0}
+          gradientTransform="matrix(6 0 0 6 8 8)"
+          gradientUnits="userSpaceOnUse"
+          id={`${iconPrefix}__a`}
+          r={1}
+        >
+          <stop offset={0.002} stopColor="#683D87" stopOpacity={0.01} />
+          <stop offset={1} stopColor="#760FC3" />
+        </radialGradient>
+      </defs>
+    </Icon>
+  );
+});
+
+export default ProgressViolet;

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

@@ -0,0 +1,31 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+import { useIconId } from '../utils';
+
+const ProgressWhite = forwardRef<IconProps, 'svg'>((props, ref) => {
+  const iconPrefix = useIconId();
+  return (
+    <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+      <path
+        clipRule="evenodd"
+        d="M2 8a6 6 0 1 0 12 0A6 6 0 0 0 2 8Zm10.667 0a4.667 4.667 0 1 1-9.334 0 4.667 4.667 0 0 1 9.334 0Z"
+        fill={`url(#${iconPrefix}__a)`}
+        fillRule="evenodd"
+      />
+      <defs>
+        <radialGradient
+          cx={0}
+          cy={0}
+          gradientTransform="matrix(6 0 0 6 8 8)"
+          gradientUnits="userSpaceOnUse"
+          id={`${iconPrefix}__a`}
+          r={1}
+        >
+          <stop offset={0.002} stopColor="#fff" stopOpacity={0.01} />
+          <stop offset={1} stopColor="#fff" />
+        </radialGradient>
+      </defs>
+    </Icon>
+  );
+});
+
+export default ProgressWhite;

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

@@ -0,0 +1,14 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const StageCurrent = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <g clipRule="evenodd" fill="currentColor" fillRule="evenodd">
+      <path d="M0 8C0 3.58172 3.58172 0 8 0C8.53428 0 9.05633 0.0523755 9.5613 0.152272L9.30254 1.46026C8.88234 1.37713 8.44694 1.33333 8 1.33333V14.6667C8.44694 14.6667 8.88234 14.6229 9.30254 14.5397L9.5613 15.8477C9.05633 15.9476 8.53428 16 8 16C3.58172 16 0 12.4183 0 8Z" />
+      <path d="M15.8477 9.56129L14.5397 9.30253C14.6229 8.88233 14.6667 8.44694 14.6667 8C14.6667 7.55305 14.6229 7.11766 14.5397 6.69746L15.8477 6.4387C15.9476 6.94366 16 7.46571 16 8C16 8.53428 15.9476 9.05633 15.8477 9.56129Z" />
+      <path d="M14.6525 3.55507L13.5446 4.29683C13.0575 3.56925 12.4308 2.94254 11.7032 2.45543L12.4449 1.34747C13.3173 1.93154 14.0685 2.68266 14.6525 3.55507Z" />
+      <path d="M12.4449 14.6525L11.7032 13.5446C12.4308 13.0575 13.0575 12.4307 13.5446 11.7032L14.6525 12.4449C14.0685 13.3173 13.3173 14.0685 12.4449 14.6525Z" />
+    </g>
+  </Icon>
+));
+
+export default StageCurrent;

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

@@ -0,0 +1,14 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const StageIncomplete = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <path
+      clipRule="evenodd"
+      d="M15.8477 9.5613L14.5397 9.30254C14.6229 8.88234 14.6667 8.44694 14.6667 8C14.6667 7.55306 14.6229 7.11766 14.5397 6.69746L15.8477 6.4387C15.9476 6.94367 16 7.46572 16 8C16 8.53428 15.9476 9.05633 15.8477 9.5613ZM14.6525 3.55507L13.5446 4.29683C13.0575 3.56925 12.4308 2.94254 11.7032 2.45543L12.4449 1.34748C13.3173 1.93154 14.0685 2.68266 14.6525 3.55507ZM9.5613 0.152272L9.30254 1.46026C8.88234 1.37713 8.44694 1.33333 8 1.33333C7.55306 1.33333 7.11766 1.37713 6.69746 1.46026L6.4387 0.152272C6.94367 0.0523755 7.46572 0 8 0C8.53428 0 9.05633 0.0523755 9.5613 0.152272ZM3.55507 1.34748L4.29683 2.45543C3.56925 2.94254 2.94254 3.56925 2.45543 4.29683L1.34748 3.55508C1.93154 2.68266 2.68266 1.93154 3.55507 1.34748ZM0.152272 6.4387C0.0523755 6.94367 0 7.46572 0 8C0 8.53428 0.0523755 9.05633 0.152272 9.5613L1.46026 9.30254C1.37713 8.88234 1.33333 8.44694 1.33333 8C1.33333 7.55306 1.37713 7.11766 1.46026 6.69746L0.152272 6.4387ZM1.34748 12.4449L2.45543 11.7032C2.94254 12.4308 3.56925 13.0575 4.29683 13.5446L3.55508 14.6525C2.68266 14.0685 1.93154 13.3173 1.34748 12.4449ZM6.4387 15.8477L6.69746 14.5397C7.11766 14.6229 7.55306 14.6667 8 14.6667C8.44694 14.6667 8.88234 14.6229 9.30254 14.5397L9.5613 15.8477C9.05633 15.9476 8.53428 16 8 16C7.46572 16 6.94367 15.9476 6.4387 15.8477ZM12.4449 14.6525L11.7032 13.5446C12.4308 13.0575 13.0575 12.4308 13.5446 11.7032L14.6525 12.4449C14.0685 13.3173 13.3173 14.0685 12.4449 14.6525Z"
+      fill="currentColor"
+      fillRule="evenodd"
+    />
+  </Icon>
+));
+
+export default StageIncomplete;

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

@@ -0,0 +1,16 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const StepstatusSkip = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <path d="m4.333 5.5 2.5 2.5-2.5 2.5 1 1 3.5-3.5-3.5-3.5-1 1Z" fill="currentColor" />
+    <path d="m7.833 5.5 2.5 2.5-2.5 2.5 1 1 3.5-3.5-3.5-3.5-1 1Z" fill="currentColor" />
+    <path
+      clipRule="evenodd"
+      d="M0 8a8 8 0 1 0 16 0A8 8 0 0 0 0 8Zm14.667 0A6.667 6.667 0 1 1 1.333 8a6.667 6.667 0 0 1 13.334 0Z"
+      fill="currentColor"
+      fillRule="evenodd"
+    />
+  </Icon>
+));
+
+export default StepstatusSkip;

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

@@ -0,0 +1,15 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const StepstatusWarning = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <path d="M7.333 4h1.333v5.33H7.333V4Zm1.333 6.667H7.333v1.332h1.333v-1.332Z" fill="currentColor" />
+    <path
+      clipRule="evenodd"
+      d="M8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16Zm0-1.333A6.667 6.667 0 1 0 8 1.333a6.667 6.667 0 0 0 0 13.334Z"
+      fill="currentColor"
+      fillRule="evenodd"
+    />
+  </Icon>
+));
+
+export default StepstatusWarning;

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

@@ -0,0 +1,18 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+
+const TestInconclusive = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <path
+      d="M8.124 8.003c-.372.274-.777.572-.777 1.22 0 .166.082.372.082.372H8.53c0-.49.305-.757.638-1.047.396-.347.831-.727.831-1.56 0-.868-.775-1.655-1.96-1.655A2.08 2.08 0 0 0 6 6.74l1.02.455s.205-.662.98-.662c.449 0 .735.29.735.621 0 .4-.294.615-.61.849Zm-.206 2.089c-.367 0-.653.29-.653.62 0 .332.286.621.653.621.368 0 .653-.29.653-.62 0-.331-.285-.621-.653-.621Z"
+      fill="currentColor"
+    />
+    <path
+      clipRule="evenodd"
+      d="m14.041 6.49-4.53-4.531a2.136 2.136 0 0 0-3.021 0l-4.531 4.53a2.136 2.136 0 0 0 0 3.021l4.53 4.531a2.136 2.136 0 0 0 3.021 0l4.531-4.53a2.136 2.136 0 0 0 0-3.021ZM7.433 2.902a.803.803 0 0 1 1.135 0l4.53 4.53a.803.803 0 0 1 0 1.136l-4.53 4.53a.803.803 0 0 1-1.135 0l-4.531-4.53a.803.803 0 0 1 0-1.135l4.53-4.531Z"
+      fill="currentColor"
+      fillRule="evenodd"
+    />
+  </Icon>
+));
+
+export default TestInconclusive;

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

@@ -3,6 +3,7 @@ import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
 const ThumbDown = forwardRef<IconProps, 'svg'>((props, ref) => (
   <Icon ref={ref} viewBox="0 0 16 16" {...props}>
     <path
+      id="Vector"
       fillRule="evenodd"
       clipRule="evenodd"
       d="M6.27419 13.9855C6.78568 14.2495 7.41116 14.1321 7.7921 13.7006L10.8383 10.25H13C13.6904 10.25 14.25 9.69036 14.25 9V3C14.25 2.30964 13.6904 1.75 13 1.75H4.87588C4.39674 1.75 3.95977 2.02388 3.7509 2.45509L1.92503 6.22463C1.80984 6.46244 1.75 6.72326 1.75 6.9875V9.09677C1.75 9.78713 2.30964 10.3468 3 10.3468H6.05949L5.61706 12.6303C5.51098 13.1778 5.77859 13.7297 6.27419 13.9855ZM9.75 9.21631L7.25992 12.0369L7.70506 9.73943C7.74765 9.51962 7.6898 9.29227 7.54732 9.11954C7.40485 8.94681 7.19266 8.84677 6.96875 8.84677H3.25V6.9875C3.25 6.94975 3.25855 6.91249 3.275 6.87852L5.03257 3.25H9.75V9.21631ZM11.25 8.75H12.75V3.25H11.25V8.75Z"

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

@@ -3,6 +3,7 @@ import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
 const ThumbUp = forwardRef<IconProps, 'svg'>((props, ref) => (
   <Icon ref={ref} viewBox="0 0 16 16" {...props}>
     <path
+      id="Vector"
       fillRule="evenodd"
       clipRule="evenodd"
       d="M9.72581 2.01449C9.21432 1.75049 8.58884 1.86789 8.2079 2.2994L5.16167 5.75001H3C2.30964 5.75001 1.75 6.30965 1.75 7.00001V13C1.75 13.6904 2.30964 14.25 3 14.25H11.1241C11.6033 14.25 12.0402 13.9761 12.2491 13.5449L14.075 9.77538C14.1902 9.53757 14.25 9.27675 14.25 9.01251V6.90323C14.25 6.21288 13.6904 5.65323 13 5.65323H9.94051L10.3829 3.36974C10.489 2.8222 10.2214 2.27028 9.72581 2.01449ZM6.25 6.7837L8.74008 3.96307L8.29494 6.26058C8.25235 6.48039 8.3102 6.70774 8.45268 6.88047C8.59515 7.0532 8.80734 7.15323 9.03125 7.15323H12.75V9.01251C12.75 9.05026 12.7415 9.08751 12.725 9.12149L10.9674 12.75H6.25V6.7837ZM4.75 7.25001H3.25V12.75H4.75V7.25001Z"

package/src/Components/Icons/16x16/{Check.tsx → Tick.tsx}

@@ -1,14 +1,14 @@
 import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
 
-const Check = forwardRef<IconProps, 'svg'>((props, ref) => (
+const Tick = forwardRef<IconProps, 'svg'>((props, ref) => (
   <Icon ref={ref} viewBox="0 0 16 16" {...props}>
     <path
-      fillRule="evenodd"
       clipRule="evenodd"
-      d="M13.0644 5.49386L7.34186 12.0339L3.03148 8.58563L3.96852 7.41433L7.15814 9.96602L11.9356 4.5061L13.0644 5.49386Z"
+      d="m6.808 9.277 4.681-4.61.993.993-5.674 5.673-3.475-3.546.993-.993 2.482 2.483Z"
       fill="currentColor"
+      fillRule="evenodd"
     />
   </Icon>
 ));
 
-export default Check;
+export default Tick;

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

@@ -3,6 +3,7 @@ import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
 const Ubuntu = forwardRef<IconProps, 'svg'>((props, ref) => (
   <Icon ref={ref} viewBox="0 0 16 16" {...props}>
     <path
+      id="Vector"
       fillRule="evenodd"
       clipRule="evenodd"
       d="M15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8ZM9.91276 4.68702C9.4658 4.42897 9.31266 3.85744 9.57071 3.41048C9.82876 2.96352 10.4003 2.81038 10.8472 3.06843C11.2942 3.32648 11.4474 3.89801 11.1893 4.34497C10.9312 4.79193 10.3597 4.94507 9.91276 4.68702ZM3.24 8.93449C3.75611 8.93449 4.1745 8.51611 4.1745 8C4.1745 7.4839 3.75611 7.06551 3.24 7.06551C2.7239 7.06551 2.30551 7.4839 2.30551 8C2.30551 8.51611 2.7239 8.93449 3.24 8.93449ZM9.91275 11.313C10.3597 11.0549 10.9312 11.2081 11.1893 11.655C11.4473 12.102 11.2942 12.6735 10.8472 12.9316C10.4003 13.1896 9.82875 13.0365 9.5707 12.5895C9.31265 12.1426 9.46579 11.571 9.91275 11.313ZM9.08413 4.08636C9.14491 4.46244 9.3681 4.80907 9.72374 5.0144C10.079 5.21952 10.4904 5.23966 10.8462 5.1047C11.5395 5.78632 11.9891 6.71503 12.0523 7.74817H10.7185C10.5914 6.35848 9.42282 5.27 7.99999 5.27C7.5925 5.27 7.20587 5.35928 6.85857 5.51935L6.19155 4.36402C6.73611 4.09264 7.35023 3.94 7.99999 3.94C8.37546 3.94 8.73902 3.99097 9.08413 4.08636ZM7.99999 12.06C8.37546 12.06 8.73903 12.009 9.08415 11.9136C9.14493 11.5376 9.36812 11.1909 9.72376 10.9856C10.079 10.7805 10.4904 10.7604 10.8462 10.8953C11.5395 10.2137 11.9891 9.28497 12.0523 8.25183H10.7185C10.5914 9.64152 9.42283 10.73 7.99999 10.73C7.59251 10.73 7.20588 10.6407 6.85859 10.4807L6.19156 11.636C6.73612 11.9074 7.35023 12.06 7.99999 12.06ZM4.06865 9.01792C4.36394 8.77725 4.55252 8.41065 4.55252 8C4.55252 7.58936 4.36394 7.22276 4.06865 6.98209C4.32212 6.00034 4.93362 5.16254 5.75559 4.61624L6.42261 5.77156C5.72516 6.26613 5.26999 7.07991 5.26999 8C5.26999 8.9201 5.72517 9.73388 6.42263 10.2285L5.75561 11.3838C4.93363 10.8375 4.32212 9.99967 4.06865 9.01792Z"

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

@@ -2,13 +2,11 @@ import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
 
 const Warning = forwardRef<IconProps, 'svg'>((props, ref) => (
   <Icon ref={ref} viewBox="0 0 16 16" {...props}>
-    <path d="M8.75 10.0001V11.5001H7.25V10.0001H8.75Z" fill="currentColor" />
-    <path d="M8.75 9.00007V5.50007H7.25V9.00007H8.75Z" fill="currentColor" />
     <path
-      fillRule="evenodd"
       clipRule="evenodd"
-      d="M1.26533 10.9886L6.27461 2.44339C7.04728 1.12531 8.95273 1.12531 9.7254 2.4434L14.7347 10.9886C15.5163 12.3219 14.5548 14.0001 13.0093 14.0001H2.99073C1.44524 14.0001 0.483748 12.3219 1.26533 10.9886ZM7.56866 3.20197L2.55938 11.7472C2.36398 12.0805 2.60436 12.5001 2.99073 12.5001H13.0093C13.3957 12.5001 13.636 12.0805 13.4406 11.7472L8.43135 3.20197C8.23819 2.87245 7.76182 2.87245 7.56866 3.20197Z"
+      d="m9.204 2.076 5.33 10.659c.066.2.133.4.133.6 0 .732-.6 1.332-1.333 1.332H2.676c-.2 0-.4-.067-.6-.134a1.335 1.335 0 0 1-.6-1.798L6.874 2.076c.133-.266.333-.466.532-.6a1.335 1.335 0 0 1 1.8.6Zm-1.199.6-5.33 10.658h10.66L8.004 2.676Zm-.666 3.997H8.67v3.33H7.34v-3.33Zm1.332 5.329V10.67H7.34v1.332h1.33Z"
       fill="currentColor"
+      fillRule="evenodd"
     />
   </Icon>
 ));

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

@@ -0,0 +1,18 @@
+import { forwardRef, Icon, IconProps } from '@chakra-ui/react';
+import Box from '../../Box/Box';
+
+const WarningColored = forwardRef<IconProps, 'svg'>((props, ref) => (
+  <Icon ref={ref} viewBox="0 0 16 16" {...props}>
+    <Box
+      as="path"
+      clipRule="evenodd"
+      d="M14.5334 12.7348L9.20415 2.07627C8.87107 1.41011 8.07168 1.14364 7.40552 1.47672C7.20567 1.60995 7.00582 1.8098 6.87259 2.07627L1.47671 12.7348C1.14363 13.401 1.41009 14.2004 2.07625 14.5334C2.2761 14.6 2.47595 14.6667 2.67579 14.6667H13.3343C14.0671 14.6667 14.6666 14.0671 14.6666 13.3343C14.6666 13.1345 14.6 12.9347 14.5334 12.7348Z"
+      fill="yellow.80"
+      fillRule="evenodd"
+    />
+    <Box as="path" d="M8.66563 5.33333H7.33331V10.0036H8.66563V5.33333Z" fill="purple.10" />
+    <Box as="path" d="M8.66563 11.3333V12.6656H7.33331V11.3333H8.66563Z" fill="purple.10" />
+  </Icon>
+));
+
+export default WarningColored;