sanity-plugin-media 2.3.1 → 2.4.0

package/src/config/searchFacets.ts

@@ -1,4 +1,4 @@
-import {
+import type {
   SearchFacetDivider,
   SearchFacetInputProps,
   SearchFacetName,
@@ -19,6 +19,16 @@ export const inputs: Record<SearchFacetName, SearchFacetInputProps> = {
     type: 'string',
     value: ''
   },
+  creditLine: {
+    assetTypes: ['file', 'image'],
+    field: 'creditLine',
+    name: 'creditLine',
+    operatorType: 'empty',
+    operatorTypes: ['empty', 'notEmpty', null, 'includes', 'doesNotInclude'],
+    title: 'Credit',
+    type: 'string',
+    value: ''
+  },
   description: {
     assetTypes: ['file', 'image'],
     field: 'description',

package/src/constants.ts

@@ -1,4 +1,9 @@
-import {SearchFacetInputProps, SearchFacetDivider, SearchFacetGroup, OrderDirection} from '@types'
+import type {
+  SearchFacetInputProps,
+  SearchFacetDivider,
+  SearchFacetGroup,
+  OrderDirection
+} from '@types'
 import {divider, inputs} from './config/searchFacets'
 
 // Sort order dropdown options
@@ -52,6 +57,7 @@ export const FACETS: (SearchFacetDivider | SearchFacetGroup | SearchFacetInputPr
   divider,
   inputs.title,
   inputs.altText,
+  inputs.creditLine,
   inputs.description,
   divider,
   inputs.isOpaque,

package/src/contexts/AssetSourceDispatchContext.tsx

@@ -1,4 +1,4 @@
-import React, {ReactNode, createContext, useContext} from 'react'
+import {type ReactNode, createContext, useContext} from 'react'
 import type {AssetSourceComponentProps} from 'sanity'
 
 type ContextProps = {

package/src/contexts/DropzoneDispatchContext.tsx

@@ -1,4 +1,4 @@
-import React, {ReactNode, createContext, useContext} from 'react'
+import {type ReactNode, createContext, useContext} from 'react'
 
 type ContextProps = {
   open: () => void

package/src/contexts/ToolOptionsContext.tsx

@@ -1,9 +1,10 @@
-import {MediaToolOptions} from '@types'
-import React, {PropsWithChildren, createContext, useContext, useMemo} from 'react'
-import {DropzoneOptions} from 'react-dropzone'
+import type {MediaToolOptions} from '@types'
+import {type PropsWithChildren, createContext, useContext, useMemo} from 'react'
+import type {DropzoneOptions} from 'react-dropzone'
 
 type ContextProps = {
   dropzone: Pick<DropzoneOptions, 'maxSize'>
+  creditLine: MediaToolOptions['creditLine']
 }
 
 const ToolOptionsContext = createContext<ContextProps | null>(null)
@@ -13,10 +14,27 @@ type Props = {
 }
 
 export const ToolOptionsProvider = ({options, children}: PropsWithChildren<Props>) => {
-  const value = useMemo<ContextProps>(
-    () => ({dropzone: {maxSize: options?.maximumUploadSize}}),
-    [options?.maximumUploadSize]
-  )
+  const value = useMemo<ContextProps>(() => {
+    let creditLineExcludeSources
+
+    if (options?.creditLine?.excludeSources) {
+      creditLineExcludeSources = Array.isArray(options?.creditLine?.excludeSources)
+        ? options.creditLine.excludeSources
+        : [options?.creditLine?.excludeSources]
+    }
+
+    return {
+      dropzone: {maxSize: options?.maximumUploadSize},
+      creditLine: {
+        enabled: options?.creditLine?.enabled || false,
+        excludeSources: creditLineExcludeSources
+      }
+    }
+  }, [
+    options?.creditLine?.enabled,
+    options?.creditLine?.excludeSources,
+    options?.maximumUploadSize
+  ])
 
   return <ToolOptionsContext.Provider value={value}>{children}</ToolOptionsContext.Provider>
 }

package/src/formSchema/index.ts

@@ -7,6 +7,7 @@ export const tagOptionSchema = z.object({
 
 export const assetFormSchema = z.object({
   altText: z.string().trim().optional(),
+  creditLine: z.string().trim().optional(),
   description: z.string().trim().optional(),
   opt: z.object({
     media: z.object({

package/src/hooks/useKeyPress.ts

@@ -1,5 +1,5 @@
 import isHotkey from 'is-hotkey'
-import {RefObject, useCallback, useEffect, useRef} from 'react'
+import {type RefObject, useCallback, useEffect, useRef} from 'react'
 
 const useKeyPress = (hotkey: string, onPress?: () => void): RefObject<boolean> => {
   const keyPressed = useRef(false)

package/src/hooks/useOnScreen.ts

@@ -1,4 +1,4 @@
-import {RefObject, useEffect, useState} from 'react'
+import {type RefObject, useEffect, useState} from 'react'
 
 const useOnScreen = (ref: RefObject<HTMLElement>, options = {}, once: boolean) => {
   const [isIntersecting, setIntersecting] = useState(false)

package/src/hooks/usePortalPopoverProps.ts

@@ -1,4 +1,4 @@
-import {PopoverProps, usePortal} from '@sanity/ui'
+import {type PopoverProps, usePortal} from '@sanity/ui'
 
 export function usePortalPopoverProps(): PopoverProps {
   const portal = usePortal()

package/src/hooks/useTypedSelector.ts

@@ -1,6 +1,6 @@
-import {TypedUseSelectorHook, useSelector} from 'react-redux'
+import {type TypedUseSelectorHook, useSelector} from 'react-redux'
 
-import {RootReducerState} from '../modules/types'
+import type {RootReducerState} from '../modules/types'
 
 const useTypedSelector: TypedUseSelectorHook<RootReducerState> = useSelector
 

package/src/modules/assets/actions.ts

@@ -1,5 +1,5 @@
 import {createAction} from '@reduxjs/toolkit'
-import {AssetItem, HttpError, Tag} from '../../types'
+import type {AssetItem, HttpError, Tag} from '../../types'
 
 export const ASSETS_ACTIONS = {
   tagsAddComplete: createAction(

package/src/modules/assets/index.ts

@@ -1,6 +1,6 @@
-import {createSelector, createSlice, PayloadAction} from '@reduxjs/toolkit'
+import {createSelector, createSlice, type PayloadAction} from '@reduxjs/toolkit'
 import type {ClientError, Patch, Transaction} from '@sanity/client'
-import {
+import type {
   Asset,
   AssetItem,
   AssetType,
@@ -13,7 +13,7 @@ import {
 } from '@types'
 import groq from 'groq'
 import {nanoid} from 'nanoid'
-import {Selector} from 'react-redux'
+import type {Selector} from 'react-redux'
 import {ofType} from 'redux-observable'
 import {empty, from, of} from 'rxjs'
 import {
@@ -239,6 +239,7 @@ const assetsSlice = createSlice({
               _createdAt,
               _updatedAt,
               altText,
+              creditLine,
               description,
               extension,
               metadata {
@@ -252,6 +253,9 @@ const assetsSlice = createSlice({
               },
               originalFilename,
               size,
+              source {
+                name
+              },
               title,
               url
             } ${pipe} ${sort} ${selector},

package/src/modules/debug/index.ts

@@ -1,4 +1,4 @@
-import {PayloadAction, createSlice} from '@reduxjs/toolkit'
+import {type PayloadAction, createSlice} from '@reduxjs/toolkit'
 
 type DebugReducerState = {
   badConnection: boolean

package/src/modules/dialog/index.ts

@@ -1,5 +1,5 @@
-import {createSlice, PayloadAction} from '@reduxjs/toolkit'
-import {AssetItem, Dialog, MyEpic, Tag} from '@types'
+import {createSlice, type PayloadAction} from '@reduxjs/toolkit'
+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/index.ts

@@ -1,7 +1,7 @@
 import {
-  ActionFromReducersMapObject,
-  Reducer,
-  StateFromReducersMapObject,
+  type ActionFromReducersMapObject,
+  type Reducer,
+  type StateFromReducersMapObject,
   combineReducers
 } from '@reduxjs/toolkit'
 import {combineEpics} from 'redux-observable'

package/src/modules/notifications/index.ts

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

package/src/modules/search/index.ts

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

package/src/modules/selectors.ts

@@ -1,7 +1,7 @@
 import {createSelector} from '@reduxjs/toolkit'
-import {CardAssetData, CardUploadData} from '@types'
+import type {CardAssetData, CardUploadData} from '@types'
 
-import {RootReducerState} from './types'
+import type {RootReducerState} from './types'
 
 export const selectCombinedItems = createSelector(
   [

package/src/modules/tags/index.ts

@@ -1,8 +1,8 @@
-import {createSelector, createSlice, PayloadAction} from '@reduxjs/toolkit'
+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 groq from 'groq'
-import {Selector} from 'react-redux'
+import type {Selector} from 'react-redux'
 import {ofType} from 'redux-observable'
 import {from, Observable, of} from 'rxjs'
 import {bufferTime, catchError, filter, mergeMap, switchMap, withLatestFrom} from 'rxjs/operators'

package/src/modules/uploads/index.ts

@@ -1,8 +1,8 @@
-import {createSelector, createSlice, PayloadAction} from '@reduxjs/toolkit'
+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 groq from 'groq'
-import {Selector} from 'react-redux'
+import type {Selector} from 'react-redux'
 import {empty, merge, of} from 'rxjs'
 import {catchError, delay, filter, mergeMap, takeUntil, withLatestFrom} from 'rxjs/operators'
 import constructFilter from '../../utils/constructFilter'

package/src/operators/debugThrottle.ts

@@ -1,4 +1,4 @@
-import {iif, Observable, of, throwError} from 'rxjs'
+import {iif, type Observable, of, throwError} from 'rxjs'
 import {delay, mergeMap} from 'rxjs/operators'
 
 const debugThrottle = (throttled?: boolean) => {

package/src/plugin.tsx

@@ -1,10 +1,10 @@
 import React from 'react'
-import {AssetSource, Tool as SanityTool, definePlugin} from 'sanity'
+import {type AssetSource, type Tool as SanityTool, definePlugin} from 'sanity'
 import {ImageIcon} from '@sanity/icons'
 import FormBuilderTool from './components/FormBuilderTool'
 import Tool from './components/Tool'
 import mediaTag from './schemas/tag'
-import {MediaToolOptions} from '@types'
+import type {MediaToolOptions} from '@types'
 import {ToolOptionsProvider} from './contexts/ToolOptionsContext'
 
 const plugin = {
@@ -20,7 +20,9 @@ export const mediaAssetSource = {
 
 const tool = {
   ...plugin,
-  component: Tool
+  component: Tool,
+  // @ts-expect-error TS doesn't know about this internal field see https://github.com/sanity-io/sanity/pull/7980
+  __internalApplicationType: 'sanity/media'
 } satisfies SanityTool
 
 export const media = definePlugin<MediaToolOptions | void>(options => ({

package/src/styled/react-select/creatable.tsx

@@ -1,7 +1,7 @@
 import {AddIcon, ChevronDownIcon, CloseIcon} from '@sanity/icons'
-import {Box, Card, Flex, rem, studioTheme, Text, ThemeColorSchemeKey} from '@sanity/ui'
+import {Box, Card, Flex, rem, studioTheme, Text, type ThemeColorSchemeKey} from '@sanity/ui'
 import React from 'react'
-import {components, StylesConfig} from 'react-select'
+import {components, type StylesConfig} from 'react-select'
 import {Virtuoso} from 'react-virtuoso'
 import {getSchemeColor} from '../../utils/getSchemeColor'
 

package/src/styled/react-select/single.tsx

@@ -1,7 +1,7 @@
 import {CloseIcon} from '@sanity/icons'
-import {Box, Card, rem, studioTheme, Text, ThemeColorSchemeKey} from '@sanity/ui'
+import {Box, Card, rem, studioTheme, Text, type ThemeColorSchemeKey} from '@sanity/ui'
 import React from 'react'
-import {components, StylesConfig} from 'react-select'
+import {components, type StylesConfig} from 'react-select'
 import {Virtuoso} from 'react-virtuoso'
 import {getSchemeColor} from '../../utils/getSchemeColor'
 

package/src/types/index.ts

@@ -1,4 +1,4 @@
-import {AnyAction} from '@reduxjs/toolkit'
+import type {AnyAction} from '@reduxjs/toolkit'
 import type {
   SanityAssetDocument,
   SanityClient,
@@ -8,10 +8,14 @@ import type {
 import type {Epic} from 'redux-observable'
 import * as z from 'zod'
 import {assetFormSchema, tagFormSchema, tagOptionSchema} from '../formSchema'
-import {RootReducerState} from '../modules/types'
+import type {RootReducerState} from '../modules/types'
 
 export type MediaToolOptions = {
   maximumUploadSize?: number
+  creditLine: {
+    enabled: boolean
+    excludeSources?: string | string[]
+  }
 }
 
 type CustomFields = {
@@ -152,6 +156,7 @@ export type FileAsset = SanityAssetDocument &
 export type ImageAsset = SanityImageAssetDocument &
   CustomFields & {
     _type: 'sanity.imageAsset'
+    creditLine?: string
   }
 
 export type MarkDef = {_key: string; _type: string}
@@ -238,6 +243,7 @@ export type SearchFacetInputStringProps = SearchFacetInputCommon & {
 
 export type SearchFacetName =
   | 'altText'
+  | 'creditLine'
   | 'description'
   | 'fileName'
   | 'height'

package/src/utils/blocksToText.ts

@@ -1,4 +1,4 @@
-import {Block} from '@types'
+import type {Block} from '@types'
 
 const defaults = {nonTextBehavior: 'remove'}
 

package/src/utils/constructFilter.ts

@@ -1,4 +1,4 @@
-import {AssetType, SearchFacetInputProps} from '@types'
+import type {AssetType, SearchFacetInputProps} from '@types'
 import groq from 'groq'
 
 import {operators} from '../config/searchFacets'
@@ -85,7 +85,7 @@ const constructFilter = ({
     // references(*[_type == "media.tag" && name.current == "${searchQuery.trim()}"]._id)
     ...(searchQuery
       ? [
-          groq`[_id, altText, assetId, description, originalFilename, title, url] match '*${searchQuery.trim()}*'`
+          groq`[_id, altText, assetId, creditLine, description, originalFilename, title, url] match '*${searchQuery.trim()}*'`
         ]
       : []),
     // Search facets

package/src/utils/getAssetResolution.ts

@@ -1,4 +1,4 @@
-import {ImageAsset} from '@types'
+import type {ImageAsset} from '@types'
 
 const getAssetResolution = (asset: ImageAsset) => {
   return `${asset.metadata.dimensions.width}x${asset.metadata.dimensions.height}px`

package/src/utils/getSchemeColor.ts

@@ -1,5 +1,5 @@
 import {hues} from '@sanity/color'
-import {ThemeColorSchemeKey, studioTheme} from '@sanity/ui'
+import {type ThemeColorSchemeKey, studioTheme} from '@sanity/ui'
 
 const SCHEME_COLORS = {
   bg: {

package/src/utils/getTagSelectOptions.ts

@@ -1,4 +1,4 @@
-import {TagSelectOption, TagItem} from '@types'
+import type {TagSelectOption, TagItem} from '@types'
 
 const getTagSelectOptions = (tags: TagItem[]): TagSelectOption[] => {
   return tags.reduce((acc: TagSelectOption[], val) => {

package/src/utils/getUniqueDocuments.ts

@@ -1,4 +1,4 @@
-import {SanityDocument} from '@sanity/client'
+import type {SanityDocument} from '@sanity/client'
 
 export function getUniqueDocuments(documents: SanityDocument[]): SanityDocument[] {
   const draftIds = documents.reduce(

package/src/utils/imageDprUrl.ts

@@ -1,4 +1,4 @@
-import {ImageAsset} from '@types'
+import type {ImageAsset} from '@types'
 
 const imageDprUrl = (
   asset: ImageAsset,

package/src/utils/typeGuards.ts

@@ -1,4 +1,4 @@
-import {Asset, FileAsset, ImageAsset} from '@types'
+import type {Asset, FileAsset, ImageAsset} from '@types'
 
 export const isFileAsset = (asset: Asset): asset is FileAsset => {
   return (asset as FileAsset)._type === 'sanity.fileAsset'

package/src/utils/uploadSanityAsset.ts

@@ -2,7 +2,7 @@
 // https://github.com/sanity-io/sanity/blob/ccb777e115a8cdf20d81a9a2bc9d8c228568faff/packages/%40sanity/form-builder/src/sanity/inputs/client-adapters/assets.ts
 
 import type {SanityAssetDocument, SanityClient, SanityImageAssetDocument} from '@sanity/client'
-import {HttpError} from '@types'
+import type {HttpError} from '@types'
 import {Observable, of, throwError} from 'rxjs'
 import {map, mergeMap} from 'rxjs/operators'
 import {withMaxConcurrency} from './withMaxConcurrency'

package/dist/index.cjs.mjs

@@ -1,5 +0,0 @@
-import cjs from './index.js';
-
-export const media = cjs.media;
-export const mediaAssetSource = cjs.mediaAssetSource;
-