chore(deps): update dependency prettier to v3 (#1597)

renovate[bot] · jzempel · web-flow · commit 243e0521e654 · 2023-08-08T15:58:03.000-04:00
Co-authored-by: renovate[bot] &lt;29139614+renovate[bot]@users.noreply.github.com&gt;
Co-authored-by: Jonathan Zempel &lt;jzempel@gmail.com&gt;
diff --git a/package.json b/package.json
@@ -8,8 +8,8 @@
     "build:demo": "storybook build -o ./demo",
     "format": "prettier-package-json --write && yarn format:package_json --write && yarn format:js --write && yarn format:md --write",
     "format:all": "prettier-package-json --list-different && yarn format:package_json --list-different && yarn format:js --check && yarn format:md --check",
-    "format:js": "prettier --loglevel warn '{packages,utils}/**/*.{js,mjs,ts,tsx}' '!packages/.template' '!packages/**/dist/**'",
-    "format:md": "prettier --loglevel warn 'packages/**/*.{md,mdx}'",
+    "format:js": "prettier --log-level warn '{packages,utils}/**/*.{js,mjs,ts,tsx}' '!packages/.template' '!packages/**/dist/**'",
+    "format:md": "prettier --log-level warn 'packages/**/*.{md,mdx}'",
     "format:package_json": "lerna exec -- prettier-package-json",
     "postinstall": "husky install && lerna bootstrap",
     "lint": "yarn lint:css && yarn lint:js && yarn lint:md",
@@ -79,7 +79,7 @@
     "coveralls": "3.1.1",
     "envalid": "7.3.1",
     "eslint": "8.46.0",
-    "eslint-config-prettier": "8.10.0",
+    "eslint-config-prettier": "9.0.0",
     "eslint-plugin-garden-local": "file:./utils/eslint",
     "eslint-plugin-jest": "27.2.3",
     "eslint-plugin-jsx-a11y": "6.7.1",
@@ -102,7 +102,7 @@
     "ora": "7.0.1",
     "pluralize": "8.0.0",
     "postcss-styled-syntax": "0.4.0",
-    "prettier": "2.8.8",
+    "prettier": "3.0.1",
     "prettier-package-json": "2.8.0",
     "qs": "6.11.2",
     "react": "17.0.2",
diff --git a/packages/accordions/src/styled/accordion/StyledRotateIcon.ts b/packages/accordions/src/styled/accordion/StyledRotateIcon.ts
@@ -41,7 +41,9 @@ export const StyledRotateIcon = styled(
   'data-garden-version': PACKAGE_VERSION
 })<IStyledRotateIcon>`
   transform: ${props => props.isRotated && `rotate(${props.theme.rtl ? '-' : '+'}180deg)`};
-  transition: transform 0.25s ease-in-out, color 0.1s ease-in-out;
+  transition:
+    transform 0.25s ease-in-out,
+    color 0.1s ease-in-out;
   box-sizing: content-box;
   padding: ${props =>
     props.isCompact
diff --git a/packages/accordions/src/styled/stepper/StyledIcon.ts b/packages/accordions/src/styled/stepper/StyledIcon.ts
@@ -35,8 +35,8 @@ const sizeStyles = (props: IStyledIcon & ThemeProps<DefaultTheme>) => {
     margin-bottom: ${props.isHorizontal && `${props.theme.space.base * 2}px`};
     /* stylelint-disable-next-line property-no-unknown */
     margin-${props.theme.rtl ? 'left' : 'right'}: ${
-    !props.isHorizontal && `${props.theme.space.base * 3}px`
-  };
+      !props.isHorizontal && `${props.theme.space.base * 3}px`
+    };
     width: ${size};
     min-width: ${size};
     height: ${size};
@@ -62,7 +62,9 @@ export const StyledIcon = styled.div.attrs<IStyledIcon>({
   display: flex;
   align-items: center;
   justify-content: center;
-  transition: background 0.25s ease-in-out, color 0.25s ease-in-out;
+  transition:
+    background 0.25s ease-in-out,
+    color 0.25s ease-in-out;
   border-radius: 100%;
   ${sizeStyles}
   ${colorStyles}
diff --git a/packages/accordions/src/styled/stepper/StyledLabel.ts b/packages/accordions/src/styled/stepper/StyledLabel.ts
@@ -26,7 +26,9 @@ export const StyledLabel = styled.div.attrs<IStyledLabelProps>({
 })<IStyledLabelProps>`
   display: ${props => !props.isHorizontal && 'flex'};
   align-items: ${props => !props.isHorizontal && 'center'};
