@7shifts/sous-chef 2.15.8 → 2.16.0

package/dist/icons/components/IconUserFriends.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconUserFriends: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconUserFriends;

package/dist/icons/components/IconUserLight.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconUserLight: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconUserLight;

package/dist/icons/components/IconUserPlus.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconUserPlus: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconUserPlus;

package/dist/icons/components/IconUserSlash.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconUserSlash: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconUserSlash;

package/dist/icons/components/IconUserSolid.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconUserSolid: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconUserSolid;

package/dist/icons/components/IconUserTag.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconUserTag: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconUserTag;

package/dist/icons/components/IconUserTie.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconUserTie: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconUserTie;

package/dist/icons/components/IconUsers.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconUsers: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconUsers;

package/dist/icons/components/IconVideo.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconVideo: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconVideo;

package/dist/icons/components/IconVolume.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconVolume: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconVolume;

package/dist/icons/components/IconVolumeMute.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconVolumeMute: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconVolumeMute;

package/dist/icons/components/IconWrench.d.ts

@@ -3,9 +3,10 @@ import { IconSize } from '../types';
 declare type Props = {
     size?: IconSize;
     color?: string;
+    testId?: string;
 } & React.SVGProps<SVGSVGElement>;
 declare const IconWrench: {
-    (props: Props): JSX.Element;
+    ({ testId, ...props }: Props): JSX.Element;
     displayName: string;
 };
 export default IconWrench;

package/dist/index.css

@@ -340,22 +340,22 @@ Please ask a designer if you have questions about which colours to use.
 
 ._3OB2g {
   background: #F3F3F3;
-  border-color: #C8C8C8;
+  border-color: #D5D5D5;
   color: #464646;
 }
 ._3OB2g:hover {
-  background: #C8C8C8;
+  background: #D5D5D5;
   border-color: #949494;
   color: #323232;
 }
 ._3OB2g:disabled {
   background: #F3F3F3;
-  border-color: #C8C8C8;
+  border-color: #D5D5D5;
   color: #949494;
 }
 ._3OB2g[aria-disabled=true] {
   background: #F3F3F3;
-  border-color: #C8C8C8;
+  border-color: #D5D5D5;
   color: #949494;
 }
 
@@ -445,7 +445,7 @@ Please ask a designer if you have questions about which colours to use.
 
 ._3BrS0 {
   background: transparent;
-  border-color: #C8C8C8;
+  border-color: #D5D5D5;
   color: #464646;
 }
 ._3BrS0:hover {
@@ -455,12 +455,12 @@ Please ask a designer if you have questions about which colours to use.
 }
 ._3BrS0:disabled {
   background: transparent;
-  border-color: #C8C8C8;
+  border-color: #D5D5D5;
   color: #949494;
 }
 ._3BrS0[aria-disabled=true] {
   background: transparent;
-  border-color: #C8C8C8;
+  border-color: #D5D5D5;
   color: #949494;
 }
 
@@ -604,7 +604,7 @@ Please ask a designer if you have questions about which colours to use.
   display: flex;
   padding: 16px;
   border: 1px solid #fff;
