@sanity/ui 3.0.0-static.32 → 3.0.0-static.34

package/src/theme/v0/color/selectable.ts

@@ -1,31 +0,0 @@
-import type {ThemeColorGenericState} from './_generic'
-
-/**
- * @public
- * @deprecated Use `ThemeColorState_v2` instead.
- */
-export type ThemeColorSelectableState = ThemeColorGenericState
-
-/**
- * @public
- * @deprecated Use `ThemeColorSelectableStates_v2` instead.
- */
-export interface ThemeColorSelectableStates {
-  enabled: ThemeColorSelectableState
-  hovered: ThemeColorSelectableState
-  pressed: ThemeColorSelectableState
-  selected: ThemeColorSelectableState
-  disabled: ThemeColorSelectableState
-}
-
-/**
- * @public
- * @deprecated Use `ThemeColorSelectable_v2` instead.
- */
-export interface ThemeColorSelectable {
-  default: ThemeColorSelectableStates
-  primary: ThemeColorSelectableStates
-  positive: ThemeColorSelectableStates
-  caution: ThemeColorSelectableStates
-  critical: ThemeColorSelectableStates
-}

package/src/theme/v0/color/solid.ts

@@ -1,26 +0,0 @@
-import type {ThemeColorGenericState} from './_generic'
-
-/**
- * @public
- * @deprecated Use `ThemeColorSelectableTone_v2` instead.
- */
-export interface ThemeColorSolidTone {
-  enabled: ThemeColorGenericState
-  disabled: ThemeColorGenericState
-  hovered: ThemeColorGenericState
-  pressed: ThemeColorGenericState
-  selected: ThemeColorGenericState
-}
-
-/**
- * @public
- * @deprecated Use `ThemeColorSelectable_v2` instead.
- */
-export interface ThemeColorSolid {
-  default: ThemeColorSolidTone
-  transparent: ThemeColorSolidTone
-  primary: ThemeColorSolidTone
-  positive: ThemeColorSolidTone
-  caution: ThemeColorSolidTone
-  critical: ThemeColorSolidTone
-}

package/src/theme/v0/color/spot.ts

@@ -1,13 +0,0 @@
-import type {ThemeColorAvatarColorKey} from '../../v2'
-
-/**
- * @public
- * @deprecated Use `ThemeColorAvatarColorKey` instead
- */
-export type ThemeColorSpotKey = ThemeColorAvatarColorKey
-
-/**
- * @public
- * @deprecated Use `ThemeColorAvatar_v2` instead
- */
-export type ThemeColorSpot = Record<ThemeColorSpotKey, string>

package/src/theme/v0/css.ts

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

package/src/theme/v0/focusRing.ts

@@ -1,5 +0,0 @@
-/** @public */
-export interface ThemeFocusRing {
-  offset: number
-  width: number
-}

package/src/theme/v0/font.ts

@@ -1,40 +0,0 @@
-/** @public */
-export type ThemeFontKey = 'code' | 'heading' | 'label' | 'text'
-
-/** @public */
-export type ThemeFontWeightKey = 'regular' | 'medium' | 'semibold' | 'bold'
-
-/** @public */
-export interface ThemeFontSize {
-  ascenderHeight: number
-  descenderHeight: number
-  fontSize: number
-  iconSize: number
-  letterSpacing: number
-  lineHeight: number
-}
-
-/** @public */
-export interface ThemeFontWeight {
-  regular: number
-  medium: number
-  semibold: number
-  bold: number
-}
-
-/** @public */
-export interface ThemeFont {
-  family: string
-  weights: ThemeFontWeight
-  sizes: ThemeFontSize[]
-  /** @deprecated No longer supported. */
-  horizontalOffset?: number
-}
-
-/** @public */
-export interface ThemeFonts {
-  code: ThemeFont
-  heading: ThemeFont
-  label: ThemeFont
-  text: ThemeFont
-}

package/src/theme/v0/index.ts

