@sanity/ui 1.7.9 → 1.7.11

package/src/styles/flex/flexItemStyle.ts

@@ -1,5 +1,5 @@
-import {CSSObject} from 'styled-components'
 import {EMPTY_ARRAY} from '../../constants'
+import {CSSObject} from '../../types/styled'
 import {_responsive} from '../helpers'
 import {ThemeProps} from '../types'
 import {ResponsiveFlexItemStyleProps} from './types'

package/src/styles/flex/flexStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {rem, _responsive} from '../helpers'
 import {ThemeProps} from '../types'
 import {ResponsiveFlexStyleProps} from './types'

package/src/styles/font/codeFontStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {ThemeProps} from '../types'
 import {responsiveFont} from './responsiveFont'
 import {ResponsiveFontStyleProps} from './types'

package/src/styles/font/headingFontStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {ThemeProps} from '../types'
 import {responsiveFont} from './responsiveFont'
 import {ResponsiveFontStyleProps} from './types'

package/src/styles/font/labelFontStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {ThemeProps} from '../types'
 import {responsiveFont} from './responsiveFont'
 import {ResponsiveFontStyleProps} from './types'

package/src/styles/font/responsiveFont.ts

@@ -1,5 +1,5 @@
-import {CSSObject} from 'styled-components'
 import {ThemeFontSize, ThemeFontKey} from '../../theme'
+import {CSSObject} from '../../types/styled'
 import {rem, _responsive} from '../helpers'
 import {ThemeProps} from '../types'
 import {ResponsiveFontStyleProps} from './types'

package/src/styles/font/textAlignStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {_responsive} from '../helpers'
 import {ThemeProps} from '../types'
 import {ResponsiveTextAlignStyleProps} from './types'

package/src/styles/font/textFontStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {ThemeProps} from '../types'
 import {responsiveFont} from './responsiveFont'
 import {ResponsiveFontStyleProps} from './types'

package/src/styles/grid/gridItemStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {_responsive} from '../helpers'
 import {ThemeProps} from '../types'
 import {ResponsiveGridItemStyleProps} from './types'

package/src/styles/grid/gridStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {rem, _responsive} from '../helpers'
 import {ThemeProps} from '../types'
 import {ResponsiveGridStyleProps} from './types'

package/src/styles/helpers.ts

@@ -1,6 +1,6 @@
-import {CSSObject} from 'styled-components'
 import {EMPTY_ARRAY} from '../constants'
 import {Theme} from '../theme'
+import {CSSObject} from '../types/styled'
 
 /**
  * @internal

package/src/styles/input/responsiveInputPaddingStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {rem, _responsive} from '../helpers'
 import {ThemeProps} from '../types'
 

package/src/styles/input/textInputStyle.ts

@@ -1,6 +1,7 @@
-import {css, CSSObject, FlattenSimpleInterpolation} from 'styled-components'
+import {css} from 'styled-components'
 import {ThemeColorSchemeKey, ThemeFontWeightKey} from '../../theme'
 import {CardTone} from '../../types'
+import {CSSObject} from '../../types/styled'
 import {focusRingBorderStyle, focusRingStyle} from '../focusRing'
 import {rem, _responsive} from '../helpers'
 import {ThemeProps} from '../types'
@@ -33,13 +34,13 @@ const ROOT_STYLE = css`
   align-items: center;
 `
 
-export function textInputRootStyle(): FlattenSimpleInterpolation {
+export function textInputRootStyle(): ReturnType<typeof css> {
   return ROOT_STYLE
 }
 
 export function textInputBaseStyle(
   props: TextInputInputStyleProps & ThemeProps,
-): FlattenSimpleInterpolation {
+): ReturnType<typeof css> {
   const {theme, $scheme, $tone, $weight} = props
   const font = theme.sanity.fonts.text
   const color = theme.sanity.color.input
@@ -127,7 +128,7 @@ export function textInputFontSizeStyle(props: TextInputInputStyleProps & ThemePr
 
 export function textInputRepresentationStyle(
   props: TextInputRepresentationStyleProps & ThemeProps,
-): FlattenSimpleInterpolation {
+): ReturnType<typeof css> {
   const {$hasPrefix, $hasSuffix, $scheme, $tone, theme} = props
   const {focusRing, input} = theme.sanity
   const color = theme.sanity.color.input

package/src/styles/margin/marginStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {_getResponsiveSpace} from '../helpers'
 import {ThemeProps} from '../types'
 import {ResponsiveMarginStyleProps} from './types'

package/src/styles/padding/paddingStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {_getResponsiveSpace} from '../helpers'
 import {ThemeProps} from '../types'
 import {ResponsivePaddingStyleProps} from './types'

package/src/styles/radius/radiusStyle.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../../types/styled'
 import {rem, _responsive} from '../helpers'
 import {ThemeProps} from '../types'
 import {ResponsiveRadiusStyleProps} from './types'

package/src/styles/shadow/shadowStyle.ts

@@ -1,6 +1,6 @@
-import {CSSObject} from 'styled-components'
 import {EMPTY_RECORD} from '../../constants'
 import {BoxShadow, ThemeShadow} from '../../theme'
+import {CSSObject} from '../../types/styled'
 import {rem, _responsive} from '../helpers'
 import {ThemeProps} from '../types'
 import {ResponsiveShadowStyleProps} from './types'

package/src/theme/types.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from 'styled-components'
+import {CSSObject} from '../types/styled'
 import {BaseTheme, ThemeColor, ThemeColorName, ThemeColorSchemeKey} from './lib/theme'
 
 /**

package/src/types/index.ts

@@ -10,4 +10,5 @@ export * from './gridItem'
 export * from './placement'
 export * from './popover'
 export * from './selectable'
+export * from './styled'
 export * from './text'

package/src/types/styled.ts

@@ -0,0 +1,9 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+// Workaround types that are missing in v6
+// https://github.com/styled-components/styled-components/issues/4062
+
+import type {StyledObject} from 'styled-components'
+
+/** @internal */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export type CSSObject = StyledObject<any>