@sanity/ui 0.37.12 → 0.37.14-next.6

package/src/hooks/useResponsiveProp.ts

@@ -1,10 +0,0 @@
-import {useMemo} from 'react'
-import {getResponsiveProp} from '../styles'
-
-/**
- * This API might change. DO NOT USE IN PRODUCTION.
- * @beta
- */
-export function useResponsiveProp<T = number>(val: T | T[] | undefined, defaultVal?: T[]): T[] {
-  return useMemo(() => getResponsiveProp(val, defaultVal), [defaultVal, val])
-}

package/src/primitives/popover/__workshop__/rightAligned.tsx

@@ -1,57 +0,0 @@
-import {EllipsisVerticalIcon} from '@sanity/icons'
-import {Box, Button, Card, Flex, Popover, Text, useClickOutside} from '@sanity/ui'
-import React, {useCallback, useState} from 'react'
-
-export default function RightAlignedStory() {
-  const [open, setOpen] = useState(false)
-  const [boundaryElement, setBoundaryElement] = useState<HTMLDivElement | null>(null)
-  const [buttonElement, setButtonElement] = useState<HTMLButtonElement | null>(null)
-  const [popoverElement, setPopoverElement] = useState<HTMLDivElement | null>(null)
-  const content = (
-    <Box overflow="auto" padding={3}>
-      <Text>
-        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque at nisl at sem tempor
-        hendrerit scelerisque ut libero. Maecenas iaculis efficitur lorem, ac faucibus mi imperdiet
-        quis. Cras a consectetur erat. Fusce imperdiet, dolor et pellentesque iaculis, ex quam
-        luctus felis, non ultrices enim sem vitae quam. Duis lorem velit, lacinia at rhoncus a,
-        tempus vel neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere
-        cubilia curae; Sed id mauris quam. Nam finibus sapien non lacinia ultricies. Integer
-        fermentum tortor at pellentesque faucibus. In venenatis commodo placerat. Curabitur commodo
-        tortor libero, vel pellentesque elit luctus sodales. Donec mattis tristique nunc ac lacinia.
-        Vestibulum non pulvinar turpis, posuere consequat arcu. Fusce ut urna blandit, finibus nisi
-        a, molestie elit. Nulla sed eleifend mi.
-      </Text>
-    </Box>
-  )
-
-  const handleToggleOpen = useCallback(() => setOpen((v) => !v), [])
-  const handleClose = useCallback(() => setOpen(false), [])
-
-  useClickOutside(handleClose, [buttonElement, popoverElement])
-
-  return (
-    <Box height="fill" padding={[4, 5, 6]} sizing="border">
-      <Card height="fill" padding={2} ref={setBoundaryElement} shadow={1}>
-        <Flex justify="flex-end" padding={0}>
-          <Popover
-            boundaryElement={boundaryElement}
-            constrainSize
-            content={content}
-            open={open}
-            portal
-            preventOverflow
-            ref={setPopoverElement}
-          >
-            <Button
-              icon={EllipsisVerticalIcon}
-              mode="bleed"
-              onClick={handleToggleOpen}
-              ref={setButtonElement}
-              selected={open}
-            />
-          </Popover>
-        </Flex>
-      </Card>
-    </Box>
-  )
-}

package/src/primitives/popover/modifiers/getPopoverModifiers.ts

