@sanity/embeddings-index-ui 2.0.0 → 2.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sanity/embeddings-index-ui",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "Various Sanity Studio plugins for integrating with the embeddings index API",
   "keywords": [
     "sanity",
@@ -12,27 +12,21 @@
   },
   "repository": {
     "type": "git",
-    "url": "git+ssh://git@github.com/sanity-io/embeddings-index-ui.git"
+    "url": "git@github.com:sanity-io/embeddings-index-ui.git"
   },
   "license": "MIT",
   "author": "Sanity <hello@sanity.io>",
+  "sideEffects": false,
+  "type": "commonjs",
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
       "source": "./src/index.ts",
-      "require": "./dist/index.js",
-      "node": {
-        "module": "./dist/index.esm.js",
-        "import": "./dist/index.cjs.mjs"
-      },
-      "import": "./dist/index.esm.js",
-      "default": "./dist/index.esm.js"
+      "import": "./dist/index.mjs",
+      "default": "./dist/index.js"
     },
     "./package.json": "./package.json"
   },
   "main": "./dist/index.js",
-  "module": "./dist/index.esm.js",
-  "source": "./src/index.ts",
   "types": "./dist/index.d.ts",
   "files": [
     "dist",
@@ -41,56 +35,58 @@
     "v2-incompatible.js"
   ],
   "scripts": {
-    "build": "run-s clean && plugin-kit verify-package --silent && pkg-utils build --strict && pkg-utils --strict",
+    "build": "plugin-kit verify-package --silent && pkg-utils build --strict --check --clean",
     "clean": "rimraf dist",
     "format": "prettier --write --cache --ignore-unknown .",
     "link-watch": "plugin-kit link-watch",
     "lint": "eslint .",
-    "prepublishOnly": "run-s build",
+    "prepublishOnly": "npm run build",
     "watch": "pkg-utils watch --strict",
     "prepare": "husky install"
   },
   "dependencies": {
-    "@sanity/icons": "^2.4.1",
-    "@sanity/incompatible-plugin": "^1.0.4",
-    "@sanity/ui": "^2.0.0"
+    "@sanity/icons": "^3.7.0",
+    "@sanity/incompatible-plugin": "^1.0.5",
+    "@sanity/ui": "^2.15.14"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.7.1",
     "@commitlint/config-conventional": "^17.7.0",
-    "@sanity/pkg-utils": "^2.4.8",
-    "@sanity/plugin-kit": "^3.1.10",
-    "@sanity/semantic-release-preset": "^4.1.4",
-    "@types/react": "^18.2.21",
-    "@typescript-eslint/eslint-plugin": "^6.5.0",
-    "@typescript-eslint/parser": "^6.5.0",
-    "eslint": "^8.48.0",
-    "eslint-config-prettier": "^9.0.0",
-    "eslint-config-sanity": "^6.0.0",
-    "eslint-plugin-prettier": "^5.0.0",
-    "eslint-plugin-react": "^7.33.2",
-    "eslint-plugin-react-hooks": "^4.6.0",
+    "@sanity/pkg-utils": "^7.2.2",
+    "@sanity/plugin-kit": "^4.0.19",
+    "@sanity/semantic-release-preset": "^5.0.0",
+    "@types/react": "^19.1.2",
+    "@typescript-eslint/eslint-plugin": "^8.31.1",
+    "@typescript-eslint/parser": "^8.31.1",
+    "eslint": "^8.57.1",
+    "eslint-config-prettier": "^10.1.2",
+    "eslint-config-sanity": "^7.1.4",
+    "eslint-plugin-prettier": "^5.2.6",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^5.2.0",
     "husky": "^8.0.3",
     "lint-staged": "^14.0.1",
     "npm-run-all": "^4.1.5",
-    "prettier": "^3.0.3",
-    "prettier-plugin-packagejson": "^2.4.5",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
+    "prettier": "^3.5.3",
+    "prettier-plugin-packagejson": "^2.5.10",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
     "react-is": "^18.2.0",
     "rimraf": "^5.0.1",
-    "sanity": "^3.16.1",
+    "sanity": "^3.87.1",
     "semantic-release": "^21.1.1",
-    "styled-components": "^5.3.11",
-    "typescript": "^5.2.2"
+    "styled-components": "^6.1.17",
+    "typescript": "^5.8.3"
   },
   "peerDependencies": {
-    "react": "^18",
-    "sanity": "^3.14"
+    "react": "^18 || ^19",
+    "sanity": "^3.80"
   },
   "engines": {
-    "node": ">=14"
+    "node": ">=18"
   },
+  "module": "./dist/index.mjs",
+  "browserslist": "extends @sanity/browserslist-config",
   "publishConfig": {
     "access": "public"
   }

