@sanity/ui 3.0.0-static.27 → 3.0.0-static.29

package/dist/index.d.cts

@@ -76,8 +76,10 @@ import {RGB as RGB_2} from '@sanity/ui/theme'
 import {rgba as rgba_2} from '@sanity/ui/theme'
 import {rgbToHex as rgbToHex_2} from '@sanity/ui/theme'
 import {rgbToHsl as rgbToHsl_2} from '@sanity/ui/theme'
+import {RootStyleProps} from '@sanity/ui/css'
 import {RootTheme as RootTheme_2} from '@sanity/ui/theme'
 import {screen as screen_3} from '@sanity/ui/theme'
+import {SelectableStyleProps} from '@sanity/ui/css'
 import {SelectStyleProps} from '@sanity/ui/css'
 import {ShadowStyleProps} from '@sanity/ui/css'
 import {SkeletonStyleProps} from '@sanity/ui/css'
@@ -222,7 +224,7 @@ export declare type AutocompleteOwnProps<
   filterOption?: (query: string, option: O) => boolean
   icon?: ElementType_2 | ReactNode
   /** @beta */
-  listBox?: BoxProps
+  listBox?: BoxOwnProps
   loading?: boolean
   onChange?: (value: string) => void
   onQueryChange?: (query: string | null) => void
@@ -443,12 +445,6 @@ export declare function Badge<E extends BadgeElementType = typeof DEFAULT_BADGE_
 /** @public */
 export declare type BadgeElementType = 'div' | 'span' | ComponentType
 
