sanity-plugin-media 2.4.0 → 2.4.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sanity-plugin-media",
-  "version": "2.4.0",
+  "version": "2.4.1",
   "description": "This version of `sanity-plugin-media` is for Sanity Studio V3.",
   "keywords": [
     "sanity",
@@ -42,9 +42,9 @@
     "v2-incompatible.js"
   ],
   "scripts": {
+    "dev": "sanity dev",
     "build": "plugin-kit verify-package --silent && pkg-utils build --strict --check --clean",
     "clean": "rimraf dist",
-    "dev": "npm run watch",
     "format": "prettier --write --cache --ignore-unknown .",
     "link-watch": "plugin-kit link-watch",
     "lint": "eslint .",
@@ -86,13 +86,13 @@
     "@sanity/pkg-utils": "^7.0.3",
     "@sanity/plugin-kit": "^4.0.19",
     "@sanity/semantic-release-preset": "^2.0.2",
+    "@sanity/vision": "^3.78.1",
     "@types/is-hotkey": "^0.1.7",
     "@types/pluralize": "^0.0.29",
     "@types/react": "^18",
     "@types/react-dom": "^18",
     "@types/react-file-icon": "^1.0.1",
     "@types/react-redux": "^7.1.24",
-    "@types/styled-components": "^5.1.7",
     "@typescript-eslint/eslint-plugin": "^5.42.0",
     "@typescript-eslint/parser": "^5.42.0",
     "conventional-changelog-conventionalcommits": "^5.0.0",
@@ -109,16 +109,16 @@
     "react": "^18",
     "react-dom": "^18",
     "rimraf": "^3.0.2",
-    "sanity": "^3.2.0",
+    "sanity": "^3.78.1",
     "standard-version": "^9.5.0",
-    "styled-components": "^5.3.3",
+    "styled-components": "^6.1.15",
     "typescript": "5.7.3"
   },
   "peerDependencies": {
     "@sanity/ui": "^1.0 || ^2.0",
     "react": "^18",
     "react-dom": "^18",
-    "sanity": "^3.0.0",
+    "sanity": "^3",
     "styled-components": "^5.0 || ^6.0"
   },
   "engines": {

package/src/components/AssetGridVirtualized/index.tsx

@@ -1,7 +1,7 @@
-import type {CardAssetData, CardUploadData} from '@types'
+import type {CardAssetData, CardUploadData} from '../../types'
 import {memo} from 'react'
 import {VirtuosoGrid} from 'react-virtuoso'
-import styled from 'styled-components'
+import {styled} from 'styled-components'
 import useTypedSelector from '../../hooks/useTypedSelector'
 import CardAsset from '../CardAsset'
 import CardUpload from '../CardUpload'
@@ -63,6 +63,7 @@ const AssetGridVirtualized = (props: Props) => {
       }}
       components={{
         Item: ItemContainer,
+        // @ts-expect-error - fix typings later
         List: ListContainer
       }}
       endReached={onLoadMore}

package/src/components/AssetMetadata/index.tsx

@@ -1,6 +1,6 @@
 import {DownloadIcon} from '@sanity/icons'
 import {Box, Button, Flex, Inline, Stack, Text} from '@sanity/ui'
-import type {Asset, AssetItem} from '@types'
+import type {Asset, AssetItem} from '../../types'
 import format from 'date-fns/format'
 import filesize from 'filesize'
 import {type ReactNode} from 'react'

package/src/components/AssetTableVirtualized/index.tsx

@@ -1,4 +1,4 @@
-import type {CardAssetData, CardUploadData} from '@types'
+import type {CardAssetData, CardUploadData} from '../../types'
 import {Box} from '@sanity/ui'
 import {memo} from 'react'
 import {GroupedVirtuoso} from 'react-virtuoso'

package/src/components/Browser/index.tsx

@@ -1,6 +1,6 @@
 import type {MutationEvent} from '@sanity/client'
 import {Card, Flex, PortalProvider, studioTheme, ThemeProvider, ToastProvider} from '@sanity/ui'
-import type {Asset, Tag} from '@types'
+import type {Asset, Tag} from '../../types'
 import groq from 'groq'
 import {useEffect, useState} from 'react'
 import {useDispatch} from 'react-redux'

package/src/components/CardAsset/index.tsx

