sanity-plugin-media 3.0.5 → 4.1.0

package/README.md

@@ -95,10 +95,14 @@ export default defineConfig({
 })
 ```
 
+
 ### Plugin Config
 
 ```ts
 // sanity.config.ts
+import {media} from 'sanity-plugin-media'
+import {CustomDetails} from './MyCustomDetails'
+
 export default defineConfig({
   //...
   plugins: [
@@ -111,13 +115,40 @@ export default defineConfig({
         // string | string[] - when used with 3rd party asset sources, you may
         // wish to prevent users overwriting the creditLine based on the `source.name`
       },
-      maximumUploadSize: 10000000
+      maximumUploadSize: 10000000,
       // number - maximum file size (in bytes) that can be uploaded through the plugin interface
+      directUploads: true,
+      // boolean - enable / disable direct uploads through the plugin interface (default true)
+      components: {
+        details: CustomDetails
+        // Custom component for asset details (see below)
+      }
+      // Custom components to override default UI (see below)
     })
   ],
 })
 ```
 
+#### Custom Asset Details Component
+
+Custom React component for the asset details form via the plugin config. This allows you to override or extend the default asset details UI.
+
+Your component will receive all form props and a `renderDefaultDetails(props)` function for fallback or composition.
+
+```tsx
+// Example custom details component
+export function CustomDetails(props) {
+  // You can render the default details, or add your own fields
+  return (
+    <>
+      <h3>Custom header</h3>
+      {/* Change the UI as you see fit */}
+      {props.renderDefaultDetails(props)}
+    </>
+  )
+}
+```
+
 ## Known issues
 
 <details>

package/dist/index.d.mts

@@ -1,14 +1,177 @@
 import {AssetSourceComponentProps} from 'sanity'
+import type {ComponentType} from 'react'
+import {Control} from 'react-hook-form'
+import {FieldErrors} from 'react-hook-form'
 import {ForwardRefExoticComponent} from 'react'
 import {JSX as JSX_2} from 'react'
 import {Plugin as Plugin_2} from 'sanity'
 import {RefAttributes} from 'react'
+import type {SanityAssetDocument} from '@sanity/client'
+import type {SanityImageAssetDocument} from '@sanity/client'
 import {SVGProps} from 'react'
+import {UseFormRegister} from 'react-hook-form'
+import * as z from 'zod'
+
+declare type Asset = FileAsset | ImageAsset
+
+declare type AssetFormData = z.infer<typeof assetFormSchema>
+
+declare const assetFormSchema: z.ZodObject<
+  {
+    altText: z.ZodOptional<z.ZodString>
+    creditLine: z.ZodOptional<z.ZodString>
+    description: z.ZodOptional<z.ZodString>
+    opt: z.ZodObject<
+      {
+        media: z.ZodObject<
+          {
+            tags: z.ZodNullable<
+              z.ZodArray<
+                z.ZodObject<
+                  {
+                    label: z.ZodString
+                    value: z.ZodString
+                  },
+                  'strip',
+                  z.ZodTypeAny,
+                  {
+                    label: string
+                    value: string
+                  },
+                  {
+                    label: string
+                    value: string
+                  }
+                >,
+                'many'
+              >
+            >
+          },
+          'strip',
+          z.ZodTypeAny,
+          {
+            tags:
+              | {
+                  label: string
+                  value: string
+                }[]
+              | null
+          },
+          {
+            tags:
+              | {
+                  label: string
+                  value: string
+                }[]
+              | null
+          }
+        >
+      },
+      'strip',
+      z.ZodTypeAny,
+      {
+        media: {
+          tags:
+            | {
+                label: string
+                value: string
+              }[]
+            | null
+        }
+      },
+      {
+        media: {
+          tags:
+            | {
+                label: string
+                value: string
+              }[]
+            | null
+        }
+      }
+    >
+    originalFilename: z.ZodString
+    title: z.ZodOptional<z.ZodString>
+  },
+  'strip',
+  z.ZodTypeAny,
+  {
+    opt: {
+      media: {
+        tags:
+          | {
+              label: string
+              value: string
+            }[]
+          | null
+      }
+    }
+    originalFilename: string
+    altText?: string | undefined
+    creditLine?: string | undefined
+    description?: string | undefined
+    title?: string | undefined
+  },
+  {
+    opt: {
+      media: {
+        tags:
+          | {
+              label: string
+              value: string
+            }[]
+          | null
+      }
+    }
+    originalFilename: string
+    altText?: string | undefined
+    creditLine?: string | undefined
+    description?: string | undefined
+    title?: string | undefined
+  }
+>
+
+declare type CustomFields = {
+  altText?: string
+  description?: string
+  opt?: {
+    media?: {
+      tags?: SanityReference[]
+    }
+  }
+  title?: string
+}
+
+declare type DetailsProps = {
+  formUpdating: boolean
+  handleCreateTag: (title: string) => void
+  control: Control<AssetFormData>
+  errors: FieldErrors<AssetFormData>
+  register: UseFormRegister<AssetFormData>
+  allTagOptions: TagSelectOption[]
+  assetTagOptions: TagSelectOption[] | null
+  currentAsset: Asset
+  creditLine?: {
+    enabled: boolean
+    excludeSources?: string | string[] | undefined
+  }
+}
+
+declare type FileAsset = SanityAssetDocument &
+  CustomFields & {
+    _type: 'sanity.fileAsset'
+  }
+
+declare type ImageAsset = SanityImageAssetDocument &
+  CustomFields & {
+    _type: 'sanity.imageAsset'
+    creditLine?: string
+  }
 
 export declare const media: Plugin_2<void | MediaToolOptions>
 
 export declare const mediaAssetSource: {
-  component: (props: AssetSourceComponentProps) => JSX_2.Element
+  component: (props: AssetSourceComponentProps) => JSX_2
   icon: ForwardRefExoticComponent<
     Omit<SVGProps<SVGSVGElement>, 'ref'> & RefAttributes<SVGSVGElement>
   >
@@ -18,10 +181,43 @@ export declare const mediaAssetSource: {
 
 export declare type MediaToolOptions = {
   maximumUploadSize?: number
+  components?: {
+    details?: ComponentType<
+      DetailsProps & {
+        renderDefaultDetails: (props: DetailsProps) => JSX_2.Element
+      }
+    >
+  }
   creditLine: {
     enabled: boolean
     excludeSources?: string | string[]
   }
+  directUploads?: boolean
 }
 
+declare type SanityReference = {
+  _ref: string
+  _type: 'reference'
+  _weak?: boolean
+}
+
+declare const tagOptionSchema: z.ZodObject<
+  {
+    label: z.ZodString
+    value: z.ZodString
+  },
+  'strip',
+  z.ZodTypeAny,
+  {
+    label: string
+    value: string
+  },
+  {
+    label: string
+    value: string
+  }
+>
+
+declare type TagSelectOption = z.infer<typeof tagOptionSchema>
+
 export {}

package/dist/index.d.ts

@@ -1,14 +1,177 @@
 import {AssetSourceComponentProps} from 'sanity'
+import type {ComponentType} from 'react'
+import {Control} from 'react-hook-form'
+import {FieldErrors} from 'react-hook-form'
 import {ForwardRefExoticComponent} from 'react'
 import {JSX as JSX_2} from 'react'
 import {Plugin as Plugin_2} from 'sanity'
 import {RefAttributes} from 'react'
+import type {SanityAssetDocument} from '@sanity/client'
+import type {SanityImageAssetDocument} from '@sanity/client'
 import {SVGProps} from 'react'
+import {UseFormRegister} from 'react-hook-form'
+import * as z from 'zod'
+
+declare type Asset = FileAsset | ImageAsset
+
+declare type AssetFormData = z.infer<typeof assetFormSchema>
+
+declare const assetFormSchema: z.ZodObject<
+  {
+    altText: z.ZodOptional<z.ZodString>
+    creditLine: z.ZodOptional<z.ZodString>
+    description: z.ZodOptional<z.ZodString>
+    opt: z.ZodObject<
+      {
+        media: z.ZodObject<
+          {
+            tags: z.ZodNullable<
+              z.ZodArray<
+                z.ZodObject<
+                  {
+                    label: z.ZodString
+                    value: z.ZodString
+                  },
+                  'strip',
+                  z.ZodTypeAny,
+                  {
+                    label: string
+                    value: string
+                  },
+                  {
+                    label: string
+                    value: string
+                  }
+                >,
+                'many'
+              >
+            >
+          },
+          'strip',
+          z.ZodTypeAny,
+          {
+            tags:
+              | {
+                  label: string
+                  value: string
+                }[]
+              | null
+          },
+          {
+            tags:
+              | {
+                  label: string
+                  value: string
+                }[]
+              | null
+          }
+        >
+      },
+      'strip',
+      z.ZodTypeAny,
+      {
+        media: {
+          tags:
+            | {
+                label: string
+                value: string
+              }[]
+            | null
+        }
+      },
+      {
+        media: {
+          tags:
+            | {
+                label: string
+                value: string
+              }[]
+            | null
+        }
+      }
+    >
+    originalFilename: z.ZodString
+    title: z.ZodOptional<z.ZodString>
+  },
+  'strip',
+  z.ZodTypeAny,
+  {
+    opt: {
+      media: {
+        tags:
+          | {
+              label: string
+              value: string
+            }[]
+          | null
+      }
+    }
+    originalFilename: string
+    altText?: string | undefined
+    creditLine?: string | undefined
+    description?: string | undefined
+    title?: string | undefined
+  },
+  {
+    opt: {
+      media: {
+        tags:
+          | {
+              label: string
+              value: string
+            }[]
+          | null
+      }
+    }
+    originalFilename: string
+    altText?: string | undefined
+    creditLine?: string | undefined
+    description?: string | undefined
+    title?: string | undefined
+  }
+>
+
+declare type CustomFields = {
+  altText?: string
+  description?: string
+  opt?: {
+    media?: {
+      tags?: SanityReference[]
+    }
+  }
+  title?: string
+}
+
+declare type DetailsProps = {
+  formUpdating: boolean
+  handleCreateTag: (title: string) => void
+  control: Control<AssetFormData>
+  errors: FieldErrors<AssetFormData>
+  register: UseFormRegister<AssetFormData>
+  allTagOptions: TagSelectOption[]
+  assetTagOptions: TagSelectOption[] | null
+  currentAsset: Asset
+  creditLine?: {
+    enabled: boolean
+    excludeSources?: string | string[] | undefined
+  }
+}
+
+declare type FileAsset = SanityAssetDocument &
+  CustomFields & {
+    _type: 'sanity.fileAsset'
+  }
+
+declare type ImageAsset = SanityImageAssetDocument &
+  CustomFields & {
+    _type: 'sanity.imageAsset'
+    creditLine?: string
+  }
 
 export declare const media: Plugin_2<void | MediaToolOptions>
 
 export declare const mediaAssetSource: {
-  component: (props: AssetSourceComponentProps) => JSX_2.Element
+  component: (props: AssetSourceComponentProps) => JSX_2
   icon: ForwardRefExoticComponent<
     Omit<SVGProps<SVGSVGElement>, 'ref'> & RefAttributes<SVGSVGElement>
   >
@@ -18,10 +181,43 @@ export declare const mediaAssetSource: {
 
 export declare type MediaToolOptions = {
   maximumUploadSize?: number
+  components?: {
+    details?: ComponentType<
+      DetailsProps & {
+        renderDefaultDetails: (props: DetailsProps) => JSX_2.Element
+      }
+    >
+  }
   creditLine: {
     enabled: boolean
     excludeSources?: string | string[]
   }
+  directUploads?: boolean
 }
 
+declare type SanityReference = {
+  _ref: string
+  _type: 'reference'
+  _weak?: boolean
+}
+
+declare const tagOptionSchema: z.ZodObject<
+  {
+    label: z.ZodString
+    value: z.ZodString
+  },
+  'strip',
+  z.ZodTypeAny,
+  {
+    label: string
+    value: string
+  },
+  {
+    label: string
+    value: string
+  }
+>
+
+declare type TagSelectOption = z.infer<typeof tagOptionSchema>
+
 export {}