-  transition: color 0.25s ease-in-out, font-weight 0.25s ease-in-out;
+  transition:
+    color 0.25s ease-in-out,
+    font-weight 0.25s ease-in-out;
   text-align: ${props => props.isHorizontal && 'center'};
   line-height: ${props => getLineHeight(props.theme.space.base * 5, props.theme.fontSizes.md)};
   color: ${props =>
diff --git a/packages/avatars/src/styled/StyledAvatar.ts b/packages/avatars/src/styled/StyledAvatar.ts
@@ -156,7 +156,9 @@ export const StyledAvatar = styled.figure.attrs({
   position: relative;
   align-items: center;
   justify-content: center;
-  transition: box-shadow ${TRANSITION_DURATION}s ease-in-out, color 0.1s ease-in-out;
+  transition:
+    box-shadow ${TRANSITION_DURATION}s ease-in-out,
+    color 0.1s ease-in-out;
   margin: 0; /* <figure> reset */
   vertical-align: middle;
   box-sizing: border-box;
diff --git a/packages/buttons/src/styled/StyledIcon.ts b/packages/buttons/src/styled/StyledIcon.ts
@@ -41,7 +41,9 @@ export const StyledIcon = styled(({ children, isRotated, theme, ...props }) =>
   'data-garden-version': PACKAGE_VERSION
 })<IStyledIconProps>`
   transform: ${props => props.isRotated && `rotate(${props.theme.rtl ? '-' : '+'}180deg)`};
-  transition: transform 0.25s ease-in-out, color 0.25s ease-in-out;
+  transition:
+    transform 0.25s ease-in-out,
+    color 0.25s ease-in-out;
 
   ${props => sizeStyles(props)};
 
diff --git a/packages/chrome/src/styled/StyledSkipNav.ts b/packages/chrome/src/styled/StyledSkipNav.ts
@@ -27,7 +27,9 @@ const animationStyles = () => {
   `;
 
   return css`
-    transition: opacity 0.2s ease-out, clip 0s linear 0.2s;
+    transition:
+      opacity 0.2s ease-out,
+      clip 0s linear 0.2s;
     opacity: 0;
     clip: rect(0, 0, 0, 0);
 
diff --git a/packages/chrome/src/styled/body/StyledSidebar.ts b/packages/chrome/src/styled/body/StyledSidebar.ts
@@ -19,7 +19,7 @@ export const StyledSidebar = styled.aside.attrs({
   box-sizing: border-box;
   /* stylelint-disable-next-line property-no-unknown */
   border-${props => (props.theme.rtl ? 'left' : 'right')}: ${props =>
-  `${props.theme.borders.sm} ${getColor('neutralHue', 300, props.theme)}`};
+    `${props.theme.borders.sm} ${getColor('neutralHue', 300, props.theme)}`};
   width: 330px;
   overflow: auto;
 
diff --git a/packages/chrome/src/styled/header/StyledBaseHeaderItem.ts b/packages/chrome/src/styled/header/StyledBaseHeaderItem.ts
@@ -48,7 +48,9 @@ export const StyledBaseHeaderItem = styled.button.attrs({
   align-items: center;
   justify-content: ${props => (props.maxX ? 'start' : 'center')};
   order: 1;
-  transition: box-shadow 0.1s ease-in-out, color 0.1s ease-in-out;
+  transition:
+    box-shadow 0.1s ease-in-out,
+    color 0.1s ease-in-out;
   z-index: 0; /* [1] */
   margin: ${props => `0 ${props.theme.space.base * 3}px`};
   border: none; /* [2] */
diff --git a/packages/chrome/src/styled/header/StyledLogoHeaderItem.ts b/packages/chrome/src/styled/header/StyledLogoHeaderItem.ts
@@ -59,7 +59,7 @@ export const StyledLogoHeaderItem = styled(StyledBaseHeaderItem).attrs({
   margin-left: ${props => (props.theme.rtl ? 'auto' : `-${props.theme.space.base}px`)};
   /* stylelint-disable-next-line property-no-unknown */
   border-${props => (props.theme.rtl ? 'left' : 'right')}: ${props =>
-  `${props.theme.borders.sm} ${getColor('neutralHue', 300, props.theme)}`};
+    `${props.theme.borders.sm} ${getColor('neutralHue', 300, props.theme)}`};
   border-radius: 0;
   padding: 0;
   width: ${props => getNavWidth(props)};
diff --git a/packages/chrome/src/styled/subnav/StyledSubNavItemHeader.ts b/packages/chrome/src/styled/subnav/StyledSubNavItemHeader.ts
@@ -24,7 +24,7 @@ export const StyledSubNavItemHeader = styled(StyledSubNavItem).attrs<IStyledSubN
   position: relative;
   /* stylelint-disable-next-line property-no-unknown */
   padding-${props => (props.theme.rtl ? 'left' : 'right')}: ${props =>
-  props.theme.space.base * 7}px;
+    props.theme.space.base * 7}px;
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
diff --git a/packages/chrome/src/styled/subnav/StyledSubNavPanel.ts b/packages/chrome/src/styled/subnav/StyledSubNavPanel.ts
@@ -36,7 +36,7 @@ export const StyledSubNavPanel = styled.div.attrs<IStyledSubNavPanelProps>({
   ${StyledSubNavItem} {
     /* stylelint-disable-next-line property-no-unknown */
     padding-${props => (props.theme.rtl ? 'right' : 'left')}: ${props =>
-  `${props.theme.space.base * 5}px`};
+      `${props.theme.space.base * 5}px`};
   }
 
   ${props => retrieveComponentStyles(PANEL_COMPONENT_ID, props)};
diff --git a/packages/dropdowns/src/styled/items/media/StyledMediaBody.ts b/packages/dropdowns/src/styled/items/media/StyledMediaBody.ts
@@ -25,7 +25,7 @@ export const StyledMediaBody = styled.div.attrs({
   overflow: hidden;
   /* stylelint-disable-next-line property-no-unknown */
   padding-${props => (props.theme.rtl ? 'right' : 'left')}: ${props =>
-  props.theme.space.base * 2}px;
+    props.theme.space.base * 2}px;
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
diff --git a/packages/forms/demo/~patterns/stories/FileUploadStory.tsx b/packages/forms/demo/~patterns/stories/FileUploadStory.tsx
@@ -34,17 +34,20 @@ const FileItem: FC<IFileItemProps> = memo(({ type, disabled, isCompact, children
 
   useEffect(() => {
     /* simulate file upload progress */
-    const interval = setInterval(() => {
-      setUploadProgress(value => {
-        if (value >= 100) {
-          clearInterval(interval);
-
-          return 100;
-        }
-
-        return value + 20;
-      });
-    }, Math.random() * 300 + 100);
+    const interval = setInterval(
+      () => {
+        setUploadProgress(value => {
+          if (value >= 100) {
+            clearInterval(interval);
+
+            return 100;
+          }
+
+          return value + 20;
+        });
+      },
+      Math.random() * 300 + 100
+    );
 
     return () => {
       clearInterval(interval);
diff --git a/packages/forms/src/styled/toggle/StyledToggleMessage.ts b/packages/forms/src/styled/toggle/StyledToggleMessage.ts
@@ -23,7 +23,7 @@ export const StyledToggleMessage = styled(StyledMessage).attrs({
 
   & ${StyledMessageIcon} {
     ${props => (props.theme.rtl ? 'right' : 'left')}: ${props =>
-  math(`${props.theme.space.base} * 10px - ${props.theme.iconSizes.md}`)};
+      math(`${props.theme.space.base} * 10px - ${props.theme.iconSizes.md}`)};
   }
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
diff --git a/packages/grid/src/elements/pane/PaneProvider.tsx b/packages/grid/src/elements/pane/PaneProvider.tsx
@@ -16,11 +16,14 @@ const getPixelsPerFr = (totalFrs: number, totalDimension: number) => {
 };
 
 const convertToPixels = (values: Record<string, number>, pixelsPerFr: number) => {
-  return Object.entries(values).reduce((prev, [key, value]) => {
-    prev[key] = value * pixelsPerFr;
+  return Object.entries(values).reduce(
+    (prev, [key, value]) => {
+      prev[key] = value * pixelsPerFr;
 
-    return prev;
-  }, {} as Record<string, number>);
+      return prev;
+    },
+    {} as Record<string, number>
+  );
 };
 
 export const PaneProvider = ({
@@ -94,17 +97,23 @@ export const PaneProvider = ({
     const rowArray = Object.keys(rowsTrack);
     const columnArray = Object.keys(columnsTrack);
 
-    const rows = rowArray.reduce((prev, key, index) => {
-      prev[key] = index;
+    const rows = rowArray.reduce(
+      (prev, key, index) => {
+        prev[key] = index;
 
-      return prev;
-    }, {} as Record<string, number>);
+        return prev;
+      },
+      {} as Record<string, number>
+    );
 
-    const columns = columnArray.reduce((prev, key, index) => {
-      prev[key] = index;
+    const columns = columnArray.reduce(
+      (prev, key, index) => {
+        prev[key] = index;
 
-      return prev;
-    }, {} as Record<string, number>);
+        return prev;
+      },
+      {} as Record<string, number>
+    );
 
     return {
       rows,
diff --git a/packages/tables/src/styled/StyledCell.ts b/packages/tables/src/styled/StyledCell.ts
@@ -63,7 +63,9 @@ export const StyledCell = styled.td.attrs<IStyledCellProps>({
   'data-garden-version': PACKAGE_VERSION
 })<IStyledCellProps>`
   display: table-cell;
-  transition: border-color 0.25s ease-in-out, box-shadow 0.1s ease-in-out;
+  transition:
+    border-color 0.25s ease-in-out,
+    box-shadow 0.1s ease-in-out;
 
   ${props => sizeStyling(props)};
   ${props => props.isTruncated && truncatedStyling};
diff --git a/packages/tables/src/styled/StyledSortableButton.ts b/packages/tables/src/styled/StyledSortableButton.ts
@@ -75,7 +75,7 @@ export const StyledSortableButton = styled.button.attrs<IStyledSortableButtonPro
   padding: 0; /* [1] */
   /* stylelint-disable-next-line property-no-unknown */
   padding-${props => (props.theme.rtl ? 'left' : 'right')}: ${props =>
-  math(`${props.theme.space.base} + ${props.theme.iconSizes.sm}`)};
+    math(`${props.theme.space.base} + ${props.theme.iconSizes.sm}`)};
   width: ${props => props.width};
   text-decoration: none; /* [2] */
   color: inherit;
diff --git a/packages/typography/src/styled/StyledBlockquote.ts b/packages/typography/src/styled/StyledBlockquote.ts
@@ -19,11 +19,11 @@ export const StyledBlockquote = styled.blockquote.attrs({
   margin: 0;
   /* stylelint-disable property-no-unknown */
   border-${props => (props.theme.rtl ? 'right' : 'left')}: ${props =>
-  props.theme.shadowWidths.sm} solid;
+    props.theme.shadowWidths.sm} solid;
   border-color: ${props => getColor('neutralHue', 400, props.theme)};
   padding: 0;
   padding-${props => (props.theme.rtl ? 'right' : 'left')}: ${props =>
-  props.theme.space.base * 4}px;
+    props.theme.space.base * 4}px;
   /* stylelint-enable property-no-unknown */
   direction: ${props => (props.theme.rtl ? 'rtl' : 'ltr')};
 
diff --git a/packages/typography/src/styled/StyledListItem.ts b/packages/typography/src/styled/StyledListItem.ts
@@ -64,9 +64,9 @@ export const StyledOrderedListItem = styled(StyledFont as 'li').attrs({
 })<IStyledListItemProps>`
   /* stylelint-disable */
   margin-${props => (props.theme.rtl ? 'right' : 'left')}: ${props =>
-  math(`${props.theme.space.base} * -1px`)};
+    math(`${props.theme.space.base} * -1px`)};
   padding-${props => (props.theme.rtl ? 'right' : 'left')}: ${props =>
-  math(`${props.theme.space.base} * 1px`)};
+    math(`${props.theme.space.base} * 1px`)};
   /* stylelint-enable */
 
   ${props => listItemStyles(props)};
diff --git a/yarn.lock b/yarn.lock
@@ -9493,10 +9493,10 @@ escodegen@^2.0.0:
   optionalDependencies:
     source-map "~0.6.1"
 
-eslint-config-prettier@8.10.0:
-  version "8.10.0"
-  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-8.10.0.tgz#3a06a662130807e2502fc3ff8b4143d8a0658e11"
-  integrity sha512-SM8AMJdeQqRYT9O9zguiruQZaN7+z+E4eAP9oiLNGKMtomwaB1E9dcgUD6ZAn/eQAb52USbvezbiljfZUhbJcg==
+eslint-config-prettier@9.0.0:
+  version "9.0.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-9.0.0.tgz#eb25485946dd0c66cd216a46232dc05451518d1f"
+  integrity sha512-IcJsTkJae2S35pRsRAwoCE+925rJJStOdkKnLVgtE+tEpqU0EVVM7OqrwxqgptKdX29NUwC82I5pXsGFIgSevw==
 
 eslint-plugin-es@^3.0.0:
   version "3.0.1"
@@ -16438,7 +16438,12 @@ prettier-package-json@2.8.0:
     sort-object-keys "^1.1.3"
     sort-order "^1.0.1"
 
-prettier@2.8.8, prettier@^2.8.0:
+prettier@3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.0.1.tgz#65271fc9320ce4913c57747a70ce635b30beaa40"
+  integrity sha512-fcOWSnnpCrovBsmFZIGIy9UqK2FaI7Hqax+DIO0A9UxeVoY4iweyaFjS5TavZN97Hfehph0nhsZnjlVKzEQSrQ==
+
+prettier@^2.8.0:
   version "2.8.8"
   resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.8.tgz#e8c5d7e98a4305ffe3de2e1fc4aca1a71c28b1da"
   integrity sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==
