sanity-plugin-iconify 1.1.1 → 2.0.0

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/lib/api.ts","../src/combobox/iconify-combobox.styles.tsx","../src/combobox/search-input.tsx","../src/combobox/search-result.tsx","../src/combobox/unset-button.tsx","../src/combobox/iconify-combobox.tsx","../src/lib/query-client.tsx","../src/lib/use-pretty-icon-name.ts","../src/iconify-input.tsx","../src/iconify-preview.tsx","../src/iconify-plugin.tsx"],"sourcesContent":["import { IconifyInfo } from '@iconify/types';\nimport { keepPreviousData, useQuery, useQueryClient } from '@tanstack/react-query';\nimport { useCallback, useState } from 'react';\nimport { useDebounce } from 'use-debounce';\nimport { IconifySearchResult } from './types';\n\nconst BASE_API_URL = 'https://api.iconify.design';\n\nfunction fetchJson<T>({ url, signal }: { url: string | URL; signal?: AbortSignal }): Promise<T> {\n  return fetch(url, { signal })\n    .then((response) => {\n      if (!response.ok) {\n        throw new Error(`Network error: status ${response.status}`);\n      }\n\n      return response.json();\n    })\n    .then(\n      (result) => result as T,\n      (error) => {\n        if (error instanceof Error) {\n          throw error;\n        } else {\n          console.error(`Unknown error: ${error}`);\n          throw new Error('Something went wrong');\n        }\n      },\n    );\n}\n\nexport function useSearch({ collections }: { collections: string[] | null }) {\n  const queryClient = useQueryClient();\n  const [term, setTerm] = useState('');\n  const [debouncedTerm, setDebouncedTerm] = useDebounce(term, 500);\n\n  const updateTerm = useCallback(\n    (newTerm: string, updateImmediately = false) => {\n      setTerm(newTerm);\n\n      if (updateImmediately) {\n        setDebouncedTerm(newTerm);\n      }\n    },\n    [setDebouncedTerm],\n  );\n\n  const { isLoading, isError, error, data, isPlaceholderData } = useQuery<string[], Error>({\n    queryKey: ['search', collections, debouncedTerm],\n    queryFn: async ({ signal }) => {\n      const url = new URL(`/search`, BASE_API_URL);\n\n      url.searchParams.append('query', debouncedTerm);\n      url.searchParams.append('limit', '60');\n\n      if (collections) {\n        url.searchParams.append('prefixes', collections.join(','));\n      }\n\n      const result = debouncedTerm ? await fetchJson<IconifySearchResult>({ url, signal }) : null;\n\n      if (result) {\n        // Cache the info for each collection\n        Object.entries(result.collections).forEach(([prefix, info]) => {\n          queryClient.setQueryData<IconifyInfo>(['iconSetInfo', prefix], info);\n        });\n      }\n\n      return result?.icons ?? [];\n    },\n    enabled: debouncedTerm.length > 0,\n    placeholderData: keepPreviousData,\n    staleTime: 5 * 60 * 1000, // 5 minutes\n  });\n\n  return {\n    term,\n    setTerm: updateTerm,\n    debouncedTerm,\n    isLoading,\n    isError,\n    error,\n    data,\n    isPreviousData: isPlaceholderData,\n  };\n}\n\nexport function useIconSetInfo({ prefix }: { prefix?: string | null }) {\n  return useQuery<IconifyInfo | null, Error>({\n    queryKey: ['iconSetInfo', prefix],\n    queryFn: async ({ signal }) => {\n      if (!prefix) return null;\n\n      const url = new URL('/collection', BASE_API_URL);\n\n      url.searchParams.append('prefix', prefix);\n      url.searchParams.append('info', 'true');\n\n      const result = await fetchJson<{ info: IconifyInfo }>({ url, signal });\n\n      return result?.info ?? null;\n    },\n    staleTime: Infinity,\n  });\n}\n","import { Box, Card, Grid, Text } from '@sanity/ui';\nimport { ReactNode } from 'react';\nimport styled from 'styled-components';\n\nexport const ComboboxWrapper = styled(Grid)`\n  grid-template-columns: 1fr min-content;\n  position: relative;\n`;\n\nexport const OptionsWrapper = styled(Box)`\n  box-sizing: border-box;\n  padding: 0.5rem;\n\n  & [role='listbox'] {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(min(100%, 2.5rem), 1fr));\n    gap: 0.5rem;\n    list-style: none;\n    margin: 0;\n    padding: 0;\n\n    @media (min-width: 650px) {\n      grid-template-columns: repeat(10, minmax(min(100%, 2.5rem), 1fr));\n    }\n  }\n\n  & [role='option'] {\n    display: grid;\n    place-items: center;\n\n    & button {\n      aspect-ratio: 1;\n      cursor: pointer;\n      width: 100%;\n\n      & > [data-ui='Box'] {\n        display: flex;\n      }\n    }\n  }\n`;\n\nexport function MessageWrapper({ children }: { children: ReactNode }) {\n  return (\n    <Card padding={4}>\n      <Text align=\"center\" muted>\n        {children}\n      </Text>\n    </Card>\n  );\n}\n","import { Combobox } from '@headlessui/react';\nimport { Icon } from '@iconify/react';\nimport { TextInput } from '@sanity/ui';\nimport { ChangeEventHandler, forwardRef } from 'react';\n\n// ------------ //\n// SEARCH INPUT //\n// ------------ //\n\ninterface SearchInputProps {\n  term: string;\n  selectedIcon: string | null;\n  onChange: ChangeEventHandler<HTMLInputElement>;\n}\n\nexport const SearchInput = forwardRef<HTMLInputElement, SearchInputProps>((props, ref) => {\n  const { term, selectedIcon, onChange } = props;\n\n  return (\n    <Combobox.Input\n      as={TextInput}\n      ref={ref}\n      inputMode=\"search\"\n      value={term}\n      onChange={onChange}\n      icon={selectedIcon ? <Icon icon={selectedIcon} /> : null}\n      placeholder={selectedIcon ? 'Search and replace selected icon...' : 'Search for an icon...'}\n    />\n  );\n});\n\nSearchInput.displayName = 'SearchInput';\n","import { Combobox } from '@headlessui/react';\nimport { Icon } from '@iconify/react';\nimport { Button } from '@sanity/ui';\nimport { MessageWrapper } from './iconify-combobox.styles';\n\n// -------------- //\n// SEARCH RESULTS //\n// -------------- //\n\nexport interface SearchResultsProps {\n  state: 'initial' | 'loading' | 'error' | 'empty' | 'data' | 'stale';\n  data?: string[];\n}\n\nexport function SearchResults(props: SearchResultsProps) {\n  const { state, data } = props;\n\n  if (state === 'initial') {\n    return <MessageWrapper>Search for icons</MessageWrapper>;\n  }\n\n  if (state === 'loading') {\n    return <MessageWrapper>Searching...</MessageWrapper>;\n  }\n\n  if (state === 'error') {\n    return <MessageWrapper>Something went wrong...</MessageWrapper>;\n  }\n\n  if (state === 'empty') {\n    return <MessageWrapper>No icons found</MessageWrapper>;\n  }\n\n  return (\n    <Combobox.Options style={{ opacity: state === 'stale' ? 0.5 : 1 }}>\n      {data!.map((icon) => (\n        <Combobox.Option key={icon} value={icon}>\n          {({ active }) => (\n            <Button padding={3} mode=\"bleed\" selected={active}>\n              <Icon icon={icon} width=\"100%\" height=\"100%\" />\n            </Button>\n          )}\n        </Combobox.Option>\n      ))}\n    </Combobox.Options>\n  );\n}\n","import { TrashIcon } from '@sanity/icons';\nimport { Button, Card } from '@sanity/ui';\n\n// ------------ //\n// UNSET BUTTON //\n// ------------ //\n\ninterface UnsetButtonProps {\n  onUnset: () => void;\n}\n\nexport function UnsetButton(props: UnsetButtonProps) {\n  const { onUnset } = props;\n\n  return (\n    <Card border borderLeft={false} padding={1} display=\"flex\">\n      <Button icon={<TrashIcon />} onClick={onUnset} mode=\"bleed\" fontSize={1} padding={2} />\n    </Card>\n  );\n}\n","import { Combobox } from '@headlessui/react';\nimport { Popover, useToast } from '@sanity/ui';\nimport { ChangeEventHandler, useCallback, useEffect, useId, useRef } from 'react';\nimport { match } from 'ts-pattern';\nimport { useSearch } from '../lib/api';\nimport { ComboboxWrapper, OptionsWrapper } from './iconify-combobox.styles';\nimport { SearchInput } from './search-input';\nimport { SearchResults, SearchResultsProps } from './search-result';\nimport { UnsetButton } from './unset-button';\n\nexport interface IconifyComboboxProps {\n  selectedIcon: string | null;\n  onSelect: (newValue: string) => void;\n  collections: string[] | null;\n}\n\nexport function IconifyCombobox(props: IconifyComboboxProps) {\n  const { selectedIcon, onSelect: pushSelection, collections } = props;\n\n  const id = useId();\n  const toast = useToast();\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const { term, setTerm, debouncedTerm, isLoading, isError, error, data, isPreviousData } =\n    useSearch({\n      collections,\n    });\n\n  const handleTermChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n    (event) => setTerm(event.target.value),\n    [setTerm],\n  );\n\n  const handleSelect = useCallback(\n    (icon: string) => {\n      pushSelection(icon);\n      setTerm('', true);\n    },\n    [pushSelection, setTerm],\n  );\n\n  const handleUnset = useCallback(() => handleSelect(''), [handleSelect]);\n\n  useEffect(() => {\n    if (isError) {\n      console.error('Iconify input error:', error);\n\n      toast.push({\n        id,\n        status: 'error',\n        title: 'Iconify input error',\n        description: error?.message,\n      });\n    }\n  }, [error, id, isError, toast]);\n\n  return (\n    <ComboboxWrapper>\n      <Combobox onChange={handleSelect}>\n        {({ open }) => (\n          <>\n            <SearchInput\n              ref={inputRef}\n              term={term}\n              selectedIcon={selectedIcon}\n              onChange={handleTermChange}\n            />\n\n            <Popover\n              open={open}\n              placement=\"bottom\"\n              arrow={false}\n              matchReferenceWidth\n              portal\n              constrainSize\n              referenceElement={inputRef.current}\n              content={\n                <OptionsWrapper>\n                  <SearchResults\n                    state={match<boolean>(true)\n                      .returnType<SearchResultsProps['state']>()\n                      .with(isLoading, () => 'loading')\n                      .with(!debouncedTerm, () => 'initial')\n                      .with(isError, () => 'error')\n                      .with(!data || data.length === 0, () => 'empty')\n                      .with(isPreviousData, () => 'stale')\n                      .otherwise(() => 'data')}\n                    data={data}\n                  />\n                </OptionsWrapper>\n              }\n            />\n          </>\n        )}\n      </Combobox>\n\n      {selectedIcon ? <UnsetButton onUnset={handleUnset} /> : null}\n    </ComboboxWrapper>\n  );\n}\n","import {\n  QueryClient,\n  QueryClientProvider as ReactQueryClientProvider,\n} from '@tanstack/react-query';\nimport { ReactNode } from 'react';\n\nexport const queryClient = new QueryClient();\n\nexport function QueryClientProvider(props: { children: ReactNode }) {\n  return <ReactQueryClientProvider client={queryClient}>{props.children}</ReactQueryClientProvider>;\n}\n","import { IconifyIconName, stringToIcon } from '@iconify/utils';\nimport { sentenceCase } from 'change-case';\nimport { useMemo } from 'react';\nimport { useIconSetInfo } from './api';\n\ninterface UsePrettyIconNameProps {\n  name?: string | null;\n  iconMeta?: IconifyIconName | null;\n}\n\nexport function usePrettyIconName(props: UsePrettyIconNameProps) {\n  const { name } = props;\n  const iconMeta = useMemo(\n    () => props.iconMeta ?? (name ? stringToIcon(name) : null),\n    [name, props.iconMeta],\n  );\n  const iconSetInfo = useIconSetInfo({ prefix: iconMeta?.prefix ?? null });\n\n  return useMemo(\n    () =>\n      iconMeta\n        ? {\n            name: sentenceCase(iconMeta.name),\n            collection: iconSetInfo.data?.name ?? iconMeta.prefix,\n          }\n        : null,\n    [iconMeta, iconSetInfo.data?.name],\n  );\n}\n","import { Flex, RootTheme, Stack, Text, ThemeProvider, studioTheme, useTheme } from '@sanity/ui';\nimport { useCallback, useMemo } from 'react';\nimport { ObjectInputProps, set, unset } from 'sanity';\nimport { IconifyCombobox } from './combobox';\nimport { QueryClientProvider } from './lib/query-client';\nimport { IconOptions, IconifyPluginConfig } from './lib/types';\nimport { usePrettyIconName } from './lib/use-pretty-icon-name';\n\n// -------------- //\n// ICONIFY INPUT //\n// -------------- //\n\ninterface IconifyInputProps extends ObjectInputProps {\n  config: IconifyPluginConfig;\n}\n\nexport function IconifyInput(props: IconifyInputProps) {\n  const { config, value, onChange: pushChange, schemaType } = props;\n\n  const selectedIcon: string | null = value?.name ?? null;\n\n  const options: IconOptions = schemaType.options;\n  const collections =\n    (!!options?.collections?.length && options.collections) ||\n    (!!config?.collections?.length && config.collections) ||\n    null;\n  const showName = options?.showName ?? config?.showName ?? false;\n\n  const parentTheme = useTheme();\n  const theme: RootTheme = useMemo(\n    () => (parentTheme ? { ...parentTheme.sanity, color: studioTheme.color } : studioTheme),\n    [parentTheme],\n  );\n\n  const handleSelect = useCallback(\n    (icon: string) => {\n      pushChange(icon === '' ? unset() : set(icon, ['name']));\n    },\n    [pushChange],\n  );\n\n  return (\n    <QueryClientProvider>\n      <ThemeProvider theme={theme}>\n        <Stack space={2}>\n          <IconifyCombobox\n            selectedIcon={selectedIcon}\n            onSelect={handleSelect}\n            collections={collections}\n          />\n\n          {showName && selectedIcon ? <IconifyNameDisplay name={selectedIcon} /> : null}\n        </Stack>\n      </ThemeProvider>\n    </QueryClientProvider>\n  );\n}\n\ninterface IconifyNameDisplayProps {\n  name?: string | null;\n}\n\nfunction IconifyNameDisplay(props: IconifyNameDisplayProps) {\n  const { name } = props;\n  const prettyName = usePrettyIconName({ name });\n\n  return (\n    <Flex gap={1}>\n      <Text size={1} muted>\n        Selected:\n      </Text>\n\n      <Text size={1} weight=\"semibold\">\n        {prettyName?.name ?? name}\n      </Text>\n\n      {prettyName?.collection && (\n        <Text size={1} muted style={{ fontStyle: 'italic' }}>\n          by {prettyName?.collection}\n        </Text>\n      )}\n    </Flex>\n  );\n}\n","import { Icon } from '@iconify/react';\nimport { PreviewProps } from 'sanity';\nimport { usePrettyIconName } from './lib/use-pretty-icon-name';\nimport { IconifyIconName, stringToIcon } from '@iconify/utils';\nimport { QueryClientProvider } from './lib/query-client';\n\n// --------------- //\n// ICONIFY PREVIEW //\n// --------------- //\n\nexport function IconifyPreview(props: PreviewProps) {\n  const { title } = props;\n  const iconName = typeof props.title === 'string' ? stringToIcon(props.title) : null;\n\n  // We check this double to avoid the TS error\n  if (typeof title === 'string' && iconName) {\n    return (\n      <QueryClientProvider>\n        <IconifyPreviewInner {...props} iconName={title} iconMeta={iconName} />\n      </QueryClientProvider>\n    );\n  }\n\n  return props.renderDefault(props);\n}\n\n// --------------------- //\n// ICONIFY PREVIEW INNER //\n// --------------------- //\n\ninterface IconifyPreviewInnerProps extends PreviewProps {\n  iconName: string;\n  iconMeta: IconifyIconName;\n}\n\nfunction IconifyPreviewInner(props: IconifyPreviewInnerProps) {\n  const { iconMeta, iconName, ...previewProps } = props;\n  const prettyName = usePrettyIconName({ iconMeta });\n\n  return props.renderDefault({\n    ...previewProps,\n    media: <Icon icon={iconName} />,\n    title: prettyName?.name ?? iconName,\n    subtitle: prettyName?.collection,\n  });\n}\n","import { FieldProps, ObjectInputProps, definePlugin } from 'sanity';\nimport { IconifyInput } from './iconify-input';\nimport { IconifyPreview } from './iconify-preview';\nimport { IconifyPluginConfig } from './lib/types';\n\n/**\n * Usage in `sanity.config.ts` (or .js)\n *\n * ```ts\n * import { defineConfig } from 'sanity'\n * import { iconify } from 'sanity-plugin-iconify'\n *\n * export default defineConfig({\n *   // ...\n *   plugins: [iconify()],\n * })\n * ```\n */\nexport const iconify = definePlugin<IconifyPluginConfig | void>((config = {}) => {\n  return {\n    name: 'sanity-plugin-iconify',\n    schema: {\n      types: [\n        {\n          name: 'icon',\n          title: 'Icon',\n          type: 'object',\n          fields: [\n            {\n              name: 'name',\n              title: 'Name',\n              type: 'string',\n            },\n          ],\n          components: {\n            input: (props: ObjectInputProps) => <IconifyInput {...props} config={config!} />,\n            preview: IconifyPreview,\n\n            // This makes sure the input component is not indented\n            field: (props: FieldProps) => props.renderDefault({ ...props, level: 0 }),\n          },\n        },\n      ],\n    },\n  };\n});\n"],"names":["BASE_API_URL","fetchJson","_ref","url","signal","fetch","then","response","ok","Error","concat","status","json","result","error","console","useSearch","_ref2","collections","queryClient","useQueryClient","term","setTerm","useState","debouncedTerm","setDebouncedTerm","useDebounce","updateTerm","useCallback","newTerm","updateImmediately","arguments","length","undefined","isLoading","isError","data","isPlaceholderData","useQuery","queryKey","queryFn","_ref3","_a","URL","searchParams","append","join","Object","entries","forEach","_ref4","prefix","info","setQueryData","icons","enabled","placeholderData","keepPreviousData","staleTime","isPreviousData","useIconSetInfo","_ref5","_ref6","Infinity","_b","ComboboxWrapper","styled","Grid","__template","OptionsWrapper","Box","MessageWrapper","_ref7","children","jsx","Card","padding","Text","align","muted","SearchInput","forwardRef","props","ref","selectedIcon","onChange","Combobox","Input","as","TextInput","inputMode","value","icon","Icon","placeholder","displayName","SearchResults","state","Options","style","opacity","map","Option","active","Button","mode","selected","width","height","UnsetButton","onUnset","border","borderLeft","display","TrashIcon","onClick","fontSize","IconifyCombobox","onSelect","pushSelection","id","useId","toast","useToast","inputRef","useRef","handleTermChange","event","target","handleSelect","handleUnset","useEffect","push","title","description","message","open","jsxs","Fragment","Popover","placement","arrow","matchReferenceWidth","portal","constrainSize","referenceElement","current","content","match","returnType","with","otherwise","QueryClient","QueryClientProvider","ReactQueryClientProvider","client","usePrettyIconName","name","iconMeta","useMemo","stringToIcon","iconSetInfo","sentenceCase","collection","IconifyInput","_c","_d","_e","config","pushChange","schemaType","options","showName","parentTheme","useTheme","theme","sanity","color","studioTheme","unset","set","ThemeProvider","Stack","space","IconifyNameDisplay","prettyName","Flex","gap","size","weight","fontStyle","IconifyPreview","iconName","IconifyPreviewInner","renderDefault","previewProps","media","subtitle","iconify","definePlugin","schema","types","type","fields","components","input","preview","field","level"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/lib/api.ts","../src/combobox/iconify-combobox.styles.tsx","../src/combobox/search-input.tsx","../src/combobox/search-result.tsx","../src/combobox/unset-button.tsx","../src/combobox/iconify-combobox.tsx","../src/lib/query-client.tsx","../src/lib/use-pretty-icon-name.ts","../src/iconify-input.tsx","../src/iconify-preview.tsx","../src/iconify-plugin.tsx"],"sourcesContent":["import type { IconifyInfo } from '@iconify/types';\nimport { keepPreviousData, useQuery, useQueryClient } from '@tanstack/react-query';\nimport { useCallback, useState } from 'react';\nimport { useDebounce } from 'use-debounce';\nimport type { IconifySearchResult } from './types';\n\nconst BASE_API_URL = 'https://api.iconify.design';\n\nfunction fetchJson<T>({ url, signal }: { url: string | URL; signal?: AbortSignal }): Promise<T> {\n  return fetch(url, { signal })\n    .then((response) => {\n      if (!response.ok) {\n        throw new Error(`Network error: status ${response.status}`);\n      }\n\n      return response.json();\n    })\n    .then(\n      (result) => result as T,\n      (error) => {\n        if (error instanceof Error) {\n          throw error;\n        } else {\n          console.error(`Unknown error: ${error}`);\n          throw new Error('Something went wrong');\n        }\n      },\n    );\n}\n\nexport function useSearch({ collections }: { collections: string[] | null }) {\n  const queryClient = useQueryClient();\n  const [term, setTerm] = useState('');\n  const [debouncedTerm, setDebouncedTerm] = useDebounce(term, 500);\n\n  const updateTerm = useCallback(\n    (newTerm: string, updateImmediately = false) => {\n      setTerm(newTerm);\n\n      if (updateImmediately) {\n        setDebouncedTerm(newTerm);\n      }\n    },\n    [setDebouncedTerm],\n  );\n\n  const { isLoading, isError, error, data, isPlaceholderData } = useQuery<string[], Error>({\n    queryKey: ['search', collections, debouncedTerm],\n    queryFn: async ({ signal }) => {\n      const url = new URL(`/search`, BASE_API_URL);\n\n      url.searchParams.append('query', debouncedTerm);\n      url.searchParams.append('limit', '60');\n\n      if (collections) {\n        url.searchParams.append('prefixes', collections.join(','));\n      }\n\n      const result = debouncedTerm ? await fetchJson<IconifySearchResult>({ url, signal }) : null;\n\n      if (result) {\n        // Cache the info for each collection\n        Object.entries(result.collections).forEach(([prefix, info]) => {\n          queryClient.setQueryData<IconifyInfo>(['iconSetInfo', prefix], info);\n        });\n      }\n\n      return result?.icons ?? [];\n    },\n    enabled: debouncedTerm.length > 0,\n    placeholderData: keepPreviousData,\n    staleTime: 5 * 60 * 1000, // 5 minutes\n  });\n\n  return {\n    term,\n    setTerm: updateTerm,\n    debouncedTerm,\n    isLoading,\n    isError,\n    error,\n    data,\n    isPreviousData: isPlaceholderData,\n  };\n}\n\nexport function useIconSetInfo({ prefix }: { prefix?: string | null }) {\n  return useQuery<IconifyInfo | null, Error>({\n    queryKey: ['iconSetInfo', prefix],\n    queryFn: async ({ signal }) => {\n      if (!prefix) return null;\n\n      const url = new URL('/collection', BASE_API_URL);\n\n      url.searchParams.append('prefix', prefix);\n      url.searchParams.append('info', 'true');\n\n      const result = await fetchJson<{ info: IconifyInfo }>({ url, signal });\n\n      return result?.info ?? null;\n    },\n    staleTime: Infinity,\n  });\n}\n","import { Box, Card, Grid, Text } from '@sanity/ui';\nimport type { ReactNode } from 'react';\nimport styled from 'styled-components';\n\nexport const ComboboxWrapper = styled(Grid)`\n  grid-template-columns: 1fr min-content;\n  position: relative;\n`;\n\nexport const OptionsWrapper = styled(Box)`\n  box-sizing: border-box;\n  padding: 0.5rem;\n\n  & [role='listbox'] {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(min(100%, 2.5rem), 1fr));\n    gap: 0.5rem;\n    margin: 0;\n    padding: 0;\n    list-style: none;\n\n    @media (min-width: 650px) {\n      grid-template-columns: repeat(10, minmax(min(100%, 2.5rem), 1fr));\n    }\n  }\n\n  & [role='option'] {\n    display: grid;\n    place-items: center;\n\n    & button {\n      cursor: pointer;\n      aspect-ratio: 1;\n      width: 100%;\n\n      & > [data-ui='Box'] {\n        display: flex;\n      }\n    }\n  }\n`;\n\nexport function MessageWrapper({ children }: { children: ReactNode }) {\n  return (\n    <Card padding={4}>\n      <Text align=\"center\" muted>\n        {children}\n      </Text>\n    </Card>\n  );\n}\n","import { ComboboxInput } from '@headlessui/react';\nimport { Icon } from '@iconify/react';\nimport { TextInput } from '@sanity/ui';\nimport type { ChangeEventHandler } from 'react';\nimport { forwardRef } from 'react';\n\n// ------------ //\n// SEARCH INPUT //\n// ------------ //\n\ninterface SearchInputProps {\n  term: string;\n  selectedIcon: string | null;\n  onChange: ChangeEventHandler<HTMLInputElement>;\n  suffix?: React.ReactNode;\n}\n\nexport const SearchInput = forwardRef<HTMLInputElement, SearchInputProps>((props, ref) => {\n  const { term, selectedIcon, onChange, suffix } = props;\n\n  return (\n    <ComboboxInput\n      as={TextInput}\n      ref={ref}\n      inputMode=\"search\"\n      value={term}\n      onChange={onChange}\n      icon={selectedIcon ? <Icon icon={selectedIcon} /> : null}\n      placeholder={selectedIcon ? 'Search and replace selected icon...' : 'Search for an icon...'}\n      suffix={suffix}\n    />\n  );\n});\n\nSearchInput.displayName = 'SearchInput';\n","import { ComboboxOption, ComboboxOptions } from '@headlessui/react';\nimport { Icon } from '@iconify/react';\nimport { Button } from '@sanity/ui';\nimport { MessageWrapper } from './iconify-combobox.styles';\n\n// -------------- //\n// SEARCH RESULTS //\n// -------------- //\n\nexport interface SearchResultsProps {\n  state: 'initial' | 'loading' | 'error' | 'empty' | 'data' | 'stale';\n  data?: string[];\n}\n\nexport function SearchResults(props: SearchResultsProps) {\n  const { state, data } = props;\n\n  if (state === 'initial') {\n    return <MessageWrapper>Search for icons</MessageWrapper>;\n  }\n\n  if (state === 'loading') {\n    return <MessageWrapper>Searching...</MessageWrapper>;\n  }\n\n  if (state === 'error') {\n    return <MessageWrapper>Something went wrong...</MessageWrapper>;\n  }\n\n  if (state === 'empty') {\n    return <MessageWrapper>No icons found</MessageWrapper>;\n  }\n\n  return (\n    <ComboboxOptions style={{ opacity: state === 'stale' ? 0.5 : 1 }}>\n      {data!.map((icon) => (\n        <ComboboxOption key={icon} value={icon}>\n          {({ focus }) => (\n            <Button padding={3} mode=\"bleed\" selected={focus}>\n              <Icon icon={icon} width=\"100%\" height=\"100%\" />\n            </Button>\n          )}\n        </ComboboxOption>\n      ))}\n    </ComboboxOptions>\n  );\n}\n","import { TrashIcon } from '@sanity/icons';\nimport { Button, Card } from '@sanity/ui';\n\n// ------------ //\n// UNSET BUTTON //\n// ------------ //\n\ninterface UnsetButtonProps {\n  onUnset: () => void;\n}\n\nexport function UnsetButton(props: UnsetButtonProps) {\n  const { onUnset } = props;\n\n  return (\n    <Card border borderLeft={false} padding={1} display=\"flex\" radius={2}>\n      <Button icon={<TrashIcon />} onClick={onUnset} mode=\"bleed\" fontSize={1} padding={2} />\n    </Card>\n  );\n}\n","import { Combobox } from '@headlessui/react';\nimport { Popover, useToast } from '@sanity/ui';\nimport type { ChangeEventHandler } from 'react';\nimport { useCallback, useEffect, useId, useRef } from 'react';\nimport { match } from 'ts-pattern';\nimport { useSearch } from '../lib/api';\nimport { ComboboxWrapper, OptionsWrapper } from './iconify-combobox.styles';\nimport { SearchInput } from './search-input';\nimport type { SearchResultsProps } from './search-result';\nimport { SearchResults } from './search-result';\nimport { UnsetButton } from './unset-button';\n\nexport interface IconifyComboboxProps {\n  selectedIcon: string | null;\n  onSelect: (newValue: string) => void;\n  collections: string[] | null;\n}\n\nexport function IconifyCombobox(props: IconifyComboboxProps) {\n  const { selectedIcon, onSelect: pushSelection, collections } = props;\n\n  const id = useId();\n  const toast = useToast();\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const { term, setTerm, debouncedTerm, isLoading, isError, error, data, isPreviousData } =\n    useSearch({\n      collections,\n    });\n\n  const handleTermChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n    (event) => setTerm(event.target.value),\n    [setTerm],\n  );\n\n  const handleSelect = useCallback(\n    (icon: string) => {\n      pushSelection(icon);\n      setTerm('', true);\n    },\n    [pushSelection, setTerm],\n  );\n\n  const handleUnset = useCallback(() => handleSelect(''), [handleSelect]);\n\n  useEffect(() => {\n    if (isError) {\n      console.error('Iconify input error:', error);\n\n      toast.push({\n        id,\n        status: 'error',\n        title: 'Iconify input error',\n        description: error?.message,\n      });\n    }\n  }, [error, id, isError, toast]);\n\n  return (\n    <ComboboxWrapper>\n      <Combobox onChange={handleSelect}>\n        {({ open }) => (\n          <>\n            <SearchInput\n              ref={inputRef}\n              term={term}\n              selectedIcon={selectedIcon}\n              onChange={handleTermChange}\n              suffix={selectedIcon ? <UnsetButton onUnset={handleUnset} /> : null}\n            />\n\n            <Popover\n              open={open}\n              placement=\"bottom\"\n              arrow={false}\n              matchReferenceWidth\n              portal\n              constrainSize\n              referenceElement={inputRef.current}\n              content={\n                <OptionsWrapper>\n                  <SearchResults\n                    state={match<boolean>(true)\n                      .returnType<SearchResultsProps['state']>()\n                      .with(isLoading, () => 'loading')\n                      .with(!debouncedTerm, () => 'initial')\n                      .with(isError, () => 'error')\n                      .with(!data || data.length === 0, () => 'empty')\n                      .with(isPreviousData, () => 'stale')\n                      .otherwise(() => 'data')}\n                    data={data}\n                  />\n                </OptionsWrapper>\n              }\n            />\n          </>\n        )}\n      </Combobox>\n    </ComboboxWrapper>\n  );\n}\n","import {\n  QueryClient,\n  QueryClientProvider as ReactQueryClientProvider,\n} from '@tanstack/react-query';\nimport type { ReactNode } from 'react';\n\nexport const queryClient = new QueryClient();\n\nexport function QueryClientProvider(props: { children: ReactNode }) {\n  return <ReactQueryClientProvider client={queryClient}>{props.children}</ReactQueryClientProvider>;\n}\n","import type { IconifyIconName } from '@iconify/utils';\nimport { stringToIcon } from '@iconify/utils';\nimport { sentenceCase } from 'change-case';\nimport { useMemo } from 'react';\nimport { useIconSetInfo } from './api';\n\ninterface UsePrettyIconNameProps {\n  name?: string | null;\n  iconMeta?: IconifyIconName | null;\n}\n\nexport function usePrettyIconName(props: UsePrettyIconNameProps) {\n  const { name } = props;\n  const iconMeta = useMemo(\n    () => props.iconMeta ?? (name ? stringToIcon(name) : null),\n    [name, props.iconMeta],\n  );\n  const iconSetInfo = useIconSetInfo({ prefix: iconMeta?.prefix ?? null });\n\n  return useMemo(\n    () =>\n      iconMeta\n        ? {\n            name: sentenceCase(iconMeta.name),\n            collection: iconSetInfo.data?.name ?? iconMeta.prefix,\n          }\n        : null,\n    [iconMeta, iconSetInfo.data?.name],\n  );\n}\n","import { Flex, Stack, Text, ThemeProvider } from '@sanity/ui';\nimport { buildTheme } from '@sanity/ui/theme';\nimport { useCallback } from 'react';\nimport type { ObjectInputProps } from 'sanity';\nimport { set, unset } from 'sanity';\nimport { IconifyCombobox } from './combobox';\nimport { QueryClientProvider } from './lib/query-client';\nimport type { IconifyPluginConfig, IconOptions } from './lib/types';\nimport { usePrettyIconName } from './lib/use-pretty-icon-name';\n\n// -------------- //\n// ICONIFY INPUT //\n// -------------- //\n\ninterface IconifyInputProps extends ObjectInputProps {\n  config: IconifyPluginConfig;\n}\n\nexport function IconifyInput(props: IconifyInputProps) {\n  const { config, value, onChange: pushChange, schemaType } = props;\n\n  const selectedIcon: string | null = value?.name ?? null;\n\n  const options: IconOptions = schemaType.options;\n  const collections =\n    (!!options?.collections?.length && options.collections) ||\n    (!!config?.collections?.length && config.collections) ||\n    null;\n  const showName = options?.showName ?? config?.showName ?? false;\n\n  // const parentTheme = useTheme();\n  // const theme: RootTheme = useMemo(\n  //   () => (parentTheme ? { ...parentTheme.sanity, color: studioTheme.color } : studioTheme),\n  //   [parentTheme],\n  // );\n\n  const handleSelect = useCallback(\n    (icon: string) => {\n      pushChange(icon === '' ? unset() : set(icon, ['name']));\n    },\n    [pushChange],\n  );\n\n  return (\n    <QueryClientProvider>\n      <ThemeProvider theme={buildTheme()}>\n        <Stack space={2}>\n          <IconifyCombobox\n            selectedIcon={selectedIcon}\n            onSelect={handleSelect}\n            collections={collections}\n          />\n\n          {showName && selectedIcon ? <IconifyNameDisplay name={selectedIcon} /> : null}\n        </Stack>\n      </ThemeProvider>\n    </QueryClientProvider>\n  );\n}\n\ninterface IconifyNameDisplayProps {\n  name?: string | null;\n}\n\nfunction IconifyNameDisplay(props: IconifyNameDisplayProps) {\n  const { name } = props;\n  const prettyName = usePrettyIconName({ name });\n\n  return (\n    <Flex gap={1}>\n      <Text size={1} muted>\n        Selected:\n      </Text>\n\n      <Text size={1} weight=\"semibold\">\n        {prettyName?.name ?? name}\n      </Text>\n\n      {prettyName?.collection && (\n        <Text size={1} muted style={{ fontStyle: 'italic' }}>\n          by {prettyName?.collection}\n        </Text>\n      )}\n    </Flex>\n  );\n}\n","import { Icon } from '@iconify/react';\nimport type { IconifyIconName } from '@iconify/utils';\nimport { stringToIcon } from '@iconify/utils';\nimport type { PreviewProps } from 'sanity';\nimport { QueryClientProvider } from './lib/query-client';\nimport { usePrettyIconName } from './lib/use-pretty-icon-name';\n\n// --------------- //\n// ICONIFY PREVIEW //\n// --------------- //\n\nexport function IconifyPreview(props: PreviewProps) {\n  const { title } = props;\n  const iconName = typeof props.title === 'string' ? stringToIcon(props.title) : null;\n\n  // We check this double to avoid the TS error\n  if (typeof title === 'string' && iconName) {\n    return (\n      <QueryClientProvider>\n        <IconifyPreviewInner {...props} iconName={title} iconMeta={iconName} />\n      </QueryClientProvider>\n    );\n  }\n\n  return props.renderDefault(props);\n}\n\n// --------------------- //\n// ICONIFY PREVIEW INNER //\n// --------------------- //\n\ninterface IconifyPreviewInnerProps extends PreviewProps {\n  iconName: string;\n  iconMeta: IconifyIconName;\n}\n\nfunction IconifyPreviewInner(props: IconifyPreviewInnerProps) {\n  const { iconMeta, iconName, ...previewProps } = props;\n  const prettyName = usePrettyIconName({ iconMeta });\n\n  return props.renderDefault({\n    ...previewProps,\n    media: <Icon icon={iconName} />,\n    title: prettyName?.name ?? iconName,\n    subtitle: prettyName?.collection,\n  });\n}\n","import type { FieldProps, ObjectInputProps } from 'sanity';\nimport { definePlugin } from 'sanity';\nimport { IconifyInput } from './iconify-input';\nimport { IconifyPreview } from './iconify-preview';\nimport type { IconifyPluginConfig } from './lib/types';\n\n/**\n * Usage in `sanity.config.ts` (or .js)\n *\n * ```ts\n * import { defineConfig } from 'sanity'\n * import { iconify } from 'sanity-plugin-iconify'\n *\n * export default defineConfig({\n *   // ...\n *   plugins: [iconify()],\n * })\n * ```\n */\nexport const iconify = definePlugin<IconifyPluginConfig | void>((config = {}) => {\n  return {\n    name: 'sanity-plugin-iconify',\n    schema: {\n      types: [\n        {\n          name: 'icon',\n          title: 'Icon',\n          type: 'object',\n          fields: [\n            {\n              name: 'name',\n              title: 'Name',\n              type: 'string',\n            },\n          ],\n          components: {\n            input: (props: ObjectInputProps) => <IconifyInput {...props} config={config!} />,\n            preview: IconifyPreview,\n\n            // This makes sure the input component is not indented\n            field: (props: FieldProps) => props.renderDefault({ ...props, level: 0 }),\n          },\n        },\n      ],\n    },\n  };\n});\n"],"names":["queryClient","ReactQueryClientProvider","_a","_b"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sanity-plugin-iconify",
-  "version": "1.1.1",
+  "version": "2.0.0",
   "description": "Icon picker based on Iconify",
   "keywords": [
     "sanity",
@@ -16,19 +16,19 @@
   },
   "license": "MIT",
   "author": "Wannes Salomé <mail@wannessalome.nl>",
+  "sideEffects": true,
+  "type": "module",
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
       "source": "./src/index.ts",
-      "require": "./dist/index.js",
-      "import": "./dist/index.esm.js",
-      "default": "./dist/index.esm.js"
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs",
+      "default": "./dist/index.js"
     },
     "./package.json": "./package.json"
   },
-  "main": "./dist/index.js",
-  "module": "./dist/index.esm.js",
-  "source": "./src/index.ts",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "files": [
     "dist",
@@ -44,72 +44,69 @@
     "lint": "eslint .",
     "prepublish-only": "run-s build",
     "watch": "pkg-utils watch --strict",
-    "generate-types": "tsx src/lib/generate-types",
-    "prepare": "husky install"
+    "generate-types": "node src/lib/generate-types",
+    "prepare": "husky"
   },
+  "browserslist": "extends @sanity/browserslist-config",
   "dependencies": {
-    "@headlessui/react": "^1.7.17",
-    "@iconify/react": "^4.1.1",
-    "@iconify/utils": "^2.1.11",
-    "@sanity/icons": "^2.7.0",
+    "@headlessui/react": "^2.0.4",
+    "@iconify/react": "^5.0.1",
+    "@iconify/utils": "^2.1.24",
+    "@sanity/icons": "^3.2.0",
     "@sanity/incompatible-plugin": "^1.0.4",
-    "@sanity/ui": "^1.8.3",
-    "@tanstack/react-query": "^5.4.3",
-    "change-case": "^4.1.2",
-    "ts-pattern": "^5.0.5",
-    "use-debounce": "^9.0.4"
+    "@sanity/ui": "^2.3.5",
+    "@tanstack/react-query": "^5.45.0",
+    "change-case": "^5.4.4",
+    "ts-pattern": "^5.2.0",
+    "use-debounce": "^10.0.1"
   },
   "devDependencies": {
-    "@commitlint/cli": "^18.2.0",
-    "@commitlint/config-conventional": "^18.1.0",
-    "@commitlint/load": "^18.2.0",
-    "@iconify/json": "^2.2.137",
+    "@commitlint/cli": "^19.3.0",
+    "@commitlint/config-conventional": "^19.2.2",
+    "@commitlint/load": "^19.2.0",
+    "@iconify/json": "^2.2.218",
     "@iconify/types": "^2.0.0",
-    "@sanity/pkg-utils": "^3.2.2",
-    "@sanity/plugin-kit": "^3.1.10",
-    "@sanity/semantic-release-preset": "^4.1.6",
-    "@tanstack/eslint-plugin-query": "^5.0.5",
-    "@tanstack/react-query-devtools": "^5.4.3",
-    "@types/react": "^18.2.34",
-    "@types/styled-components": "^5.1.29",
-    "@typescript-eslint/eslint-plugin": "^6.9.1",
-    "@typescript-eslint/parser": "^6.9.1",
-    "eslint": "^8.53.0",
-    "eslint-config-prettier": "^9.0.0",
-    "eslint-config-sanity": "^7.0.1",
-    "eslint-plugin-prettier": "^5.0.1",
-    "eslint-plugin-react": "^7.33.2",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "husky": "^8.0.3",
-    "lint-staged": "^15.0.2",
+    "@sanity/pkg-utils": "^6.9.3",
+    "@sanity/plugin-kit": "^4.0.17",
+    "@sanity/semantic-release-preset": "^5.0.0",
+    "@tanstack/eslint-plugin-query": "^5.43.1",
+    "@tanstack/react-query-devtools": "^5.45.0",
+    "@types/react": "^18.3.3",
+    "@types/styled-components": "^5.1.34",
+    "@waspeer/config": "^2.2.0",
+    "eslint": "^9.4.0",
+    "husky": "^9.0.11",
+    "lint-staged": "^15.2.7",
     "npm-run-all": "^4.1.5",
-    "prettier": "^3.0.3",
-    "prettier-plugin-packagejson": "^2.4.6",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-is": "^18.2.0",
-    "rimraf": "^5.0.5",
-    "sanity": "^3.19.1",
-    "tsx": "^3.14.0",
-    "typescript": "^5.2.2"
+    "prettier": "^3.3.2",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-is": "^18.3.1",
+    "rimraf": "^5.0.7",
+    "sanity": "^3.46.0",
+    "typescript": "^5.4.5"
   },
   "peerDependencies": {
     "react": "^18",
     "sanity": "^3",
-    "styled-components": "^5"
+    "styled-components": "^6"
   },
   "engines": {
-    "node": ">=14"
-  },
-  "sanityPlugin": {
-    "verifyPackage": {
-      "scripts": false
-    }
+    "node": ">=18"
   },
   "pnpm": {
     "overrides": {
       "@babel/traverse@<7.23.2": ">=7.23.2",
+      "conventional-changelog-conventionalcommits": "^8",
+      "follow-redirects@<1.15.4": ">=1.15.4",
+      "follow-redirects@<=1.15.5": ">=1.15.6",
       "postcss@<8.4.31": ">=8.4.31"
     }
+  },
+  "sanityPlugin": {
+    "verifyPackage": {
+      "scripts": false,
+      "eslintImports": false
+    }
   }
 }

package/src/combobox/iconify-combobox.styles.tsx

@@ -1,5 +1,5 @@
 import { Box, Card, Grid, Text } from '@sanity/ui';
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 import styled from 'styled-components';
 
 export const ComboboxWrapper = styled(Grid)`
@@ -15,9 +15,9 @@ export const OptionsWrapper = styled(Box)`
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(min(100%, 2.5rem), 1fr));
     gap: 0.5rem;
-    list-style: none;
     margin: 0;
     padding: 0;
+    list-style: none;
 
     @media (min-width: 650px) {
       grid-template-columns: repeat(10, minmax(min(100%, 2.5rem), 1fr));
@@ -29,8 +29,8 @@ export const OptionsWrapper = styled(Box)`
     place-items: center;
 
     & button {
-      aspect-ratio: 1;
       cursor: pointer;
+      aspect-ratio: 1;
       width: 100%;
 
       & > [data-ui='Box'] {

package/src/combobox/iconify-combobox.tsx

@@ -1,11 +1,13 @@
 import { Combobox } from '@headlessui/react';
 import { Popover, useToast } from '@sanity/ui';
-import { ChangeEventHandler, useCallback, useEffect, useId, useRef } from 'react';
+import type { ChangeEventHandler } from 'react';
+import { useCallback, useEffect, useId, useRef } from 'react';
 import { match } from 'ts-pattern';
 import { useSearch } from '../lib/api';
 import { ComboboxWrapper, OptionsWrapper } from './iconify-combobox.styles';
 import { SearchInput } from './search-input';
-import { SearchResults, SearchResultsProps } from './search-result';
+import type { SearchResultsProps } from './search-result';
+import { SearchResults } from './search-result';
 import { UnsetButton } from './unset-button';
 
 export interface IconifyComboboxProps {
@@ -64,6 +66,7 @@ export function IconifyCombobox(props: IconifyComboboxProps) {
               term={term}
               selectedIcon={selectedIcon}
               onChange={handleTermChange}
+              suffix={selectedIcon ? <UnsetButton onUnset={handleUnset} /> : null}
             />
 
             <Popover
@@ -93,8 +96,6 @@ export function IconifyCombobox(props: IconifyComboboxProps) {
           </>
         )}
       </Combobox>
-
-      {selectedIcon ? <UnsetButton onUnset={handleUnset} /> : null}
     </ComboboxWrapper>
   );
 }

package/src/combobox/search-input.tsx

@@ -1,7 +1,8 @@
-import { Combobox } from '@headlessui/react';
+import { ComboboxInput } from '@headlessui/react';
 import { Icon } from '@iconify/react';
 import { TextInput } from '@sanity/ui';
-import { ChangeEventHandler, forwardRef } from 'react';
+import type { ChangeEventHandler } from 'react';
+import { forwardRef } from 'react';
 
 // ------------ //
 // SEARCH INPUT //
@@ -11,13 +12,14 @@ interface SearchInputProps {
   term: string;
   selectedIcon: string | null;
   onChange: ChangeEventHandler<HTMLInputElement>;
+  suffix?: React.ReactNode;
 }
 
 export const SearchInput = forwardRef<HTMLInputElement, SearchInputProps>((props, ref) => {
-  const { term, selectedIcon, onChange } = props;
+  const { term, selectedIcon, onChange, suffix } = props;
 
   return (
-    <Combobox.Input
+    <ComboboxInput
       as={TextInput}
       ref={ref}
       inputMode="search"
@@ -25,6 +27,7 @@ export const SearchInput = forwardRef<HTMLInputElement, SearchInputProps>((props
       onChange={onChange}
       icon={selectedIcon ? <Icon icon={selectedIcon} /> : null}
       placeholder={selectedIcon ? 'Search and replace selected icon...' : 'Search for an icon...'}
+      suffix={suffix}
     />
   );
 });

package/src/combobox/search-result.tsx

@@ -1,4 +1,4 @@
-import { Combobox } from '@headlessui/react';
+import { ComboboxOption, ComboboxOptions } from '@headlessui/react';
 import { Icon } from '@iconify/react';
 import { Button } from '@sanity/ui';
 import { MessageWrapper } from './iconify-combobox.styles';
@@ -32,16 +32,16 @@ export function SearchResults(props: SearchResultsProps) {
   }
 
   return (
-    <Combobox.Options style={{ opacity: state === 'stale' ? 0.5 : 1 }}>
+    <ComboboxOptions style={{ opacity: state === 'stale' ? 0.5 : 1 }}>
       {data!.map((icon) => (
-        <Combobox.Option key={icon} value={icon}>
-          {({ active }) => (
-            <Button padding={3} mode="bleed" selected={active}>
+        <ComboboxOption key={icon} value={icon}>
+          {({ focus }) => (
+            <Button padding={3} mode="bleed" selected={focus}>
               <Icon icon={icon} width="100%" height="100%" />
             </Button>
           )}
-        </Combobox.Option>
+        </ComboboxOption>
       ))}
-    </Combobox.Options>
+    </ComboboxOptions>
   );
 }

package/src/combobox/unset-button.tsx

@@ -13,7 +13,7 @@ export function UnsetButton(props: UnsetButtonProps) {
   const { onUnset } = props;
 
   return (
-    <Card border borderLeft={false} padding={1} display="flex">
+    <Card border borderLeft={false} padding={1} display="flex" radius={2}>
       <Button icon={<TrashIcon />} onClick={onUnset} mode="bleed" fontSize={1} padding={2} />
     </Card>
   );

package/src/iconify-input.tsx

@@ -1,9 +1,11 @@
-import { Flex, RootTheme, Stack, Text, ThemeProvider, studioTheme, useTheme } from '@sanity/ui';
-import { useCallback, useMemo } from 'react';
-import { ObjectInputProps, set, unset } from 'sanity';
+import { Flex, Stack, Text, ThemeProvider } from '@sanity/ui';
+import { buildTheme } from '@sanity/ui/theme';
+import { useCallback } from 'react';
+import type { ObjectInputProps } from 'sanity';
+import { set, unset } from 'sanity';
 import { IconifyCombobox } from './combobox';
 import { QueryClientProvider } from './lib/query-client';
-import { IconOptions, IconifyPluginConfig } from './lib/types';
+import type { IconifyPluginConfig, IconOptions } from './lib/types';
 import { usePrettyIconName } from './lib/use-pretty-icon-name';
 
 // -------------- //
@@ -26,11 +28,11 @@ export function IconifyInput(props: IconifyInputProps) {
     null;
   const showName = options?.showName ?? config?.showName ?? false;
 
-  const parentTheme = useTheme();
-  const theme: RootTheme = useMemo(
-    () => (parentTheme ? { ...parentTheme.sanity, color: studioTheme.color } : studioTheme),
-    [parentTheme],
-  );
+  // const parentTheme = useTheme();
+  // const theme: RootTheme = useMemo(
+  //   () => (parentTheme ? { ...parentTheme.sanity, color: studioTheme.color } : studioTheme),
+  //   [parentTheme],
+  // );
 
   const handleSelect = useCallback(
     (icon: string) => {
@@ -41,7 +43,7 @@ export function IconifyInput(props: IconifyInputProps) {
 
   return (
     <QueryClientProvider>
-      <ThemeProvider theme={theme}>
+      <ThemeProvider theme={buildTheme()}>
         <Stack space={2}>
           <IconifyCombobox
             selectedIcon={selectedIcon}

package/src/iconify-plugin.tsx

@@ -1,7 +1,8 @@
-import { FieldProps, ObjectInputProps, definePlugin } from 'sanity';
+import type { FieldProps, ObjectInputProps } from 'sanity';
+import { definePlugin } from 'sanity';
 import { IconifyInput } from './iconify-input';
 import { IconifyPreview } from './iconify-preview';
-import { IconifyPluginConfig } from './lib/types';
+import type { IconifyPluginConfig } from './lib/types';
 
 /**
  * Usage in `sanity.config.ts` (or .js)

package/src/iconify-preview.tsx

@@ -1,8 +1,9 @@
 import { Icon } from '@iconify/react';
-import { PreviewProps } from 'sanity';
-import { usePrettyIconName } from './lib/use-pretty-icon-name';
-import { IconifyIconName, stringToIcon } from '@iconify/utils';
+import type { IconifyIconName } from '@iconify/utils';
+import { stringToIcon } from '@iconify/utils';
+import type { PreviewProps } from 'sanity';
 import { QueryClientProvider } from './lib/query-client';
+import { usePrettyIconName } from './lib/use-pretty-icon-name';
 
 // --------------- //
 // ICONIFY PREVIEW //

package/src/lib/api.ts

@@ -1,8 +1,8 @@
-import { IconifyInfo } from '@iconify/types';
+import type { IconifyInfo } from '@iconify/types';
 import { keepPreviousData, useQuery, useQueryClient } from '@tanstack/react-query';
 import { useCallback, useState } from 'react';
 import { useDebounce } from 'use-debounce';
-import { IconifySearchResult } from './types';
+import type { IconifySearchResult } from './types';
 
 const BASE_API_URL = 'https://api.iconify.design';
 

package/src/lib/query-client.tsx

@@ -2,7 +2,7 @@ import {
   QueryClient,
   QueryClientProvider as ReactQueryClientProvider,
 } from '@tanstack/react-query';
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 export const queryClient = new QueryClient();
 

package/src/lib/types.ts

@@ -1,4 +1,4 @@
-import { IconifyInfo } from '@iconify/types';
+import type { IconifyInfo } from '@iconify/types';
 import type { BaseSchemaDefinition } from 'sanity';
 
 // If this line errors, the type definitions have not been generated.

package/src/lib/use-pretty-icon-name.ts

@@ -1,4 +1,5 @@
-import { IconifyIconName, stringToIcon } from '@iconify/utils';
+import type { IconifyIconName } from '@iconify/utils';
+import { stringToIcon } from '@iconify/utils';
 import { sentenceCase } from 'change-case';
 import { useMemo } from 'react';
 import { useIconSetInfo } from './api';