@@ -1,10 +0,0 @@
-export * from './avatar'
-export * from './color'
-export * from './css'
-export * from './focusRing'
-export * from './font'
-export * from './input'
-export * from './layer'
-export * from './shadow'
-export * from './styles'
-export * from './theme'

package/src/theme/v0/input.ts

@@ -1,23 +0,0 @@
-/**
- * @public
- * @deprecated Use `ThemeInput_v2` instead
- */
-export interface ThemeInput {
-  checkbox: {
-    size: number
-  }
-  radio: {
-    size: number
-    markSize: number
-  }
-  switch: {
-    width: number
-    height: number
-    padding: number
-    transitionDurationMs: number
-    transitionTimingFunction: string
-  }
-  border: {
-    width: number
-  }
-}

package/src/theme/v0/layer.ts

@@ -1,6 +0,0 @@
-/** @public */
-export interface ThemeLayer {
-  dialog: {zOffset: number}
-  popover: {zOffset: number}
-  tooltip: {zOffset: number}
-}

package/src/theme/v0/shadow.ts

@@ -1,15 +0,0 @@
-/** @public */
-export type ThemeBoxShadow = [
-  // offsetX, offsetY, blurRadius, spreadRadius
-  number,
-  number,
-  number,
-  number,
-]
-
-/** @public */
-export interface ThemeShadow {
-  umbra: ThemeBoxShadow
-  penumbra: ThemeBoxShadow
-  ambient: ThemeBoxShadow
-}

package/src/theme/v0/styles.ts

@@ -1,13 +0,0 @@
-import type {CSSObject} from './css'
-
-/**
- * @internal
- */
-export interface ThemeStyles {
-  button?: {
-    root?: CSSObject
-  }
-  card?: {
-    root?: CSSObject
-  }
-}

package/src/theme/v0/theme.ts

@@ -1,72 +0,0 @@
-import type {ThemeAvatar} from './avatar'
-import type {ThemeColorSchemes} from './color'
-import type {ThemeFonts, ThemeFontWeightKey} from './font'
-import type {ThemeInput} from './input'
-import type {ThemeLayer} from './layer'
-import type {ThemeShadow} from './shadow'
-import type {ThemeStyles} from './styles'
-
-/** @public */
-export interface RootTheme_v0 {
-  _version?: 0
-  /**
-   * @deprecated Use `v2.avatar` instead
-   */
-  avatar: ThemeAvatar
-  /**
-   * @deprecated Use `v2.button` instead
-   */
-  button: {
-    textWeight: ThemeFontWeightKey
-  }
-  /**
-   * @deprecated Use `v2.color` instead
-   */
-  color: ThemeColorSchemes
-  /**
-   * @deprecated Use `v2.container` instead
-   */
-  container: number[]
-  /**
-   * @deprecated Use component-specific `v2.{button | card | input}.focusRing` values instead
-   */
-  focusRing: {
-    offset: number
-    width: number
-  }
-  /**
-   * @deprecated Use `v2.font` instead
-   */
-  fonts: ThemeFonts
-  /**
-   * @deprecated Use `v2.input` instead
-   */
-  input: ThemeInput
-  /**
-   * THIS API MAY BE UNSTABLE. DO NOT USE IN PRODUCTION.
-   * @beta
-   * @deprecated Use `v2.layer` instead
-   */
-  layer?: ThemeLayer
-  /**
-   * @deprecated Use `v2.media` instead
-   */
-  media: number[]
-  /**
-   * @deprecated Use `v2.radius` instead
-   */
-  radius: number[]
-  /**
-   * @deprecated Use `v2.shadow` instead
-   */
-  shadows: Array<ThemeShadow | null>
-  /**
-   * @deprecated Use `v2.space` instead
-   */
-  space: number[]
-  /**
-   * @internal
-   * @deprecated Use `v2.style` instead
-   */
-  styles?: ThemeStyles
-}

package/src/theme/v2/avatar.ts

@@ -1,12 +0,0 @@
-import type {ThemeFocusRing} from '../v0/focusRing'
-
-/** @public */
-export interface ThemeAvatar_v2 {
-  sizes: {
-    /** Spacing between avatars in an <AvatarStack> component (px) */
-    distance: number
-    /** Diameter of the avatar (px) */
-    size: number
-  }[]
-  focusRing: ThemeFocusRing
-}

