Skip to content

Commit 6c7faa5

Browse files
matyasfmatyasf
committed
refactor(many): better types for theming, small fixes
1 parent 9d623ed commit 6c7faa5

138 files changed

Lines changed: 621 additions & 691 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎packages/emotion/src/index.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ export { useStyle } from './useStyle'
4444
export { useTheme } from './useTheme'
4545

4646
export type { ComponentStyle, StyleObject, Overrides } from './EmotionTypes'
47-
export type { WithStyleProps } from './withStyleLegacy'
47+
export type { WithStyleProps } from './withStyle'
4848
export type { ThemeOverrideValue } from './useStyle'
4949
export type {
5050
SpacingValues,

‎packages/emotion/src/withStyle.tsx‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -66,14 +66,14 @@ type WithStylePrivateProps<
6666
> = Style extends null
6767
? object
6868
: {
69-
styles?: Style
70-
makeStyles?: (extraArgs?: Record<string, unknown>) => void
71-
}
69+
styles?: Style
70+
makeStyles?: (extraArgs?: Record<string, unknown>) => void
71+
}
7272

7373
type ThemeOverrideProp<Theme extends ComponentTheme | null = ComponentTheme> = {
7474
themeOverride?:
75-
| Partial<Theme>
76-
| ((componentTheme: Theme, currentTheme: BaseTheme) => Partial<Theme>)
75+
| Partial<Theme>
76+
| ((componentTheme: Theme, currentTheme: BaseTheme) => Partial<Theme>)
7777
}
7878

7979
type WithStyleProps<
@@ -87,7 +87,7 @@ declare const process: Record<string, any> | undefined
8787

8888
const defaultValues = {
8989
styles: {},
90-
makeStyles: () => { }
90+
makeStyles: () => {}
9191
}
9292

9393
/**
@@ -175,7 +175,7 @@ const withStyle = decorator(
175175
if (frozenTheme && !frozenTheme[themeKey]) {
176176
console.error(
177177
`The version of ${displayName} you are using does not support the currently applied "${themeKey}" theme. ` +
178-
`Please upgrade to the latest version of ${displayName}.`
178+
`Please upgrade to the latest version of ${displayName}.`
179179
)
180180
}
181181

@@ -231,7 +231,7 @@ const withStyle = decorator(
231231
theme.newTheme.sharedTokens?.(semantics),
232232
sharedTokensOverrides
233233
)
234-
234+
// Note: Some components do not have a theme, e.g., FormFieldMessages
235235
const baseComponentTheme =
236236
theme.newTheme.components[componentId as keyof NewComponentTypes]?.(
237237
semantics
@@ -247,17 +247,17 @@ const withStyle = decorator(
247247
// @ts-ignore TODO-theme-types: fix typing
248248
typeof componentOverridesFromThemeOverrideProp === 'function'
249249
? componentOverridesFromThemeOverrideProp(
250-
componentThemeFromSettingsProvider,
251-
themeInContext
252-
)
250+
componentThemeFromSettingsProvider,
251+
themeInContext
252+
)
253253
: componentOverridesFromThemeOverrideProp
254254
)
255255

256256
// TODO do not call here generateStyle, it does not receive the extraArgs
257257
const [styles, setStyles] = useState(
258258
generateStyle
259259
? // @ts-ignore TODO-theme-types: fix typing
260-
generateStyle(componentTheme, componentProps, sharedTokens, {})
260+
generateStyle(componentTheme, componentProps, sharedTokens, {})
261261
: {}
262262
)
263263

‎packages/ui-alerts/src/Alert/v2/props.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,8 @@ import type {
2929
WithStyleProps,
3030
ComponentStyle
3131
} from '@instructure/emotion'
32-
import type { AlertTheme, Renderable } from '@instructure/shared-types'
32+
import type { NewComponentTypes } from '@instructure/ui-themes'
33+
import type { Renderable } from '@instructure/shared-types'
3334
import type { WithDeterministicIdProps } from '@instructure/ui-react-utils'
3435

3536
type AlertOwnProps = {
@@ -116,7 +117,7 @@ type PropKeys = keyof AlertOwnProps
116117
type AllowedPropKeys = Readonly<Array<PropKeys>>
117118

118119
type AlertProps = AlertOwnProps &
119-
WithStyleProps<AlertTheme, AlertStyle> &
120+
WithStyleProps<ReturnType<NewComponentTypes['Alert']>, AlertStyle> &
120121
WithDeterministicIdProps
121122

122123
type AlertStyle = ComponentStyle<

‎packages/ui-avatar/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,13 +28,13 @@
2828
"@instructure/shared-types": "workspace:*",
2929
"@instructure/ui-icons": "workspace:*",
3030
"@instructure/ui-react-utils": "workspace:*",
31+
"@instructure/ui-themes": "workspace:*",
3132
"@instructure/ui-view": "workspace:*"
3233
},
3334
"devDependencies": {
3435
"@instructure/ui-axe-check": "workspace:*",
3536
"@instructure/ui-babel-preset": "workspace:*",
3637
"@instructure/ui-color-utils": "workspace:*",
37-
"@instructure/ui-themes": "workspace:*",
3838
"@testing-library/jest-dom": "^6.6.3",
3939
"@testing-library/react": "15.0.7",
4040
"vitest": "^3.2.2"

‎packages/ui-badge/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,12 +29,12 @@
2929
"@instructure/ui-color-utils": "workspace:*",
3030
"@instructure/ui-position": "workspace:*",
3131
"@instructure/ui-react-utils": "workspace:*",
32+
"@instructure/ui-themes": "workspace:*",
3233
"@instructure/ui-view": "workspace:*"
3334
},
3435
"devDependencies": {
3536
"@instructure/ui-axe-check": "workspace:*",
3637
"@instructure/ui-babel-preset": "workspace:*",
37-
"@instructure/ui-themes": "workspace:*",
3838
"@testing-library/jest-dom": "^6.6.3",
3939
"@testing-library/react": "15.0.7",
4040
"vitest": "^3.2.2"

‎packages/ui-badge/src/Badge/v2/props.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,12 +23,13 @@
2323
*/
2424

