@sanity/ui 3.0.0-static.20 → 3.0.0-static.21

package/src/css/primitives/text/text.style.ts

@@ -1,65 +0,0 @@
-import {FONT_TEXT_SIZE} from '@sanity/ui/theme'
-
-import {_responsiveRule} from '../../_responsiveRule'
-import {varNames, vars} from '../../theme'
-import type {Style, StyleRules} from '../../types'
-
-const primitive: StyleRules = {
-  '.text': {
-    vars: {
-      [varNames.font.family]: vars.font.text.family,
-      [varNames.font.featureSettings]: vars.font.text.featureSettings,
-
-      [varNames.font.weight.regular]: vars.font.text.weight.regular,
-      [varNames.font.weight.medium]: vars.font.text.weight.medium,
-      [varNames.font.weight.semibold]: vars.font.text.weight.semibold,
-      [varNames.font.weight.bold]: vars.font.text.weight.bold,
-    },
-
-    color: vars.color.fg,
-
-    nest: {
-      '& a': {
-        color: vars.color.link.fg,
-        textDecoration: 'none',
-      },
-
-      '& a:hover': {
-        color: vars.color.fg,
-      },
-
-      '& code': {
-        fontFamily: vars.font.code.family,
-        color: vars.color.code.fg,
-        backgroundColor: vars.color.code.bg,
-        borderRadius: vars.radius[2],
-      },
-
-      '& svg': {
-        color: vars.color.muted.fg,
-      },
-    },
-  },
-
-  '.text-muted': {
-    color: vars.color.muted.fg,
-  },
-}
-
-for (const size of FONT_TEXT_SIZE) {
-  const v = vars.font.text.sizes[size]
-
-  _responsiveRule(primitive, `text-${size}`, {
-    vars: {
-      [varNames.font.fontSize]: v.fontSize,
-      [varNames.font.lineHeight]: v.lineHeight,
-      [varNames.font.letterSpacing]: v.letterSpacing,
-      [varNames.font.iconSize]: v.iconSize,
-      [varNames.font.ascenderHeight]: v.ascenderHeight,
-      [varNames.font.descenderHeight]: v.descenderHeight,
-      [varNames.font.customIconSize]: v.customIconSize,
-    },
-  })
-}
-
-export const textStyle: Style = {layers: {primitive}}

package/src/css/primitives/textArea/textArea.style.ts

@@ -1,11 +0,0 @@
-import type {Style, StyleRules} from '../../types'
-
-const primitive: StyleRules = {
-  '.text-area': {},
-}
-
-export const textAreaStyle: Style = {
-  layers: {
-    primitive,
-  },
-}

package/src/css/primitives/textInput/textInput.style.ts

@@ -1,46 +0,0 @@
-import {vars} from '../../theme'
-import type {Style, StyleRules} from '../../types'
-
-const primitive: StyleRules = {
-  '.text-input': {},
-
-  '.text-input-prefix': {
-    borderTop: `1px solid ${vars.color.border}`,
-    borderLeft: `1px solid ${vars.color.border}`,
-    borderBottom: `1px solid ${vars.color.border}`,
-    borderTopLeftRadius: 'inherit',
-    borderBottomLeftRadius: 'inherit',
-
-    nest: {
-      '& > span': {
-        display: 'block',
-        margin: '-1px',
-      },
-    },
-  },
-
-  '.text-input-element': {
-    borderRadius: 'inherit',
-  },
-
-  '.text-input-suffix': {
-    borderTop: `1px solid ${vars.color.border}`,
-    borderRight: `1px solid ${vars.color.border}`,
-    borderBottom: `1px solid ${vars.color.border}`,
-    borderTopRightRadius: 'inherit',
-    borderBottomRightRadius: 'inherit',
-
-    nest: {
-      '& > span': {
-        display: 'block',
-        margin: '-1px',
-      },
-    },
-  },
-}
-
-export const textInputStyle: Style = {
-  layers: {
-    primitive,
-  },
-}

package/src/css/primitives/token/token.style.ts

