Merge pull request #555 from Yoctol/chore/bump-deps

package.json

@@ -1,5 +1,6 @@
 {
   "name": "tailor-ui",
+  "version": "1.9.1",
   "description": "A bespoke UI collection for building web application.",
   "license": "MIT",
   "author": "dev@yoctol.com",
@@ -11,7 +12,6 @@
   "bugs": {
     "url": "https://github.com/yoctol/tailor-ui/issues"
   },
-  "version": "1.9.1",
   "main": "lib/index.cjs.js",
   "module": "lib/index.js",
   "files": [
@@ -51,7 +51,7 @@
     "@reach/tooltip": "^0.15.0",
     "@reach/utils": "^0.15.0",
     "@react-spring/web": "^9.1.2",
-    "date-fns": "^2.21.1",
+    "date-fns": "^2.21.3",
     "downshift": "^6.1.3",
     "downshift3": "npm:downshift@3.2.12",
     "fuzzaldrin-plus": "^0.6.0",
@@ -69,7 +69,7 @@
     "react-virtual": "^2.7.1",
     "react-window": "^1.8.6",
     "resize-observer-polyfill": "^1.5.1",
-    "styled-components": "^5.2.3",
+    "styled-components": "^5.3.0",
     "styled-normalize": "^8.0.7",
     "styled-system": "^5.1.5"
   },
@@ -81,60 +81,60 @@
     "styled-components": ">=5.0.0"
   },
   "devDependencies": {
-    "@babel/cli": "^7.13.16",
-    "@babel/core": "^7.14.0",
+    "@babel/cli": "^7.14.3",
+    "@babel/core": "^7.14.3",
     "@babel/plugin-proposal-class-properties": "^7.13.0",
-    "@babel/plugin-transform-runtime": "^7.13.15",
-    "@babel/preset-env": "^7.14.0",
+    "@babel/plugin-transform-runtime": "^7.14.3",
+    "@babel/preset-env": "^7.14.2",
     "@babel/preset-react": "^7.13.13",
     "@babel/preset-typescript": "^7.13.0",
     "@semantic-release/changelog": "^5.0.1",
     "@semantic-release/git": "^9.0.0",
-    "@testing-library/dom": "^7.30.4",
+    "@testing-library/dom": "^7.31.0",
     "@testing-library/jest-dom": "^5.12.0",
-    "@testing-library/react": "^11.2.6",
-    "@testing-library/user-event": "^13.1.8",
+    "@testing-library/react": "^11.2.7",
+    "@testing-library/user-event": "^13.1.9",
     "@types/fuzzaldrin-plus": "^0.6.1",
     "@types/jest": "^26.0.23",
     "@types/lodash.debounce": "^4.0.6",
     "@types/ramda": "^0.27.38",
-    "@types/react": "17.0.4",
-    "@types/react-dom": "^17.0.1",
+    "@types/react": "17.0.6",
+    "@types/react-dom": "^17.0.5",
     "@types/react-helmet": "^6.1.1",
     "@types/react-window": "^1.8.3",
     "@types/styled-components": "5.1.9",
     "@types/styled-system": "^5.1.11",
     "@types/yup": "^0.29.11",
-    "@typescript-eslint/eslint-plugin": "^4.22.0",
-    "@typescript-eslint/parser": "^4.22.0",
+    "@typescript-eslint/eslint-plugin": "^4.24.0",
+    "@typescript-eslint/parser": "^4.24.0",
     "babel-core": "^7.0.0-0",
     "babel-eslint": "^10.1.0",
     "babel-jest": "^26.6.3",
     "babel-plugin-ramda": "^2.0.0",
     "babel-plugin-styled-components": "^1.12.0",
     "babel-plugin-typescript-to-proptypes": "^1.4.2",
     "cross-env": "^7.0.3",
-    "eslint": "^7.25.0",
+    "eslint": "^7.26.0",
     "eslint-config-yoctol": "^0.26.2",
     "eslint-import-resolver-jest": "^3.0.0",
-    "eslint-plugin-import": "2.22.1",
+    "eslint-plugin-import": "2.23.2",
     "eslint-plugin-jsx-a11y": "^6.4.1",
     "eslint-plugin-prettier": "^3.4.0",
     "eslint-plugin-react": "^7.23.2",
     "eslint-plugin-react-hooks": "^4.2.0",
     "eslint-plugin-sort-imports-es6-autofix": "^0.6.0",
     "eslint-plugin-typescript": "^0.14.0",
-    "formik": "^2.2.6",
+    "formik": "^2.2.7",
     "husky": "^6.0.0",
     "jest": "^26.6.3",
     "jest-styled-components": "^7.0.4",
-    "lint-staged": "^10.5.4",
-    "prettier": "^2.2.1",
-    "prettier-package-json": "^2.1.3",
+    "lint-staged": "^11.0.0",
+    "prettier": "^2.3.0",
+    "prettier-package-json": "^2.5.0",
     "rimraf": "^3.0.2",
-    "rollup": "^2.46.0",
+    "rollup": "^2.48.0",
     "rollup-plugin-commonjs": "^10.1.0",
-    "semantic-release": "^17.4.0",
+    "semantic-release": "^17.4.3",
     "stylelint": "13.13.1",
     "stylelint-config-prettier": "^8.0.2",
     "stylelint-config-styled-components": "^0.1.1",

src/Checkbox/CheckboxGroup.tsx

@@ -67,9 +67,10 @@ const CheckboxGroup = forwardRef<HTMLDivElement, CheckboxGroupProps>(
       [ownValue, setOwnValue, setValue]
     );
 
-    const isChecked = useCallback((_value) => ownValue.includes(_value), [
-      ownValue,
-    ]);
+    const isChecked = useCallback(
+      (_value) => ownValue.includes(_value),
+      [ownValue]
+    );
 
     const child = useMemo(
       () =>

src/Container/Container.tsx

@@ -34,8 +34,7 @@ const Section = forwardRef<HTMLDivElement, SectionProps>(function Section(
 
 const isElementTable = (element: ReactNode) =>
   isValidElement(element) &&
-  ((element.type as unknown) as { displayName: string }).displayName ===
-    'Table';
+  (element.type as unknown as { displayName: string }).displayName === 'Table';
 
 interface ContainerTitleProps {
   title?: ReactNode;

src/FormField/useFormField.ts

@@ -13,9 +13,8 @@ const useFormField = ({
   value?: any;
   defaultValue?: any;
 }) => {
-  const { invalid, setValue, setLabelId, labelId } = useContext(
-    FormFieldContext
-  );
+  const { invalid, setValue, setLabelId, labelId } =
+    useContext(FormFieldContext);
 
   useEffect(() => {
     if (id) {

src/Popover/Popover.tsx

@@ -59,9 +59,8 @@ const Popover: FC<PopoverProps> = ({
     children,
   });
 
-  const { setHasChild: setHasChildFromContext } = useContext(
-    ClickOutsideContext
-  );
+  const { setHasChild: setHasChildFromContext } =
+    useContext(ClickOutsideContext);
   const [hasChild, setHasChild] = useState(false);
 
   const { visible, handleClose, toggle } = useToggleTrigger({

src/Select/SelectOptions.tsx

@@ -97,9 +97,8 @@ const SelectOptions: FC<SelectOptionsProps> = ({
 }) => {
   const listRef = useRef<FixedSizeList>(null);
   const [prevSearchValue, setPrevSearchValue] = useState(inputValue);
-  const [createOptionWidth, setCreateOptionWidth] = useState<
-    number | undefined
-  >(undefined);
+  const [createOptionWidth, setCreateOptionWidth] =
+    useState<number | undefined>(undefined);
   const createOptionRef = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
@@ -147,10 +146,10 @@ const SelectOptions: FC<SelectOptionsProps> = ({
     return [];
   }, [creatable, inputValue, isValidNewOption, prevSearchValue, visible]);
 
-  const items = useMemo(() => [...filteredItems, ...additionItems], [
-    additionItems,
-    filteredItems,
-  ]);
+  const items = useMemo(
+    () => [...filteredItems, ...additionItems],
+    [additionItems, filteredItems]
+  );
 
   if (items.length === 0) {
     return <>{noOptionsMessage()}</>;

src/Slider/Slider.tsx

@@ -45,11 +45,12 @@ const Slider: FC<SliderProps> = ({
     initialDefaultValue || (range ? [0, 0] : 0)
   );
   const [stepOffset, setStepOffset] = useState<number>(0);
-  const [dragStart, setDragStart] = useState<{
-    x: number;
-    value: number;
-    touch: boolean;
-  } | null>(null);
+  const [dragStart, setDragStart] =
+    useState<{
+      x: number;
+      value: number;
+      touch: boolean;
+    } | null>(null);
 
   const value = (valueFromProps || defaultValue) as Value;
   const denominator = max - min;

src/Steps/Step.tsx

@@ -52,14 +52,8 @@ export interface StepProps {
 }
 
 const Step: FC<StepProps> = ({ title, description = null }) => {
-  const {
-    count,
-    status,
-    isLast,
-    tailColor,
-    direction,
-    onCurrentChange,
-  } = useContext(StepContext);
+  const { count, status, isLast, tailColor, direction, onCurrentChange } =
+    useContext(StepContext);
   return (
     <Flex
       flex={isLast ? 'none' : 'auto'}

src/Table/FixedColumnContext.tsx

@@ -22,10 +22,7 @@ interface Column extends FixedColumn {
 
 const FixedColumnContext = createContext<{
   setColumn: (column: Column) => void;
-  getColumnFixedInfo: (payload: {
-    index: number;
-    style?: CSSProperties;
-  }) => {
+  getColumnFixedInfo: (payload: { index: number; style?: CSSProperties }) => {
     style?: CSSProperties;
     fixed?: boolean;
     showScrollShadowStart?: boolean;
@@ -64,11 +61,10 @@ const useFixedHeadColumn = ({
     });
   }, [index, width, fixed, colSpan, setColumn]);
 
-  return useMemo(() => getColumnFixedInfo({ index, style }), [
-    getColumnFixedInfo,
-    index,
-    style,
-  ]);
+  return useMemo(
+    () => getColumnFixedInfo({ index, style }),
+    [getColumnFixedInfo, index, style]
+  );
 };
 
 interface FixedColumnContextProviderProps {

src/lab/Select/utils.ts

@@ -57,9 +57,8 @@ export const useSelectOptions = <T extends SelectOption>({
   isValidNewOption: (value: string) => boolean;
 }) => {
   const [searchValue, setSearchValue] = useState('');
-  const [selectOptions, setSelectOptions] = useState<
-    (T | SelectCreateOptionObject)[]
-  >(options);
+  const [selectOptions, setSelectOptions] =
+    useState<(T | SelectCreateOptionObject)[]>(options);
 
   useIsomorphicLayoutEffect(() => {
     if (onSearch && searchValue.trim() !== '') {

src/lab/Tooltip/Tooltip.tsx

@@ -5,12 +5,13 @@ import {
   useTooltip,
 } from '@reach/tooltip';
 import { animated, useTransition } from '@react-spring/web';
-import type * as Polymorphic from '@reach/utils/polymorphic';
 
 import { Stack } from '../../Stack';
 
 import { TooltipStyle } from './styles';
 
+import type * as Polymorphic from '@reach/utils/polymorphic';
+
 const AnimatedTooltipContent = animated(TooltipPopup);
 
 interface TooltipProps

src/notification/useNotification.ts

@@ -20,9 +20,10 @@ const useNotification = () => {
     [triggerRef]
   );
 
-  const close = useCallback((key: string) => triggerRef.current.close(key), [
-    triggerRef,
-  ]);
+  const close = useCallback(
+    (key: string) => triggerRef.current.close(key),
+    [triggerRef]
+  );
 
   const destroy = useCallback(() => triggerRef.current.destroy(), [triggerRef]);
 

website/src/pages/index.js

@@ -125,9 +125,8 @@ function User({ imageUrl, url, title, description }) {
 }
 
 function Home() {
-  const {
-    siteConfig: { customFields = {}, tagline } = {},
-  } = useDocusaurusContext();
+  const { siteConfig: { customFields = {}, tagline } = {} } =
+    useDocusaurusContext();
   const logoUrl = useBaseUrl('/img/tailor-ui-dark.svg');
 
   return (