@@ -1,137 +0,0 @@
-import maxSizeModifier from 'popper-max-size-modifier'
-import {Modifier} from 'react-popper'
-import {PopoverModifiersProps} from './types'
-
-/*
-
-The order of popper phases:
-
-- beforeRead
-- read
-- afterRead
-- beforeMain
-- main
-- afterMain
-- beforeWrite
-- write
-- afterWrite
-
-*/
-
-export function getPopoverModifiers(props: PopoverModifiersProps): Modifier<any, any>[] {
-  const {
-    allowedAutoPlacements,
-    arrow,
-    arrowElement,
-    boundaryElement,
-    constrainSize,
-    distance,
-    fallbackPlacements,
-    margins,
-    matchReferenceWidth,
-    open,
-    preventOverflow,
-    skidding,
-    tether,
-    tetherOffset,
-  } = props
-
-  // NOTE: For later viewers:
-  // Prior to adding this change, the popover would get `maxWidth: 0` the 2nd time it
-  // was opened, when used with `constrainSize`. I was looking for a way to "reset"
-  // the size of the popover as measured by Popper.js, and this seems to be a workaround.
-  if (!open) {
-    return []
-  }
-
-  const detectOverflowOptions = {
-    altAxis: !constrainSize,
-    boundary: boundaryElement || undefined,
-    padding: 8,
-    tether,
-    tetherOffset,
-  }
-
-  return [
-    constrainSize && {
-      ...maxSizeModifier,
-      options: detectOverflowOptions,
-    },
-    constrainSize && {
-      name: 'applyMaxSize',
-      enabled: true,
-      phase: 'beforeWrite',
-      requires: ['maxSize'],
-      fn({state}: any) {
-        const {width, height} = state.modifiersData.maxSize
-
-        state.styles.popper = {
-          ...state.styles.popper,
-          maxWidth: `${width}px`,
-          maxHeight: `${height}px`,
-        }
-      },
-    },
-    arrow && {
-      name: 'arrow',
-      options: {
-        element: arrowElement,
-        padding: 4,
-      },
-    },
-    (constrainSize || preventOverflow) && {
-      name: 'preventOverflow',
-      options: detectOverflowOptions,
-    },
-    {
-      name: 'offset',
-      options: {
-        offset: [skidding, distance],
-      },
-    },
-    margins && {
-      name: 'margins',
-      enabled: true,
-      phase: 'beforeRead',
-      fn: ({state}: any) => {
-        const {rects} = state
-
-        if (rects.reference) {
-          rects.reference.x += margins[3]
-          rects.reference.y += margins[1]
-          rects.reference.width -= margins[1] + margins[3]
-          rects.reference.height -= margins[0] + margins[2]
-        }
-      },
-    },
-    {
-      name: 'flip',
-      options: {
-        allowedAutoPlacements,
-        boundary: boundaryElement || undefined,
-        fallbackPlacements,
-        padding: 8,
-      },
-    },
-    matchReferenceWidth && {
-      name: 'matchWidth',
-      enabled: true,
-      phase: 'beforeWrite',
-      requires: ['computeStyles'],
-      fn({state}: any) {
-        const {width} = state.rects.reference
-
-        state.styles.popper.width = `${width}px`
-      },
-      effect: ({state}: any) => {
-        const refElement = state.elements.reference
-
-        if (refElement instanceof HTMLElement) {
-          state.elements.popper.style.width = `${
-            refElement.offsetWidth - (margins ? margins[1] + margins[3] : 0)
-          }px`
-        }
-      },
-    },
-  ].filter(Boolean) as Modifier<any, any>[]
-}

package/src/primitives/popover/modifiers/index.ts

@@ -1 +0,0 @@
-export * from './usePopoverModifiers'

package/src/primitives/popover/modifiers/types.ts

@@ -1,18 +0,0 @@
-import {Placement} from '../../../types'
-
-export interface PopoverModifiersProps {
-  allowedAutoPlacements?: Placement[]
-  arrow?: boolean
-  arrowElement?: HTMLElement | null
-  boundaryElement?: HTMLElement | null
-  constrainSize?: boolean
-  distance: number
-  fallbackPlacements?: Placement[]
-  margins?: [number, number, number, number]
-  matchReferenceWidth?: boolean
-  open: boolean
-  preventOverflow?: boolean
-  skidding: number
-  tether?: boolean
-  tetherOffset?: number | ((...args: any[]) => number)
-}

package/src/primitives/popover/modifiers/usePopoverModifiers.ts

@@ -1,58 +0,0 @@
-import {useMemo} from 'react'
-import {Modifier} from 'react-popper'
-
-import {getPopoverModifiers} from './getPopoverModifiers'
-import {PopoverModifiersProps} from './types'
-
-export function usePopoverModifiers(props: PopoverModifiersProps): Modifier<any, any>[] {
-  const {
-    allowedAutoPlacements,
-    arrow,
-    arrowElement,
-    boundaryElement,
-    constrainSize,
-    distance,
-    fallbackPlacements,
-    margins,
-    matchReferenceWidth,
-    open,
-    preventOverflow,
-    skidding,
-    tether,
-    tetherOffset,
-  } = props
-
-  return useMemo(() => {
-    return getPopoverModifiers({
-      allowedAutoPlacements,
-      arrow,
-      arrowElement,
-      boundaryElement,
-      constrainSize,
-      distance,
-      fallbackPlacements,
-      margins,
-      matchReferenceWidth,
-      open,
-      preventOverflow,
-      skidding,
-      tether,
-      tetherOffset,
-    })
-  }, [
-    allowedAutoPlacements,
-    arrow,
-    arrowElement,
-    boundaryElement,
-    constrainSize,
-    distance,
-    fallbackPlacements,
-    margins,
-    matchReferenceWidth,
-    open,
-    preventOverflow,
-    skidding,
-    tether,
-    tetherOffset,
-  ])
-}

package/src/types/common.ts

@@ -1,12 +0,0 @@
-import {Placement as PopperPlacement} from '@popperjs/core'
-
-/**
- * @public
- */
-export type TextAlign = 'left' | 'right' | 'center' | 'justify' | 'initial'
-
-/**
- * A re-export of Popper’s `Placement` type
- * @public
- */
-export type Placement = PopperPlacement