@@ -1,50 +0,0 @@
-import {vars} from '../../theme'
-import type {Style, StyleRules} from '../../types'
-
-const primitive: StyleRules = {
-  '.token': {
-    _prefix: false,
-
-    nest: {
-      '&.atrule': {color: vars.color.code.token.atrule},
-      '&.attr-name': {color: vars.color.code.token.attrName},
-      '&.attr-value': {color: vars.color.code.token.attrValue},
-      '&.attribute': {color: vars.color.code.token.attribute},
-      '&.boolean': {color: vars.color.code.token.boolean},
-      '&.builtin': {color: vars.color.code.token.builtin},
-      '&.cdata': {color: vars.color.code.token.cdata},
-      '&.char': {color: vars.color.code.token.char},
-      '&.class': {color: vars.color.code.token.class},
-      '&.class-name': {color: vars.color.code.token.className},
-      '&.comment': {color: vars.color.code.token.comment},
-      '&.constant': {color: vars.color.code.token.constant},
-      '&.deleted': {color: vars.color.code.token.deleted},
-      '&.doctype': {color: vars.color.code.token.doctype},
-      '&.entity': {color: vars.color.code.token.entity},
-      '&.function': {color: vars.color.code.token.function},
-      '&.hexcode': {color: vars.color.code.token.hexcode},
-      '&.id': {color: vars.color.code.token.id},
-      '&.important': {color: vars.color.code.token.important},
-      '&.inserted': {color: vars.color.code.token.inserted},
-      '&.keyword': {color: vars.color.code.token.keyword},
-      '&.number': {color: vars.color.code.token.number},
-      '&.operator': {color: vars.color.code.token.operator},
-      '&.prolog': {color: vars.color.code.token.prolog},
-      '&.property': {color: vars.color.code.token.property},
-      '&.pseudo-class': {color: vars.color.code.token.pseudoClass},
-      '&.pseudo-element': {color: vars.color.code.token.pseudoElement},
-      '&.punctuation': {color: vars.color.code.token.punctuation},
-      '&.attr-value &:not(.attr-equals).punctuation': {color: 'inherit'},
-      '&.regex': {color: vars.color.code.token.regex},
-      '&.selector': {color: vars.color.code.token.selector},
-      '&.string': {color: vars.color.code.token.string},
-      '&.symbol': {color: vars.color.code.token.symbol},
-      '&.tag': {color: vars.color.code.token.tag},
-      '&.unit': {color: vars.color.code.token.unit},
-      '&.url': {color: vars.color.code.token.url},
-      '&.variable': {color: vars.color.code.token.variable},
-    },
-  },
-}
-
-export const tokenStyle: Style = {layers: {primitive}}

package/src/css/primitives/tooltip/tooltip.style.ts

@@ -1,9 +0,0 @@
-import type {Style, StyleRules} from '../../types'
-
-const primitive: StyleRules = {
-  '.tooltip': {
-    pointerEvents: 'none',
-  },
-}
-
-export const tooltipStyle: Style = {layers: {primitive}}

package/src/css/renderColor.ts

@@ -1,31 +0,0 @@
-import type {ResolvedColorToken} from '@sanity/ui/theme'
-
-/** @public */
-export type CSSVariableKey = `--${string}`
-
-/** @public */
-export interface RenderColorContext {
-  bgVar: CSSVariableKey
-  bgValue: string
-  prefix: string
-}
-
-/** @public */
-export function renderColor(token: ResolvedColorToken, context: RenderColorContext): string {
-  const {bgValue, prefix} = context
-
-  const colorVar =
-    token.color.type === 'hue'
-      ? `--${prefix}${token.color.hue}-${token.color.tint}`
-      : `--${prefix}${token.color.type}`
-
-  if (token.mix < 1) {
-    return `color-mix(in srgb, ${bgValue}, var(${colorVar}) ${token.mix * 100}%)`
-  }
-
-  if (token.opacity < 1) {
-    return `color-mix(in srgb, transparent, var(${colorVar}) ${token.opacity * 100}%)`
-  }
-
-  return `var(${colorVar})`
-}

package/src/css/responsiveRules.ts