2525
import React from 'react'
26-
import type { AsElementType, BadgeTheme } from '@instructure/shared-types'
26+
import type { AsElementType } from '@instructure/shared-types'
2727
import type {
2828
Spacing,
2929
WithStyleProps,
3030
ComponentStyle
3131
} from '@instructure/emotion'
32+
import type { NewComponentTypes } from '@instructure/ui-themes'
3233
import type { PlacementPropValues } from '@instructure/ui-position'
3334
import type { WithDeterministicIdProps } from '@instructure/ui-react-utils'
3435
import type { PropsWithChildren } from 'react'
@@ -87,7 +88,7 @@ type PropKeys = keyof BadgeOwnProps
8788
type AllowedPropKeys = Readonly<Array<PropKeys>>
8889

8990
type BadgeProps = BadgeOwnProps &
90-
WithStyleProps<BadgeTheme, BadgeStyle> &
91+
WithStyleProps<ReturnType<NewComponentTypes['Badge']>, BadgeStyle> &
9192
WithDeterministicIdProps
9293

9394
type BadgeStyle = ComponentStyle<'badge' | 'wrapper'>

‎packages/ui-billboard/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,14 @@
2929
"@instructure/ui-heading": "workspace:*",
3030
"@instructure/ui-img": "workspace:*",
3131
"@instructure/ui-react-utils": "workspace:*",
32+
"@instructure/ui-themes": "workspace:*",
3233
"@instructure/ui-view": "workspace:*"
3334
},
3435
"devDependencies": {
3536
"@instructure/ui-axe-check": "workspace:*",
3637
"@instructure/ui-babel-preset": "workspace:*",
3738
"@instructure/ui-color-utils": "workspace:*",
3839
"@instructure/ui-icons": "workspace:*",
39-
"@instructure/ui-themes": "workspace:*",
4040
"@testing-library/jest-dom": "^6.6.3",
4141
"@testing-library/react": "15.0.7",
4242
"@testing-library/user-event": "^14.6.1",

‎packages/ui-billboard/src/Billboard/v2/props.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,9 +27,9 @@ import type {
2727
WithStyleProps,
2828
ComponentStyle
2929
} from '@instructure/emotion'
30+
import type { NewComponentTypes } from '@instructure/ui-themes'
3031
import type {
3132
AsElementType,
32-
BillboardTheme,
3333
OtherHTMLAttributes
3434
} from '@instructure/shared-types'
3535
import type { ViewProps } from '@instructure/ui-view/latest'
@@ -102,7 +102,7 @@ type PropKeys = keyof BillboardOwnProps
102102
type AllowedPropKeys = Readonly<Array<PropKeys>>
103103

104104
type BillboardProps = BillboardOwnProps &
105-
WithStyleProps<BillboardTheme, BillboardStyle> &
105+
WithStyleProps<ReturnType<NewComponentTypes['Billboard']>, BillboardStyle> &
106106
OtherHTMLAttributes<BillboardOwnProps>
107107

108108
type BillboardStyle = ComponentStyle<

‎packages/ui-breadcrumb/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@
2929
"@instructure/ui-icons": "workspace:*",
3030
"@instructure/ui-link": "workspace:*",
3131
"@instructure/ui-react-utils": "workspace:*",
32+
"@instructure/ui-themes": "workspace:*",
3233
"@instructure/ui-tooltip": "workspace:*",
3334
"@instructure/ui-truncate-text": "workspace:*",
3435
"@instructure/ui-utils": "workspace:*",
@@ -38,7 +39,6 @@
3839
"@instructure/ui-axe-check": "workspace:*",
3940
"@instructure/ui-babel-preset": "workspace:*",
4041
"@instructure/ui-scripts": "workspace:*",
41-
"@instructure/ui-themes": "workspace:*",
4242
"@testing-library/jest-dom": "^6.6.3",
4343
"@testing-library/react": "15.0.7",
4444
"vitest": "^3.2.2"

‎packages/ui-buttons/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@
3434
"@instructure/ui-icons": "workspace:*",
3535
"@instructure/ui-position": "workspace:*",
3636
"@instructure/ui-react-utils": "workspace:*",
37+
"@instructure/ui-themes": "workspace:*",
3738
"@instructure/ui-tooltip": "workspace:*",
3839
"@instructure/ui-utils": "workspace:*",
3940
"@instructure/ui-view": "workspace:*",
@@ -42,7 +43,6 @@
4243
"devDependencies": {
4344
"@instructure/ui-axe-check": "workspace:*",
4445
"@instructure/ui-babel-preset": "workspace:*",
45-
"@instructure/ui-themes": "workspace:*",
4646
"@testing-library/jest-dom": "^6.6.3",
4747
"@testing-library/react": "15.0.7",
4848
"@testing-library/user-event": "^14.6.1",

0 commit comments

Comments
 (0)