package/src/theme/v2/build/_deprecated/color/_selectable/createSelectableTones.ts

@@ -1,76 +0,0 @@
-import type {
-  ThemeColorBase,
-  ThemeColorMuted,
-  ThemeColorSelectable,
-  ThemeColorSelectableStates,
-  ThemeColorSolid,
-} from '../../../../../v0'
-import type {ThemeColorBuilderOpts} from '../factory'
-
-export function createSelectableTones(
-  opts: ThemeColorBuilderOpts,
-  base: ThemeColorBase,
-  dark: boolean,
-  solid: ThemeColorSolid,
-  muted: ThemeColorMuted,
-): ThemeColorSelectable {
-  return {
-    default: _createSelectableStates(opts, base, dark, solid, muted, 'default'),
-    primary: _createSelectableStates(opts, base, dark, solid, muted, 'primary'),
-    positive: _createSelectableStates(opts, base, dark, solid, muted, 'positive'),
-    caution: _createSelectableStates(opts, base, dark, solid, muted, 'caution'),
-    critical: _createSelectableStates(opts, base, dark, solid, muted, 'critical'),
-  }
-}
-
-function _createSelectableStates(
-  opts: ThemeColorBuilderOpts,
-  base: ThemeColorBase,
-  dark: boolean,
-  solid: ThemeColorSolid,
-  muted: ThemeColorMuted,
-  tone: 'default' | 'primary' | 'positive' | 'caution' | 'critical',
-): ThemeColorSelectableStates {
-  return {
-    enabled: opts.selectable({
-      base,
-      dark,
-      solid,
-      muted,
-      state: 'enabled',
-      tone,
-    }),
-    hovered: opts.selectable({
-      base,
-      dark,
-      solid,
-      muted,
-      state: 'hovered',
-      tone,
-    }),
-    pressed: opts.selectable({
-      base,
-      dark,
-      solid,
-      muted,
-      state: 'pressed',
-      tone,
-    }),
-    selected: opts.selectable({
-      base,
-      dark,
-      solid,
-      muted,
-      state: 'selected',
-      tone,
-    }),
-    disabled: opts.selectable({
-      base,
-      dark,
-      solid,
-      muted,
-      state: 'disabled',
-      tone,
-    }),
-  }
-}

package/src/theme/v2/build/_deprecated/color/_solid/createSolidTones.ts