@@ -1,18 +0,0 @@
-import {BREAKPOINTS} from './constants'
-import {type Properties, type Rules} from './types'
-
-export function responsiveRules(className: string, props: Properties): Rules {
-  const rules: Rules = {
-    [className]: props,
-  }
-
-  for (const [index, width] of Object.entries(BREAKPOINTS)) {
-    rules[`_${index}:${className}`] = {
-      '@media': {
-        [`screen and (min-width: ${width}px)`]: props,
-      },
-    }
-  }
-
-  return rules
-}

package/src/css/theme/index.ts

@@ -1,14 +0,0 @@
-import {buildTheme_v3} from '@sanity/ui/theme'
-
-import {resolveTheme} from './resolveTheme'
-
-const result = resolveTheme({theme: buildTheme_v3()})
-
-/** @public */
-export const vars = result.vars
-
-/** @public */
-export const varNames = result.varNames
-
-/** @public */
-export const properties = result.properties

package/src/css/theme/lib/contract/buildVarContract.ts

@@ -1,76 +0,0 @@
-import {_hash} from '../../../_hash'
-import type {Contract, ContractProperties, ContractVarNames, ContractVars} from './types'
-
-export function buildVarContract<C extends Contract, P extends string>(
-  contract: C,
-  options: {layer: string; prefix: P},
-) {
-  return {
-    vars: buildVars(contract, options),
-    varNames: buildVarNames(contract, options),
-    properties: buildProperties(contract, options),
-  }
-}
-
-function buildProperties<C extends Contract, P extends string>(
-  contract: C,
-  options: {layer: string; prefix: P},
-) {
-  const _properties: ContractProperties = {}
-
-  function walk(c: Contract) {
-    for (const key in c) {
-      if (typeof c[key] === 'string') {
-        _properties[`--${options.prefix}${_hash(`${options.layer}.${c[key]}`)}`] = c[key]
-      } else if (c[key] === null) {
-        // ignore
-      } else {
-        walk(c[key])
-      }
-    }
-  }
-
-  walk(contract)
-
-  return Object.freeze(_properties)
-}
-
-function buildVars<C extends Contract, P extends string>(
-  contract: C,
-  options: {layer: string; prefix: P},
-  path: string = '',
-) {
-  const _vars = {} as Record<string, unknown>
-
-  for (const key in contract) {
-    if (typeof contract[key] === 'string') {
-      _vars[key] = `var(--${options.prefix}${_hash(`${options.layer}.${contract[key]}`)})`
-    } else if (contract[key] === null) {
-      _vars[key] = `var(--${options.prefix}${_hash(`${options.layer}.${path}.${key}`)})`
-    } else {
-      _vars[key] = buildVars(contract[key], options, [path, key].join('.'))
-    }
-  }
-
-  return Object.freeze(_vars) as ContractVars<C>
-}
-
-function buildVarNames<C extends Contract, P extends string>(
-  contract: C,
-  options: {layer: string; prefix: P},
-  path: string = '',
-) {
-  const _varNames = {} as Record<string, unknown>
-
-  for (const key in contract) {
-    if (typeof contract[key] === 'string') {
-      _varNames[key] = `--${options.prefix}${_hash(`${options.layer}.${contract[key]}`)}`
-    } else if (contract[key] === null) {
-      _varNames[key] = `--${options.prefix}${_hash(`${options.layer}.${path}.${key}`)}`
-    } else {
-      _varNames[key] = buildVarNames(contract[key], options, [path, key].join('.'))
-    }
-  }
-
-  return Object.freeze(_varNames) as ContractVarNames<C>
-}

package/src/css/theme/lib/contract/index.ts

@@ -1,2 +0,0 @@
-export * from './buildVarContract'
-export * from './types'

package/src/css/theme/lib/contract/types.ts

@@ -1,15 +0,0 @@
-export interface Contract {
-  [key: string]: string | Contract | null
-}
-
-export interface ContractProperties {
-  [key: `--${string}`]: string
-}
-
-export type ContractVars<C extends Contract> = {
-  [key in keyof C]: C[key] extends object ? ContractVars<C[key]> : `var(--${string})`
-}
-
-export type ContractVarNames<C extends Contract> = {
-  [key in keyof C]: C[key] extends object ? ContractVarNames<C[key]> : `--${string}`
-}