-  border-bottom: 1px solid #C8C8C8;
+  border-bottom: 1px solid #D5D5D5;
 }
 ._3DlpO:last-child:not(._NS-B9) {
   border-bottom: 1px solid #fff;
@@ -704,7 +704,7 @@ Please ask a designer if you have questions about which colours to use.
 }
 
 ._2ygIH {
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
   border-radius: 8px;
   font-family: "Proxima Nova", sans-serif;
   font-size: 14px;
@@ -726,7 +726,7 @@ The base colour is the default colour and is numbered with 400. If someone says
 Please ask a designer if you have questions about which colours to use.
 */
 ._1IynL button:disabled {
-  border-color: #C8C8C8;
+  border-color: #D5D5D5;
 }
 ._1IynL button:last-child {
   border-radius: 0 4px 4px 0;
@@ -754,7 +754,7 @@ Please ask a designer if you have questions about which colours to use.
   display: flex;
 }
 ._1d8Ci:not(:last-child):not(._3tb7U) {
-  border-bottom: 1px solid #C8C8C8;
+  border-bottom: 1px solid #D5D5D5;
 }
 
 ._1d8Ci:focus:not(:focus-visible) {
@@ -806,7 +806,7 @@ Please ask a designer if you have questions about which colours to use.
   justify-content: flex-end;
 }
 ._1rrRr:not(:last-child) {
-  border-right: 1px solid #C8C8C8;
+  border-right: 1px solid #D5D5D5;
 }
 
 ._azbIG {
@@ -929,7 +929,7 @@ Just for future references:
 ._3tNyE::before {
   content: "";
   display: block;
-  background: #C8C8C8;
+  background: #D5D5D5;
   transition: all ease-in-out 150ms;
   box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.03);
   border-radius: 26px;
@@ -945,7 +945,7 @@ Just for future references:
   right: 21px;
   top: 2px;
   background: #fff;
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
   border-radius: 24px;
   height: 14px;
   width: 14px;
@@ -1033,7 +1033,7 @@ Please ask a designer if you have questions about which colours to use.
 }
 
 ._1bTmd {
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
   border-radius: 8px;
   font-family: "Proxima Nova", sans-serif;
   font-size: 14px;
@@ -1112,7 +1112,7 @@ Please ask a designer if you have questions about which colours to use.
 
 ._wQQ_2 {
   position: initial;
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
   background: #fff;
   overflow: auto;
   outline: none;
@@ -1411,7 +1411,7 @@ Please ask a designer if you have questions about which colours to use.
 }
 
 ._3vJkw {
-  color: #C8C8C8;
+  color: #D5D5D5;
   cursor: default;
 }
 
@@ -1436,7 +1436,7 @@ Please ask a designer if you have questions about which colours to use.
   display: table-cell;
   padding: 0.5em;
   min-width: 1em;
-  border-right: 1px solid #C8C8C8;
+  border-right: 1px solid #D5D5D5;
   color: #949494;
   vertical-align: middle;
   text-align: right;
@@ -1629,7 +1629,7 @@ Please ask a designer if you have questions about which colours to use.
 }
 
 ._1M4ZF {
-  color: #C8C8C8;
+  color: #D5D5D5;
   cursor: default;
 }
 
@@ -1654,7 +1654,7 @@ Please ask a designer if you have questions about which colours to use.
   display: table-cell;
   padding: 0.5em;
   min-width: 1em;
-  border-right: 1px solid #C8C8C8;
+  border-right: 1px solid #D5D5D5;
   color: #949494;
   vertical-align: middle;
   text-align: right;
@@ -1922,7 +1922,7 @@ Please ask a designer if you have questions about which colours to use.
   border-radius: 4px;
   padding: 7px;
   box-shadow: none;
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
   flex: 1;
   display: flex;
   flex-direction: column;
@@ -1979,7 +1979,7 @@ Please ask a designer if you have questions about which colours to use.
   font-family: "Proxima Nova", sans-serif;
   color: #464646;
   box-shadow: none;
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
   margin: 0;
   flex: 1;
   min-width: 90px;
@@ -2044,8 +2044,8 @@ Please ask a designer if you have questions about which colours to use.
   width: 14px;
   background-color: transparent;
   border-radius: 4px;
-  border: 1px solid #C8C8C8;
-  box-shadow: inset 0 1px 4px -2px #C8C8C8;
+  border: 1px solid #D5D5D5;
+  box-shadow: inset 0 1px 4px -2px #D5D5D5;
 }
 ._2mA8e::after {
   position: absolute;
@@ -2076,7 +2076,7 @@ input:focus-visible + ._2mA8e {
 }
 input:disabled + ._2mA8e {
   background-color: #F3F3F3;
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
 }
 input:disabled + ._2mA8e::after {
   box-shadow: none;
@@ -2117,7 +2117,7 @@ Please ask a designer if you have questions about which colours to use.
   font-size: 14px;
   font-weight: 600;
   padding: 8px;
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
   border-radius: 25px;
   min-height: 38px;
   min-width: 60px;
@@ -2133,8 +2133,8 @@ Please ask a designer if you have questions about which colours to use.
   box-sizing: border-box;
 }
 input:hover ~ ._1i2AX {
-  background-color: #C8C8C8;
-  border-color: #C8C8C8;
+  background-color: #D5D5D5;
+  border-color: #D5D5D5;
 }
 input:checked:hover ~ ._1i2AX {
   background-color: #e16840;
@@ -2234,8 +2234,8 @@ Please ask a designer if you have questions about which colours to use.
   width: 14px;
   background-color: transparent;
   border-radius: 50%;
-  border: 1px solid #C8C8C8;
-  box-shadow: inset 0 1px 4px -2px #C8C8C8;
+  border: 1px solid #D5D5D5;
+  box-shadow: inset 0 1px 4px -2px #D5D5D5;
 }
 ._1tMq-::after {
   position: absolute;
@@ -2264,7 +2264,7 @@ input:focus-visible + ._1tMq- {
 }
 input:disabled + ._1tMq- {
   background-color: #F3F3F3;
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
 }
 input:disabled + ._1tMq-::after {
   box-shadow: none;
@@ -2293,7 +2293,7 @@ Please ask a designer if you have questions about which colours to use.
   font-family: "Proxima Nova", sans-serif;
   color: #464646;
   box-shadow: none;
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
   margin: 0;
   flex: 1;
   min-width: 90px;
@@ -2349,7 +2349,7 @@ The base colour is the default colour and is numbered with 400. If someone says
 Please ask a designer if you have questions about which colours to use.
 */
 ._U0krC {
-  color: #C8C8C8;
+  color: #D5D5D5;
   font-family: "Proxima Nova", sans-serif;
 }
 
@@ -2401,7 +2401,7 @@ Please ask a designer if you have questions about which colours to use.
   font-family: "Proxima Nova", sans-serif;
   color: #464646;
   box-shadow: none;
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
   margin: 0;
   flex: 1;
   min-width: 90px;
@@ -2624,7 +2624,7 @@ Please ask a designer if you have questions about which colours to use.
 }
 
 ._2pgnH {
-  color: #C8C8C8;
+  color: #D5D5D5;
   cursor: default;
 }
 
@@ -2649,7 +2649,7 @@ Please ask a designer if you have questions about which colours to use.
   display: table-cell;
   padding: 0.5em;
   min-width: 1em;
-  border-right: 1px solid #C8C8C8;
+  border-right: 1px solid #D5D5D5;
   color: #949494;
   vertical-align: middle;
   text-align: right;
@@ -2676,7 +2676,7 @@ Please ask a designer if you have questions about which colours to use.
   font-family: "Proxima Nova", sans-serif;
   color: #464646;
   box-shadow: none;
-  border: 1px solid #C8C8C8;
+  border: 1px solid #D5D5D5;
   margin: 0;
   flex: 1;
   min-width: 90px;
@@ -2997,4 +2997,93 @@ Please ask a designer if you have questions about which colours to use.
 ._GKL9P svg {
   width: 80%;
   padding-top: 25%;
+}
+/*********************************
+For new colours, see _colors.scss.
+**********************************/
+/* stylelint-disable color-no-hex */
+/*
+These are the colour variables to be used around the webapp.
+The variables are set up to describe the color and number which represents the lightness of the color.
+The smaller the number the lighter the color. So $eggplant-100 would be light purple and $eggplant-600 would be dark purple.
+The base colour is the default colour and is numbered with 400. If someone says "use Tangerine" they are referring to the base color.
+Please ask a designer if you have questions about which colours to use.
+*/
+._1fIeV {
+  font-size: 12px;
+  font-weight: 600;
+  border-radius: 2px;
+  padding: 2px 8px;
+  line-height: 16px;
+  display: inline-block;
+  text-align: center;
+  text-transform: uppercase;
+}
+._V4byU {
+  background-color: #fdd5c8;
+  color: #96452b;
+}
+._37gN9 {
+  background-color: #c6f1eb;
+  color: #277e71;
+}
+._Tw7tp {
+  background-color: #d3dbf4;
+  color: #415184;
+}
+._t94VZ {
+  background-color: #ffeec9;
+  color: #99772c;
+}
+._3SmeO {
+  background-color: #ceecf5;
+  color: #367385;
+}
+._2eoX0 {
+  background-color: #f7d1d1;
+  color: #8a3d3d;
+}
+/*********************************
+For new colours, see _colors.scss.
+**********************************/
+/* stylelint-disable color-no-hex */
+/*
+These are the colour variables to be used around the webapp.
+The variables are set up to describe the color and number which represents the lightness of the color.
+The smaller the number the lighter the color. So $eggplant-100 would be light purple and $eggplant-600 would be dark purple.
+The base colour is the default colour and is numbered with 400. If someone says "use Tangerine" they are referring to the base color.
+Please ask a designer if you have questions about which colours to use.
+*/
+._23q4Y {
+  font-size: 14px;
+  font-weight: 600;
+  border-radius: 25px;
+  padding: 0 12px 0 12px;
+  line-height: 28px;
+  min-width: 40px;
+  display: inline-block;
+  text-align: center;
+}
+._23q4Y::first-letter {
+  text-transform: capitalize;
+}
+._niDEM {
+  background-color: #D5D5D5;
+  color: #323232;
+}
+._IwDRB {
+  background-color: #c6f1eb;
+  color: #277e71;
+}
+._MPji- {
+  background-color: #f7d1d1;
+  color: #8a3d3d;
+}
+._3S2m8 {
+  background-color: #ffeec9;
+  color: #99772c;
+}
+._2G3ML {
+  background-color: #ceecf5;
+  color: #367385;
 }