@skopon-cool/form-sdk 0.6.3 → 0.6.5

package/src/catalog/fileUploadPreview.test.tsx

@@ -58,7 +58,11 @@ function renderFileSurface(options: {
   onUploadingChange?: (uploading: boolean) => void
   fileExampleUrls?: string[]
   fileReviewCriteria?: string
+  fileReviewStatus?: 'passed' | 'failed'
+  fileReviewMessage?: string
+  fileRejectedUrls?: string[]
   help?: string
+  withUploader?: boolean
 } = {}) {
   const doc = blocksToA2ui(
     {
@@ -75,6 +79,9 @@ function renderFileSurface(options: {
           defaultValue: options.defaultValue,
           fileExampleUrls: options.fileExampleUrls,
           fileReviewCriteria: options.fileReviewCriteria,
+          fileReviewStatus: options.fileReviewStatus,
+          fileReviewMessage: options.fileReviewMessage,
+          fileRejectedUrls: options.fileRejectedUrls,
           help: options.help,
         },
       ],
@@ -92,6 +99,7 @@ function renderFileSurface(options: {
       surfaceId: 'upload-test',
       fieldNames: ['attachments'],
       onUploadingChange: options.onUploadingChange,
+      uploadMaterial: options.withUploader === false ? undefined : uploadMock,
     }),
   )
   const input = view.container.querySelector('input[type="file"]') as HTMLInputElement
@@ -111,9 +119,31 @@ describe('FileUploadPreview', () => {
     expect(getByAltText('附件示例 1').getAttribute('src')).toBe('https://cdn.example.com/example.jpg')
     expect(ref.current?.getValues()).toEqual({ attachments: [] })
   })
-  it('stores successful CDN URLs in user selection order', async () => {
-    const first = deferred<{ url: string }>()
-    const second = deferred<{ url: string }>()
+  it('shows a rejected uploaded file and reason without treating its old URL as a valid answer', () => {
+    const { getByText, container, ref } = renderFileSurface({
+      minCount: 1,
+      fileReviewStatus: 'failed',
+      fileReviewMessage: '场景中检测到人物',
+      fileRejectedUrls: ['https://cdn.example.com/rejected-scene.jpg'],
+    })
+    expect(getByText('❌ 审核不合格：场景中检测到人物')).toBeTruthy()
+    expect(container.textContent).toContain('rejected-scene.jpg')
+    expect(ref.current?.getValues()).toEqual({ attachments: [] })
+  })
+
+  it('shows and locks a retained approved upload', () => {
+    const { getByText, container, ref } = renderFileSurface({
+      defaultValue: ['https://cdn.example.com/approved.jpg'],
+      fileReviewStatus: 'passed',
+    })
+    expect(getByText('✅ 审核通过，已保留，无需重新上传')).toBeTruthy()
+    expect(container.textContent).toContain('approved.jpg')
+    expect(container.querySelector('input[type="file"]')?.hasAttribute('disabled')).toBe(true)
+    expect(ref.current?.getValues()).toEqual({ attachments: ['https://cdn.example.com/approved.jpg'] })
+  })
+  it('stores successful private asset IDs in user selection order', async () => {
+    const first = deferred<{ assetId: string; name: string; previewUrl: string }>()
+    const second = deferred<{ assetId: string; name: string; previewUrl: string }>()
     uploadMock
       .mockImplementationOnce(() => first.promise)
       .mockImplementationOnce(() => second.promise)
@@ -130,16 +160,16 @@ describe('FileUploadPreview', () => {
     await waitFor(() => expect(uploadMock).toHaveBeenCalledTimes(2))
     expect(uploadingChanges).toContain(true)
 
-    await act(async () => second.resolve({ url: 'https://cdn.example.com/second.pdf' }))
+    await act(async () => second.resolve({ assetId: 'mat_second', name: 'second.pdf', previewUrl: 'https://cdn.example.com/second.pdf' }))
     expect(ref.current?.getValues()).toEqual({
-      attachments: ['https://cdn.example.com/second.pdf'],
+      attachments: [{ asset_id: 'mat_second', source: 'upload' }],
     })
-    await act(async () => first.resolve({ url: 'https://cdn.example.com/first.pdf' }))
+    await act(async () => first.resolve({ assetId: 'mat_first', name: 'first.pdf', previewUrl: 'https://cdn.example.com/first.pdf' }))
     await waitFor(() =>
       expect(ref.current?.getValues()).toEqual({
         attachments: [
-          'https://cdn.example.com/first.pdf',
-          'https://cdn.example.com/second.pdf',
+          { asset_id: 'mat_first', source: 'upload' },
+          { asset_id: 'mat_second', source: 'upload' },
         ],
       }),
     )
@@ -157,11 +187,11 @@ describe('FileUploadPreview', () => {
   it('allows removing below minCount and aborts an in-flight request', async () => {
     let signal: AbortSignal | undefined
     uploadMock.mockImplementation(
-      (_file: File, options?: { signal?: AbortSignal }) => {
+      (_file: File, _field: unknown, options?: { signal?: AbortSignal }) => {
         signal = options?.signal
-        return new Promise<{ url: string }>((resolve) => {
+        return new Promise<{ assetId: string; name: string }>((resolve) => {
           signal?.addEventListener('abort', () => {
-            resolve({ url: 'https://cdn.example.com/ignored.pdf' })
+            resolve({ assetId: 'mat_ignored', name: 'ignored.pdf' })
           })
         })
       },
@@ -191,4 +221,40 @@ describe('FileUploadPreview', () => {
     )
     expect(getByText('legacy file.pdf')).toBeTruthy()
   })
+
+  it('fails closed when the host does not inject a private uploader', async () => {
+    const { input, getByText, ref } = renderFileSurface({ withUploader: false })
+    fireEvent.change(input, { target: { files: [new File(['x'], 'private.pdf')] } })
+    await waitFor(() => expect(getByText('当前宿主未配置私有物料上传，请联系管理员')).toBeTruthy())
+    expect(ref.current?.getValues()).toEqual({ attachments: [] })
+    expect(uploadMock).not.toHaveBeenCalled()
+  })
+})
+
+describe('Footage selection in generic material forms', () => {
+  function renderAssetField(mode: 'asset_only' | 'upload_or_asset') {
+    const ref = createRef<SkoponFormRendererRef>()
+    const doc = blocksToA2ui({ blocks: [{
+      id: 'asset-field', type: 'file', name: 'scene', label: '场景', fileSourceMode: mode,
+      fileMaxCount: 1, fileAssetOptions: [{ assetId: '17', label: '山景', assetType: 'image', url: 'https://cdn.test/scene.jpg' }],
+    }] }, { includeHeader: false })
+    return { ref, ...render(createElement(SkoponFormRenderer, { ref, doc, surfaceId: 'asset-test', fieldNames: ['scene'] })) }
+  }
+
+  it('asset-only fields submit the selected asset identity without uploading', async () => {
+    const view = renderAssetField('asset_only')
+    expect(view.container.querySelector('input[type="file"]')).toBeNull()
+    fireEvent.click(view.getByRole('button', { name: '选择素材' }))
+    fireEvent.click(await view.findByRole('button', { name: '选择素材 山景' }))
+    await waitFor(() => expect(view.ref.current?.getValues().scene).toEqual([{ asset_id: '17', source: 'library_select' }]))
+    expect(uploadMock).not.toHaveBeenCalled()
+  })
+
+  it('mixed fields retain both upload and library selection actions', async () => {
+    const view = renderAssetField('upload_or_asset')
+    expect(view.container.querySelector('input[type="file"]')).not.toBeNull()
+    fireEvent.click(view.getByRole('button', { name: '选择素材' }))
+    fireEvent.click(await view.findByRole('button', { name: '选择素材 山景' }))
+    await waitFor(() => expect(view.ref.current?.getValues().scene).toEqual([{ asset_id: '17', source: 'library_select' }]))
+  })
 })

package/src/catalog/materialUploadContext.tsx

@@ -0,0 +1,43 @@
+import { createContext, useContext, type ReactNode } from 'react'
+
+export interface MaterialUploadFieldContext {
+  fieldName?: string
+  moduleId?: string
+  positionKey?: string
+  assetSlotKey?: string
+  assetType?: string
+}
+
+export interface MaterialUploadResult {
+  assetId: string
+  name: string
+  mimeType?: string
+  size?: number
+  previewUrl?: string
+}
+
+export type MaterialUploadFn = (
+  file: File,
+  context: MaterialUploadFieldContext,
+  options?: { signal?: AbortSignal },
+) => Promise<MaterialUploadResult>
+
+const MaterialUploadContext = createContext<MaterialUploadFn | null>(null)
+
+export function MaterialUploadProvider({
+  uploadMaterial,
+  children,
+}: {
+  uploadMaterial?: MaterialUploadFn | null
+  children: ReactNode
+}) {
+  return (
+    <MaterialUploadContext.Provider value={uploadMaterial ?? null}>
+      {children}
+    </MaterialUploadContext.Provider>
+  )
+}
+
+export function useMaterialUpload(): MaterialUploadFn | null {
+  return useContext(MaterialUploadContext)
+}

package/src/catalog/moduleTabs.test.tsx

@@ -0,0 +1,59 @@
+// @vitest-environment happy-dom
+import { afterEach, beforeAll, describe, expect, it, vi } from 'vitest'
+
+vi.mock('@a2ui/web_core/v0_9/basic_catalog', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('@a2ui/web_core/v0_9/basic_catalog')>()
+  return { ...actual, injectBasicCatalogStyles: vi.fn() }
+})
+vi.mock('@a2ui/react/styles', () => ({ injectStyles: vi.fn(), removeStyles: vi.fn() }))
+
+import { createElement } from 'react'
+import { cleanup, fireEvent, render } from '@testing-library/react'
+import { blocksToA2ui } from '../adapter/a2uiAdapter'
+import SkoponFormRenderer from '../components/SkoponFormRenderer'
+
+beforeAll(() => {
+  class ResizeObserverMock { observe() {} unobserve() {} disconnect() {} }
+  vi.stubGlobal('ResizeObserver', ResizeObserverMock)
+})
+afterEach(cleanup)
+
+describe('form module tabs', () => {
+  it('renders grouped upload fields and module guidance inside tabs', () => {
+    const doc = blocksToA2ui({
+      title: '',
+      description: '',
+      modules: [
+        { id: 'person', label: '人物', reviewCriteria: '人物五官清晰' },
+        { id: 'scene', label: '场景', reviewCriteria: '场景中不能有人物' },
+      ],
+      blocks: [
+        { id: 'p', type: 'file', name: 'person', label: '人物图', moduleId: 'person', fileSourceMode: 'upload_required', fileReviewCriteria: '人物五官清晰' },
+        { id: 'p2', type: 'file', name: 'person2', label: '人物备选图', moduleId: 'person', fileSourceMode: 'upload_or_asset', fileReviewCriteria: '人物五官清晰' },
+        { id: 's', type: 'file', name: 'scene', label: '场景图', moduleId: 'scene', fileSourceMode: 'asset_only', fileReviewCriteria: '场景中不能有人物' },
+      ],
+    })
+    const view = render(createElement(SkoponFormRenderer, { doc, surfaceId: 'modules-test' }))
+    expect(view.container.querySelector('.skopon-compact-upload')).toBeTruthy()
+    expect(view.container.querySelector('.ant-upload-drag')).toBeNull()
+    expect(view.getByText('人物图')).toBeTruthy()
+    expect(view.getByText('物料 · 仅上传')).toBeTruthy()
+    expect(view.container.querySelectorAll('.skopon-compact-upload__state-mark')).toHaveLength(0)
+    expect(view.container.textContent).not.toContain('最多 1')
+    const cards = view.container.querySelectorAll('.skopon-compact-upload')
+    expect(cards).toHaveLength(2)
+    expect(cards[0].querySelector('button')?.textContent?.replace(/\s/g, '')).toContain('上传')
+    expect(cards[0].textContent).not.toContain('选择素材')
+    expect(cards[1].textContent).toContain('物料或素材')
+    expect(cards[1].textContent?.replace(/\s/g, '')).toContain('上传')
+    expect(cards[1].textContent).toContain('选择素材')
+    expect(view.getByText('人物素材要求')).toBeTruthy()
+    expect(view.getByText('人物五官清晰')).toBeTruthy()
+    fireEvent.click(view.getByRole('button', { name: '场景' }))
+    expect(view.getByText('场景图')).toBeTruthy()
+    expect(view.getByText('素材 · 仅选择')).toBeTruthy()
+    expect(view.queryByRole('button', { name: '上传' })).toBeNull()
+    expect(view.getByRole('button', { name: '选择素材' })).toBeTruthy()
+    expect(view.getByText('场景中不能有人物')).toBeTruthy()
+  })
+})

package/src/components/AskUserFormCard.tsx

@@ -41,6 +41,7 @@ import {
 import SkoponFormRenderer, { type SkoponFormRendererRef } from './SkoponFormRenderer'
 import CurlSubmitBlock from './CurlSubmitBlock'
 import SkoponFormProvider from './SkoponFormProvider'
+import type { MaterialUploadFn } from '../catalog/materialUploadContext'
 
 const REFRESH_REPORT_DEBOUNCE_MS = 80
 
@@ -61,6 +62,8 @@ export interface AskUserFormCardProps {
   payload: unknown
   /** 可选；无则跳过拉取 vt_forms，仅用 payload blocks fallback */
   formUniqueId?: string | null
+  /** 开放卡使用 latest；已提交/失效卡使用 snapshot，冻结发卡时外观。 */
+  formDefinitionPolicy?: 'latest' | 'snapshot'
   /**
    * ask_source_unique_id（Flow/QA 业务 id）。
    * 有值且 sessionStorage.auth_user.realtime_ws_url 存在、且渲染出表单控件时按卡建连。
@@ -80,6 +83,8 @@ export interface AskUserFormCardProps {
   contentSearch?: ContentSearchFn | null
   /** 案例单选组件：注入搜索函数 */
   caseSearch?: CaseSearchFn | null
+  /** 用户私有物料上传函数，由宿主负责浏览器直传及上下文。 */
+  uploadMaterial?: MaterialUploadFn | null
 }
 
 interface AskUserFormCardBodyProps extends AskUserFormCardProps {
@@ -90,6 +95,7 @@ interface AskUserFormCardBodyProps extends AskUserFormCardProps {
 function AskUserFormCardBody({
   payload,
   formUniqueId,
+  formDefinitionPolicy = 'latest',
   askUserMessageId,
   callbackUrl,
   submitMode = 'curl',
@@ -100,6 +106,7 @@ function AskUserFormCardBody({
   resumeSearch = null,
   contentSearch = null,
   caseSearch = null,
+  uploadMaterial = null,
   onSurfaceReadyChange,
   onAutoControlReady,
 }: AskUserFormCardBodyProps) {
@@ -147,7 +154,7 @@ function AskUserFormCardBody({
 
   useEffect(() => {
     let cancelled = false
-    if (!resolvedFormUniqueId) {
+    if (!resolvedFormUniqueId || formDefinitionPolicy === 'snapshot') {
       setLoading(false)
       setFormDisabled(false)
       setFormDef(null)
@@ -178,18 +185,30 @@ function AskUserFormCardBody({
     return () => {
       cancelled = true
     }
-  }, [resolvedFormUniqueId, fetchFormDetail])
+  }, [resolvedFormUniqueId, fetchFormDetail, formDefinitionPolicy])
 
   const payloadDef = useMemo(() => parsePayloadBlocksJson(payload), [payload])
 
+  // Older hibot servers omitted schema when persisting card_data.payload.
+  // Runtime source mode is unique to the dynamic material collection payload,
+  // so retain its snapshot blocks in that compatibility case as well.
+  const dynamicMaterialForm = payloadDef?.schema === 'skopon.material-form/v2' || Boolean(
+    payloadDef?.rawBlocks?.some((block) =>
+      block.type === 'file' &&
+      ['upload_required', 'upload_or_asset', 'asset_only'].includes(String(block.fileSourceMode)),
+    ),
+  )
+
   const intersection = useMemo(() => {
     if (!payloadDef) return null
-    return intersectPayloadBlocksWithForm(payloadDef, formDef ?? undefined)
-  }, [payloadDef, formDef])
+    return intersectPayloadBlocksWithForm(payloadDef, formDef ?? undefined, {
+      definitionPolicy: formDefinitionPolicy,
+    })
+  }, [payloadDef, formDef, formDefinitionPolicy])
 
   const matchedBlocks = intersection?.matchedBlocks ?? []
   const usePayloadFallback =
-    Boolean(payloadDef && payloadHasInputBlocks(payloadDef) && matchedBlocks.length === 0)
+    Boolean(payloadDef && payloadHasInputBlocks(payloadDef) && (dynamicMaterialForm || matchedBlocks.length === 0))
 
   const renderBlocks = useMemo(() => {
     if (usePayloadFallback && payloadDef) {
@@ -224,16 +243,17 @@ function AskUserFormCardBody({
     [renderBlocks],
   )
 
-  const surfaceTitle = intersection?.title ?? payloadDef?.title ?? ''
-  const surfaceDescription = intersection?.description ?? payloadDef?.description ?? ''
+  const surfaceTitle = dynamicMaterialForm ? payloadDef?.title ?? '' : intersection?.title ?? payloadDef?.title ?? ''
+  const surfaceDescription = dynamicMaterialForm ? payloadDef?.description ?? '' : intersection?.description ?? payloadDef?.description ?? ''
+  const surfaceModules = dynamicMaterialForm ? payloadDef?.modules : intersection?.modules ?? payloadDef?.modules
 
   const surfaceDoc = useMemo(() => {
     if (renderBlocks.length === 0) return null
     return buildAskUserSurface(
-      { title: surfaceTitle, description: surfaceDescription },
+      { title: surfaceTitle, description: surfaceDescription, modules: surfaceModules },
       renderBlocks,
     )
-  }, [surfaceTitle, surfaceDescription, renderBlocks])
+  }, [surfaceTitle, surfaceDescription, surfaceModules, renderBlocks])
 
   const docKey = useMemo(() => {
     if (!surfaceDoc) return ''
@@ -370,8 +390,10 @@ function AskUserFormCardBody({
       const effectiveForm =
         renderBlocks.length > 0
           ? {
+              ...(dynamicMaterialForm ? { schema: 'skopon.material-form/v2' as const } : {}),
               title: surfaceTitle,
               description: surfaceDescription,
+              modules: surfaceModules,
               blocks: renderBlocks,
             }
           : (payloadDef ?? undefined)
@@ -411,6 +433,7 @@ function AskUserFormCardBody({
     renderBlocks,
     surfaceTitle,
     surfaceDescription,
+    surfaceModules,
     extraValues,
     reportSnapshot,
     runtime,
@@ -497,6 +520,7 @@ function AskUserFormCardBody({
         resumeSearch={resumeSearch}
         contentSearch={contentSearch}
         caseSearch={caseSearch}
+        uploadMaterial={uploadMaterial}
         onUploadingChange={setUploading}
       />
 

package/src/components/AskUserFormCard.upload.test.tsx

@@ -39,6 +39,29 @@ beforeEach(() => {
 afterEach(cleanup)
 
 describe('AskUserFormCard file upload guard', () => {
+  it('freezes settled cards on the message snapshot without fetching latest definition', async () => {
+    const fetchFormDetail = vi.fn()
+    const snapshotBlock = {
+      id: 'snapshot-title',
+      type: 'text' as const,
+      name: 'title',
+      label: '历史标题',
+      defaultValue: '已提交内容',
+    }
+    const view = render(
+      createElement(AskUserFormCard, {
+        payload: { title: '历史表单', description: '', blocks: [snapshotBlock] },
+        formUniqueId: 'form-versioned',
+        formDefinitionPolicy: 'snapshot',
+        callbackUrl: null,
+        fetchFormDetail,
+      }),
+    )
+
+    await waitFor(() => expect(view.getByText('历史标题')).toBeTruthy())
+    expect(fetchFormDetail).not.toHaveBeenCalled()
+  })
+
   it('disables submit until every file upload settles', async () => {
     let resolveUpload!: (value: { url: string }) => void
     uploadMock.mockReturnValue(
@@ -89,3 +112,46 @@ describe('AskUserFormCard file upload guard', () => {
     await waitFor(() => expect(submit.disabled).toBe(false))
   })
 })
+
+it('generic material schemas render every runtime position even when only some keys match the stored form', async () => {
+  const field = { id: 'portrait', type: 'file' as const, name: 'portrait', label: '人物', moduleId: 'people' }
+  const view = render(createElement(AskUserFormCard, {
+    payload: { schema: 'skopon.material-form/v2', title: '通用素材收集', modules: [{ id: 'people', label: '人物 Tab' }], blocks: [field, { ...field, id: 'outfit', name: 'outfit', label: '服装' }] },
+    formUniqueId: 'generic-form', callbackUrl: '/callback',
+    fetchFormDetail: async () => ({ formUniqueId: 'generic-form', disabled: false, formDefinition: normalizeFormDefinition({ title: '旧标题', blocks: [field], jsonSchema: {} }) }),
+  }))
+  await waitFor(() => expect(view.getByText('服装')).toBeTruthy())
+  expect(view.getByText('人物')).toBeTruthy()
+  expect(view.getByText('人物 Tab')).toBeTruthy()
+})
+
+it('keeps runtime material source modes when hibot snapshot omits the schema marker', async () => {
+  const module = { id: 'materials', label: '素材' }
+  const payloadBlocks = [
+    { id: 'upload', name: 'upload', type: 'file' as const, label: '物料', moduleId: 'materials', fileSourceMode: 'upload_required' as const },
+    { id: 'asset', name: 'asset', type: 'file' as const, label: '素材', moduleId: 'materials', fileSourceMode: 'asset_only' as const },
+    { id: 'mixed', name: 'mixed', type: 'file' as const, label: '物料或素材', moduleId: 'materials', fileSourceMode: 'upload_or_asset' as const },
+  ]
+  const storedBlocks = payloadBlocks.map(({ fileSourceMode: _mode, ...block }) => block)
+  const formDefinition = normalizeFormDefinition({
+    title: '存量表单', modules: [module], blocks: storedBlocks, jsonSchema: {},
+  })
+  const view = render(createElement(AskUserFormCard, {
+    payload: { title: '本次素材', modules: [module], blocks: payloadBlocks },
+    formUniqueId: 'generic-form', callbackUrl: '/callback',
+    fetchFormDetail: async () => ({ formUniqueId: 'generic-form', disabled: false, formDefinition }),
+  }))
+
+  await waitFor(() => expect(view.container.querySelectorAll('.skopon-compact-upload')).toHaveLength(3))
+  const cards = view.container.querySelectorAll('.skopon-compact-upload')
+  const text = (index: number) => (cards[index].textContent || '').replace(/\s/g, '')
+  expect(text(0)).toContain('物料·仅上传')
+  expect(text(0)).toContain('上传')
+  expect(text(0)).not.toContain('选择素材')
+  expect(text(1)).toContain('素材·仅选择')
+  expect(text(1)).toContain('选择素材')
+  expect(text(1)).not.toContain('上传')
+  expect(text(2)).toContain('物料或素材')
+  expect(text(2)).toContain('上传')
+  expect(text(2)).toContain('选择素材')
+})

package/src/components/SkoponFormRenderer.tsx

@@ -16,6 +16,7 @@ import { isA2uiSurfaceEmpty, surfaceDocToMessages } from '../adapter/a2uiAdapter
 import { SKOPON_CATALOG_ID, buildSkoponCatalog } from '../catalog/a2uiCustomCatalog'
 import { A2uiPreviewModeProvider } from '../catalog/a2uiPreviewContext'
 import { FileUploadStatusProvider } from '../catalog/fileUploadStatusContext'
+import { MaterialUploadProvider, type MaterialUploadFn } from '../catalog/materialUploadContext'
 import { CaseSearchProvider, type CaseSearchFn } from '../catalog/caseSearchContext'
 import { ContentSearchProvider, type ContentSearchFn } from '../catalog/contentSearchContext'
 import { ResumeSearchProvider, type ResumeSearchFn } from '../catalog/resumeSearchContext'
@@ -41,6 +42,8 @@ export interface SkoponFormRendererProps {
   caseSearch?: CaseSearchFn | null
   /** 任意文件上传任务的聚合状态 */
   onUploadingChange?: (uploading: boolean) => void
+  /** 宿主注入的用户私有物料直传；未注入时上传会失败并提示配置。 */
+  uploadMaterial?: MaterialUploadFn | null
   /** 外层已包裹 SkoponFormProvider 时可设为 false，避免重复 ConfigProvider */
   wrapProvider?: boolean
 }
@@ -57,6 +60,7 @@ const SkoponFormRenderer = forwardRef<SkoponFormRendererRef, SkoponFormRendererP
       contentSearch = null,
       caseSearch = null,
       onUploadingChange,
+      uploadMaterial = null,
       wrapProvider = true,
     },
     ref,
@@ -144,6 +148,7 @@ const SkoponFormRenderer = forwardRef<SkoponFormRendererRef, SkoponFormRendererP
     }
 
     const content = (
+      <MaterialUploadProvider uploadMaterial={uploadMaterial}>
       <FileUploadStatusProvider onUploadingChange={onUploadingChange}>
         <ResumeSearchProvider resumeSearch={resumeSearch}>
           <ContentSearchProvider contentSearch={contentSearch}>
@@ -159,6 +164,7 @@ const SkoponFormRenderer = forwardRef<SkoponFormRendererRef, SkoponFormRendererP
           </ContentSearchProvider>
         </ResumeSearchProvider>
       </FileUploadStatusProvider>
+      </MaterialUploadProvider>
     )
 
     return wrapProvider ? <SkoponFormProvider>{content}</SkoponFormProvider> : content

package/src/icons/FilePlaceholderIcon.tsx

@@ -1,8 +1,8 @@
 import {
   FileExcelOutlined,
+  FileImageOutlined,
   FileOutlined,
   FileTextOutlined,
-  PictureOutlined,
   SoundOutlined,
   VideoCameraOutlined,
 } from '@ant-design/icons'
@@ -11,7 +11,7 @@ import type { FormFilePlaceholderIcon } from '../types/index'
 const PLACEHOLDER_ICON_COMPONENTS = {
   video: VideoCameraOutlined,
   audio: SoundOutlined,
-  image: PictureOutlined,
+  image: FileImageOutlined,
   file: FileOutlined,
   spreadsheet: FileExcelOutlined,
   document: FileTextOutlined,

package/src/index.ts

@@ -4,6 +4,7 @@ export type {
   A2uiComponentNode,
   A2uiSurfaceDoc,
   FormBlock,
+  FormAssetOption,
   FormBlockCondition,
   FormBlockOption,
   FormBlockType,
@@ -15,6 +16,7 @@ export type {
   FormFilePlaceholderIcon,
   FormJsonSchema,
   FormMediaSize,
+  FormModule,
   FormResumeFilter,
   FormSchema,
   SubmitMode,