@@ -1,54 +0,0 @@
-import type {ThemeColorBase, ThemeColorName, ThemeColorSolid} from '../../../../../v0'
-import type {ThemeColorBuilderOpts} from '../factory'
-
-export function createSolidTones(
-  opts: ThemeColorBuilderOpts,
-  base: ThemeColorBase,
-  dark: boolean,
-  name: ThemeColorName,
-): ThemeColorSolid {
-  return {
-    default: {
-      enabled: opts.solid({base, dark, tone: 'default', name, state: 'enabled'}),
-      disabled: opts.solid({base, dark, tone: 'default', name, state: 'disabled'}),
-      hovered: opts.solid({base, dark, tone: 'default', name, state: 'hovered'}),
-      pressed: opts.solid({base, dark, tone: 'default', name, state: 'pressed'}),
-      selected: opts.solid({base, dark, tone: 'default', name, state: 'selected'}),
-    },
-    transparent: {
-      enabled: opts.solid({base, dark, tone: 'transparent', name, state: 'enabled'}),
-      disabled: opts.solid({base, dark, tone: 'transparent', name, state: 'disabled'}),
-      hovered: opts.solid({base, dark, tone: 'transparent', name, state: 'hovered'}),
-      pressed: opts.solid({base, dark, tone: 'transparent', name, state: 'pressed'}),
-      selected: opts.solid({base, dark, tone: 'transparent', name, state: 'selected'}),
-    },
-    primary: {
-      enabled: opts.solid({base, dark, tone: 'primary', name, state: 'enabled'}),
-      disabled: opts.solid({base, dark, tone: 'primary', name, state: 'disabled'}),
-      hovered: opts.solid({base, dark, tone: 'primary', name, state: 'hovered'}),
-      pressed: opts.solid({base, dark, tone: 'primary', name, state: 'pressed'}),
-      selected: opts.solid({base, dark, tone: 'primary', name, state: 'selected'}),
-    },
-    positive: {
-      enabled: opts.solid({base, dark, tone: 'positive', name, state: 'enabled'}),
-      disabled: opts.solid({base, dark, tone: 'positive', name, state: 'disabled'}),
-      hovered: opts.solid({base, dark, tone: 'positive', name, state: 'hovered'}),
-      pressed: opts.solid({base, dark, tone: 'positive', name, state: 'pressed'}),
-      selected: opts.solid({base, dark, tone: 'positive', name, state: 'selected'}),
-    },
-    caution: {
-      enabled: opts.solid({base, dark, tone: 'caution', name, state: 'enabled'}),
-      disabled: opts.solid({base, dark, tone: 'caution', name, state: 'disabled'}),
-      hovered: opts.solid({base, dark, tone: 'caution', name, state: 'hovered'}),
-      pressed: opts.solid({base, dark, tone: 'caution', name, state: 'pressed'}),
-      selected: opts.solid({base, dark, tone: 'caution', name, state: 'selected'}),
-    },
-    critical: {
-      enabled: opts.solid({base, dark, tone: 'critical', name, state: 'enabled'}),
-      disabled: opts.solid({base, dark, tone: 'critical', name, state: 'disabled'}),
-      hovered: opts.solid({base, dark, tone: 'critical', name, state: 'hovered'}),
-      pressed: opts.solid({base, dark, tone: 'critical', name, state: 'pressed'}),
-      selected: opts.solid({base, dark, tone: 'critical', name, state: 'selected'}),
-    },
-  }
-}

package/src/theme/v2/build/_deprecated/color/button/createButtonModes.ts

@@ -1,22 +0,0 @@
-import type {
-  ThemeColorBase,
-  ThemeColorButton,
-  ThemeColorMuted,
-  ThemeColorSolid,
-} from '../../../../../v0'
-import type {ThemeColorBuilderOpts} from '../factory'
-import {createButtonTones} from './createButtonTones'
-
-export function createButtonModes(
-  opts: ThemeColorBuilderOpts,
-  base: ThemeColorBase,
-  dark: boolean,
-  solid: ThemeColorSolid,
-  muted: ThemeColorMuted,
-): ThemeColorButton {
-  return {
-    default: createButtonTones(opts, base, dark, solid, muted, 'default'),
-    ghost: createButtonTones(opts, base, dark, solid, muted, 'ghost'),
-    bleed: createButtonTones(opts, base, dark, solid, muted, 'bleed'),
-  }
-}

package/src/theme/v2/build/_deprecated/color/button/createButtonTones.ts

@@ -1,55 +0,0 @@
-import type {
-  ThemeColorBase,
-  ThemeColorButtonTones,
-  ThemeColorMuted,
-  ThemeColorSolid,
-} from '../../../../../v0'
-import type {ThemeColorButtonModeKey} from '../../../../color'
-import type {ThemeColorBuilderOpts} from '../factory'
-
-export function createButtonTones(
-  opts: ThemeColorBuilderOpts,
-  base: ThemeColorBase,
-  dark: boolean,
-  solid: ThemeColorSolid,
-  muted: ThemeColorMuted,
-  mode: ThemeColorButtonModeKey,
-): ThemeColorButtonTones {
-  return {
-    default: opts.button({
-      base,
-      dark,
-      solid: solid.default,
-      muted: muted.default,
-      mode,
-    }),
-    primary: opts.button({
-      base,
-      dark,
-      solid: solid.primary,
-      muted: muted.primary,
-      mode,
-    }),
-    positive: opts.button({
-      base,
-      dark,
-      solid: solid.positive,
-      muted: muted.positive,
-      mode,
-    }),
-    caution: opts.button({
-      base,
-      dark,
-      solid: solid.caution,
-      muted: muted.caution,
-      mode,
-    }),
-    critical: opts.button({
-      base,
-      dark,
-      solid: solid.critical,
-      muted: muted.critical,
-      mode,
-    }),
-  }
-}