package/src/api/embeddingsApiHooks.ts

@@ -1,5 +1,5 @@
-import {SanityClient, useClient} from 'sanity'
 import {useMemo} from 'react'
+import {SanityClient, useClient} from 'sanity'
 
 export function useApiClient(): SanityClient {
   const client = useClient({apiVersion: 'vX'})

package/src/api/isEnabled.tsx

@@ -1,6 +1,7 @@
-import {useProjectId} from 'sanity'
-import {createContext, PropsWithChildren, useContext, useEffect, useState} from 'react'
 import {Card, Text} from '@sanity/ui'
+import {createContext, PropsWithChildren, useContext, useEffect, useState} from 'react'
+import {useProjectId} from 'sanity'
+
 import {useApiClient} from './embeddingsApiHooks'
 
 export type FeatureStatus = 'enabled' | 'disabled' | 'loading' | 'error'
@@ -28,7 +29,7 @@ export function useIsFeatureEnabled() {
   return status
 }
 
-export function FeatureEnabledProvider(props: PropsWithChildren<{}>) {
+export function FeatureEnabledProvider(props: PropsWithChildren) {
   const status = useIsFeatureEnabled()
   return (
     <FeatureEnabledContext.Provider value={status}>{props.children}</FeatureEnabledContext.Provider>

package/src/embeddingsIndexDashboard/EmbeddingsIndexTool.tsx

@@ -1,12 +1,13 @@
+import {AddIcon, UndoIcon} from '@sanity/icons'
 import {Box, Button, Card, Flex, Heading, Spinner, Stack} from '@sanity/ui'
 import {useCallback, useEffect, useState} from 'react'
-import {AddIcon, UndoIcon} from '@sanity/icons'
+
 import {deleteIndex, getIndexes, IndexState, NamedIndex} from '../api/embeddingsApi'
-import {EditIndexDialog} from './IndexEditor'
-import {IndexList} from './IndexList'
-import {IndexInfo} from './IndexInfo'
 import {useApiClient} from '../api/embeddingsApiHooks'
 import {FeatureDisabledNotice, FeatureError, useIsFeatureEnabled} from '../api/isEnabled'
+import {EditIndexDialog} from './IndexEditor'
+import {IndexInfo} from './IndexInfo'
+import {IndexList} from './IndexList'
 
 export function EmbeddingsIndexTool() {
   const featureState = useIsFeatureEnabled()

package/src/embeddingsIndexDashboard/IndexEditor.tsx

@@ -1,8 +1,9 @@
-import {IndexState, NamedIndex} from '../api/embeddingsApi'
-import {useSchema} from 'sanity'
-import {FormEvent, useCallback, useEffect, useId, useRef, useState} from 'react'
-import {Box, Button, Card, Dialog, Spinner, Stack, Text} from '@sanity/ui'
 import {AddIcon} from '@sanity/icons'
+import {Box, Button, Card, Dialog, Spinner, Stack, Text} from '@sanity/ui'
+import {FormEvent, useCallback, useEffect, useId, useRef, useState} from 'react'
+import {useSchema} from 'sanity'
+
+import {IndexState, NamedIndex} from '../api/embeddingsApi'
 import {useApiClient} from '../api/embeddingsApiHooks'
 import {useDefaultIndex} from './hooks'
 import {IndexFormInput} from './IndexFormInput'
@@ -107,6 +108,7 @@ export function IndexEditor(props: {
             onSubmit(response.index)
           }
         })
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         .catch((err: any) => {
           console.error(err)
           setErrors([err.message])

package/src/embeddingsIndexDashboard/IndexFormInput.tsx

@@ -1,6 +1,7 @@
-import {NamedIndex} from '../api/embeddingsApi'
+import {Box, Label, Stack, Text, TextArea, TextInput} from '@sanity/ui'
 import {Dispatch, FormEvent, SetStateAction, useCallback, useId} from 'react'
-import {Box, Label, Stack, TextArea, TextInput, Text} from '@sanity/ui'
+
+import {NamedIndex} from '../api/embeddingsApi'
 
 export interface IndexFormInputProps {
   index: Partial<NamedIndex>

package/src/embeddingsIndexDashboard/IndexInfo.tsx

@@ -1,3 +1,4 @@
+import {EllipsisVerticalIcon, TrashIcon} from '@sanity/icons'
 import {
   Box,
   Button,
@@ -10,11 +11,11 @@ import {
   Stack,
   Text,
 } from '@sanity/ui'
-import {EllipsisVerticalIcon, TrashIcon} from '@sanity/icons'
+import {useCallback} from 'react'
+
+import {IndexState} from '../api/embeddingsApi'
 import {IndexEditor} from './IndexEditor'
 import {QueryIndex} from './QueryIndex'
-import {IndexState} from '../api/embeddingsApi'
-import {useCallback} from 'react'
 
 export interface IndexInfoProps {
   selectedIndex: IndexState

package/src/embeddingsIndexDashboard/IndexList.tsx

@@ -1,7 +1,8 @@
 import {Box, Button, Card, Flex, Label, Stack, Text} from '@sanity/ui'
-import {IndexState} from '../api/embeddingsApi'
 import {useCallback} from 'react'
 
+import {IndexState} from '../api/embeddingsApi'
+
 export interface IndexListProps {
   loading: boolean
   selectedIndex?: IndexState

package/src/embeddingsIndexDashboard/QueryIndex.tsx

@@ -1,8 +1,9 @@
 import {useCallback, useMemo} from 'react'
-import {SemanticSearchAutocomplete} from '../referenceInput/SemanticSearchAutocomplete'
-import {EmbeddingsIndexConfig} from '../schemas/typeDefExtensions'
 import {useRouter} from 'sanity/router'
+
 import {QueryResult} from '../api/embeddingsApi'
+import {SemanticSearchAutocomplete} from '../referenceInput/SemanticSearchAutocomplete'
+import {EmbeddingsIndexConfig} from '../schemas/typeDefExtensions'
 
 export function QueryIndex(props: {indexName: string}) {
   const {indexName} = props

package/src/embeddingsIndexDashboard/dashboardPlugin.ts

@@ -1,5 +1,6 @@
-import {definePlugin, Tool} from 'sanity'
 import {EarthGlobeIcon} from '@sanity/icons'
+import {definePlugin, Tool} from 'sanity'
+
 import {EmbeddingsIndexTool} from './EmbeddingsIndexTool'
 
 export const embeddingsIndexTool: Tool = {

package/src/embeddingsIndexDashboard/hooks.ts

@@ -1,5 +1,6 @@
-import {ObjectSchemaType, Schema} from 'sanity'
 import {useMemo} from 'react'
+import {ObjectSchemaType, Schema} from 'sanity'
+
 import {isType} from '../utils/types'
 
 const defaultProjection = '{...}'

package/src/index.ts

@@ -1,6 +1,7 @@
 import './schemas/typeDefExtensions'
-import {embeddingsIndexReferenceInput} from './referenceInput/referencePlugin'
+
 import {embeddingsIndexDashboard} from './embeddingsIndexDashboard/dashboardPlugin'
+import {embeddingsIndexReferenceInput} from './referenceInput/referencePlugin'
 
 export {embeddingsIndexReferenceInput}
 

package/src/preview/DocumentPreview.tsx

@@ -1,5 +1,7 @@
+import {ErrorOutlineIcon} from '@sanity/icons'
+import {Box, Button, ButtonProps, Card} from '@sanity/ui'
 import {CSSProperties, useMemo} from 'react'
-import {useMemoObservable} from 'react-rx'
+import {useObservable} from 'react-rx'
 import {
   DefaultPreview,
   getPreviewStateObservable,
@@ -11,8 +13,6 @@ import {
   useSchema,
 } from 'sanity'
 import {useIntentLink} from 'sanity/router'
-import {Box, Button, ButtonProps, Card} from '@sanity/ui'
-import {ErrorOutlineIcon} from '@sanity/icons'
 
 interface ResultPreviewProps {
   documentId: string
@@ -80,12 +80,20 @@ function DocumentPreviewInner({
 }: ResultPreviewProps & {schemaType: SchemaType} & ButtonProps) {
   const documentPreviewStore = useDocumentPreviewStore()
 
-  // NOTE: this emits sync so can never be null
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-  const {draft, published, isLoading} = useMemoObservable(
-    () => getPreviewStateObservable(documentPreviewStore, schemaType, documentId, ''),
+  const previewStateObservable = useMemo(
+    () => getPreviewStateObservable(documentPreviewStore, schemaType, documentId),
     [documentId, documentPreviewStore, schemaType],
-  )!
+  )
+
+  const {
+    snapshot,
+    original,
+    isLoading: previewIsLoading,
+  } = useObservable(previewStateObservable, {
+    snapshot: null,
+    isLoading: true,
+    original: null,
+  })
 
   const sanityDocument = useMemo(() => {
     return {
@@ -105,11 +113,11 @@ function DocumentPreviewInner({
   const preview = (
     <SanityDefaultPreview
       {...getPreviewValueWithFallback({
-        draft,
-        published,
-        value: sanityDocument,
+        snapshot,
+        original,
+        fallback: sanityDocument,
       })}
-      isPlaceholder={isLoading ?? true}
+      isPlaceholder={previewIsLoading ?? true}
       layout="default"
       icon={schemaType?.icon}
     />

package/src/referenceInput/SemanticSearchAutocomplete.tsx

@@ -1,6 +1,5 @@
 /* eslint-disable max-nested-callbacks */
 import {Autocomplete, AutocompleteOpenButtonProps, Box, Button, Flex, Text} from '@sanity/ui'
-import {DocumentPreview} from '../preview/DocumentPreview'
 import {
   FocusEventHandler,
   forwardRef,
@@ -11,10 +10,12 @@ import {
   useRef,
   useState,
 } from 'react'
-import {EmbeddingsIndexConfig} from '../schemas/typeDefExtensions'
-import {queryIndex, QueryResult} from '../api/embeddingsApi'
 import {typed} from 'sanity'
+
+import {queryIndex, QueryResult} from '../api/embeddingsApi'
 import {useApiClient} from '../api/embeddingsApiHooks'
+import {DocumentPreview} from '../preview/DocumentPreview'
+import {EmbeddingsIndexConfig} from '../schemas/typeDefExtensions'
 
 export interface SemanticSearchAutocompleteProps {
   indexConfig: EmbeddingsIndexConfig
@@ -43,6 +44,7 @@ const NO_FILTER = () => true
 
 export const SemanticSearchAutocomplete = forwardRef(function SemanticSearchAutocomplete(
   props: SemanticSearchAutocompleteProps,
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   ref: any,
 ) {
   const {
@@ -78,7 +80,7 @@ export const SemanticSearchAutocomplete = forwardRef(function SemanticSearchAuto
 
       queryIndex(
         {
-          query: queryString.trim().length ? queryString : getEmptySearchValue() ?? '',
+          query: queryString.trim().length ? queryString : (getEmptySearchValue() ?? ''),
           indexName,
           maxResults,
           filter: {
@@ -91,6 +93,7 @@ export const SemanticSearchAutocomplete = forwardRef(function SemanticSearchAuto
           if (queryRef.current === queryString) {
             setSearching(false)
             setOptions([])
+            setOptions([])
             const resultOptions = result
               .filter((hit) => (filterResult ? filterResult(hit) : true))
               .map((r) => typed<Option>({result: r, value: r.value.documentId}))

package/src/referenceInput/SemanticSearchReferenceInput.tsx

@@ -1,3 +1,6 @@
+import {EarthGlobeIcon, LinkIcon} from '@sanity/icons'
+import {Box, Button, Flex, Spinner} from '@sanity/ui'
+import {useCallback, useEffect, useMemo, useRef, useState} from 'react'
 import {
   ObjectInputProps,
   ReferenceBaseOptions,
@@ -6,14 +9,12 @@ import {
   setIfMissing,
   unset,
 } from 'sanity'
-import {Box, Button, Flex, Spinner} from '@sanity/ui'
-import {EarthGlobeIcon, LinkIcon} from '@sanity/icons'
-import {useCallback, useEffect, useMemo, useRef, useState} from 'react'
 import {useDocumentPane} from 'sanity/desk'
+
 import {QueryResult} from '../api/embeddingsApi'
-import {publicId} from '../utils/id'
 import {FeatureDisabledNotice, FeatureError, useIsFeatureEnabledContext} from '../api/isEnabled'
 import {EmbeddingsIndexConfig} from '../schemas/typeDefExtensions'
+import {publicId} from '../utils/id'
 import {SemanticSearchAutocomplete} from './SemanticSearchAutocomplete'
 
 function useEmeddingsConfig(

package/src/referenceInput/referencePlugin.tsx

@@ -1,8 +1,9 @@
 import {definePlugin, isObjectInputProps, ObjectInputProps, ReferenceSchemaType} from 'sanity'
-import {SemanticSearchReferenceInput} from './SemanticSearchReferenceInput'
-import {isType} from '../utils/types'
+
 import {FeatureEnabledProvider} from '../api/isEnabled'
 import {EmbeddingsIndexConfig} from '../schemas/typeDefExtensions'
+import {isType} from '../utils/types'
+import {SemanticSearchReferenceInput} from './SemanticSearchReferenceInput'
 
 export const embeddingsIndexReferenceInput = definePlugin<EmbeddingsIndexConfig | void>(
   (defaultConfig) => {

package/dist/index.cjs.mjs

@@ -1,8 +0,0 @@
-import cjs from './index.js';
-
-export const deleteIndex = cjs.deleteIndex;
-export const embeddingsIndexDashboard = cjs.embeddingsIndexDashboard;
-export const embeddingsIndexReferenceInput = cjs.embeddingsIndexReferenceInput;
-export const getIndexes = cjs.getIndexes;
-export const queryIndex = cjs.queryIndex;
-