feat(ui-list): migrate to new theming system

Author: git-nandor

packages/ui-list/src/InlineList/InlineListItem/index.tsx

@@ -26,12 +26,9 @@ import { Component } from 'react'
 
 import { View } from '@instructure/ui-view'
 import { passthroughProps } from '@instructure/ui-react-utils'
-
-import { withStyleRework as withStyle } from '@instructure/emotion'
+import { withStyle } from '@instructure/emotion'
 
 import generateStyle from './styles'
-import generateComponentTheme from './theme'
-
 import { allowedProps } from './props'
 import type { InlineListItemProps } from './props'
 
@@ -41,7 +38,7 @@ parent: InlineList
 id: InlineList.Item
 ---
 **/
-@withStyle(generateStyle, generateComponentTheme)
+@withStyle(generateStyle)
 class InlineListItem extends Component<InlineListItemProps> {
   static readonly componentId = 'InlineList.Item'
 

packages/ui-list/src/InlineList/InlineListItem/styles.ts

@@ -24,7 +24,7 @@
 
 import { logError as error } from '@instructure/console'
 
-import type { InlineListItemTheme } from '@instructure/shared-types'
+import type { NewComponentTypes } from '@instructure/ui-themes'
 import type { InlineListItemProps, InlineListItemStyle } from './props'
 
 /**
@@ -40,7 +40,7 @@ import type { InlineListItemProps, InlineListItemStyle } from './props'
  * @return {Object} The final style object, which will be used in the component
  */
 const generateStyle = (
-  componentTheme: InlineListItemTheme,
+  componentTheme: NewComponentTypes['InlineListInlineListItem'],
   props: InlineListItemProps
 ): InlineListItemStyle => {
   const { size, delimiter, spacing } = props

packages/ui-list/src/InlineList/InlineListItem/theme.ts

@@ -26,12 +26,9 @@ import { Component } from 'react'
 
 import { View } from '@instructure/ui-view'
 import { passthroughProps } from '@instructure/ui-react-utils'
-
-import { withStyleRework as withStyle } from '@instructure/emotion'
+import { withStyle } from '@instructure/emotion'
 
 import generateStyle from './styles'
-import generateComponentTheme from './theme'
-
 import { allowedProps } from './props'
 import type { ListItemProps } from './props'
 
@@ -41,7 +38,7 @@ parent: List
 id: List.Item
 ---
 **/
-@withStyle(generateStyle, generateComponentTheme)
+@withStyle(generateStyle)
 class ListItem extends Component<ListItemProps> {
   static readonly componentId = 'List.Item'
 

packages/ui-list/src/List/ListItem/index.tsx

@@ -23,8 +23,7 @@
  */
 
 import { logError as error } from '@instructure/console'
-
-import type { ListItemTheme } from '@instructure/shared-types'
+import type { NewComponentTypes } from '@instructure/ui-themes'
 import type { ListItemProps, ListItemStyle } from './props'
 
 /**
@@ -40,7 +39,7 @@ import type { ListItemProps, ListItemStyle } from './props'
  * @return {Object} The final style object, which will be used in the component
  */
 const generateStyle = (
-  componentTheme: ListItemTheme,
+  componentTheme: NewComponentTypes['ListListItem'],
   props: ListItemProps
 ): ListItemStyle => {
   const { size, delimiter, spacing } = props

packages/ui-list/src/List/ListItem/styles.ts

@@ -26,14 +26,10 @@ import { Children, Component, ReactElement } from 'react'
 
 import { View } from '@instructure/ui-view'
 import { passthroughProps, safeCloneElement } from '@instructure/ui-react-utils'
+import { withStyle } from '@instructure/emotion'
 
 import { ListItem } from './ListItem'
-
-import { withStyleRework as withStyle } from '@instructure/emotion'
-
 import generateStyle from './styles'
-import generateComponentTheme from './theme'
-
 import { allowedProps } from './props'
 import type { ListProps } from './props'
 
@@ -42,7 +38,7 @@ import type { ListProps } from './props'
 category: components
 ---
 **/
-@withStyle(generateStyle, generateComponentTheme)
+@withStyle(generateStyle)
 class List extends Component<ListProps> {
   static readonly componentId = 'List'
 

packages/ui-list/src/List/ListItem/theme.ts

@@ -22,8 +22,8 @@
  * SOFTWARE.
  */
 
-import type { ListTheme } from '@instructure/shared-types'
 import type { ListProps, ListStyle } from './props'
+import type { NewComponentTypes } from '@instructure/ui-themes'
 
 /**
  * ---
@@ -36,7 +36,7 @@ import type { ListProps, ListStyle } from './props'
  * @return {Object} The final style object, which will be used in the component
  */
 const generateStyle = (
-  componentTheme: ListTheme,
+  componentTheme: NewComponentTypes['List'],
   props: ListProps
 ): ListStyle => {
   const { isUnstyled, as } = props