package/src/theme/v2/build/_deprecated/color/card/createCardStates.ts

@@ -1,60 +0,0 @@
-import type {
-  ThemeColorBase,
-  ThemeColorCard,
-  ThemeColorMuted,
-  ThemeColorName,
-  ThemeColorSolid,
-} from '../../../../../v0'
-import type {ThemeColorBuilderOpts} from '../factory'
-
-export function createCardStates(
-  opts: ThemeColorBuilderOpts,
-  base: ThemeColorBase,
-  dark: boolean,
-  name: ThemeColorName,
-  solid: ThemeColorSolid,
-  muted: ThemeColorMuted,
-): ThemeColorCard {
-  return {
-    enabled: opts.card({
-      base,
-      dark,
-      name,
-      state: 'enabled',
-      solid,
-      muted,
-    }),
-    disabled: opts.card({
-      base,
-      dark,
-      name,
-      state: 'disabled',
-      solid,
-      muted,
-    }),
-    hovered: opts.card({
-      base,
-      dark,
-      name,
-      state: 'hovered',
-      solid,
-      muted,
-    }),
-    pressed: opts.card({
-      base,
-      dark,
-      name,
-      state: 'pressed',
-      solid,
-      muted,
-    }),
-    selected: opts.card({
-      base,
-      dark,
-      name,
-      state: 'selected',
-      solid,
-      muted,
-    }),
-  }
-}

package/src/theme/v2/build/_deprecated/color/color.test.ts

@@ -1,63 +0,0 @@
-import {describe, expect, it} from 'vitest'
-
-import {createColorTheme} from './factory'
-
-describe('color', () => {
-  describe('createColorTheme', () => {
-    it('should generate base (scheme=light, name=default)', () => {
-      const theme = createColorTheme()
-      const scheme = 'light'
-      const name = 'default'
-      const color = theme[scheme][name]
-
-      expect(color.base).toEqual({
-        bg: 'hsl(0, 0%, 100%)',
-        border: 'hsl(0, 0%, 95%)',
-        fg: 'hsl(0, 0%, 0%)',
-        focusRing: 'hsl(240, 100%, 50%)',
-        shadow: {
-          ambient: 'hsl(0, 0%, 0%)',
-          outline: 'hsl(0, 0%, 0%)',
-          penumbra: 'hsl(0, 0%, 0%)',
-          umbra: 'hsl(0, 0%, 0%)',
-        },
-        skeleton: {
-          from: 'hsl(0, 0%, 0%)',
-          to: 'hsl(0, 0%, 0%)',
-        },
-      })
-    })
-
-    it('should generate muted states (scheme=light, name=default)', () => {
-      const theme = createColorTheme()
-      const scheme = 'light'
-      const name = 'default'
-      const color = theme[scheme][name]
-
-      expect(color.muted.default.enabled).toEqual({
-        bg: 'hsl(0, 0%, 95%)',
-        bg2: 'hsl(0, 0%, 95%)',
-        border: 'hsl(0, 0%, 70%)',
-        fg: 'hsl(0, 0%, 20%)',
-        icon: 'hsl(0, 0%, 20%)',
-        muted: {
-          fg: 'hsl(0, 0%, 0%)',
-        },
-        link: {
-          fg: 'hsl(0, 0%, 0%)',
-        },
-        accent: {
-          fg: 'hsl(0, 0%, 0%)',
-        },
-        code: {
-          bg: 'hsl(0, 0%, 0%)',
-          fg: 'hsl(0, 0%, 0%)',
-        },
-        skeleton: {
-          from: 'hsl(0, 0%, 0%)',
-          to: 'hsl(0, 0%, 0%)',
-        },
-      })
-    })
-  })
-})