@@ -13,7 +13,7 @@ import {
 import {memo, type MouseEvent, type RefObject} from 'react'
 import {useDispatch} from 'react-redux'
 import {useColorScheme} from 'sanity'
-import styled, {css} from 'styled-components'
+import {styled, css} from 'styled-components'
 import {PANEL_HEIGHT} from '../../constants'
 import {useAssetSourceActions} from '../../contexts/AssetSourceDispatchContext'
 import useKeyPress from '../../hooks/useKeyPress'
@@ -66,18 +66,21 @@ const CardContainer = styled(Flex)<{picked?: boolean; theme: Theme; updating?: b
   }
 )
 
-const ContextActionContainer = styled(Flex)(({scheme}: {scheme: ThemeColorSchemeKey}) => {
-  return css`
-    cursor: pointer;
-    height: ${PANEL_HEIGHT}px;
-    transition: all 300ms;
-    @media (hover: hover) and (pointer: fine) {
-      &:hover {
-        background: ${getSchemeColor(scheme, 'bg')};
+const ContextActionContainer = styled(Flex)(
+  // @ts-expect-error - fix typings later
+  ({scheme}: {scheme: ThemeColorSchemeKey}) => {
+    return css`
+      cursor: pointer;
+      height: ${PANEL_HEIGHT}px;
+      transition: all 300ms;
+      @media (hover: hover) and (pointer: fine) {
+        &:hover {
+          background: ${getSchemeColor(scheme, 'bg')};
+        }
       }
-    }
-  `
-})
+    `
+  }
+)
 
 const StyledWarningOutlineIcon = styled(WarningFilledIcon)(({theme}) => {
   return {
@@ -221,6 +224,7 @@ const CardAsset = (props: Props) => {
           align="center"
           onClick={handleContextActionClick}
           paddingX={1}
+          // @ts-expect-error - fix typings later
           scheme={scheme}
           style={{opacity: opacityContainer}}
         >

package/src/components/CardUpload/index.tsx

@@ -4,7 +4,7 @@ import filesize from 'filesize'
 import React from 'react'
 import {useDispatch} from 'react-redux'
 import {useColorScheme} from 'sanity'
-import styled from 'styled-components'
+import {styled} from 'styled-components'
 import {PANEL_HEIGHT} from '../../constants'
 import useTypedSelector from '../../hooks/useTypedSelector'
 import {selectUploadById, uploadsActions} from '../../modules/uploads'

package/src/components/DialogAssetEdit/index.tsx

@@ -1,7 +1,7 @@
 import {zodResolver} from '@hookform/resolvers/zod'
 import type {MutationEvent} from '@sanity/client'
 import {Box, Button, Card, Flex, Stack, Tab, TabList, TabPanel, Text} from '@sanity/ui'
-import type {Asset, AssetFormData, DialogAssetEditProps, TagSelectOption} from '@types'
+import type {Asset, AssetFormData, DialogAssetEditProps, TagSelectOption} from '../../types'
 import groq from 'groq'
 import {type ReactNode, useCallback, useEffect, useRef, useState} from 'react'
 import {type SubmitHandler, useForm} from 'react-hook-form'

package/src/components/DialogConfirm/index.tsx

@@ -1,6 +1,6 @@
 import {WarningOutlineIcon} from '@sanity/icons'
 import {Box, Button, Flex, Stack, Text} from '@sanity/ui'
-import type {DialogConfirmProps} from '@types'
+import type {DialogConfirmProps} from '../../types'
 import {type ReactNode} from 'react'
 import {useDispatch} from 'react-redux'
 import {dialogActions} from '../../modules/dialog'

package/src/components/DialogSearchFacets/index.tsx

@@ -1,5 +1,5 @@
 import {Box} from '@sanity/ui'
-import type {DialogSearchFacetsProps} from '@types'
+import type {DialogSearchFacetsProps} from '../../types'
 import {type ReactNode, useCallback} from 'react'
 import {useDispatch} from 'react-redux'
 import {dialogActions} from '../../modules/dialog'

package/src/components/DialogTagCreate/index.tsx

@@ -1,6 +1,6 @@
 import {zodResolver} from '@hookform/resolvers/zod'
 import {Box, Flex} from '@sanity/ui'
-import type {DialogTagCreateProps, TagFormData} from '@types'
+import type {DialogTagCreateProps, TagFormData} from '../../types'
 import {type ReactNode, useEffect} from 'react'
 import {type SubmitHandler, useForm} from 'react-hook-form'
 import {useDispatch} from 'react-redux'

package/src/components/DialogTagEdit/index.tsx

@@ -1,7 +1,7 @@
 import {zodResolver} from '@hookform/resolvers/zod'
 import type {MutationEvent} from '@sanity/client'
 import {Box, Button, Card, Flex, Text} from '@sanity/ui'
-import type {DialogTagEditProps, Tag, TagFormData} from '@types'
+import type {DialogTagEditProps, Tag, TagFormData} from '../../types'
 import groq from 'groq'
 import {type ReactNode, useCallback, useEffect, useState} from 'react'
 import {type SubmitHandler, useForm} from 'react-hook-form'

package/src/components/DialogTags/index.tsx

@@ -1,5 +1,5 @@
 import {Box} from '@sanity/ui'
-import type {DialogTagsProps} from '@types'
+import type {DialogTagsProps} from '../../types'
 import {type ReactNode, useCallback} from 'react'
 import {useDispatch} from 'react-redux'
 import {dialogActions} from '../../modules/dialog'

package/src/components/Dialogs/index.tsx

@@ -1,4 +1,4 @@
-import type {Dialog} from '@types'
+import type {Dialog} from '../../types'
 import React from 'react'
 import useTypedSelector from '../../hooks/useTypedSelector'
 import DialogAssetEdit from '../DialogAssetEdit'

package/src/components/FileAssetPreview/index.tsx

@@ -1,5 +1,5 @@
 import {Flex} from '@sanity/ui'
-import type {Asset} from '@types'
+import type {Asset} from '../../types'
 import React from 'react'
 import FileIcon from '../FileIcon'
 

package/src/components/FileIcon/index.tsx

@@ -2,7 +2,7 @@ import {Box, Flex, type Theme} from '@sanity/ui'
 import {type MouseEvent} from 'react'
 import {defaultStyles, FileIcon as ReactFileIcon} from 'react-file-icon'
 import type {DefaultExtensionType} from 'react-file-icon'
-import styled, {css} from 'styled-components'
+import {styled, css} from 'styled-components'
 
 type Props = {
   extension?: string

package/src/components/FormFieldInputLabel/index.tsx

@@ -1,7 +1,7 @@
 import {ErrorOutlineIcon} from '@sanity/icons'
 import {Box, Inline, Text, Tooltip} from '@sanity/ui'
 import React from 'react'
-import styled from 'styled-components'
+import {styled} from 'styled-components'
 
 type Props = {
   description?: string

package/src/components/Image/index.tsx

@@ -1,6 +1,6 @@
 import type {ThemeColorSchemeKey} from '@sanity/ui'
 import type {MouseEvent} from 'react'
-import styled, {css} from 'styled-components'
+import {styled, css} from 'styled-components'
 import {getSchemeColor} from '../../utils/getSchemeColor'
 
 type Props = {

package/src/components/SearchFacet/index.tsx

@@ -1,10 +1,10 @@
 import {CloseIcon} from '@sanity/icons'
 import {Box, Flex, Label, rem, Text, type Theme, type ThemeColorSchemeKey} from '@sanity/ui'
-import type {SearchFacetInputProps, WithId} from '@types'
+import type {SearchFacetInputProps, WithId} from '../../types'
 import {type ReactNode} from 'react'
 import {useDispatch} from 'react-redux'
 import {useColorScheme} from 'sanity'
-import styled, {css} from 'styled-components'
+import {styled, css} from 'styled-components'
 import {searchActions} from '../../modules/search'
 import {getSchemeColor} from '../../utils/getSchemeColor'
 
@@ -13,6 +13,7 @@ type Props = {
   facet: WithId<SearchFacetInputProps>
 }
 
+// @ts-expect-error - fix typings later
 const Container = styled(Box)(({scheme, theme}: {scheme: ThemeColorSchemeKey; theme: Theme}) => {
   return css`
     background: ${getSchemeColor(scheme, 'bg')};
@@ -33,7 +34,11 @@ const SearchFacet = (props: Props) => {
   }
 
   return (
-    <Container padding={[2, 2, 1]} scheme={scheme}>
+    <Container
+      padding={[2, 2, 1]}
+      // @ts-expect-error - fix typings later
+      scheme={scheme}
+    >
       <Flex align={['flex-start', 'flex-start', 'center']} direction={['column', 'column', 'row']}>
         {/* Title */}
         <Box paddingBottom={[3, 3, 0]} paddingLeft={1} paddingRight={2} paddingTop={[1, 1, 0]}>

package/src/components/SearchFacetNumber/index.tsx

@@ -5,7 +5,7 @@ import type {
   SearchFacetInputNumberProps,
   SearchFacetOperatorType,
   WithId
-} from '@types'
+} from '../../types'
 import React from 'react'
 import {useDispatch} from 'react-redux'
 import {operators} from '../../config/searchFacets'

package/src/components/SearchFacetSelect/index.tsx

@@ -5,7 +5,7 @@ import type {
   SearchFacetInputSelectProps,
   SearchFacetOperatorType,
   WithId
-} from '@types'
+} from '../../types'
 import React from 'react'
 import {useDispatch} from 'react-redux'
 

package/src/components/SearchFacetString/index.tsx

@@ -1,6 +1,6 @@
 import {SelectIcon} from '@sanity/icons'
 import {Box, Button, Menu, MenuButton, MenuDivider, MenuItem, TextInput} from '@sanity/ui'
-import type {SearchFacetInputStringProps, SearchFacetOperatorType, WithId} from '@types'
+import type {SearchFacetInputStringProps, SearchFacetOperatorType, WithId} from '../../types'
 import {type ChangeEvent} from 'react'
 import {useDispatch} from 'react-redux'
 

package/src/components/SearchFacetTags/index.tsx

@@ -5,7 +5,7 @@ import type {
   SearchFacetInputSearchableProps,
   SearchFacetOperatorType,
   WithId
-} from '@types'
+} from '../../types'
 import React from 'react'
 import {useDispatch} from 'react-redux'
 import Select from 'react-select'

package/src/components/SearchFacets/index.tsx

@@ -1,6 +1,6 @@
 import {Box, Flex, Inline, rem, type Theme} from '@sanity/ui'
 import React from 'react'
-import styled, {css} from 'styled-components'
+import {styled, css} from 'styled-components'
 
 import useTypedSelector from '../../hooks/useTypedSelector'
 import SearchFacetNumber from '../SearchFacetNumber'

package/src/components/SearchFacetsControl/index.tsx

@@ -1,6 +1,6 @@
 import {AddIcon} from '@sanity/icons'
 import {Button, Flex, Menu, MenuButton, MenuDivider, MenuGroup, MenuItem} from '@sanity/ui'
-import type {SearchFacetDivider, SearchFacetGroup, SearchFacetInputProps} from '@types'
+import type {SearchFacetDivider, SearchFacetGroup, SearchFacetInputProps} from '../../types'
 import React from 'react'
 import {useDispatch} from 'react-redux'
 import {FACETS} from '../../constants'

package/src/components/TableHeader/index.tsx

@@ -1,7 +1,7 @@
 import {Checkbox, Flex, Grid, type ThemeColorSchemeKey, useMediaIndex} from '@sanity/ui'
 import {type MouseEvent} from 'react'
 import {useDispatch} from 'react-redux'
-import styled, {css} from 'styled-components'
+import {styled, css} from 'styled-components'
 import {GRID_TEMPLATE_COLUMNS, PANEL_HEIGHT} from '../../constants'
 import {useAssetSourceActions} from '../../contexts/AssetSourceDispatchContext'
 import useTypedSelector from '../../hooks/useTypedSelector'
@@ -11,16 +11,19 @@ import {useColorScheme} from 'sanity'
 import {getSchemeColor} from '../../utils/getSchemeColor'
 
 // TODO: DRY
-const ContextActionContainer = styled(Flex)(({scheme}: {scheme: ThemeColorSchemeKey}) => {
-  return css`
-    cursor: pointer;
-    @media (hover: hover) and (pointer: fine) {
-      &:hover {
-        background: ${getSchemeColor(scheme, 'bg')};
+const ContextActionContainer = styled(Flex)(
+  // @ts-expect-error - fix typings later
+  ({scheme}: {scheme: ThemeColorSchemeKey}) => {
+    return css`
+      cursor: pointer;
+      @media (hover: hover) and (pointer: fine) {
+        &:hover {
+          background: ${getSchemeColor(scheme, 'bg')};
+        }
       }
-    }
-  `
-})
+    `
+  }
+)
 
 const TableHeader = () => {
   const {scheme} = useColorScheme()
@@ -75,6 +78,7 @@ const TableHeader = () => {
           align="center"
           justify="center"
           onClick={handleContextActionClick}
+          // @ts-expect-error - fix typings later
           scheme={scheme}
           style={{
             height: '100%',

package/src/components/TableRowAsset/index.tsx

@@ -24,7 +24,7 @@ import {
 } from 'react'
 import {useDispatch} from 'react-redux'
 import {WithReferringDocuments, useColorScheme} from 'sanity'
-import styled, {css} from 'styled-components'
+import {styled, css} from 'styled-components'
 import {GRID_TEMPLATE_COLUMNS} from '../../constants'
 import {useAssetSourceActions} from '../../contexts/AssetSourceDispatchContext'
 import useKeyPress from '../../hooks/useKeyPress'
@@ -48,6 +48,7 @@ type Props = {
 }
 
 const ContainerGrid = styled(Grid)(
+  // @ts-expect-error - fix typings later
   ({
     scheme,
     selected,
@@ -77,6 +78,7 @@ const ContainerGrid = styled(Grid)(
   }
 )
 
+// @ts-expect-error - fix typings later
 const ContextActionContainer = styled(Flex)(({scheme}: {scheme: ThemeColorSchemeKey}) => {
   return css`
     cursor: pointer;
@@ -179,6 +181,7 @@ const TableRowAsset = (props: Props) => {
   return (
     <ContainerGrid
       onClick={selected ? undefined : handleClick}
+      // @ts-expect-error - fix typings later
       scheme={scheme}
       selected={selected}
       style={{
@@ -193,6 +196,7 @@ const TableRowAsset = (props: Props) => {
       {/* Picked checkbox */}
       <ContextActionContainer
         onClick={handleContextActionClick}
+        // @ts-expect-error - fix typings later
         scheme={scheme}
         style={{
           alignItems: 'center',

package/src/components/Tag/index.tsx

@@ -1,9 +1,9 @@
 import {ArrowDownIcon, ArrowUpIcon, CloseIcon, EditIcon, SearchIcon, TrashIcon} from '@sanity/icons'
 import {Box, Button, Container, Flex, Text, Tooltip} from '@sanity/ui'
-import type {SearchFacetInputSearchableProps, TagActions, TagItem} from '@types'
+import type {SearchFacetInputSearchableProps, TagActions, TagItem} from '../../types'
 import {type ReactNode} from 'react'
 import {useDispatch} from 'react-redux'
-import styled from 'styled-components'
+import {styled} from 'styled-components'
 import {inputs} from '../../config/searchFacets'
 import {PANEL_HEIGHT} from '../../constants'
 import useTypedSelector from '../../hooks/useTypedSelector'

package/src/components/TagsVirtualized/index.tsx

@@ -1,5 +1,5 @@
 import {Flex, Label} from '@sanity/ui'
-import type {TagActions, TagItem} from '@types'
+import type {TagActions, TagItem} from '../../types'
 import {memo, useState} from 'react'
 import {Virtuoso} from 'react-virtuoso'
 import {PANEL_HEIGHT} from '../../constants'

package/src/components/UploadDropzone/index.tsx

@@ -3,7 +3,7 @@ import {Flex, Text} from '@sanity/ui'
 import {type ReactNode} from 'react'
 import {type DropEvent, type DropzoneOptions, useDropzone} from 'react-dropzone'
 import {useDispatch} from 'react-redux'
-import styled from 'styled-components'
+import {styled} from 'styled-components'
 import {useAssetSourceActions} from '../../contexts/AssetSourceDispatchContext'
 import {DropzoneDispatchProvider} from '../../contexts/DropzoneDispatchContext'
 import useTypedSelector from '../../hooks/useTypedSelector'

package/src/config/searchFacets.ts

@@ -3,7 +3,7 @@ import type {
   SearchFacetInputProps,
   SearchFacetName,
   SearchFacetOperators
-} from '@types'
+} from '../types'
 import groq from 'groq'
 
 export const divider: SearchFacetDivider = {type: 'divider'}

package/src/constants.ts

@@ -3,7 +3,7 @@ import type {
   SearchFacetDivider,
   SearchFacetGroup,
   OrderDirection
-} from '@types'
+} from './types'
 import {divider, inputs} from './config/searchFacets'
 
 // Sort order dropdown options

package/src/contexts/ToolOptionsContext.tsx

@@ -1,4 +1,4 @@
-import type {MediaToolOptions} from '@types'
+import type {MediaToolOptions} from '../types'
 import {type PropsWithChildren, createContext, useContext, useMemo} from 'react'
 import type {DropzoneOptions} from 'react-dropzone'
 

package/src/index.ts

@@ -1,2 +1,2 @@
 export {media, mediaAssetSource} from './plugin'
-export type {MediaToolOptions} from '@types'
+export type {MediaToolOptions} from './types'

package/src/modules/assets/index.ts

@@ -10,7 +10,7 @@ import type {
   Order,
   OrderDirection,
   Tag
-} from '@types'
+} from '../../types'
 import groq from 'groq'
 import {nanoid} from 'nanoid'
 import type {Selector} from 'react-redux'

package/src/modules/dialog/index.ts

@@ -1,5 +1,5 @@
 import {createSlice, type PayloadAction} from '@reduxjs/toolkit'
-import type {AssetItem, Dialog, MyEpic, Tag} from '@types'
+import type {AssetItem, Dialog, MyEpic, Tag} from '../../types'
 import pluralize from 'pluralize'
 import {ofType} from 'redux-observable'
 import {empty, of} from 'rxjs'

package/src/modules/notifications/index.ts

@@ -1,5 +1,5 @@
 import {type PayloadAction, createSlice} from '@reduxjs/toolkit'
-import type {ImageAsset, MyEpic} from '@types'
+import type {ImageAsset, MyEpic} from '../../types'
 import pluralize from 'pluralize'
 import {ofType} from 'redux-observable'
 import {of} from 'rxjs'

package/src/modules/search/index.ts

@@ -1,5 +1,5 @@
 import {type PayloadAction, createSelector, createSlice} from '@reduxjs/toolkit'
-import type {MyEpic, SearchFacetInputProps, SearchFacetOperatorType, WithId} from '@types'
+import type {MyEpic, SearchFacetInputProps, SearchFacetOperatorType, WithId} from '../../types'
 import {empty, of} from 'rxjs'
 import {filter, mergeMap, withLatestFrom} from 'rxjs/operators'
 import {uuid} from '@sanity/uuid'

package/src/modules/selectors.ts

@@ -1,5 +1,5 @@
 import {createSelector} from '@reduxjs/toolkit'
-import type {CardAssetData, CardUploadData} from '@types'
+import type {CardAssetData, CardUploadData} from '../types'
 
 import type {RootReducerState} from './types'
 

package/src/modules/tags/index.ts

@@ -1,6 +1,6 @@
 import {createSelector, createSlice, type PayloadAction} from '@reduxjs/toolkit'
 import type {ClientError, Transaction} from '@sanity/client'
-import type {Asset, HttpError, MyEpic, TagSelectOption, Tag, TagItem} from '@types'
+import type {Asset, HttpError, MyEpic, TagSelectOption, Tag, TagItem} from '../../types'
 import groq from 'groq'
 import type {Selector} from 'react-redux'
 import {ofType} from 'redux-observable'

package/src/modules/uploads/index.ts

@@ -1,6 +1,6 @@
 import {createSelector, createSlice, type PayloadAction} from '@reduxjs/toolkit'
 import type {ClientError, SanityAssetDocument, SanityImageAssetDocument} from '@sanity/client'
-import type {HttpError, MyEpic, SanityUploadProgressEvent, UploadItem} from '@types'
+import type {HttpError, MyEpic, SanityUploadProgressEvent, UploadItem} from '../../types'
 import groq from 'groq'
 import type {Selector} from 'react-redux'
 import {empty, merge, of} from 'rxjs'

package/src/operators/checkTagName.ts

@@ -1,5 +1,5 @@
 import type {SanityClient} from '@sanity/client'
-import type {HttpError} from '@types'
+import type {HttpError} from '../types'
 import groq from 'groq'
 import {from, Observable, of, throwError} from 'rxjs'
 import {mergeMap} from 'rxjs/operators'

package/src/plugin.tsx

@@ -4,7 +4,7 @@ import {ImageIcon} from '@sanity/icons'
 import FormBuilderTool from './components/FormBuilderTool'
 import Tool from './components/Tool'
 import mediaTag from './schemas/tag'
-import type {MediaToolOptions} from '@types'
+import type {MediaToolOptions} from './types'
 import {ToolOptionsProvider} from './contexts/ToolOptionsContext'
 
 const plugin = {