Upgrade TypeScript to v4.9.3 (#7271)

Author: aaronccasanova

package.json

@@ -84,7 +84,7 @@
     "stylelint": "^14.15.0",
     "ts-node": "^10.7.0",
     "turbo": "^1.2.8",
-    "typescript": "^4.6.3"
+    "typescript": "^4.9.3"
   },
   "prettier": "@shopify/prettier-config",
   "size-limit": [

polaris-cli/package.json

@@ -26,9 +26,6 @@
     "@oclif/core": "^1.13.10",
     "@shopify/polaris-migrator": "^0.11.3"
   },
-  "devDependencies": {
-    "typescript": "^4.7.4"
-  },
   "engine-strict": true,
   "engines": {
     "node": "^16.13.0 || >=18.12.0"

polaris-react/src/components/OptionList/tests/OptionList.test.tsx

@@ -539,12 +539,8 @@ function firstOption(
   options?: OptionDescriptor[],
   sections?: OptionListProps['sections'],
 ): string {
-  const firstOptionsValue =
-    options == null || options === [] ? '' : options[0].value;
-  const firstSectionOptionsValue =
-    sections == null || sections === [] || sections[0].options === []
-      ? ''
-      : sections[0].options[0].value;
+  const firstOptionsValue = options?.[0]?.value ?? '';
+  const firstSectionOptionsValue = sections?.[0]?.options?.[0]?.value ?? '';
   return firstOptionsValue || firstSectionOptionsValue;
 }
 

polaris-react/src/components/ResourceList/ResourceList.tsx

@@ -1,5 +1,4 @@
 import React, {
-  ReactElement,
   useCallback,
   useEffect,
   useReducer,
@@ -41,7 +40,11 @@ import styles from './ResourceList.scss';
 const SMALL_SPINNER_HEIGHT = 28;
 const LARGE_SPINNER_HEIGHT = 45;
 
-function getAllItemsOnPage<TItemType>(
+interface ResourceListItemData {
+  [data: string]: any;
+}
+
+function getAllItemsOnPage<TItemType extends ResourceListItemData>(
   items: TItemType[],
   idForItem: (item: TItemType, index: number) => string,
 ) {
@@ -57,16 +60,16 @@ const isBreakpointsXS = () => {
         parseFloat(toPx(tokens.breakpoints['breakpoints-sm']) ?? '');
 };
 
-function defaultIdForItem<TItemType extends {id?: any}>(
+function defaultIdForItem<TItemType extends ResourceListItemData>(
   item: TItemType,
   index: number,
-) {
-  return Object.prototype.hasOwnProperty.call(item, 'id')
-    ? item.id
-    : index.toString();
+): string {
+  return 'id' in item ? item.id : index.toString();
 }
 
-export interface ResourceListProps<TItemType = any> {
+export interface ResourceListProps<
+  TItemType extends ResourceListItemData = ResourceListItemData,
+> {
   /** Item data; each item is passed to renderItem */
   items: TItemType[];
   filterControl?: React.ReactNode;
@@ -119,13 +122,7 @@ export interface ResourceListProps<TItemType = any> {
   resolveItemId?(item: TItemType): string;
 }
 
-type ResourceListType = (<TItemType>(
-  value: ResourceListProps<TItemType>,
-) => ReactElement) & {
-  Item: typeof ResourceItem;
-};
-
-export const ResourceList: ResourceListType = function ResourceList<TItemType>({
+export function ResourceList<TItemType extends ResourceListItemData>({
   items,
   filterControl,
   emptyState,
@@ -767,6 +764,6 @@ export const ResourceList: ResourceListType = function ResourceList<TItemType>({
       <div ref={bulkActionsIntersectionRef} />
     </ResourceListContext.Provider>
   );
-};
+}
 
 ResourceList.Item = ResourceItem;

polaris-react/src/utilities/merge.ts

@@ -30,7 +30,7 @@ export function merge<TSource1, TSource2, TSource3, TSource4, TSource5>(
   let final = {};
 
   for (const obj of objs) {
-    final = mergeRecursively(final, obj);
+    final = mergeRecursively(final, obj as any);
   }
 
   return final;

polaris.shopify.com/content/design/typography.md

@@ -123,6 +123,10 @@ Small heading styles, `headingXs` - `headingMd`, and body styles will remain the
 
 ![An image showing how heading styles change based on breakpoint](/images/foundations/design/typography/type-responsive-styles@2x.png)
 
+### Uppercase styles
+
+The design language no longer supports uppercase typography. We recommend using the [Text component](/components/text) to apply visual hierarchy. Work with your team to determine a type style that works best for your use case.
+
 ---
 
 ## Font stack

polaris.shopify.com/package.json

@@ -70,6 +70,6 @@
     "rehype-raw": "^6.1.1",
     "sass": "^1.49.9",
     "style-loader": "^3.3.1",
-    "typescript": "^4.7.4"
+    "typescript": "^4.9.3"
   }
 }

yarn.lock

@@ -21679,10 +21679,10 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
-typescript@^4.3.2, typescript@^4.6.3, typescript@^4.7.4:
-  version "4.8.4"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.8.4.tgz#c464abca159669597be5f96b8943500b238e60e6"
-  integrity sha512-QCh+85mCy+h0IGff8r5XWzOVSbBO+KfeYrMQh7NJ58QujwcE22u+NUSmUxqF+un70P9GXKxa2HCNiTTMJknyjQ==
+typescript@^4.3.2, typescript@^4.9.3:
+  version "4.9.3"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.9.3.tgz#3aea307c1746b8c384435d8ac36b8a2e580d85db"
+  integrity sha512-CIfGzTelbKNEnLpLdGFgdyKhG23CKdKgQPOBc+OUNrkJ2vr+KSzsSV5kq5iWhEQbok+quxgGzrAtGWCyU7tHnA==
 
 typical@^4.0.0:
   version "4.0.0"