@sanity/ui 3.0.0-static.14 → 3.0.0-static.16

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

@@ -1,224 +0,0 @@
-import {Rules} from '../../types'
-import {vars} from '../../vars'
-
-export const textInputRules: Rules = {
-  'text-input': {
-    '--font-family': vars.font.text.family,
-
-    '@nest': {
-      '& > span': {
-        borderRadius: 'inherit',
-      },
-    },
-  },
-
-  'text-input-prefix': {
-    'borderTop': '1px solid var(--color-border)',
-    'borderLeft': '1px solid var(--color-border)',
-    'borderBottom': '1px solid var(--color-border)',
-    'borderTopRightRadius': '0 !important',
-    'borderBottomRightRadius': '0 !important',
-
-    '@nest': {
-      '& > span': {
-        display: 'block',
-        margin: '-1px',
-      },
-    },
-  },
-
-  'text-input-suffix': {
-    'borderTop': '1px solid var(--color-border)',
-    'borderRight': '1px solid var(--color-border)',
-    'borderBottom': '1px solid var(--color-border)',
-    'borderTopLeftRadius': '0 !important',
-    'borderBottomLeftRadius': '0 !important',
-
-    '@nest': {
-      '& > span': {
-        display: 'block',
-        margin: '-1px',
-      },
-    },
-  },
-
-  'text-input-presentation': {
-    // position: 'absolute',
-    // top: 0,
-    // left: 0,
-    // right: 0,
-    // bottom: 0,
-    // display: 'block',
-    // pointerEvents: 'none',
-    // zIndex: 0,
-    // backgroundColor: 'var(--input-bg-color)',
-    // 'boxShadow': 'var(--input-box-shadow)',
-    // '--input-border-color': 'var(--color-input-default-enabled-border)',
-    // '--input-border-color': 'var(--color-tinted-default-border-1)',
-    // '--input-box-shadow': 'inset 0 0 0 1px var(--input-border-color)',
-    // border-top-left-radius: ${$hasPrefix ? 0 : undefined};
-    // border-bottom-left-radius: ${$hasPrefix ? 0 : undefined};
-    // border-top-right-radius: ${$hasSuffix ? 0 : undefined};
-    // border-bottom-right-radius: ${$hasSuffix ? 0 : undefined};
-    // '@nest': {
-    //   'input:hover + &': {
-    //     '--input-border-color': 'var(--color-tinted-default-border-2)',
-    //   },
-    //   'input:focus + &': {
-    //     '--input-border-color': 'var(--color-tinted-default-border-2)',
-    //   },
-    // },
-    // &[data-scheme='${$scheme}'][data-tone='${$tone}'] {
-    //   --card-bg-color: ${color.input.default.enabled.bg};
-    //   --card-fg-color: ${color.input.default.enabled.fg};
-    //   /* enabled */
-    //   *:not(:disabled) + &[data-border] {
-    //     --input-box-shadow: ${focusRingBorderStyle({
-    //       color: color.input.default.enabled.border,
-    //       width: input.border.width,
-    //     })};
-    //   }
-    //   /* invalid */
-    //   *:not(:disabled):invalid + & {
-    //     --card-bg-color: ${color.input.invalid.enabled.bg};
-    //     --card-fg-color: ${color.input.invalid.enabled.fg};
-    //     &[data-border] {
-    //       --input-box-shadow: ${focusRingBorderStyle({
-    //         color: color.input.invalid.enabled.border,
-    //         width: input.border.width,
-    //       })};
-    //     }
-    //   }
-    //   /* focused */
-    //   *:not(:disabled):focus + & {
-    //     &[data-border] {
-    //       --input-box-shadow: ${$unstableDisableFocusRing
-    //         ? undefined
-    //         : focusRingStyle({
-    //             border: {color: color.input.default.enabled.border, width: input.border.width},
-    //             focusRing: input.text.focusRing,
-    //           })};
-    //     }
-    //     &:not([data-border]) {
-    //       --input-box-shadow: ${$unstableDisableFocusRing
-    //         ? undefined
-    //         : focusRingStyle({focusRing: input.text.focusRing})};
-    //     }
-    //   }
-    //   /* disabled */
-    //   *:not(:invalid):disabled + & {
-    //     --card-bg-color: ${color.input.default.disabled.bg} !important;
-    //     --card-fg-color: ${color.input.default.disabled.fg} !important;
-    //     --card-icon-color: ${color.input.default.disabled.fg} !important;
-    //     &[data-border] {
-    //       --input-box-shadow: ${focusRingBorderStyle({
-    //         color: color.input.default.disabled.border,
-    //         width: input.border.width,
-    //       })};
-    //     }
-    //   }
-    //   *:invalid:disabled + & {
-    //     --card-bg-color: ${color.input.invalid.disabled.bg} !important;
-    //     --card-fg-color: ${color.input.invalid.disabled.fg} !important;
-    //     --card-icon-color: ${color.input.invalid.disabled.fg} !important;
-    //     &[data-border] {
-    //       --input-box-shadow: ${focusRingBorderStyle({
-    //         color: color.input.invalid.disabled.border,
-    //         width: input.border.width,
-    //       })};
-    //     }
-    //   }
-    //   /* readOnly */
-    //   *:not(:invalid):read-only + & {
-    //     --card-bg-color: ${color.input.default.readOnly.bg} !important;
-    //     --card-fg-color: ${color.input.default.readOnly.fg} !important;
-    //   }
-    //   *:invalid:read-only + & {
-    //     --card-bg-color: ${color.input.invalid.readOnly.bg} !important;
-    //     --card-fg-color: ${color.input.invalid.readOnly.fg} !important;
-    //   }
-    //   /* hovered */
-    //   @media (hover: hover) {
-    //     *:not(:disabled):not(:read-only):not(:invalid):hover + & {
-    //       --card-bg-color: ${color.input.default.hovered.bg};
-    //       --card-fg-color: ${color.input.default.hovered.fg};
-    //     }
-    //     *:invalid:not(:disabled):not(:read-only):hover + & {
-    //       --card-bg-color: ${color.input.invalid.hovered.bg};
-    //       --card-fg-color: ${color.input.invalid.hovered.fg};
-    //     }
-    //     *:not(:disabled):not(:read-only):not(:invalid):not(:focus):hover + &[data-border] {
-    //       --input-box-shadow: ${focusRingBorderStyle({
-    //         color: color.input.default.hovered.border,
-    //         width: input.border.width,
-    //       })};
-    //     }
-    //     *:invalid:not(:disabled):not(:read-only):not(:focus):hover + &[data-border] {
-    //       --input-box-shadow: ${focusRingBorderStyle({
-    //         color: color.input.invalid.hovered.border,
-    //         width: input.border.width,
-    //       })};
-    //     }
-    //   }
-    // }
-  },
-}
-
-// const Root = styled(Card).attrs({forwardedAs: 'span'})(textInputRootStyle)
-
-// const InputRoot = styled.span`
-//   flex: 1;
-//   min-width: 0;
-//   display: block;
-//   position: relative;
-// `
-
-// const Prefix = styled(Card).attrs({forwardedAs: 'span'})`
-//   border-top-right-radius: 0;
-//   border-bottom-right-radius: 0;
-
-//   & > span {
-//     display: block;
-//     margin: -1px;
-//   }
-// `
-
-// const Suffix = styled(Card).attrs({forwardedAs: 'span'})`
-//   border-top-left-radius: 0;
-//   border-bottom-left-radius: 0;
-
-//   & > span {
-//     display: block;
-//     margin: -1px;
-//   }
-// `
-
-// const Input = styled.input<TextInputResponsivePaddingStyleProps & TextInputInputStyleProps>(
-//   responsiveInputPaddingStyle,
-//   textInputBaseStyle,
-//   textInputFontSizeStyle,
-// )
-
-// const Presentation = styled.span<ResponsiveRadiusStyleProps & TextInputRepresentationStyleProps>(
-//   responsiveRadiusStyle,
-//   textInputRepresentationStyle,
-// )
-
-// const LeftBox = styled(Box)`
-//   position: absolute;
-//   top: 0;
-//   left: 0;
-// `
-
-// const RightBox = styled(Box)`
-//   position: absolute;
-//   top: 0;
-//   right: 0;
-// `
-
-// const RightCard = styled(Card)`
-//   background-color: transparent;
-//   position: absolute;
-//   top: 0;
-//   right: 0;
-// `

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

