@sanity/ui 2.0.0-beta.4 → 2.0.0-beta.5

package/dist/index.cjs.mjs

@@ -14,6 +14,7 @@ export const Card = cjs.Card;
 export const Checkbox = cjs.Checkbox;
 export const Code = cjs.Code;
 export const CodeSkeleton = cjs.CodeSkeleton;
+export const ConditionalWrapper = cjs.ConditionalWrapper;
 export const Container = cjs.Container;
 export const Dialog = cjs.Dialog;
 export const DialogContext = cjs.DialogContext;

package/dist/index.d.ts

@@ -116,24 +116,24 @@ export declare const Autocomplete: <Option extends BaseAutocompleteOption>(
   props: AutocompleteProps<Option> &
     Omit<
       HTMLProps<HTMLInputElement>,
-      | 'value'
-      | 'ref'
       | 'id'
-      | 'spellCheck'
+      | 'type'
       | 'role'
-      | 'prefix'
-      | 'autoCapitalize'
-      | 'autoCorrect'
-      | 'inputMode'
       | 'aria-activedescendant'
       | 'aria-autocomplete'
       | 'aria-expanded'
       | 'aria-owns'
       | 'onChange'
       | 'onSelect'
+      | 'value'
+      | 'ref'
+      | 'spellCheck'
+      | 'prefix'
+      | 'autoCapitalize'
+      | 'autoCorrect'
+      | 'inputMode'
       | 'as'
       | 'autoComplete'
-      | 'type'
     > & {
       ref?: Ref<HTMLInputElement> | undefined
     },
@@ -497,7 +497,7 @@ export declare type BoxSizing = 'content' | 'border'
  */
 export declare const Breadcrumbs: ForwardRefExoticComponent<
   BreadcrumbsProps &
-    Omit<HTMLProps<HTMLOListElement>, 'ref' | 'as' | 'type'> &
+    Omit<HTMLProps<HTMLOListElement>, 'type' | 'ref' | 'as'> &
     RefAttributes<HTMLOListElement>
 >
 
@@ -616,7 +616,7 @@ export declare type CardTone = ThemeColorCardToneKey | 'inherit'
  * @public
  */
 export declare const Checkbox: ForwardRefExoticComponent<
-  Omit<Omit<HTMLProps<HTMLInputElement>, 'as' | 'type'> & CheckboxProps, 'ref'> &
+  Omit<Omit<HTMLProps<HTMLInputElement>, 'type' | 'as'> & CheckboxProps, 'ref'> &
     RefAttributes<HTMLInputElement>
 >
 
@@ -657,7 +657,7 @@ export declare interface CodeProps {
  */
 export declare const CodeSkeleton: ForwardRefExoticComponent<
   Omit<
-    CodeSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'size' | 'children' | 'height' | 'as'>,
+    CodeSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'children' | 'size' | 'as'>,
     'ref'
   > &
     RefAttributes<HTMLDivElement>
@@ -671,6 +671,19 @@ export declare interface CodeSkeletonProps extends SkeletonProps {
   size?: number | number[]
 }
 
+/**
+ * @internal
+ */
+export declare function ConditionalWrapper({
+  children,
+  condition,
+  wrapper,
+}: {
+  children: React.ReactNode
+  condition: boolean
+  wrapper: (children: React.ReactNode) => React.ReactNode
+}): React.ReactNode
+
 /**
  * The `Container` component wraps content layout in a defined set of widths.
  *
@@ -1055,7 +1068,7 @@ export declare interface HeadingProps {
  */
 export declare const HeadingSkeleton: ForwardRefExoticComponent<
   Omit<
-    HeadingSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'size' | 'children' | 'height' | 'as'>,
+    HeadingSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'children' | 'size' | 'as'>,
     'ref'
   > &
     RefAttributes<HTMLDivElement>
@@ -1222,7 +1235,7 @@ export declare interface LabelProps {
  */
 export declare const LabelSkeleton: ForwardRefExoticComponent<
   Omit<
-    LabelSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'size' | 'children' | 'height' | 'as'>,
+    LabelSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'children' | 'size' | 'as'>,
     'ref'
   > &
     RefAttributes<HTMLDivElement>
@@ -1299,7 +1312,7 @@ export declare interface _MediaStore {
  * @public
  */
 export declare const Menu: ForwardRefExoticComponent<
-  Omit<MenuProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'tabIndex' | 'role' | 'as'>, 'ref'> &
+  Omit<MenuProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'role' | 'tabIndex' | 'as'>, 'ref'> &
     RefAttributes<HTMLDivElement>
 >
 
@@ -1382,7 +1395,7 @@ export declare const MenuDivider: IStyledComponent<
     style?: CSSProperties | undefined
     tabIndex?: number | undefined
     title?: string | undefined
-    translate?: 'yes' | 'no' | undefined
+    translate?: 'no' | 'yes' | undefined
     radioGroup?: string | undefined
     role?: AriaRole | undefined
     about?: string | undefined
@@ -1407,7 +1420,7 @@ export declare const MenuDivider: IStyledComponent<
     itemRef?: string | undefined
     results?: number | undefined
     security?: string | undefined
-    unselectable?: 'on' | 'off' | undefined
+    unselectable?: 'off' | 'on' | undefined
     inputMode?:
       | 'none'
       | 'text'
@@ -1421,7 +1434,7 @@ export declare const MenuDivider: IStyledComponent<
     is?: string | undefined
     'aria-activedescendant'?: string | undefined
     'aria-atomic'?: (boolean | 'false' | 'true') | undefined
-    'aria-autocomplete'?: 'none' | 'both' | 'inline' | 'list' | undefined
+    'aria-autocomplete'?: 'none' | 'inline' | 'both' | 'list' | undefined
     'aria-braillelabel'?: string | undefined
     'aria-brailleroledescription'?: string | undefined
     'aria-busy'?: (boolean | 'false' | 'true') | undefined
@@ -1436,16 +1449,16 @@ export declare const MenuDivider: IStyledComponent<
       | 'page'
       | 'false'
       | 'true'
-      | 'time'
       | 'step'
       | 'location'
       | 'date'
+      | 'time'
       | undefined
     'aria-describedby'?: string | undefined
     'aria-description'?: string | undefined
     'aria-details'?: string | undefined
     'aria-disabled'?: (boolean | 'false' | 'true') | undefined
-    'aria-dropeffect'?: 'none' | 'link' | 'copy' | 'move' | 'execute' | 'popup' | undefined
+    'aria-dropeffect'?: 'none' | 'copy' | 'move' | 'link' | 'execute' | 'popup' | undefined
     'aria-errormessage'?: string | undefined
     'aria-expanded'?: (boolean | 'false' | 'true') | undefined
     'aria-flowto'?: string | undefined
@@ -1477,8 +1490,8 @@ export declare const MenuDivider: IStyledComponent<
     'aria-pressed'?: boolean | 'mixed' | 'false' | 'true' | undefined
     'aria-readonly'?: (boolean | 'false' | 'true') | undefined
     'aria-relevant'?:
-      | 'text'
       | 'all'
+      | 'text'
       | 'additions'
       | 'additions removals'
       | 'additions text'
@@ -1700,7 +1713,7 @@ export declare interface MenuGroupProps {
  */
 export declare const MenuItem: ForwardRefExoticComponent<
   MenuItemProps &
-    Omit<HTMLProps<HTMLDivElement>, 'ref' | 'height' | 'tabIndex' | 'as' | 'selected'> &
+    Omit<HTMLProps<HTMLDivElement>, 'height' | 'tabIndex' | 'ref' | 'as' | 'selected'> &
     RefAttributes<HTMLDivElement>
 >
 
@@ -1783,7 +1796,7 @@ export declare type Placement =
 export declare const Popover: MemoExoticComponent<
   ForwardRefExoticComponent<
     Omit<
-      PopoverProps & Omit<HTMLProps<HTMLDivElement>, 'content' | 'children' | 'width' | 'as'>,
+      PopoverProps & Omit<HTMLProps<HTMLDivElement>, 'content' | 'width' | 'children' | 'as'>,
       'ref'
     > &
       RefAttributes<HTMLDivElement>
@@ -1802,15 +1815,41 @@ export declare interface PopoverProps
     ResponsiveShadowProps {
   /** @beta */
   __unstable_margins?: PopoverMargins
+  /**
+   * Whether the popover should animate in and out.
+   *
+   * @beta
+   * @defaultValue false
+   */
+  animate?: boolean
   arrow?: boolean
   /** @deprecated Use `floatingBoundary` and/or `referenceBoundary` instead */
   boundaryElement?: HTMLElement | null
   children?: React.ReactElement
+  /**
+     * When `true`, prevent overflow within the current boundary:
+     * - by flipping on its side axis
+     * - by resizing
+     /*
+     * Note that:
+     * - setting `preventOverflow` to `true` also prevents overflow on its side axis
+     * - setting `matchReferenceWidth` to `true` also causes the popover to resize
+     *
+     * @defaultValue false
+     */
   constrainSize?: boolean
   content?: React.ReactNode
   disabled?: boolean
   fallbackPlacements?: Placement[]
   floatingBoundary?: HTMLElement | null
+  /**
+   * When `true`, set the maximum width to match the reference element, and also prevent overflow within
+   * the current boundary by resizing.
+   *
+   * Note that setting `constrainSize` to `true` also causes the popover to resize
+   *
+   * @defaultValue false
+   */
   matchReferenceWidth?: boolean
   open?: boolean
   overflow?: BoxOverflow
@@ -1889,7 +1928,7 @@ export declare interface PortalProviderProps {
  * @public
  */
 export declare const Radio: ForwardRefExoticComponent<
-  Omit<Omit<HTMLProps<HTMLInputElement>, 'as' | 'type'> & RadioProps, 'ref'> &
+  Omit<Omit<HTMLProps<HTMLInputElement>, 'type' | 'as'> & RadioProps, 'ref'> &
     RefAttributes<HTMLInputElement>
 >
 
@@ -2279,7 +2318,7 @@ export declare type Styles = ThemeStyles
  * @public
  */
 export declare const Switch: ForwardRefExoticComponent<
-  Omit<Omit<HTMLProps<HTMLInputElement>, 'as' | 'type'> & SwitchProps, 'ref'> &
+  Omit<Omit<HTMLProps<HTMLInputElement>, 'type' | 'as'> & SwitchProps, 'ref'> &
     RefAttributes<HTMLInputElement>
 >
 
@@ -2298,7 +2337,7 @@ export declare const Tab: ForwardRefExoticComponent<
     TabProps &
       Omit<
         HTMLProps<HTMLButtonElement>,
-        'label' | 'width' | 'id' | 'aria-controls' | 'as' | 'type'
+        'width' | 'id' | 'type' | 'aria-controls' | 'label' | 'as'
       >,
     'ref'
   > &
@@ -2404,7 +2443,7 @@ export declare interface TextAreaProps extends ResponsiveRadiusProps {
  * @public
  */
 export declare const TextInput: ForwardRefExoticComponent<
-  Omit<TextInputProps & Omit<HTMLProps<HTMLInputElement>, 'prefix' | 'as' | 'type'>, 'ref'> &
+  Omit<TextInputProps & Omit<HTMLProps<HTMLInputElement>, 'type' | 'prefix' | 'as'>, 'ref'> &
     RefAttributes<HTMLInputElement>
 >
 
@@ -2486,7 +2525,7 @@ export declare interface TextProps {
  */
 export declare const TextSkeleton: ForwardRefExoticComponent<
   Omit<
-    TextSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'size' | 'children' | 'height' | 'as'>,
+    TextSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'children' | 'size' | 'as'>,
     'ref'
   > &
     RefAttributes<HTMLDivElement>
@@ -2834,7 +2873,7 @@ export declare interface TooltipProps extends Omit<LayerProps, 'as'> {
 export declare const Tree: MemoExoticComponent<
   ForwardRefExoticComponent<
     TreeProps &
-      Omit<HTMLProps<HTMLDivElement>, 'wrap' | 'ref' | 'height' | 'role' | 'as' | 'align'> &
+      Omit<HTMLProps<HTMLDivElement>, 'height' | 'role' | 'wrap' | 'ref' | 'as' | 'align'> &
       RefAttributes<HTMLDivElement>
   >
 >
@@ -2859,7 +2898,7 @@ export declare interface TreeContextValue {
  * @beta
  */
 export declare const TreeItem: NamedExoticComponent<
-  TreeItemProps & Omit<HTMLProps<HTMLLIElement>, 'ref' | 'role' | 'as'>
+  TreeItemProps & Omit<HTMLProps<HTMLLIElement>, 'role' | 'ref' | 'as'>
 >
 
 /**
@@ -3029,7 +3068,7 @@ export declare function useTree(): TreeContextValue
 export declare const VirtualList: ForwardRefExoticComponent<
   VirtualListProps<any> &
     StackProps &
-    Omit<HTMLProps<HTMLDivElement>, 'children' | 'ref' | 'onChange' | 'as'> &
+    Omit<HTMLProps<HTMLDivElement>, 'children' | 'onChange' | 'ref' | 'as'> &
     RefAttributes<HTMLDivElement>
 >