@7shifts/sous-chef 1.5.8 → 2.1.1

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@7shifts/sous-chef",
-    "version": "1.5.8",
+    "version": "2.1.1",
     "description": "7shifts component library",
     "author": "7shifts",
     "license": "MIT",
@@ -12,7 +12,9 @@
         "node": ">=10"
     },
     "scripts": {
+        "prebuild": "run-s build-icons",
         "build": "./scripts/build.sh",
+        "build-icons": "./scripts/build-icons.sh",
         "compile": "microbundle-crl --no-compress --format modern,cjs",
         "start": "microbundle-crl watch --no-compress --format modern,cjs",
         "prepare": "run-s build",
@@ -26,15 +28,17 @@
         "storybook:build": "build-storybook -o ./.storybook/dist"
     },
     "peerDependencies": {
-        "react": "^16.0.0",
-        "react-dom": "^16.0.0"
+        "react": ">16.0.0",
+        "react-dom": ">16.0.0"
     },
     "devDependencies": {
-        "@babel/core": "^7.14.3",
+        "@babel/core": "^7.16.7",
+        "@babel/plugin-transform-regenerator": "^7.16.7",
         "@storybook/addon-actions": "^6.4.12",
         "@storybook/addon-essentials": "^6.4.12",
         "@storybook/addon-links": "^6.4.12",
         "@storybook/react": "^6.4.12",
+        "@svgr/cli": "^6.2.0",
         "@testing-library/jest-dom": "^5.12.0",
         "@testing-library/react": "^11.2.7",
         "@testing-library/user-event": "^13.2.1",
@@ -47,8 +51,8 @@
         "@typescript-eslint/eslint-plugin": "^2.26.0",
         "@typescript-eslint/parser": "^2.26.0",
         "babel-eslint": "^10.0.3",
-        "babel-loader": "^8.2.2",
-        "chromatic": "^5.9.2",
+        "babel-loader": "^8.2.3",
+        "chromatic": "^6.3.4",
         "cross-env": "^7.0.2",
         "eslint": "^6.8.0",
         "eslint-config-prettier": "^6.7.0",

package/CHANGELOG.md

@@ -1,230 +0,0 @@
-## 1.5.8 (February 14th, 2022)
-
-### Bug fixes
-
--   DataTableRow: Updated hover state to only appear if there's an onClick (i.e. row action) similar to previous component (ResourceTable).
--   DataTableEditableCell: Added hover state styles to DataTableEditableCell to keep proper styles after the changes to DataTableRow (above).
-
-## 1.5.7 (January 31st, 2022)
-
-### Enhancements
-
--   TextField: Added new props:
-    -   `onFocus`, accepts an event callback to be passed which receives the current input value
-    -   `onKeyDown`, accepts an event callback to be passed which receives the key pressed when the input has focus
-    -   `maxLength`, specifies the maximum length allowed by the underlying `input`
-
-## 1.5.6 (January 21st, 2022)
-
-### Enhancements
-
--   TextField: Added new string prop `autoComplete` which has no default value. Options are "off" or "on".
-
-## 1.5.5 (January 13th, 2022)
-
-### Bug fixes
-
--   DataTableEditableCell: Added new prop 'step' which is set to 'any' if the input type is set to 'currency'. ([#72](https://github.com/7shifts/sous-chef/pull/72))
-
-## 1.5.4 (January 10th, 2022)
-
-### Enhancements
-
--   MultiSelectField: Added new prop closeOnSelect which is set to false by default in order for the dropdown to stay open while selecting options. ([#71](https://github.com/7shifts/sous-chef/pull/71))
-
-## 1.5.3 (December 13th, 2021)
-
-### Enhancements
-
--   Button: Updated link button themes to have proper one shade darker color (excluding contrast, icon, and toolbar theme) on hover. ([#70](https://github.com/7shifts/sous-chef/pull/70))
-
-## 1.5.2 (November 10th, 2021)
-
-### Enhancements
-
--   PasswordField: Updated met criteria bullet to IconCheck to be consistent with mobile ([#69](https://github.com/7shifts/sous-chef/pull/69))
-
-### New Components
-
--   IconCheck: added for now to use in PasswordCriteria. ([#69](https://github.com/7shifts/sous-chef/pull/69))
-
-## 1.5.1 (October 20th, 2021)
-
-### Bug fixes
-
--   DataTable: Exported `DataTableCustomComponent` type ([#67](https://github.com/7shifts/sous-chef/pull/67))
-
-## 1.5.0 (October 19th, 2021)
-
-### New components
-
--   PillSelectField ([#65](https://github.com/7shifts/sous-chef/pull/65))
-
-### Bug fixes
-
--   Field: Updated to align properly when using FormRow with only one form field with with label ([#66](https://github.com/7shifts/sous-chef/pull/66))
-
-## 1.4.1 (October 8th, 2021)
-
-### Enhancements
-
--   DataTable: Updated flow types ([#62](https://github.com/7shifts/sous-chef/pull/62))
--   Tooltip: Added the prop `onClose` to listen when the overlay closed ([#64](https://github.com/7shifts/sous-chef/pull/64))
-
-## 1.4.0 (October 7th, 2021)
-
-### Enhancements
-
--   Updated SelectField to support disabled options
-
-## 1.3.1 (September 29th, 2021)
-
-### Bug fixes
-
--   Avatar: updated to show the proper background when the image url is not available ([#57](https://github.com/7shifts/sous-chef/pull/57))
--   PaginationControls: updated to have the title with the first character capitalized ([#58](https://github.com/7shifts/sous-chef/pull/58))
--   DataTable: Added missing exports ([#59](https://github.com/7shifts/sous-chef/pull/59))
-
-## 1.3.0 (September 27th, 2021)
-
-### New components
-
--   DataTable ([#50](https://github.com/7shifts/sous-chef/pull/50)) - And added editable functionality ([#54](https://github.com/7shifts/sous-chef/pull/54))
-
-## 1.2.2 (September 24rd, 2021)
-
-### Bug fixes
-
--   TextField: Removed the support for Formik `Field` as it was a breaking change in the `TextField` component ([#56](https://github.com/7shifts/sous-chef/pull/56))
-
-## 1.2.1 (September 23rd, 2021)
-
-### Bug fixes
-
--   Modal: When a scroll was showing, the top content was getting cut off on the top. Also updated the flow type ([#55](https://github.com/7shifts/sous-chef/pull/55))
-
-### Enhancements
-
--   Form: Updated the field components to work with formik components such as `Field` and `FieldArray`. It also suports now dynamic fields ([#53](https://github.com/7shifts/sous-chef/pull/53))
-
-## 1.2.0 (September 15th, 2021)
-
-### New components
-
--   Modal ([#49](https://github.com/7shifts/sous-chef/pull/49))
-
-### Bug fixes
-
--   Avatar: The fallback image was not being applied properly ([#46](https://github.com/7shifts/sous-chef/pull/46))
-
-## 1.1.4 (August 17, 2021)
-
-### Bug fixes
-
--   Button: Fixed the padding when having only an icon inside the Button ([#45](https://github.com/7shifts/sous-chef/pull/45))
-
-## 1.1.3 (August 5, 2021)
-
-### Bug fixes
-
--   MultiSelectField: It was not wrapping to the next line when multiple options were select and they didn't fit on the space given ([#44](https://github.com/7shifts/sous-chef/pull/44))
-
-## 1.1.2 (August 4, 2021)
-
-### Bug fixes
-
--   SelectField: When using the `prefix` prop it had a missaligned prefix ([#43](https://github.com/7shifts/sous-chef/pull/43))
--   SelectField: Implemented the `onBlur` prop ([#42](https://github.com/7shifts/sous-chef/pull/42))
--   MultiSelectField: Implemented the `onBlur` prop ([#42](https://github.com/7shifts/sous-chef/pull/42))
-
-## 1.1.1 (July 28, 2021)
-
-### Enhancements
-
--   Badge: Added the `title` prop to make it easier adding a black tooltip ([#40](https://github.com/7shifts/sous-chef/pull/40))
-
-### New components
-
--   IconExclaim ([#41](https://github.com/7shifts/sous-chef/pull/41))
-
-## 1.1.0 (July 23, 2021)
-
-### New components
-
--   Badge ([#37](https://github.com/7shifts/sous-chef/pull/37))
--   Avatar ([#38](https://github.com/7shifts/sous-chef/pull/38))
--   IconComment ([#39](https://github.com/7shifts/sous-chef/pull/39))
--   IconLocation ([#39](https://github.com/7shifts/sous-chef/pull/39))
--   IconMinusCircle ([#39](https://github.com/7shifts/sous-chef/pull/39))
--   IconUserPlus ([#39](https://github.com/7shifts/sous-chef/pull/39))
-
-### Bug fixes
-
--   SelectField: When there is no container with size defined the component will grow with the content until it fills the space ([#36](https://github.com/7shifts/sous-chef/pull/36))
-
-### Enhancements
-
--   SelectField: Added the `prefix` prop and the `asToolbarField` so the component will look as a toolbar filter with no border ([#36](https://github.com/7shifts/sous-chef/pull/36))
-
-## 1.0.3 (July 15, 2021)
-
-### Bug fixes
-
--   Button: Fixed global CSS overrites when button behaves like link ([#35](https://github.com/7shifts/sous-chef/pull/35))
-
-## 1.0.2 (July 15, 2021)
-
-### Bug fixes
-
--   TextAreaField: Fixed global CSS overrites ([#34](https://github.com/7shifts/sous-chef/pull/34))
-
-## 1.0.1 (July 14, 2021)
-
-### Enhancements
-
--   TextField: Added the possibility of using `useRef` ([#33](https://github.com/7shifts/sous-chef/pull/33))
-
-## 1.0.0 (June 25, 2021)
-
-### New components
-
--   Tooltip ([#16](https://github.com/7shifts/sous-chef/pull/16))
--   MultiSelectField ([#19](https://github.com/7shifts/sous-chef/pull/19))
--   TextAreaField ([#21](https://github.com/7shifts/sous-chef/pull/21))
--   RadioGroupField ([#22](https://github.com/7shifts/sous-chef/pull/22))
--   WeekField ([#24](https://github.com/7shifts/sous-chef/pull/24))
--   DateRangeField ([#25](https://github.com/7shifts/sous-chef/pull/25))
--   IconRemove ([#26](https://github.com/7shifts/sous-chef/pull/26))
-
-### Enhancements
-
--   Button: Added the possibility of making Butons act as links ([#23](https://github.com/7shifts/sous-chef/pull/23))
--   SelectField and MultiSelectField: Added the possibility of customizing the select options ([#27](https://github.com/7shifts/sous-chef/pull/27))
-
-### Bug fixes
-
--   Form: consolidated the Flow types for `useFormik` and `<Formik ...>` ([#28](https://github.com/7shifts/sous-chef/pull/28))
--   Icons: added missing Flow types ([#26](https://github.com/7shifts/sous-chef/pull/26))
-
-### Pre existing components
-
--   Button
--   PaginationControls
--   Toggle
--   Inline
--   Stack
--   ResourceTable
--   Spinner
--   CheckboxField
--   DateField
--   DateRangeField
--   Form
--   FormRow
--   MultiSelectField
--   PasswordField
--   RadioGroupField
--   SelectField
--   TextAreaField
--   TextField
--   WeekField
--   Tooltip

package/dist/icons/IconArrowDown.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-    rotate?: number;
-    dataTestId?: string;
-};
-declare const IconArrowDown: React.FC<Props>;
-export default IconArrowDown;

package/dist/icons/IconArrowLeft.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconArrowLeft: React.FC<Props>;
-export default IconArrowLeft;

package/dist/icons/IconArrowRight.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconArrowRight: React.FC<Props>;
-export default IconArrowRight;

package/dist/icons/IconArrowUp.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconArrowUp: React.FC<Props>;
-export default IconArrowUp;

package/dist/icons/IconCalendar.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconCalendar: React.FC<Props>;
-export default IconCalendar;

package/dist/icons/IconCheck.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconCheck: React.FC<Props>;
-export default IconCheck;

package/dist/icons/IconChevronDown.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-declare type Props = {
-    size?: 'small' | 'medium';
-    color?: string;
-    rotate?: number;
-    dataTestId?: string;
-};
-declare const IconChevronDown: React.FC<Props>;
-export default IconChevronDown;

package/dist/icons/IconChevronUp.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-declare type Props = {
-    size?: 'small' | 'medium';
-    color?: Color;
-};
-declare const IconChevronUp: React.FC<Props>;
-export default IconChevronUp;

package/dist/icons/IconClose.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconClose: React.FC<Props>;
-export default IconClose;

package/dist/icons/IconComment.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconComment: React.FC<Props>;
-export default IconComment;

package/dist/icons/IconDelete.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconDelete: React.FC<Props>;
-export default IconDelete;

package/dist/icons/IconEdit.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconEdit: React.FC<Props>;
-export default IconEdit;

package/dist/icons/IconExclaim.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconExclaim: React.FC<Props>;
-export default IconExclaim;

package/dist/icons/IconEye.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconEye: React.FC<Props>;
-export default IconEye;

package/dist/icons/IconEyeSlash.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconEyeSlash: React.FC<Props>;
-export default IconEyeSlash;

package/dist/icons/IconLocation.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconLocation: React.FC<Props>;
-export default IconLocation;

package/dist/icons/IconMinusCircle.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconMinusCircle: React.FC<Props>;
-export default IconMinusCircle;

package/dist/icons/IconMore.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconMore: React.FC<Props>;
-export default IconMore;

package/dist/icons/IconRemove.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-declare type Props = {
-    size?: 'small' | 'medium' | 'default' | 'large';
-    color?: Color;
-};
-declare const IconRemove: React.FC<Props>;
-export default IconRemove;

package/dist/icons/IconUser.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: string;
-};
-declare const IconUser: React.FC<Props>;
-export default IconUser;

package/dist/icons/IconUserPlus.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { Color } from '../foundation/colors';
-import { IconSize } from './types';
-declare type Props = {
-    size?: IconSize;
-    color?: Color;
-};
-declare const IconUserPlus: React.FC<Props>;
-export default IconUserPlus;