-/**
- * @public
- * @deprecated No longer used
- */
-export declare type BadgeMode = 'default' | 'outline'
-
 /** @public */
 export declare type BadgeOwnProps = PaddingStyleProps &
   RadiusStyleProps & {
@@ -463,7 +459,7 @@ export declare type BadgeProps<E extends BadgeElementType = BadgeElementType> =
 >
 
 /** @public */
-export declare type BadgeTone = ThemeColorStateToneKey
+declare type BadgeTone = ThemeColorStateToneKey
 
 /** @public */
 export declare interface BaseAutocompleteOption {
@@ -832,13 +828,13 @@ export declare const DEFAULT_ARROW_ELEMENT = 'div'
 export declare const DEFAULT_AUTOCOMPLETE_ELEMENT = 'input'
 
 /** @public */
-export declare const DEFAULT_AVATAR_COUNTER_ELEMENT = 'div'
+export declare const DEFAULT_AVATAR_COUNTER_ELEMENT = 'span'
 
 /** @public */
 export declare const DEFAULT_AVATAR_ELEMENT = 'span'
 
 /** @public */
-export declare const DEFAULT_AVATAR_STACK_ELEMENT = 'div'
+export declare const DEFAULT_AVATAR_STACK_ELEMENT = 'span'
 
 /** @public */
 export declare const DEFAULT_BADGE_ELEMENT = 'span'
@@ -921,9 +917,15 @@ export declare const DEFAULT_POPOVER_ELEMENT = 'div'
 /** @public */
 export declare const DEFAULT_RADIO_ELEMENT = 'input'
 
+/** @public */
+export declare const DEFAULT_ROOT_ELEMENT = 'html'
+
 /** @public */
 export declare const DEFAULT_SELECT_ELEMENT = 'select'
 
+/** @internal */
+export declare const DEFAULT_SELECTABLE_ELEMENT = 'button'
+
 /** @beta */
 export declare const DEFAULT_SKELETON_ELEMENT = 'div'
 
@@ -960,7 +962,7 @@ export declare const DEFAULT_TEXT_INPUT_ELEMENT = 'input'
 /** @beta */
 export declare const DEFAULT_TEXT_SKELETON_ELEMENT = 'div'
 
-/** @public */
+/** @internal */
 export declare const DEFAULT_TOAST_ELEMENT = 'li'
 
 /** @public */
@@ -2142,6 +2144,24 @@ export declare const rgbToHex: typeof rgbToHex_2
  */
 export declare const rgbToHsl: typeof rgbToHsl_2
 
+/**
+ * The `Root` component.
+ *
+ * @public
+ */
+export declare function Root<E extends RootElementType = typeof DEFAULT_ROOT_ELEMENT>(
+  props: RootProps<E>,
+): JSX.Element
+
+/** @public */
+export declare type RootElementType = 'html' | 'body' | 'div'
+
+/** @public */
+export declare interface RootOwnProps extends BoxOwnProps, RootStyleProps {}
+
+/** @public */
+export declare type RootProps<E extends RootElementType = RootElementType> = Props<RootOwnProps, E>
+
 /**
  * @public
  * @deprecated Use `RootTheme` from `@sanity/ui/theme` instead.
@@ -2165,10 +2185,29 @@ export declare function Select<E extends SelectElementType = typeof DEFAULT_SELE
 ): JSX.Element
 
 /** @internal */
-declare type SelectableElementType = 'button' | 'a' | ComponentType
+export declare function Selectable<
+  E extends SelectableElementType = typeof DEFAULT_SELECTABLE_ELEMENT,
+>(props: SelectableProps<E>): JSX.Element
+
+/** @internal */
+export declare type SelectableElementType = 'button' | 'a' | ComponentType
+
+/** @internal */
+export declare type SelectableOwnProps = BoxOwnProps &
+  SelectableStyleProps & {
+    disabled?: boolean
+    href?: string
+    selected?: boolean
+    tone?: ThemeColorStateToneKey
+    type?: 'button'
+  }
+
+/** @internal */
+export declare type SelectableProps<E extends SelectableElementType = SelectableElementType> =
+  Props<SelectableOwnProps, E>
 
 /**
- * @public
+ * @internal
  * @deprecated Use `ThemeColorStateToneKey` instead
  */
 export declare type SelectableTone = ThemeColorStateToneKey
@@ -2205,11 +2244,10 @@ export declare type SkeletonElementType = 'div' | 'span' | ComponentType
  * This API might change. DO NOT USE IN PRODUCTION.
  * @beta
  */
-export declare type SkeletonOwnProps = BoxOwnProps &
-  SkeletonStyleProps & {
-    animated?: boolean
-    delay?: number
-  }
+export declare type SkeletonOwnProps = SkeletonStyleProps & {
+  animated?: boolean
+  delay?: number
+}
 
 /** @beta */
 export declare type SkeletonProps<E extends SkeletonElementType = SkeletonElementType> = Props<
@@ -2704,9 +2742,9 @@ export declare type ThemeShadow = ThemeShadow_2
 /**
  * The `Toast` component gives feedback to users when an action has taken place.
  *
- * Toasts can be closed with a close button, or auto-dismiss after a certain timeout.
+ * Toasts can be closed with a close button, or auto-dismiss when the duration expires.
  *
- * @public
+ * @internal
  */
 export declare function Toast<E extends ToastElementType = typeof DEFAULT_TOAST_ELEMENT>(
   props: ToastProps<E>,
@@ -2724,7 +2762,7 @@ export declare interface ToastContextValue {
   push: (params: ToastParams) => string
 }
 
-/** @public */
+/** @internal */
 export declare type ToastElementType = 'li' | ComponentType
 
 /** @internal */
@@ -2739,17 +2777,14 @@ declare type ToastLayerProps<E extends ToastLayerElementType = ToastLayerElement
   E
 >
 
-/** @public */
+/** @internal */
 export declare type ToastOwnProps = RadiusStyleProps & {
   closable?: boolean
   description?: ReactNode
   onClose?: () => void
   title?: ReactNode
   status?: 'error' | 'warning' | 'success' | 'info'
-  /** @deprecated */
   duration?: number
-  /** @deprecated */
-  updatedAt?: number
 }
 
 /** @public */
@@ -2763,7 +2798,7 @@ export declare interface ToastParams {
   status?: 'error' | 'warning' | 'success' | 'info'
 }
 
-/** @public */
+/** @internal */
 export declare type ToastProps<E extends ToastElementType = ToastElementType> = Props<
   ToastOwnProps,
   E
@@ -2919,6 +2954,7 @@ export declare type TreeItemOwnProps = CardOwnProps & {
   icon?: ElementType_2
   /**
    * Allows passing a custom element type to the link component
+   * @internal
    */
   linkAs?: SelectableElementType
   onClick?: MouseEventHandler<HTMLAnchorElement | HTMLLIElement>

package/dist/index.d.ts

@@ -76,8 +76,10 @@ import {RGB as RGB_2} from '@sanity/ui/theme'
 import {rgba as rgba_2} from '@sanity/ui/theme'
 import {rgbToHex as rgbToHex_2} from '@sanity/ui/theme'
 import {rgbToHsl as rgbToHsl_2} from '@sanity/ui/theme'
+import {RootStyleProps} from '@sanity/ui/css'
 import {RootTheme as RootTheme_2} from '@sanity/ui/theme'
 import {screen as screen_3} from '@sanity/ui/theme'
+import {SelectableStyleProps} from '@sanity/ui/css'
 import {SelectStyleProps} from '@sanity/ui/css'
 import {ShadowStyleProps} from '@sanity/ui/css'
 import {SkeletonStyleProps} from '@sanity/ui/css'
@@ -222,7 +224,7 @@ export declare type AutocompleteOwnProps<
   filterOption?: (query: string, option: O) => boolean
   icon?: ElementType_2 | ReactNode
   /** @beta */
-  listBox?: BoxProps
+  listBox?: BoxOwnProps
   loading?: boolean
   onChange?: (value: string) => void
   onQueryChange?: (query: string | null) => void
@@ -443,12 +445,6 @@ export declare function Badge<E extends BadgeElementType = typeof DEFAULT_BADGE_
 /** @public */
 export declare type BadgeElementType = 'div' | 'span' | ComponentType
 
-/**
- * @public
- * @deprecated No longer used
- */
-export declare type BadgeMode = 'default' | 'outline'
-
 /** @public */
 export declare type BadgeOwnProps = PaddingStyleProps &
   RadiusStyleProps & {
@@ -463,7 +459,7 @@ export declare type BadgeProps<E extends BadgeElementType = BadgeElementType> =
 >
 
 /** @public */
-export declare type BadgeTone = ThemeColorStateToneKey
+declare type BadgeTone = ThemeColorStateToneKey
 
 /** @public */
 export declare interface BaseAutocompleteOption {
@@ -832,13 +828,13 @@ export declare const DEFAULT_ARROW_ELEMENT = 'div'
 export declare const DEFAULT_AUTOCOMPLETE_ELEMENT = 'input'
 
 /** @public */
-export declare const DEFAULT_AVATAR_COUNTER_ELEMENT = 'div'
+export declare const DEFAULT_AVATAR_COUNTER_ELEMENT = 'span'
 
 /** @public */
 export declare const DEFAULT_AVATAR_ELEMENT = 'span'
 
 /** @public */
-export declare const DEFAULT_AVATAR_STACK_ELEMENT = 'div'
+export declare const DEFAULT_AVATAR_STACK_ELEMENT = 'span'
 
 /** @public */
 export declare const DEFAULT_BADGE_ELEMENT = 'span'
@@ -921,9 +917,15 @@ export declare const DEFAULT_POPOVER_ELEMENT = 'div'
 /** @public */
 export declare const DEFAULT_RADIO_ELEMENT = 'input'
 
+/** @public */
+export declare const DEFAULT_ROOT_ELEMENT = 'html'
+
 /** @public */
 export declare const DEFAULT_SELECT_ELEMENT = 'select'
 
+/** @internal */
+export declare const DEFAULT_SELECTABLE_ELEMENT = 'button'
+
 /** @beta */
 export declare const DEFAULT_SKELETON_ELEMENT = 'div'
 
@@ -960,7 +962,7 @@ export declare const DEFAULT_TEXT_INPUT_ELEMENT = 'input'
 /** @beta */
 export declare const DEFAULT_TEXT_SKELETON_ELEMENT = 'div'
 
-/** @public */
+/** @internal */
 export declare const DEFAULT_TOAST_ELEMENT = 'li'
 
 /** @public */
@@ -2142,6 +2144,24 @@ export declare const rgbToHex: typeof rgbToHex_2
  */
 export declare const rgbToHsl: typeof rgbToHsl_2
 
+/**
+ * The `Root` component.
+ *
+ * @public
+ */
+export declare function Root<E extends RootElementType = typeof DEFAULT_ROOT_ELEMENT>(
+  props: RootProps<E>,
+): JSX.Element
+
+/** @public */
+export declare type RootElementType = 'html' | 'body' | 'div'
+
+/** @public */
+export declare interface RootOwnProps extends BoxOwnProps, RootStyleProps {}
+
+/** @public */
+export declare type RootProps<E extends RootElementType = RootElementType> = Props<RootOwnProps, E>
+
 /**
  * @public
  * @deprecated Use `RootTheme` from `@sanity/ui/theme` instead.
@@ -2165,10 +2185,29 @@ export declare function Select<E extends SelectElementType = typeof DEFAULT_SELE
 ): JSX.Element
 
 /** @internal */
-declare type SelectableElementType = 'button' | 'a' | ComponentType
+export declare function Selectable<
+  E extends SelectableElementType = typeof DEFAULT_SELECTABLE_ELEMENT,
+>(props: SelectableProps<E>): JSX.Element
+
+/** @internal */
+export declare type SelectableElementType = 'button' | 'a' | ComponentType
+
+/** @internal */
+export declare type SelectableOwnProps = BoxOwnProps &
+  SelectableStyleProps & {
+    disabled?: boolean
+    href?: string
+    selected?: boolean
+    tone?: ThemeColorStateToneKey
+    type?: 'button'
+  }
+
+/** @internal */
+export declare type SelectableProps<E extends SelectableElementType = SelectableElementType> =
+  Props<SelectableOwnProps, E>
 
 /**
- * @public
+ * @internal
  * @deprecated Use `ThemeColorStateToneKey` instead
  */
 export declare type SelectableTone = ThemeColorStateToneKey
@@ -2205,11 +2244,10 @@ export declare type SkeletonElementType = 'div' | 'span' | ComponentType
  * This API might change. DO NOT USE IN PRODUCTION.
  * @beta
  */
-export declare type SkeletonOwnProps = BoxOwnProps &
-  SkeletonStyleProps & {
-    animated?: boolean
-    delay?: number
-  }
+export declare type SkeletonOwnProps = SkeletonStyleProps & {
+  animated?: boolean
+  delay?: number
+}
 
 /** @beta */
 export declare type SkeletonProps<E extends SkeletonElementType = SkeletonElementType> = Props<
@@ -2704,9 +2742,9 @@ export declare type ThemeShadow = ThemeShadow_2
 /**
  * The `Toast` component gives feedback to users when an action has taken place.
  *
- * Toasts can be closed with a close button, or auto-dismiss after a certain timeout.
+ * Toasts can be closed with a close button, or auto-dismiss when the duration expires.
  *
- * @public
+ * @internal
  */
 export declare function Toast<E extends ToastElementType = typeof DEFAULT_TOAST_ELEMENT>(
   props: ToastProps<E>,
@@ -2724,7 +2762,7 @@ export declare interface ToastContextValue {
   push: (params: ToastParams) => string
 }
 
-/** @public */
+/** @internal */
 export declare type ToastElementType = 'li' | ComponentType
 
 /** @internal */
@@ -2739,17 +2777,14 @@ declare type ToastLayerProps<E extends ToastLayerElementType = ToastLayerElement
   E
 >
 
-/** @public */
+/** @internal */
 export declare type ToastOwnProps = RadiusStyleProps & {
   closable?: boolean
   description?: ReactNode
   onClose?: () => void
   title?: ReactNode
   status?: 'error' | 'warning' | 'success' | 'info'
-  /** @deprecated */
   duration?: number
-  /** @deprecated */
-  updatedAt?: number
 }
 
 /** @public */
@@ -2763,7 +2798,7 @@ export declare interface ToastParams {
   status?: 'error' | 'warning' | 'success' | 'info'
 }
 
-/** @public */
+/** @internal */
 export declare type ToastProps<E extends ToastElementType = ToastElementType> = Props<
   ToastOwnProps,
   E
@@ -2919,6 +2954,7 @@ export declare type TreeItemOwnProps = CardOwnProps & {
   icon?: ElementType_2
   /**
    * Allows passing a custom element type to the link component
+   * @internal
    */
   linkAs?: SelectableElementType
   onClick?: MouseEventHandler<HTMLAnchorElement | HTMLLIElement>