@@ -1,19 +0,0 @@
-import {Rules} from '../../types'
-
-export const tooltipRules: Rules = {
-  'tooltip': {
-    pointerEvents: 'none',
-  },
-
-  'tooltip-card': {
-    'willChange': 'transform',
-
-    '@nest': {
-      '&[data-animate] > *': {
-        // opacity: var(${POPOVER_MOTION_CONTENT_OPACITY_PROPERTY}, 1);
-        opacity: `var(--motion-content-opacity, 1)`,
-        willChange: 'opacity',
-      },
-    },
-  },
-}

package/src/ui/RootClassNames.tsx

@@ -1,44 +0,0 @@
-import {card, scopeClassName as _} from '@sanity/ui/css'
-import {useEffect} from 'react'
-
-import {_raf2} from './helpers'
-import {useCard} from './primitives'
-
-/** @internal */
-export function RootClassNames(props: {element: HTMLElement}) {
-  const {element} = props
-  const {scheme, tone} = useCard() ?? {}
-
-  useEffect(() => {
-    const els = document.querySelectorAll(
-      [_('button'), _('card'), _('font')].map((n) => `.${n}`).join(', '),
-    )
-
-    // temporarily disable all transitions when the theme changes
-    for (const el of els) {
-      if (el instanceof HTMLElement) {
-        el.style.transition = 'none'
-      }
-    }
-
-    _raf2(() => {
-      document.documentElement.className = card({scheme, tone}) ?? ''
-
-      _raf2(() => {
-        for (const el of els) {
-          if (el instanceof HTMLElement) {
-            el.style.transition = ''
-          }
-        }
-      })
-    })
-
-    return () => {
-      document.documentElement.className = ''
-    }
-  }, [element, scheme, tone])
-
-  return null
-}
-
-RootClassNames.displayName = 'RootClassNames'

package/src/ui/_compat/studioTheme.ts

@@ -1,7 +0,0 @@
-import {buildTheme} from '@sanity/ui/theme'
-
-/**
- * @public
- * @deprecated Use `buildTheme` from `@sanity/ui/theme` instead.
- */
-export const studioTheme = buildTheme()

package/src/ui/primitives/card/cardProvider.tsx

@@ -1,21 +0,0 @@
-import {ThemeColorCardToneKey, ThemeColorSchemeKey} from '@sanity/ui/theme'
-import {ReactNode, useMemo} from 'react'
-
-import {CardContext} from './cardContext'
-import {CardCompatProviderComponent} from './types'
-
-export function CardProvider(props: {
-  compat_provider?: CardCompatProviderComponent
-  children?: ReactNode
-  rendered?: boolean
-  tone: ThemeColorCardToneKey
-  scheme: ThemeColorSchemeKey
-}) {
-  const {children, rendered = false, tone, scheme} = props
-
-  const context = useMemo(() => ({rendered, tone, scheme}), [rendered, tone, scheme])
-
-  return <CardContext.Provider value={context}>{children}</CardContext.Provider>
-}
-
-CardProvider.displayName = 'CardProvider'