@king-design/vue 3.7.0 → 3.8.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (227) hide show
  1. package/__tests__/__snapshots__/Vue Next Demos.md +399 -0
  2. package/components/bubble/bubble.d.ts +61 -0
  3. package/components/bubble/bubble.js +81 -0
  4. package/components/bubble/bubble.vdt.js +85 -0
  5. package/components/bubble/index.d.ts +1 -0
  6. package/components/bubble/index.js +1 -0
  7. package/components/bubble/index.spec.d.ts +1 -0
  8. package/components/bubble/index.spec.js +771 -0
  9. package/components/bubble/styles.d.ts +5 -0
  10. package/components/bubble/styles.js +53 -0
  11. package/components/bubble/useBubbleDisplay.d.ts +18 -0
  12. package/components/bubble/useBubbleDisplay.js +300 -0
  13. package/components/bubbleList/bubbleList.d.ts +87 -0
  14. package/components/bubbleList/bubbleList.js +75 -0
  15. package/components/bubbleList/bubbleList.vdt.js +143 -0
  16. package/components/bubbleList/index.d.ts +1 -0
  17. package/components/bubbleList/index.js +1 -0
  18. package/components/bubbleList/index.spec.d.ts +1 -0
  19. package/components/bubbleList/index.spec.js +1268 -0
  20. package/components/bubbleList/item.d.ts +16 -0
  21. package/components/bubbleList/item.js +27 -0
  22. package/components/bubbleList/item.vdt.js +36 -0
  23. package/components/bubbleList/styles.d.ts +5 -0
  24. package/components/bubbleList/styles.js +33 -0
  25. package/components/bubbleList/useBubbleList.d.ts +28 -0
  26. package/components/bubbleList/useBubbleList.js +455 -0
  27. package/components/checkbox/index.d.ts +3 -3
  28. package/components/fileCard/fileCard.d.ts +65 -0
  29. package/components/fileCard/fileCard.js +72 -0
  30. package/components/fileCard/fileCard.vdt.js +161 -0
  31. package/components/fileCard/fileCardAssets.d.ts +1 -0
  32. package/components/fileCard/fileCardAssets.js +54 -0
  33. package/components/fileCard/fileCardUtils.d.ts +14 -0
  34. package/components/fileCard/fileCardUtils.js +94 -0
  35. package/components/fileCard/index.d.ts +2 -0
  36. package/components/fileCard/index.js +2 -0
  37. package/components/fileCard/index.spec.d.ts +1 -0
  38. package/components/fileCard/index.spec.js +1096 -0
  39. package/components/fileCard/list.d.ts +29 -0
  40. package/components/fileCard/list.js +46 -0
  41. package/components/fileCard/list.vdt.js +71 -0
  42. package/components/fileCard/styles.d.ts +5 -0
  43. package/components/fileCard/styles.js +83 -0
  44. package/components/fileCard/useFileCard.d.ts +45 -0
  45. package/components/fileCard/useFileCard.js +330 -0
  46. package/components/fileCard/useFileCardList.d.ts +14 -0
  47. package/components/fileCard/useFileCardList.js +49 -0
  48. package/components/form/form.js +2 -1
  49. package/components/media/context.d.ts +6 -0
  50. package/components/media/context.js +2 -0
  51. package/components/media/group.d.ts +12 -0
  52. package/components/media/group.js +32 -0
  53. package/components/media/group.vdt.js +50 -0
  54. package/components/media/index.d.ts +2 -0
  55. package/components/media/index.js +2 -0
  56. package/components/media/index.spec.d.ts +1 -0
  57. package/components/media/index.spec.js +1691 -0
  58. package/components/media/media.d.ts +37 -0
  59. package/components/media/media.js +67 -0
  60. package/components/media/media.vdt.js +202 -0
  61. package/components/media/mediaAssets.d.ts +4 -0
  62. package/components/media/mediaAssets.js +9 -0
  63. package/components/media/mediaUtils.d.ts +6 -0
  64. package/components/media/mediaUtils.js +66 -0
  65. package/components/media/styles.d.ts +13 -0
  66. package/components/media/styles.js +52 -0
  67. package/components/media/types.d.ts +37 -0
  68. package/components/media/types.js +1 -0
  69. package/components/media/useMedia.d.ts +70 -0
  70. package/components/media/useMedia.js +471 -0
  71. package/components/media/useMediaGroup.d.ts +15 -0
  72. package/components/media/useMediaGroup.js +136 -0
  73. package/components/media/useMediaViewer.d.ts +14 -0
  74. package/components/media/useMediaViewer.js +129 -0
  75. package/components/media/viewer.d.ts +24 -0
  76. package/components/media/viewer.js +54 -0
  77. package/components/media/viewer.vdt.js +100 -0
  78. package/components/radio/index.d.ts +3 -3
  79. package/components/sender/icons.d.ts +3 -0
  80. package/components/sender/icons.js +17 -0
  81. package/components/sender/index.d.ts +1 -0
  82. package/components/sender/index.js +1 -0
  83. package/components/sender/index.spec.d.ts +1 -0
  84. package/components/sender/index.spec.js +1597 -0
  85. package/components/sender/sender.d.ts +104 -0
  86. package/components/sender/sender.js +111 -0
  87. package/components/sender/sender.vdt.js +230 -0
  88. package/components/sender/styles.d.ts +5 -0
  89. package/components/sender/styles.js +56 -0
  90. package/components/sender/useAutoResize.d.ts +4 -0
  91. package/components/sender/useAutoResize.js +99 -0
  92. package/components/sender/useSenderDrag.d.ts +6 -0
  93. package/components/sender/useSenderDrag.js +320 -0
  94. package/components/sender/useSenderInput.d.ts +16 -0
  95. package/components/sender/useSenderInput.js +101 -0
  96. package/components/sender/useSenderPaste.d.ts +5 -0
  97. package/components/sender/useSenderPaste.js +36 -0
  98. package/components/sender/useSenderUpload.d.ts +11 -0
  99. package/components/sender/useSenderUpload.js +395 -0
  100. package/components/skeleton/skeleton.d.ts +2 -1
  101. package/components/skeleton/skeleton.js +1 -1
  102. package/components/think/index.d.ts +1 -0
  103. package/components/think/index.js +1 -0
  104. package/components/think/index.spec.d.ts +1 -0
  105. package/components/think/index.spec.js +345 -0
  106. package/components/think/index.vdt.js +82 -0
  107. package/components/think/styles.d.ts +5 -0
  108. package/components/think/styles.js +25 -0
  109. package/components/think/think.d.ts +28 -0
  110. package/components/think/think.js +48 -0
  111. package/components/think/useThinkExpand.d.ts +10 -0
  112. package/components/think/useThinkExpand.js +56 -0
  113. package/components/types.d.ts +4 -2
  114. package/components/upload/ajaxUploader.d.ts +1 -0
  115. package/components/upload/ajaxUploader.js +6 -0
  116. package/components/xmarkdown/index.d.ts +2 -0
  117. package/components/xmarkdown/index.js +1 -0
  118. package/components/xmarkdown/index.spec.d.ts +1 -0
  119. package/components/xmarkdown/index.spec.js +1666 -0
  120. package/components/xmarkdown/markdown/codeBlockRenderer.d.ts +8 -0
  121. package/components/xmarkdown/markdown/codeBlockRenderer.js +52 -0
  122. package/components/xmarkdown/markdown/codeblock.d.ts +8 -0
  123. package/components/xmarkdown/markdown/codeblock.js +74 -0
  124. package/components/xmarkdown/markdown/highlight.d.ts +17 -0
  125. package/components/xmarkdown/markdown/highlight.js +83 -0
  126. package/components/xmarkdown/markdown/index.d.ts +14 -0
  127. package/components/xmarkdown/markdown/index.js +14 -0
  128. package/components/xmarkdown/markdown/mermaid.d.ts +8 -0
  129. package/components/xmarkdown/markdown/mermaid.js +104 -0
  130. package/components/xmarkdown/markdown/renderTree.d.ts +54 -0
  131. package/components/xmarkdown/markdown/renderTree.js +386 -0
  132. package/components/xmarkdown/markdown/renderer.d.ts +18 -0
  133. package/components/xmarkdown/markdown/renderer.js +461 -0
  134. package/components/xmarkdown/markdown/streaming.d.ts +24 -0
  135. package/components/xmarkdown/markdown/streaming.js +513 -0
  136. package/components/xmarkdown/markdown/types.d.ts +124 -0
  137. package/components/xmarkdown/markdown/types.js +6 -0
  138. package/components/xmarkdown/markdown/utils.d.ts +7 -0
  139. package/components/xmarkdown/markdown/utils.js +9 -0
  140. package/components/xmarkdown/markdown.d.ts +1 -0
  141. package/components/xmarkdown/markdown.js +1 -0
  142. package/components/xmarkdown/styles.d.ts +5 -0
  143. package/components/xmarkdown/styles.js +50 -0
  144. package/components/xmarkdown/useMermaid.d.ts +27 -0
  145. package/components/xmarkdown/useMermaid.js +745 -0
  146. package/components/xmarkdown/useXMarkdownContent.d.ts +14 -0
  147. package/components/xmarkdown/useXMarkdownContent.js +218 -0
  148. package/components/xmarkdown/useXMarkdownDisplay.d.ts +26 -0
  149. package/components/xmarkdown/useXMarkdownDisplay.js +569 -0
  150. package/components/xmarkdown/xmarkdown.d.ts +61 -0
  151. package/components/xmarkdown/xmarkdown.js +109 -0
  152. package/components/xmarkdown/xmarkdown.vdt.js +43 -0
  153. package/dist/fonts/KaTeX_AMS-Regular.ttf +0 -0
  154. package/dist/fonts/KaTeX_AMS-Regular.woff +0 -0
  155. package/dist/fonts/KaTeX_AMS-Regular.woff2 +0 -0
  156. package/dist/fonts/KaTeX_Caligraphic-Bold.ttf +0 -0
  157. package/dist/fonts/KaTeX_Caligraphic-Bold.woff +0 -0
  158. package/dist/fonts/KaTeX_Caligraphic-Bold.woff2 +0 -0
  159. package/dist/fonts/KaTeX_Caligraphic-Regular.ttf +0 -0
  160. package/dist/fonts/KaTeX_Caligraphic-Regular.woff +0 -0
  161. package/dist/fonts/KaTeX_Caligraphic-Regular.woff2 +0 -0
  162. package/dist/fonts/KaTeX_Fraktur-Bold.ttf +0 -0
  163. package/dist/fonts/KaTeX_Fraktur-Bold.woff +0 -0
  164. package/dist/fonts/KaTeX_Fraktur-Bold.woff2 +0 -0
  165. package/dist/fonts/KaTeX_Fraktur-Regular.ttf +0 -0
  166. package/dist/fonts/KaTeX_Fraktur-Regular.woff +0 -0
  167. package/dist/fonts/KaTeX_Fraktur-Regular.woff2 +0 -0
  168. package/dist/fonts/KaTeX_Main-Bold.ttf +0 -0
  169. package/dist/fonts/KaTeX_Main-Bold.woff +0 -0
  170. package/dist/fonts/KaTeX_Main-Bold.woff2 +0 -0
  171. package/dist/fonts/KaTeX_Main-BoldItalic.ttf +0 -0
  172. package/dist/fonts/KaTeX_Main-BoldItalic.woff +0 -0
  173. package/dist/fonts/KaTeX_Main-BoldItalic.woff2 +0 -0
  174. package/dist/fonts/KaTeX_Main-Italic.ttf +0 -0
  175. package/dist/fonts/KaTeX_Main-Italic.woff +0 -0
  176. package/dist/fonts/KaTeX_Main-Italic.woff2 +0 -0
  177. package/dist/fonts/KaTeX_Main-Regular.ttf +0 -0
  178. package/dist/fonts/KaTeX_Main-Regular.woff +0 -0
  179. package/dist/fonts/KaTeX_Main-Regular.woff2 +0 -0
  180. package/dist/fonts/KaTeX_Math-BoldItalic.ttf +0 -0
  181. package/dist/fonts/KaTeX_Math-BoldItalic.woff +0 -0
  182. package/dist/fonts/KaTeX_Math-BoldItalic.woff2 +0 -0
  183. package/dist/fonts/KaTeX_Math-Italic.ttf +0 -0
  184. package/dist/fonts/KaTeX_Math-Italic.woff +0 -0
  185. package/dist/fonts/KaTeX_Math-Italic.woff2 +0 -0
  186. package/dist/fonts/KaTeX_SansSerif-Bold.ttf +0 -0
  187. package/dist/fonts/KaTeX_SansSerif-Bold.woff +0 -0
  188. package/dist/fonts/KaTeX_SansSerif-Bold.woff2 +0 -0
  189. package/dist/fonts/KaTeX_SansSerif-Italic.ttf +0 -0
  190. package/dist/fonts/KaTeX_SansSerif-Italic.woff +0 -0
  191. package/dist/fonts/KaTeX_SansSerif-Italic.woff2 +0 -0
  192. package/dist/fonts/KaTeX_SansSerif-Regular.ttf +0 -0
  193. package/dist/fonts/KaTeX_SansSerif-Regular.woff +0 -0
  194. package/dist/fonts/KaTeX_SansSerif-Regular.woff2 +0 -0
  195. package/dist/fonts/KaTeX_Script-Regular.ttf +0 -0
  196. package/dist/fonts/KaTeX_Script-Regular.woff +0 -0
  197. package/dist/fonts/KaTeX_Script-Regular.woff2 +0 -0
  198. package/dist/fonts/KaTeX_Size1-Regular.ttf +0 -0
  199. package/dist/fonts/KaTeX_Size1-Regular.woff +0 -0
  200. package/dist/fonts/KaTeX_Size1-Regular.woff2 +0 -0
  201. package/dist/fonts/KaTeX_Size2-Regular.ttf +0 -0
  202. package/dist/fonts/KaTeX_Size2-Regular.woff +0 -0
  203. package/dist/fonts/KaTeX_Size2-Regular.woff2 +0 -0
  204. package/dist/fonts/KaTeX_Size3-Regular.ttf +0 -0
  205. package/dist/fonts/KaTeX_Size3-Regular.woff +0 -0
  206. package/dist/fonts/KaTeX_Size3-Regular.woff2 +0 -0
  207. package/dist/fonts/KaTeX_Size4-Regular.ttf +0 -0
  208. package/dist/fonts/KaTeX_Size4-Regular.woff +0 -0
  209. package/dist/fonts/KaTeX_Size4-Regular.woff2 +0 -0
  210. package/dist/fonts/KaTeX_Typewriter-Regular.ttf +0 -0
  211. package/dist/fonts/KaTeX_Typewriter-Regular.woff +0 -0
  212. package/dist/fonts/KaTeX_Typewriter-Regular.woff2 +0 -0
  213. package/dist/i18n/en-US.js +29 -1
  214. package/dist/i18n/en-US.js.map +1 -1
  215. package/dist/i18n/en-US.min.js +1 -1
  216. package/dist/index.js +100506 -37457
  217. package/dist/index.js.map +1 -1
  218. package/dist/index.min.js +1569 -1
  219. package/dist/kpc.css +4 -0
  220. package/dist/ksyun.css +4 -0
  221. package/i18n/en-US.d.ts +27 -0
  222. package/i18n/en-US.js +29 -1
  223. package/index.d.ts +9 -2
  224. package/index.js +9 -2
  225. package/package.json +8 -2
  226. package/styles/global.js +12 -6
  227. package/yarn-error.log +0 -1012
@@ -1,5 +1,331 @@
1
1
  # `Vue Next Demos`
2
2
 
3
+ ## `bubble`
4
+
5
+ #### `Bubble attachments`
6
+
7
+ ```
8
+ "<div class=\"bubble-demo-attachments\"><div class=\"k-bubble k-bubble-end k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>你</span></div><div class=\"k-bubble-header\"><span>你</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-attachments\"><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"店铺参考图.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"店铺参考图.jpg\" src=\"https://images.unsplash.com/photo-1524758631624-e2822e304c36?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-audio k-file-card-default\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-audio k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"旁白.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"分镜脚本.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"分镜脚本.pdf\"><span class=\"k-file-card-title-prefix\">分镜脚本</span><span class=\"k-file-card-title-suffix\">.pdf</span></div><div class=\"k-file-card-description\"><span>120 KB</span></div></div></div></div></div></div></div> 请基于这些输入素材做一个 20 秒的介绍短片。 </div></div></div><div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-attachments\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-video k-file-card-large\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-video k-media-large k-media-loading k-file-card-media-view css-bh0jn3\" title=\"intro.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"metadata\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\" poster=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div></div></div></div></div></div>"
9
+ ```
10
+
11
+ #### `Bubble basic`
12
+
13
+ ```
14
+ "<div class=\"bubble-demo-basic\"><div class=\"k-bubble k-bubble-end k-bubble-filled k-bubble-corner css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">介绍一下你自己</div></div></div></div><div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><img class=\"k-bubble-avatar-image\" src=\"https://dummyimage.com/64x64/1677ff/ffffff&amp;text=A\" alt=\"AI 助手\"></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">你好,我是AI小助手,很高兴认识你。</div></div><div class=\"k-bubble-footer\"><div class=\"bubble-demo-footer-bar\"><i class=\"k-icon k-hoverable k-icon-refresh css-16qej3\" title=\"重新生成\"></i><div><i class=\"k-icon k-hoverable k-icon-clone k-copy css-t3aops css-16qej3\" title=\"复制\"></i></div></div></div><div class=\"k-bubble-extra\">12 tokens · 0.4s</div></div></div><div class=\"k-bubble k-bubble-middle k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">系统消息:文档已自动保存,3 秒后继续生成。</div></div></div></div></div>"
15
+ ```
16
+
17
+ #### `Bubble customContent`
18
+
19
+ ```
20
+ "<div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>知</span></div><div class=\"k-bubble-header\"><span>知识库助手</span></div></div><div class=\"k-bubble-content\"><div class=\"bubble-demo-panel\"><div class=\"bubble-demo-panel-head\"><div><div class=\"bubble-demo-panel-title\">检索到 3 条相关内容</div><div class=\"bubble-demo-panel-subtitle\">来源:产品文档 / 设计规范 / FAQ</div></div><div class=\"bubble-demo-panel-badge\">Top 3</div></div><div class=\"bubble-demo-panel-list\"><div class=\"bubble-demo-panel-item\"><div class=\"bubble-demo-panel-item-title\">1. Bubble 组件设计说明</div><div class=\"bubble-demo-panel-item-desc\">包含 props、slots、variant 与 shape 的交互规范。</div></div><div class=\"bubble-demo-panel-item\"><div class=\"bubble-demo-panel-item-title\">2. Markdown 渲染约定</div><div class=\"bubble-demo-panel-item-desc\">说明聊天内容中的代码块、表格、链接和安全清洗策略。</div></div><div class=\"bubble-demo-panel-item\"><div class=\"bubble-demo-panel-item-title\">3. 对话类组件的 footer 策略</div><div class=\"bubble-demo-panel-item-desc\">由业务通过 footer 插槽按需接入操作区,避免组件内置过重语义。</div></div></div><div class=\"bubble-demo-panel-actions\"><button class=\"k-btn k-none css-h31bz\" tabindex=\"0\" type=\"button\">忽略</button><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">插入到回答</button></div></div></div><div class=\"k-bubble-extra\">可用于知识卡片、搜索结果、推荐模块等复杂区域</div></div></div>"
21
+ ```
22
+
23
+ #### `Bubble loading`
24
+
25
+ ```
26
+ "<div class=\"bubble-demo-loading\"><div class=\"bubble-demo-actions\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\"><span>停止 loading</span></button></div><div class=\"bubble-demo-loading-list\"><div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-loading\"><span class=\"k-bubble-loading-dot\"></span><span class=\"k-bubble-loading-dot\"></span><span class=\"k-bubble-loading-dot\"></span></div></div><div class=\"k-bubble-extra\">默认 loading</div></div></div><div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>工</span></div><div class=\"k-bubble-header\"><span>工作流引擎</span></div></div><div class=\"k-bubble-content\"><div class=\"bubble-demo-custom-loading\"><span class=\"bubble-demo-custom-loading-ring\"></span><span>正在调度 3 个子任务...</span></div></div><div class=\"k-bubble-extra\">通过 `loading` 插槽自定义加载区</div></div></div></div></div>"
27
+ ```
28
+
29
+ #### `Bubble shape`
30
+
31
+ ```
32
+ "<div class=\"bubble-demo-shape\"><div class=\"k-bubble k-bubble-start k-bubble-outlined k-bubble-round css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">round 更柔和,适合需要更强亲和感的对话场景。</div></div></div></div><div class=\"k-bubble k-bubble-start k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">square 是默认形状,更规整,适合偏工具型界面。</div></div></div></div><div class=\"k-bubble k-bubble-start k-bubble-outlined k-bubble-corner css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">corner 带一点对话尾巴的感觉,更像聊天气泡。</div></div></div></div></div>"
33
+ ```
34
+
35
+ #### `Bubble streaming`
36
+
37
+ ```
38
+ "<div class=\"bubble-demo-streaming\"><div class=\"bubble-demo-streaming-actions\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">慢速流式 + typing</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">快速流式 + typing</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">仅流式输出</button></div><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-loading\"><span class=\"k-bubble-loading-dot\"></span><span class=\"k-bubble-loading-dot\"></span><span class=\"k-bubble-loading-dot\"></span></div></div><div class=\"k-bubble-extra\"><div class=\"bubble-demo-streaming-extra\"><div>当前已渲染:(空)</div><div>完成事件触发次数:0</div></div></div></div></div></div>"
39
+ ```
40
+
41
+ #### `Bubble typing`
42
+
43
+ ```
44
+ "<div class=\"bubble-demo-typing\"><div class=\"bubble-demo-typing-actions\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">慢速播放</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">快速播放</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">逐字播放</button></div><div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">Bubble 的 typing 会在内容稳定后逐步推进,适合回答生成完成后的展示动画。</div></div><div class=\"k-bubble-extra\"><div class=\"bubble-demo-typing-extra\"><div>当前模式:未播放</div><div>完成次数:1</div></div></div></div></div></div>"
45
+ ```
46
+
47
+ #### `Bubble variant`
48
+
49
+ ```
50
+ "<div class=\"bubble-demo-variant\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">filled 适合强调主内容,是默认风格。</div></div></div></div><div class=\"k-bubble k-bubble-start k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">outlined 更适合信息卡片感或偏文档型内容。</div></div></div></div><div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">plain 更轻,适合弱化容器感的对话内容。</div></div></div></div></div>"
51
+ ```
52
+
53
+ #### `Bubble withThink`
54
+
55
+ ```
56
+ "<div class=\"think-demo-with-bubble\"><div class=\"think-demo-with-bubble-actions\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">开始流式思考</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">重置</button></div><div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-loading\"><span class=\"k-bubble-loading-dot\"></span><span class=\"k-bubble-loading-dot\"></span><span class=\"k-bubble-loading-dot\"></span></div></div></div></div></div>"
57
+ ```
58
+
59
+ #### `Bubble xmarkdown`
60
+
61
+ ```
62
+ "<div class=\"bubble-demo-xmarkdown\"><div class=\"bubble-demo-xmarkdown-actions\"><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">开始流式回复</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">重置</button></div><!--v-if--></div>"
63
+ ```
64
+
65
+ ## `bubbleList`
66
+
67
+ #### `BubbleList append`
68
+
69
+ ```
70
+ "<div class=\"bubble-list-demo-append\"><div class=\"bubble-list-demo-append-actions\"><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">追加对话</button><span>当前 2 条消息</span></div><div class=\"k-bubble-list bubble-list-demo-append-list css-4odw9o\"><div class=\"k-bubble-list-scroll\"><div class=\"k-bubble-list-scroll-content\"><div class=\"k-bubble-list-items\"><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-filled k-bubble-corner css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">先帮我搭一段两条消息的对话。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">好的,初始对话已经准备好了,可以继续追加新的消息。</div></div></div></div></div></div></div></div></div><div class=\"k-bubble-list-scroll-to-bottom\"><button class=\"k-bubble-list-scroll-to-bottom-button\" type=\"button\" title=\"回到底部\" aria-label=\"回到底部\"><i class=\"k-icon k-bubble-list-scroll-to-bottom-icon k-icon-down-bold css-16qej3\"></i></button></div></div></div>"
71
+ ```
72
+
73
+ #### `BubbleList basic`
74
+
75
+ ```
76
+ "<div class=\"k-bubble-list bubble-list-demo-basic css-4odw9o\"><div class=\"k-bubble-list-scroll\"><div class=\"k-bubble-list-scroll-content\"><div class=\"k-bubble-list-items\"><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-middle k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">这是您与AI助手的首次聊天</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-filled k-bubble-corner css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">你好,请做个自我介绍。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">你好呀,我是AI小助手,您有什么问题都可以尽情地问我呢,我一定会尽心尽力帮您解决。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-filled k-bubble-corner css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">怎么用KingDesign组件库?</div></div></div></div></div></div></div></div></div><div class=\"k-bubble-list-scroll-to-bottom\"><button class=\"k-bubble-list-scroll-to-bottom-button\" type=\"button\" title=\"回到底部\" aria-label=\"回到底部\"><i class=\"k-icon k-bubble-list-scroll-to-bottom-icon k-icon-down-bold css-16qej3\"></i></button></div></div>"
77
+ ```
78
+
79
+ #### `BubbleList customItem`
80
+
81
+ ```
82
+ "<div class=\"k-bubble-list bubble-list-demo-custom-item css-4odw9o\"><div class=\"k-bubble-list-scroll\"><div class=\"k-bubble-list-scroll-content\"><div class=\"k-bubble-list-items\"><div><div class=\"bubble-list-demo-custom-item-row bubble-list-demo-custom-item-row-summary\"><div class=\"bubble-list-demo-custom-item-main\"><div class=\"bubble-list-demo-custom-item-title\"><span>需求结论</span><div class=\"k-tag k-success k-none css-1blxads\"><span>摘要</span></div></div><div class=\"bubble-list-demo-custom-item-content\">本轮先交付 BubbleList 首版,覆盖滚动、历史加载、空态与插槽扩展能力。</div></div><div class=\"bubble-list-demo-custom-item-meta\"> #1</div></div></div><div><div class=\"bubble-list-demo-custom-item-row bubble-list-demo-custom-item-row-action\"><div class=\"bubble-list-demo-custom-item-main\"><div class=\"bubble-list-demo-custom-item-title\"><span>后续动作</span><div class=\"k-tag k-none css-1blxads\"><span>操作</span></div></div><div class=\"bubble-list-demo-custom-item-content\">补充方法调用 demo,并确认 scrollToKey 在自定义 item 场景下仍可正常定位。</div></div><div class=\"bubble-list-demo-custom-item-meta\"> #2</div></div></div><div><div class=\"bubble-list-demo-custom-item-row bubble-list-demo-custom-item-row-summary\"><div class=\"bubble-list-demo-custom-item-main\"><div class=\"bubble-list-demo-custom-item-title\"><span>测试状态</span><div class=\"k-tag k-success k-none css-1blxads\"><span>摘要</span></div></div><div class=\"bubble-list-demo-custom-item-content\">核心能力已补齐用例,可以继续朝发版标准收口。</div></div><div class=\"bubble-list-demo-custom-item-meta\"> #3</div></div></div></div></div></div><div class=\"k-bubble-list-scroll-to-bottom\"><button class=\"k-bubble-list-scroll-to-bottom-button\" type=\"button\" title=\"回到底部\" aria-label=\"回到底部\"><i class=\"k-icon k-bubble-list-scroll-to-bottom-icon k-icon-down-bold css-16qej3\"></i></button></div></div>"
83
+ ```
84
+
85
+ #### `BubbleList empty`
86
+
87
+ ```
88
+ "<div class=\"bubble-list-demo-empty\"><div class=\"bubble-list-demo-empty-actions\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">清空消息</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">恢复消息</button></div><div class=\"k-bubble-list bubble-list-demo-empty-list css-4odw9o\"><div class=\"k-bubble-list-scroll\"><div class=\"k-bubble-list-scroll-content\"><div class=\"k-bubble-list-empty\"><div class=\"bubble-list-demo-empty-state\"><div class=\"bubble-list-demo-empty-title\">还没有会话内容</div><div class=\"bubble-list-demo-empty-desc\">你可以先发送一条消息,或从推荐问题开始。</div></div></div></div></div></div></div>"
89
+ ```
90
+
91
+ #### `BubbleList history`
92
+
93
+ ```
94
+ "<div class=\"k-bubble-list bubble-list-demo-history css-4odw9o\"><div class=\"k-bubble-list-scroll\"><div class=\"k-bubble-list-scroll-content\"><div class=\"k-bubble-list-history\"><div class=\"bubble-list-demo-history-loading\"><span>滑到顶部自动加载更早消息</span></div></div><div class=\"k-bubble-list-items\"><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">历史消息 #8</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">历史消息 #9</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">历史消息 #10</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">历史消息 #11</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">历史消息 #12</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">历史消息 #13</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">历史消息 #14</div></div></div></div></div></div></div></div></div><div class=\"k-bubble-list-scroll-to-bottom\"><button class=\"k-bubble-list-scroll-to-bottom-button\" type=\"button\" title=\"回到底部\" aria-label=\"回到底部\"><i class=\"k-icon k-bubble-list-scroll-to-bottom-icon k-icon-down-bold css-16qej3\"></i></button></div></div>"
95
+ ```
96
+
97
+ #### `BubbleList methods`
98
+
99
+ ```
100
+ "<div class=\"bubble-list-demo-methods\"><div class=\"bubble-list-demo-methods-actions\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">滚动到顶部</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">定位到第 6 条</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">滚动到底部</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">检查是否贴底</button></div><div class=\"bubble-list-demo-methods-status\"> 当前状态:点击上方按钮查看方法效果</div><div class=\"k-bubble-list bubble-list-demo-methods-list css-4odw9o\"><div class=\"k-bubble-list-scroll\"><div class=\"k-bubble-list-scroll-content\"><div class=\"k-bubble-list-items\"><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 1 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 2 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 3 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 4 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 5 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 6 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 7 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 8 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 9 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 10 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 11 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">第 12 条消息:这里是 BubbleList 方法调用演示内容。</div></div></div></div></div></div></div></div></div><div class=\"k-bubble-list-scroll-to-bottom\"><button class=\"k-bubble-list-scroll-to-bottom-button\" type=\"button\" title=\"回到底部\" aria-label=\"回到底部\"><i class=\"k-icon k-bubble-list-scroll-to-bottom-icon k-icon-down-bold css-16qej3\"></i></button></div></div></div>"
101
+ ```
102
+
103
+ #### `BubbleList slots`
104
+
105
+ ```
106
+ "<div class=\"k-bubble-list bubble-list-demo-slots css-4odw9o\"><div class=\"k-bubble-list-header\"><div class=\"bubble-list-demo-slots-header\">项目讨论群 · 2 人在线</div></div><div class=\"k-bubble-list-scroll\"><div class=\"k-bubble-list-scroll-content\"><div class=\"k-bubble-list-items\"><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">你可以把 BubbleList 当作聊天列表的编排层。</div></div><div class=\"k-bubble-footer\"><div class=\"bubble-list-demo-slots-footer\"><button type=\"button\" class=\"bubble-list-demo-slots-icon\"><i class=\"k-icon k-icon-refresh css-16qej3\"></i></button><button type=\"button\" class=\"bubble-list-demo-slots-icon k-copy css-t3aops\"><i class=\"k-icon k-icon-clone css-16qej3\"></i></button></div></div><div class=\"k-bubble-extra\"><div class=\"bubble-list-demo-slots-extra\"><span>生成完成</span></div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">那滚动和历史加载就交给它。</div></div><div class=\"k-bubble-footer\"><div class=\"bubble-list-demo-slots-footer\"><button type=\"button\" class=\"bubble-list-demo-slots-icon\"><i class=\"k-icon k-icon-refresh css-16qej3\"></i></button><button type=\"button\" class=\"bubble-list-demo-slots-icon k-copy css-t3aops\"><i class=\"k-icon k-icon-clone css-16qej3\"></i></button></div></div><div class=\"k-bubble-extra\"><div class=\"bubble-list-demo-slots-extra\"><span>已发送</span></div></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-text\">对,Bubble 继续只管单条消息。</div></div><div class=\"k-bubble-footer\"><div class=\"bubble-list-demo-slots-footer\"><button type=\"button\" class=\"bubble-list-demo-slots-icon\"><i class=\"k-icon k-icon-refresh css-16qej3\"></i></button><button type=\"button\" class=\"bubble-list-demo-slots-icon k-copy css-t3aops\"><i class=\"k-icon k-icon-clone css-16qej3\"></i></button></div></div><div class=\"k-bubble-extra\"><div class=\"bubble-list-demo-slots-extra\"><span>生成完成</span></div></div></div></div></div></div></div></div></div><div class=\"k-bubble-list-footer\"><div class=\"bubble-list-demo-slots-list-footer\">以上内容仅用于演示。</div></div><div class=\"k-bubble-list-scroll-to-bottom\"><button type=\"button\" class=\"bubble-list-demo-slots-back\"> 查看最新消息 </button></div></div>"
107
+ ```
108
+
109
+ #### `BubbleList streaming`
110
+
111
+ ```
112
+ "<div class=\"bubble-list-demo-streaming\"><div class=\"bubble-list-demo-streaming-actions\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">开始流式输出</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">重置</button></div><div class=\"k-bubble-list bubble-list-demo-streaming-list css-4odw9o\"><div class=\"k-bubble-list-scroll\"><div class=\"k-bubble-list-scroll-content\"><div class=\"k-bubble-list-items\"><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-end k-bubble-outlined k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>我</span></div><div class=\"k-bubble-header\"><span>我</span></div></div><div class=\"k-bubble-content\"><span>帮我设计一个生产可用的 BubbleList。</span></div></div></div></div></div><div><div class=\"k-bubble-list-item\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-loading\"><span class=\"k-bubble-loading-dot\"></span><span class=\"k-bubble-loading-dot\"></span><span class=\"k-bubble-loading-dot\"></span></div></div><div class=\"k-bubble-extra\"><div class=\"bubble-list-demo-streaming-extra\"><span>生成中...</span></div></div></div></div></div></div></div></div></div></div></div>"
113
+ ```
114
+
115
+ ## `fileCard`
116
+
117
+ #### `FileCard basic`
118
+
119
+ ```
120
+ "<div class=\"file-card-demo-basic\"><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-sheet\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14408)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14408)%22%2F%3E%0A%3Cpath%20d%3D%22M17.3426%2017.5996L21.7224%2013.2197C22.0929%2012.8492%2022.0929%2012.2481%2021.7224%2011.8775C21.3518%2011.507%2020.7507%2011.507%2020.3802%2011.8775L16.0003%2016.2573L11.6205%2011.8775C11.25%2011.507%2010.6489%2011.507%2010.2783%2011.8775C9.90776%2012.2481%209.90776%2012.8492%2010.2783%2013.2197L14.6581%2017.5996L10.2779%2021.9794C9.90736%2022.3499%209.90736%2022.951%2010.2779%2023.3216C10.4634%2023.5071%2010.7062%2023.5996%2010.949%2023.5996C11.1918%2023.5996%2011.4347%2023.5071%2011.6201%2023.3216L16.0003%2018.9418L20.3798%2023.3216C20.5652%2023.5071%2020.8081%2023.5996%2021.0509%2023.5996C21.2937%2023.5996%2021.5365%2023.5071%2021.722%2023.3216C22.0925%2022.951%2022.0925%2022.3499%2021.722%2021.9794L17.3426%2017.5996Z%22%20fill%3D%22white%22%2F%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14408)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%2315C46F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23A4F8D0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14408%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14408%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14408%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%236CE4A3%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2315D076%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14408%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"年度预算汇总.xlsx\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"年度预算汇总.xlsx\"><span class=\"k-file-card-title-prefix\">年度预算汇总</span><span class=\"k-file-card-title-suffix\">.xlsx</span></div><div class=\"k-file-card-description\"><span>2.2 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-file-media k-file-card-type-file k-file-card-default\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-media k-media-image k-media-done k-media-previewable k-file-card-file-media-view css-bh0jn3\" title=\"封面图.png\" style=\"width: 32px; height: 32px;\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"封面图.png\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"封面图.png\"><span class=\"k-file-card-title-prefix\">封面图</span><span class=\"k-file-card-title-suffix\">.png</span></div><div class=\"k-file-card-description\"><span>320 KB</span></div></div></div></div></div></div>"
121
+ ```
122
+
123
+ #### `FileCard bubble`
124
+
125
+ ```
126
+ "<div class=\"file-card-demo-bubble\"><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>你</span></div><div class=\"k-bubble-header\"><span>你</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-attachments\"><div class=\"k-file-card-list k-file-card-list-scrollY css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店照片-01.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店照片-01.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店照片-02.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店照片-02.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店照片-03.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店照片-03.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店照片-04.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店照片-04.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店照片-05.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店照片-05.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店照片-01.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店照片-01.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店照片-02.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店照片-02.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店照片-03.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店照片-03.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店照片-04.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店照片-04.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店照片-05.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店照片-05.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div></div></div> 这批参考图先帮我整理一下,挑几张更适合作为封面方向。 </div></div></div><div class=\"k-bubble k-bubble-start k-bubble-filled k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>你</span></div><div class=\"k-bubble-header\"><span>你</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-attachments\"><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"镜头脚本.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"镜头脚本.pdf\"><span class=\"k-file-card-title-prefix\">镜头脚本</span><span class=\"k-file-card-title-suffix\">.pdf</span></div><div class=\"k-file-card-description\"><span>120 KB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"品牌规范.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"品牌规范.pdf\"><span class=\"k-file-card-title-prefix\">品牌规范</span><span class=\"k-file-card-title-suffix\">.pdf</span></div><div class=\"k-file-card-description\"><span>1.2 MB</span></div></div></div></div></div></div></div> 这些文档和素材包也一起带上,按这个版本先出第一版脚本。 </div></div></div><div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-attachments\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-large k-file-card-loading\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-large k-media-loading k-file-card-media-view css-bh0jn3\" title=\"封面图.png\"><div class=\"k-media-shell\"><div class=\"k-media-placeholder\"><i class=\"k-icon ion-image css-16qej3\"></i></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div></div></div></div></div></div>"
127
+ ```
128
+
129
+ #### `FileCard custom`
130
+
131
+ ```
132
+ "<div class=\"file-card-demo-custom\"><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\" style=\"width: 220px;\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-default\"><div class=\"file-card-demo-custom-icon\">PSD</div></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"品牌物料源文件.psd\"><span class=\"k-file-card-title-prefix\">品牌物料源文件</span><span class=\"k-file-card-title-suffix\">.psd</span></div><div class=\"k-file-card-description\"><div class=\"file-card-demo-custom-description\"><span>58 MB</span><button class=\"k-btn k-none k-btn-icon file-card-demo-custom-download css-h31bz\" title=\"下载\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-download css-16qej3\"></i></button></div></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-file-media k-file-card-type-file k-file-card-default k-file-card-deletable\" style=\"width: 220px;\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-media k-media-image k-media-done k-media-previewable k-file-card-file-media-view css-bh0jn3\" title=\"概念海报.jpg\" style=\"width: 32px; height: 32px;\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"概念海报.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"概念海报.jpg\"><span class=\"k-file-card-title-prefix\">概念海报</span><span class=\"k-file-card-title-suffix\">.jpg</span></div><div class=\"k-file-card-description\"><span>512 KB</span></div></div></div><div class=\"k-file-card-mask k-file-card-file-mask\"><div class=\"file-card-demo-custom-mask\" title=\"概念海报.jpg\"><div class=\"file-card-demo-custom-mask-title\">精选参考图</div><button class=\"k-btn k-small k-default css-h31bz\" tabindex=\"0\" type=\"button\">查看详情</button></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"海边步道.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"海边步道.jpg\" src=\"https://images.unsplash.com/photo-1470770841072-f978cf4d019e?auto=format&amp;fit=crop&amp;w=640&amp;q=80\" draggable=\"false\"><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div></div>"
133
+ ```
134
+
135
+ #### `FileCard list`
136
+
137
+ ```
138
+ "<div class=\"file-card-demo-list\"><div class=\"file-card-demo-list-toolbar\"><span>溢出方式:</span><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">scrollX<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">scrollY<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">wrap<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div></div><div class=\"file-card-demo-list-section\"><div class=\"file-card-demo-list-title\">各类文件</div><div class=\"file-card-content\"><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"品牌规范.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"品牌规范.pdf\"><span class=\"k-file-card-title-prefix\">品牌规范</span><span class=\"k-file-card-title-suffix\">.pdf</span></div><div class=\"k-file-card-description\"><span>1.2 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-doc\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2231%22%20height%3D%2232%22%20viewBox%3D%220%200%2031%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14426)%22%3E%0A%3Cpath%20d%3D%22M1%204C1%201.79086%202.79086%200%205%200H18.7245L30%2011.1914V28C30%2030.2091%2028.2091%2032%2026%2032H5C2.79086%2032%201%2030.2091%201%2028V4Z%22%20fill%3D%22url(%23paint0_linear_25057_14426)%22%2F%3E%0A%3Cpath%20d%3D%22M20.4315%2023.5996C20.2061%2023.5996%2019.9844%2023.513%2019.8179%2023.3494L15.514%2019.1232L11.1806%2023.3512C11.058%2023.4709%2010.9026%2023.5519%2010.7338%2023.5841C10.565%2023.6162%2010.3903%2023.5982%2010.2319%2023.5321C10.0733%2023.4661%209.93795%2023.3551%209.84275%2023.213C9.74755%2023.0708%209.69676%2022.9039%209.69678%2022.7332V12.466C9.69678%2011.9877%2010.0875%2011.5996%2010.5692%2011.5996C11.0508%2011.5996%2011.4416%2011.9877%2011.4416%2012.466V20.6676L14.9044%2017.2886C15.2446%2016.9568%2015.7902%2016.9576%2016.129%2017.2904L19.5587%2020.6582V12.4898C19.5587%2012.0115%2019.9495%2011.6234%2020.4311%2011.6234C20.9128%2011.6234%2021.3036%2012.0115%2021.3036%2012.4898V22.7332C21.3036%2023.0827%2021.092%2023.3982%2020.7674%2023.5328C20.6609%2023.5768%2020.5468%2023.5995%2020.4315%2023.5996Z%22%20fill%3D%22white%22%2F%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14426)%22%3E%0A%3Cpath%20d%3D%22M17.9165%200L29.9998%2012H21.9165C19.7074%2012%2017.9165%2010.2091%2017.9165%208V0Z%22%20fill%3D%22%23196FF1%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M18.7222%200L29.9999%2011.2H22.7222C20.513%2011.2%2018.7222%209.40914%2018.7222%207.2V0Z%22%20fill%3D%22%23B3DAFF%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14426%22%20x%3D%2212.9165%22%20y%3D%22-5%22%20width%3D%2222.0835%22%20height%3D%2222%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222.5%22%20result%3D%22effect1_foregroundBlur_25057_14426%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14426%22%20x1%3D%221%22%20y1%3D%220%22%20x2%3D%2232.9992%22%20y2%3D%2232.2214%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%2376B4FD%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%234C89FF%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14426%22%3E%0A%3Crect%20width%3D%2231%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"拍摄清单.docx\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"拍摄清单.docx\"><span class=\"k-file-card-title-prefix\">拍摄清单</span><span class=\"k-file-card-title-suffix\">.docx</span></div><div class=\"k-file-card-description\"><span>84 KB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-sheet\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14408)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14408)%22%2F%3E%0A%3Cpath%20d%3D%22M17.3426%2017.5996L21.7224%2013.2197C22.0929%2012.8492%2022.0929%2012.2481%2021.7224%2011.8775C21.3518%2011.507%2020.7507%2011.507%2020.3802%2011.8775L16.0003%2016.2573L11.6205%2011.8775C11.25%2011.507%2010.6489%2011.507%2010.2783%2011.8775C9.90776%2012.2481%209.90776%2012.8492%2010.2783%2013.2197L14.6581%2017.5996L10.2779%2021.9794C9.90736%2022.3499%209.90736%2022.951%2010.2779%2023.3216C10.4634%2023.5071%2010.7062%2023.5996%2010.949%2023.5996C11.1918%2023.5996%2011.4347%2023.5071%2011.6201%2023.3216L16.0003%2018.9418L20.3798%2023.3216C20.5652%2023.5071%2020.8081%2023.5996%2021.0509%2023.5996C21.2937%2023.5996%2021.5365%2023.5071%2021.722%2023.3216C22.0925%2022.951%2022.0925%2022.3499%2021.722%2021.9794L17.3426%2017.5996Z%22%20fill%3D%22white%22%2F%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14408)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%2315C46F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23A4F8D0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14408%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14408%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14408%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%236CE4A3%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2315D076%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14408%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"预算汇总.xlsx\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"预算汇总.xlsx\"><span class=\"k-file-card-title-prefix\">预算汇总</span><span class=\"k-file-card-title-suffix\">.xlsx</span></div><div class=\"k-file-card-description\"><span>320 KB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-default\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14424)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14424)%22%2F%3E%0A%3Crect%20x%3D%229.87842%22%20y%3D%2211.3555%22%20width%3D%228%22%20height%3D%221.6%22%20rx%3D%220.4%22%20fill%3D%22white%22%2F%3E%0A%3Crect%20x%3D%229.87842%22%20y%3D%2216.8574%22%20width%3D%2212.2432%22%20height%3D%221.6%22%20rx%3D%220.4%22%20fill%3D%22white%22%2F%3E%0A%3Crect%20x%3D%229.87842%22%20y%3D%2222.3594%22%20width%3D%2211.3717%22%20height%3D%221.48611%22%20rx%3D%220.4%22%20fill%3D%22white%22%2F%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14424)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%2394B9DB%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23DBEAFC%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14424%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14424%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14424%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23C7DFF2%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23ABC3DD%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14424%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"设计源文件.psd\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"设计源文件.psd\"><span class=\"k-file-card-title-prefix\">设计源文件</span><span class=\"k-file-card-title-suffix\">.psd</span></div><div class=\"k-file-card-description\"><span>42 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-archive\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14422)%22%3E%0A%3Cg%20filter%3D%22url(%23filter0_i_25057_14422)%22%3E%0A%3Cpath%20d%3D%22M0%203.99297C0%202.22566%201.43269%200.792969%203.2%200.792969H28.8C30.5673%200.792969%2032%202.22566%2032%203.99297V10.9263H0V3.99297Z%22%20fill%3D%22url(%23paint0_linear_25057_14422)%22%2F%3E%0A%3C%2Fg%3E%0A%3Crect%20y%3D%2210.9268%22%20width%3D%2232%22%20height%3D%2210.1333%22%20fill%3D%22url(%23paint1_linear_25057_14422)%22%2F%3E%0A%3Cpath%20d%3D%22M0%2021.0596H32V27.9929C32%2029.7602%2030.5673%2031.1929%2028.8%2031.1929H3.2C1.43269%2031.1929%200%2029.7602%200%2027.9929V21.0596Z%22%20fill%3D%22url(%23paint2_linear_25057_14422)%22%2F%3E%0A%3Crect%20x%3D%2210.3999%22%20y%3D%220.807617%22%20width%3D%2211.2%22%20height%3D%2230.4%22%20fill%3D%22url(%23paint3_linear_25057_14422)%22%2F%3E%0A%3Crect%20x%3D%229.5999%22%20y%3D%2211.2%22%20width%3D%2212.8%22%20height%3D%229.6%22%20rx%3D%222.4%22%20stroke%3D%22white%22%20stroke-width%3D%221.6%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_i_25057_14422%22%20x%3D%220%22%20y%3D%220.792969%22%20width%3D%2232%22%20height%3D%2211.7338%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%20result%3D%22hardAlpha%22%2F%3E%0A%3CfeOffset%20dy%3D%221.6%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%220.8%22%2F%3E%0A%3CfeComposite%20in2%3D%22hardAlpha%22%20operator%3D%22arithmetic%22%20k2%3D%22-1%22%20k3%3D%221%22%2F%3E%0A%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200.609328%200%200%200%200%200.882798%200%200%200%200%201%200%200%200%200.6%200%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in2%3D%22shape%22%20result%3D%22effect1_innerShadow_25057_14422%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%220.792969%22%20x2%3D%227.48984%22%20y2%3D%2219.5629%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%2366D3F9%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%234BC1FB%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint1_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%2210.9268%22%20x2%3D%227.48984%22%20y2%3D%2229.6967%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FD836F%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF5F5D%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint2_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%2221.0596%22%20x2%3D%227.48984%22%20y2%3D%2239.8295%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%237BE0B1%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2351B783%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint3_linear_25057_14422%22%20x1%3D%2210.3999%22%20y1%3D%220.807617%22%20x2%3D%2227.9819%22%20y2%3D%225.94811%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FFD26D%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FFB340%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14422%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"素材包.zip\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"素材包.zip\"><span class=\"k-file-card-title-prefix\">素材包</span><span class=\"k-file-card-title-suffix\">.zip</span></div><div class=\"k-file-card-description\"><span>18 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-file-media k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-media k-media-audio k-media-loading k-file-card-file-media-view css-bh0jn3\" title=\"采访录音.mp3\" style=\"width: px;\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"采访录音.mp3\"><span class=\"k-file-card-title-prefix\">采访录音</span><span class=\"k-file-card-title-suffix\">.mp3</span></div><div class=\"k-file-card-description\"><span>6.0 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-doc\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14410)%22%3E%0A%3Cpath%20d%3D%22M1.5%204C1.5%201.79086%203.29086%200%205.5%200H19.2245L30.5%2011.1914V28C30.5%2030.2091%2028.7091%2032%2026.5%2032H5.5C3.29086%2032%201.5%2030.2091%201.5%2028V4Z%22%20fill%3D%22url(%23paint0_linear_25057_14410)%22%2F%3E%0A%3Cpath%20d%3D%22M21.2412%2012.1295H16.1613C16.055%2012.1079%2015.9453%2012.1079%2015.839%2012.1295H10.7591C10.3171%2012.1295%209.9585%2012.4857%209.9585%2012.9246C9.9585%2013.3636%2010.3171%2013.7197%2010.7591%2013.7197H15.1995V22.2912C15.1995%2022.7301%2015.5582%2023.0863%2016.0002%2023.0863C16.4422%2023.0863%2016.8008%2022.7301%2016.8008%2022.2912V13.7197H21.2412C21.6832%2013.7197%2022.0418%2013.3636%2022.0418%2012.9246C22.0418%2012.4857%2021.6832%2012.1295%2021.2412%2012.1295Z%22%20fill%3D%22white%22%2F%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14410)%22%3E%0A%3Cpath%20d%3D%22M18.4165%200L30.4998%2012H22.4165C20.2074%2012%2018.4165%2010.2091%2018.4165%208V0Z%22%20fill%3D%22%2335B4F0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2222%200L30.4999%2011.2H23.2222C21.013%2011.2%2019.2222%209.40914%2019.2222%207.2V0Z%22%20fill%3D%22%23ACEFFA%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14410%22%20x%3D%2213.4165%22%20y%3D%22-5%22%20width%3D%2222.0835%22%20height%3D%2222%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222.5%22%20result%3D%22effect1_foregroundBlur_25057_14410%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14410%22%20x1%3D%221.5%22%20y1%3D%220%22%20x2%3D%2233.4992%22%20y2%3D%2232.2214%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%2377DFFE%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%234AC5FD%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14410%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"封面需求.txt\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"封面需求.txt\"><span class=\"k-file-card-title-prefix\">封面需求</span><span class=\"k-file-card-title-suffix\">.txt</span></div><div class=\"k-file-card-description\"><span>12 KB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-archive\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14422)%22%3E%0A%3Cg%20filter%3D%22url(%23filter0_i_25057_14422)%22%3E%0A%3Cpath%20d%3D%22M0%203.99297C0%202.22566%201.43269%200.792969%203.2%200.792969H28.8C30.5673%200.792969%2032%202.22566%2032%203.99297V10.9263H0V3.99297Z%22%20fill%3D%22url(%23paint0_linear_25057_14422)%22%2F%3E%0A%3C%2Fg%3E%0A%3Crect%20y%3D%2210.9268%22%20width%3D%2232%22%20height%3D%2210.1333%22%20fill%3D%22url(%23paint1_linear_25057_14422)%22%2F%3E%0A%3Cpath%20d%3D%22M0%2021.0596H32V27.9929C32%2029.7602%2030.5673%2031.1929%2028.8%2031.1929H3.2C1.43269%2031.1929%200%2029.7602%200%2027.9929V21.0596Z%22%20fill%3D%22url(%23paint2_linear_25057_14422)%22%2F%3E%0A%3Crect%20x%3D%2210.3999%22%20y%3D%220.807617%22%20width%3D%2211.2%22%20height%3D%2230.4%22%20fill%3D%22url(%23paint3_linear_25057_14422)%22%2F%3E%0A%3Crect%20x%3D%229.5999%22%20y%3D%2211.2%22%20width%3D%2212.8%22%20height%3D%229.6%22%20rx%3D%222.4%22%20stroke%3D%22white%22%20stroke-width%3D%221.6%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_i_25057_14422%22%20x%3D%220%22%20y%3D%220.792969%22%20width%3D%2232%22%20height%3D%2211.7338%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%20result%3D%22hardAlpha%22%2F%3E%0A%3CfeOffset%20dy%3D%221.6%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%220.8%22%2F%3E%0A%3CfeComposite%20in2%3D%22hardAlpha%22%20operator%3D%22arithmetic%22%20k2%3D%22-1%22%20k3%3D%221%22%2F%3E%0A%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200.609328%200%200%200%200%200.882798%200%200%200%200%201%200%200%200%200.6%200%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in2%3D%22shape%22%20result%3D%22effect1_innerShadow_25057_14422%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%220.792969%22%20x2%3D%227.48984%22%20y2%3D%2219.5629%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%2366D3F9%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%234BC1FB%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint1_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%2210.9268%22%20x2%3D%227.48984%22%20y2%3D%2229.6967%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FD836F%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF5F5D%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint2_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%2221.0596%22%20x2%3D%227.48984%22%20y2%3D%2239.8295%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%237BE0B1%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2351B783%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint3_linear_25057_14422%22%20x1%3D%2210.3999%22%20y1%3D%220.807617%22%20x2%3D%2227.9819%22%20y2%3D%225.94811%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FFD26D%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FFB340%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14422%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"补充素材.rar\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"补充素材.rar\"><span class=\"k-file-card-title-prefix\">补充素材</span><span class=\"k-file-card-title-suffix\">.rar</span></div><div class=\"k-file-card-description\"><span>24 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-archive\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14422)%22%3E%0A%3Cg%20filter%3D%22url(%23filter0_i_25057_14422)%22%3E%0A%3Cpath%20d%3D%22M0%203.99297C0%202.22566%201.43269%200.792969%203.2%200.792969H28.8C30.5673%200.792969%2032%202.22566%2032%203.99297V10.9263H0V3.99297Z%22%20fill%3D%22url(%23paint0_linear_25057_14422)%22%2F%3E%0A%3C%2Fg%3E%0A%3Crect%20y%3D%2210.9268%22%20width%3D%2232%22%20height%3D%2210.1333%22%20fill%3D%22url(%23paint1_linear_25057_14422)%22%2F%3E%0A%3Cpath%20d%3D%22M0%2021.0596H32V27.9929C32%2029.7602%2030.5673%2031.1929%2028.8%2031.1929H3.2C1.43269%2031.1929%200%2029.7602%200%2027.9929V21.0596Z%22%20fill%3D%22url(%23paint2_linear_25057_14422)%22%2F%3E%0A%3Crect%20x%3D%2210.3999%22%20y%3D%220.807617%22%20width%3D%2211.2%22%20height%3D%2230.4%22%20fill%3D%22url(%23paint3_linear_25057_14422)%22%2F%3E%0A%3Crect%20x%3D%229.5999%22%20y%3D%2211.2%22%20width%3D%2212.8%22%20height%3D%229.6%22%20rx%3D%222.4%22%20stroke%3D%22white%22%20stroke-width%3D%221.6%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_i_25057_14422%22%20x%3D%220%22%20y%3D%220.792969%22%20width%3D%2232%22%20height%3D%2211.7338%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%20result%3D%22hardAlpha%22%2F%3E%0A%3CfeOffset%20dy%3D%221.6%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%220.8%22%2F%3E%0A%3CfeComposite%20in2%3D%22hardAlpha%22%20operator%3D%22arithmetic%22%20k2%3D%22-1%22%20k3%3D%221%22%2F%3E%0A%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200.609328%200%200%200%200%200.882798%200%200%200%200%201%200%200%200%200.6%200%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in2%3D%22shape%22%20result%3D%22effect1_innerShadow_25057_14422%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%220.792969%22%20x2%3D%227.48984%22%20y2%3D%2219.5629%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%2366D3F9%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%234BC1FB%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint1_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%2210.9268%22%20x2%3D%227.48984%22%20y2%3D%2229.6967%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FD836F%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF5F5D%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint2_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%2221.0596%22%20x2%3D%227.48984%22%20y2%3D%2239.8295%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%237BE0B1%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2351B783%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint3_linear_25057_14422%22%20x1%3D%2210.3999%22%20y1%3D%220.807617%22%20x2%3D%2227.9819%22%20y2%3D%225.94811%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FFD26D%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FFB340%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14422%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"素材包.zip\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"素材包.zip\"><span class=\"k-file-card-title-prefix\">素材包</span><span class=\"k-file-card-title-suffix\">.zip</span></div><div class=\"k-file-card-description\"><span>18 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-file-media k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-media k-media-audio k-media-loading k-file-card-file-media-view css-bh0jn3\" title=\"采访录音.mp3\" style=\"width: 32px; height: 32px;\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"采访录音.mp3\"><span class=\"k-file-card-title-prefix\">采访录音</span><span class=\"k-file-card-title-suffix\">.mp3</span></div><div class=\"k-file-card-description\"><span>6.0 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-doc\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14410)%22%3E%0A%3Cpath%20d%3D%22M1.5%204C1.5%201.79086%203.29086%200%205.5%200H19.2245L30.5%2011.1914V28C30.5%2030.2091%2028.7091%2032%2026.5%2032H5.5C3.29086%2032%201.5%2030.2091%201.5%2028V4Z%22%20fill%3D%22url(%23paint0_linear_25057_14410)%22%2F%3E%0A%3Cpath%20d%3D%22M21.2412%2012.1295H16.1613C16.055%2012.1079%2015.9453%2012.1079%2015.839%2012.1295H10.7591C10.3171%2012.1295%209.9585%2012.4857%209.9585%2012.9246C9.9585%2013.3636%2010.3171%2013.7197%2010.7591%2013.7197H15.1995V22.2912C15.1995%2022.7301%2015.5582%2023.0863%2016.0002%2023.0863C16.4422%2023.0863%2016.8008%2022.7301%2016.8008%2022.2912V13.7197H21.2412C21.6832%2013.7197%2022.0418%2013.3636%2022.0418%2012.9246C22.0418%2012.4857%2021.6832%2012.1295%2021.2412%2012.1295Z%22%20fill%3D%22white%22%2F%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14410)%22%3E%0A%3Cpath%20d%3D%22M18.4165%200L30.4998%2012H22.4165C20.2074%2012%2018.4165%2010.2091%2018.4165%208V0Z%22%20fill%3D%22%2335B4F0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2222%200L30.4999%2011.2H23.2222C21.013%2011.2%2019.2222%209.40914%2019.2222%207.2V0Z%22%20fill%3D%22%23ACEFFA%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14410%22%20x%3D%2213.4165%22%20y%3D%22-5%22%20width%3D%2222.0835%22%20height%3D%2222%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222.5%22%20result%3D%22effect1_foregroundBlur_25057_14410%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14410%22%20x1%3D%221.5%22%20y1%3D%220%22%20x2%3D%2233.4992%22%20y2%3D%2232.2214%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%2377DFFE%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%234AC5FD%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14410%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"封面需求.txt\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"封面需求.txt\"><span class=\"k-file-card-title-prefix\">封面需求</span><span class=\"k-file-card-title-suffix\">.txt</span></div><div class=\"k-file-card-description\"><span>12 KB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-archive\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14422)%22%3E%0A%3Cg%20filter%3D%22url(%23filter0_i_25057_14422)%22%3E%0A%3Cpath%20d%3D%22M0%203.99297C0%202.22566%201.43269%200.792969%203.2%200.792969H28.8C30.5673%200.792969%2032%202.22566%2032%203.99297V10.9263H0V3.99297Z%22%20fill%3D%22url(%23paint0_linear_25057_14422)%22%2F%3E%0A%3C%2Fg%3E%0A%3Crect%20y%3D%2210.9268%22%20width%3D%2232%22%20height%3D%2210.1333%22%20fill%3D%22url(%23paint1_linear_25057_14422)%22%2F%3E%0A%3Cpath%20d%3D%22M0%2021.0596H32V27.9929C32%2029.7602%2030.5673%2031.1929%2028.8%2031.1929H3.2C1.43269%2031.1929%200%2029.7602%200%2027.9929V21.0596Z%22%20fill%3D%22url(%23paint2_linear_25057_14422)%22%2F%3E%0A%3Crect%20x%3D%2210.3999%22%20y%3D%220.807617%22%20width%3D%2211.2%22%20height%3D%2230.4%22%20fill%3D%22url(%23paint3_linear_25057_14422)%22%2F%3E%0A%3Crect%20x%3D%229.5999%22%20y%3D%2211.2%22%20width%3D%2212.8%22%20height%3D%229.6%22%20rx%3D%222.4%22%20stroke%3D%22white%22%20stroke-width%3D%221.6%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_i_25057_14422%22%20x%3D%220%22%20y%3D%220.792969%22%20width%3D%2232%22%20height%3D%2211.7338%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%20result%3D%22hardAlpha%22%2F%3E%0A%3CfeOffset%20dy%3D%221.6%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%220.8%22%2F%3E%0A%3CfeComposite%20in2%3D%22hardAlpha%22%20operator%3D%22arithmetic%22%20k2%3D%22-1%22%20k3%3D%221%22%2F%3E%0A%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200.609328%200%200%200%200%200.882798%200%200%200%200%201%200%200%200%200.6%200%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in2%3D%22shape%22%20result%3D%22effect1_innerShadow_25057_14422%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%220.792969%22%20x2%3D%227.48984%22%20y2%3D%2219.5629%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%2366D3F9%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%234BC1FB%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint1_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%2210.9268%22%20x2%3D%227.48984%22%20y2%3D%2229.6967%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FD836F%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF5F5D%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint2_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%2221.0596%22%20x2%3D%227.48984%22%20y2%3D%2239.8295%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%237BE0B1%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2351B783%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint3_linear_25057_14422%22%20x1%3D%2210.3999%22%20y1%3D%220.807617%22%20x2%3D%2227.9819%22%20y2%3D%225.94811%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FFD26D%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FFB340%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14422%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"补充素材.rar\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"补充素材.rar\"><span class=\"k-file-card-title-prefix\">补充素材</span><span class=\"k-file-card-title-suffix\">.rar</span></div><div class=\"k-file-card-description\"><span>24 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-default\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14430)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14430)%22%2F%3E%0A%3Cpath%20d%3D%22M12.99%2012.5654C12.8248%2012.4187%2012.5721%2012.4336%2012.4253%2012.5987L8.73621%2016.7491C8.6015%2016.9006%208.6015%2017.129%208.73621%2017.2805L12.4253%2021.4309C12.5721%2021.596%2012.8248%2021.6109%2012.99%2021.4642L13.5134%2020.9991C13.6786%2020.8523%2013.6935%2020.5994%2013.5467%2020.4343L10.7432%2017.2806C10.6085%2017.129%2010.6085%2016.9006%2010.7432%2016.7491L13.5467%2013.5953C13.6935%2013.4302%2013.6786%2013.1773%2013.5134%2013.0306L12.99%2012.5654ZM19.3868%2012.5988C19.24%2012.4336%2018.9872%2012.4188%2018.8221%2012.5656L18.299%2013.0306C18.1338%2013.1773%2018.119%2013.4302%2018.2658%2013.5953L21.0693%2016.7491C21.204%2016.9006%2021.204%2017.129%2021.0693%2017.2806L18.2658%2020.4343C18.119%2020.5995%2018.1338%2020.8523%2018.299%2020.9991L18.8221%2021.4641C18.9872%2021.6108%2019.24%2021.596%2019.3868%2021.4309L23.0762%2017.2806C23.211%2017.129%2023.211%2016.9006%2023.0762%2016.749L19.3868%2012.5988Z%22%20fill%3D%22white%22%2F%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14430)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%233396FD%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%239FD3FB%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14430%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14430%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14430%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%2344B6FB%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2358A2FF%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14430%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"测试.html\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"测试.html\"><span class=\"k-file-card-title-prefix\">测试</span><span class=\"k-file-card-title-suffix\">.html</span></div><div class=\"k-file-card-description\"><span>2.0 KB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-slide\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14414)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14414)%22%2F%3E%0A%3Cpath%20d%3D%22M17.3009%2011.5996H11.2913C10.838%2011.5996%2010.4702%2011.9674%2010.4702%2012.4207V22.7785C10.4702%2023.2318%2010.838%2023.5996%2011.2913%2023.5996C11.7447%2023.5996%2012.1125%2023.2318%2012.1125%2022.7785V20.0578H17.3009C19.6329%2020.0578%2021.53%2018.1607%2021.53%2015.8287C21.53%2013.4967%2019.6329%2011.5996%2017.3009%2011.5996ZM17.3009%2018.4156H12.1125V13.2419H17.3009C18.7273%2013.2419%2019.8878%2014.4024%2019.8878%2015.8287C19.8878%2017.2551%2018.7273%2018.4156%2017.3009%2018.4156Z%22%20fill%3D%22white%22%2F%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14414)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F6791E%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCCBAF%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14414%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14414%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14414%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FFA573%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF7C44%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14414%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"演示.ppt\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"演示.ppt\"><span class=\"k-file-card-title-prefix\">演示</span><span class=\"k-file-card-title-suffix\">.ppt</span></div><div class=\"k-file-card-description\"><span>10 KB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-doc\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14428)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14428)%22%2F%3E%0A%3Cpath%20d%3D%22M11.103%2011.5996C11.3268%2011.5996%2011.547%2011.6863%2011.7123%2011.8498L15.9866%2016.076L20.2901%2011.848C20.4118%2011.7283%2020.5662%2011.6473%2020.7338%2011.6152C20.9015%2011.583%2021.0749%2011.6011%2021.2323%2011.6671C21.3897%2011.7331%2021.5242%2011.8441%2021.6187%2011.9863C21.7133%2012.1284%2021.7637%2012.2953%2021.7637%2012.466L21.7637%2022.7332C21.7637%2023.2115%2021.3756%2023.5996%2020.8973%2023.5996C20.4189%2023.5996%2020.0309%2023.2115%2020.0309%2022.7332L20.0309%2014.5317L16.592%2017.9106C16.2541%2018.2424%2015.7122%2018.2416%2015.3758%2017.9088L11.9697%2014.541L11.9697%2022.7094C11.9697%2023.1877%2011.5817%2023.5758%2011.1033%2023.5758C10.625%2023.5758%2010.2369%2023.1877%2010.2369%2022.7094L10.2369%2012.466C10.2369%2012.1166%2010.447%2011.8011%2010.7694%2011.6664C10.8751%2011.6224%2010.9885%2011.5997%2011.103%2011.5996Z%22%20fill%3D%22white%22%2F%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14428)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%237319F1%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23C2B3FF%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14428%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14428%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14428%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23A176FD%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23974CFF%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14428%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"测试用例.md\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"测试用例.md\"><span class=\"k-file-card-title-prefix\">测试用例</span><span class=\"k-file-card-title-suffix\">.md</span></div><div class=\"k-file-card-description\"><span>2.0 KB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-doc\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2231%22%20height%3D%2232%22%20viewBox%3D%220%200%2031%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14426)%22%3E%0A%3Cpath%20d%3D%22M1%204C1%201.79086%202.79086%200%205%200H18.7245L30%2011.1914V28C30%2030.2091%2028.2091%2032%2026%2032H5C2.79086%2032%201%2030.2091%201%2028V4Z%22%20fill%3D%22url(%23paint0_linear_25057_14426)%22%2F%3E%0A%3Cpath%20d%3D%22M20.4315%2023.5996C20.2061%2023.5996%2019.9844%2023.513%2019.8179%2023.3494L15.514%2019.1232L11.1806%2023.3512C11.058%2023.4709%2010.9026%2023.5519%2010.7338%2023.5841C10.565%2023.6162%2010.3903%2023.5982%2010.2319%2023.5321C10.0733%2023.4661%209.93795%2023.3551%209.84275%2023.213C9.74755%2023.0708%209.69676%2022.9039%209.69678%2022.7332V12.466C9.69678%2011.9877%2010.0875%2011.5996%2010.5692%2011.5996C11.0508%2011.5996%2011.4416%2011.9877%2011.4416%2012.466V20.6676L14.9044%2017.2886C15.2446%2016.9568%2015.7902%2016.9576%2016.129%2017.2904L19.5587%2020.6582V12.4898C19.5587%2012.0115%2019.9495%2011.6234%2020.4311%2011.6234C20.9128%2011.6234%2021.3036%2012.0115%2021.3036%2012.4898V22.7332C21.3036%2023.0827%2021.092%2023.3982%2020.7674%2023.5328C20.6609%2023.5768%2020.5468%2023.5995%2020.4315%2023.5996Z%22%20fill%3D%22white%22%2F%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14426)%22%3E%0A%3Cpath%20d%3D%22M17.9165%200L29.9998%2012H21.9165C19.7074%2012%2017.9165%2010.2091%2017.9165%208V0Z%22%20fill%3D%22%23196FF1%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M18.7222%200L29.9999%2011.2H22.7222C20.513%2011.2%2018.7222%209.40914%2018.7222%207.2V0Z%22%20fill%3D%22%23B3DAFF%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14426%22%20x%3D%2212.9165%22%20y%3D%22-5%22%20width%3D%2222.0835%22%20height%3D%2222%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222.5%22%20result%3D%22effect1_foregroundBlur_25057_14426%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14426%22%20x1%3D%221%22%20y1%3D%220%22%20x2%3D%2232.9992%22%20y2%3D%2232.2214%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%2376B4FD%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%234C89FF%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14426%22%3E%0A%3Crect%20width%3D%2231%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"组件文档.docx\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"组件文档.docx\"><span class=\"k-file-card-title-prefix\">组件文档</span><span class=\"k-file-card-title-suffix\">.docx</span></div><div class=\"k-file-card-description\"><span>10 KB</span></div></div></div></div></div></div></div></div><div class=\"file-card-demo-list-section\"><div class=\"file-card-demo-list-title\">图片列表</div><div class=\"file-card-content\"><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-01.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-01.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-02.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-02.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-03.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-03.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-04.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-04.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-05.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-05.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-06.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-06.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-07.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-07.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-08.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-08.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-06.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-06.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-07.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-07.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-08.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-08.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-08.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-08.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-06.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-06.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-07.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-07.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"scene-08.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"scene-08.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div></div></div></div></div>"
139
+ ```
140
+
141
+ #### `FileCard loading`
142
+
143
+ ```
144
+ "<div class=\"file-card-demo-loading\"><div class=\"file-card-demo-loading-section\"><div class=\"file-card-demo-loading-title\">文件</div><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-loading\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"需求文档.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"需求文档.pdf\"><span class=\"k-file-card-title-prefix\">需求文档</span><span class=\"k-file-card-title-suffix\">.pdf</span></div><div class=\"k-file-card-description\"><span>上传中...</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-loading k-file-card-progressing\"><div class=\"k-file-card-file-shell\" style=\"--file-card-progress-percent: 52%;\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-archive\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14422)%22%3E%0A%3Cg%20filter%3D%22url(%23filter0_i_25057_14422)%22%3E%0A%3Cpath%20d%3D%22M0%203.99297C0%202.22566%201.43269%200.792969%203.2%200.792969H28.8C30.5673%200.792969%2032%202.22566%2032%203.99297V10.9263H0V3.99297Z%22%20fill%3D%22url(%23paint0_linear_25057_14422)%22%2F%3E%0A%3C%2Fg%3E%0A%3Crect%20y%3D%2210.9268%22%20width%3D%2232%22%20height%3D%2210.1333%22%20fill%3D%22url(%23paint1_linear_25057_14422)%22%2F%3E%0A%3Cpath%20d%3D%22M0%2021.0596H32V27.9929C32%2029.7602%2030.5673%2031.1929%2028.8%2031.1929H3.2C1.43269%2031.1929%200%2029.7602%200%2027.9929V21.0596Z%22%20fill%3D%22url(%23paint2_linear_25057_14422)%22%2F%3E%0A%3Crect%20x%3D%2210.3999%22%20y%3D%220.807617%22%20width%3D%2211.2%22%20height%3D%2230.4%22%20fill%3D%22url(%23paint3_linear_25057_14422)%22%2F%3E%0A%3Crect%20x%3D%229.5999%22%20y%3D%2211.2%22%20width%3D%2212.8%22%20height%3D%229.6%22%20rx%3D%222.4%22%20stroke%3D%22white%22%20stroke-width%3D%221.6%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_i_25057_14422%22%20x%3D%220%22%20y%3D%220.792969%22%20width%3D%2232%22%20height%3D%2211.7338%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%20result%3D%22hardAlpha%22%2F%3E%0A%3CfeOffset%20dy%3D%221.6%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%220.8%22%2F%3E%0A%3CfeComposite%20in2%3D%22hardAlpha%22%20operator%3D%22arithmetic%22%20k2%3D%22-1%22%20k3%3D%221%22%2F%3E%0A%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200.609328%200%200%200%200%200.882798%200%200%200%200%201%200%200%200%200.6%200%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in2%3D%22shape%22%20result%3D%22effect1_innerShadow_25057_14422%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%220.792969%22%20x2%3D%227.48984%22%20y2%3D%2219.5629%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%2366D3F9%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%234BC1FB%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint1_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%2210.9268%22%20x2%3D%227.48984%22%20y2%3D%2229.6967%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FD836F%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF5F5D%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint2_linear_25057_14422%22%20x1%3D%220%22%20y1%3D%2221.0596%22%20x2%3D%227.48984%22%20y2%3D%2239.8295%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%237BE0B1%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2351B783%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3ClinearGradient%20id%3D%22paint3_linear_25057_14422%22%20x1%3D%2210.3999%22%20y1%3D%220.807617%22%20x2%3D%2227.9819%22%20y2%3D%225.94811%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FFD26D%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FFB340%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14422%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"素材包.zip\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"素材包.zip\"><span class=\"k-file-card-title-prefix\">素材包</span><span class=\"k-file-card-title-suffix\">.zip</span></div><div class=\"k-file-card-description\"><span>上传中... 52%</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-error\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"合同附件.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"合同附件.pdf\"><span class=\"k-file-card-title-prefix\">合同附件</span><span class=\"k-file-card-title-suffix\">.pdf</span></div><div class=\"k-file-card-description\"><span>上传失败</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-mini k-file-card-loading k-file-card-progressing\"><div class=\"k-file-card-file-shell\" style=\"--file-card-progress-percent: 42%;\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"mini上传状态.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"上传中... 42%\"><span class=\"k-file-card-title-prefix k-file-card-title-status\">上传中... 42%</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-mini k-file-card-error\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"mini失败状态.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"上传失败\"><span class=\"k-file-card-title-prefix k-file-card-title-status k-file-card-title-status-error\">上传失败</span></div></div></div></div></div></div></div><div class=\"file-card-demo-loading-section\"><div class=\"file-card-demo-loading-title\">图片</div><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-loading\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"封面草图.png\"><div class=\"k-media-shell\"><div class=\"k-media-placeholder\"><i class=\"k-icon ion-image css-16qej3\"></i></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-loading\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"用户上传原图.png\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"用户上传原图.png\" src=\"https://images.unsplash.com/photo-1519389950473-47ba0277781c?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-file-card-media-status-layer\"><span class=\"k-file-card-media-loading-text\">上传中</span></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-loading k-file-card-progressing\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"门店参考图.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店参考图.jpg\" src=\"https://images.unsplash.com/photo-1519389950473-47ba0277781c?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-file-card-media-progress-text\">48%</div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-error\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"海报封面.png\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"海报封面.png\" src=\"https://images.unsplash.com/photo-1519389950473-47ba0277781c?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-file-card-media-status-layer\"><span class=\"k-file-card-error-text\">生成失败</span></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default k-file-card-error k-file-card-media-error-artwork\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-error k-media-custom-error k-file-card-media-view css-bh0jn3\" title=\"错误图.png\"><div class=\"k-media-shell\"><div class=\"k-media-state-layer k-media-error-layer\"><div class=\"k-file-card-media-error-artwork-content\"><img class=\"k-file-card-media-error-artwork-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_25770_6783)%22%3E%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25770_6783)%22%2F%3E%3Cpath%20d%3D%22M8.24289%2022.3474L11.1107%2018.1323C11.1475%2018.0783%2011.1956%2018.033%2011.2518%2017.9996C11.3079%2017.9663%2011.3707%2017.9457%2011.4357%2017.9393C11.5007%2017.9329%2011.5664%2017.9408%2011.628%2017.9626C11.6895%2017.9844%2011.7456%2018.0194%2011.7921%2018.0652L13.6875%2019.9222L17.8459%2013.4042C17.8871%2013.3395%2017.9442%2013.2865%2018.0119%2013.2504C18.0795%2013.2142%2018.1553%2013.1961%2018.232%2013.1979C18.3086%2013.1996%2018.3835%2013.2211%2018.4495%2013.2602C18.5154%2013.2993%2018.5701%2013.3548%2018.6084%2013.4213L23.7752%2022.3756C23.8144%2022.4434%2023.8351%2022.5203%2023.8351%2022.5986C23.8352%2022.6769%2023.8146%2022.7539%2023.7754%2022.8217C23.7362%2022.8896%2023.6799%2022.9459%2023.612%2022.985C23.5441%2023.0241%2023.4672%2023.0447%2023.3888%2023.0446H8.61173C8.53054%2023.0447%208.45085%2023.0227%208.38126%2022.9809C8.31167%2022.9391%208.25481%2022.8791%208.21683%2022.8074C8.17885%2022.7356%208.16118%2022.6548%208.16574%2022.5738C8.1703%2022.4927%208.19691%2022.4145%208.2427%2022.3474H8.24289Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M9.10168%2012.8034C9.10168%2013.3996%209.33855%2013.9715%209.76017%2014.3931C10.1818%2014.8147%2010.7536%2015.0516%2011.3499%2015.0516C11.9462%2015.0516%2012.518%2014.8147%2012.9396%2014.3931C13.3612%2013.9715%2013.5981%2013.3996%2013.5981%2012.8034C13.5981%2012.2071%2013.3612%2011.6353%2012.9396%2011.2137C12.518%2010.792%2011.9462%2010.5552%2011.3499%2010.5552C10.7536%2010.5552%2010.1818%2010.792%209.76017%2011.2137C9.33855%2011.6353%209.10168%2012.2071%209.10168%2012.8034Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_25770_6783)%22%3E%3Cpath%20d%3D%22M18.4001%200L30.4001%2012H21.6001C19.8328%2012%2018.4001%2010.5673%2018.4001%208.8V0Z%22%20fill%3D%22%23C9CAD6%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M19.2001%200L30.4001%2011.2H22.4001C20.6328%2011.2%2019.2001%209.76731%2019.2001%208V0Z%22%20fill%3D%22%23F2F2F3%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_25770_6783%22%20x%3D%2214.4001%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25770_6783%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_25770_6783%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ECECEC%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23D6DCE7%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_25770_6783%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"><span class=\"k-file-card-error-text k-file-card-media-error-artwork-text\">上传失败</span></div></div></div></div></div></div></div></div><div class=\"file-card-demo-loading-section\"><div class=\"file-card-demo-loading-title\">视频</div><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-video k-file-card-default k-file-card-loading\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-video k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"模型生成视频.mp4\"><div class=\"k-media-shell\"><div class=\"k-media-placeholder\"><i class=\"k-icon ion-videocamera css-16qej3\"></i></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-video k-file-card-default k-file-card-loading\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-video k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"素材预览.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"metadata\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\" poster=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-file-card-media-status-layer\"><span class=\"k-file-card-media-loading-text\">上传中</span></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-video k-file-card-default k-file-card-loading k-file-card-progressing\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-video k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"最终成片.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"metadata\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\" poster=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-file-card-media-progress-text\">76%</div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-video k-file-card-default k-file-card-error\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-video k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"预告片.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"auto\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-file-card-media-status-layer\"><span class=\"k-file-card-error-text\">渲染失败</span></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-video k-file-card-default k-file-card-error\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-video k-media-default k-media-error k-file-card-media-view css-bh0jn3\" title=\"错误视频.mp4\"><div class=\"k-media-shell\"><div class=\"k-media-error-card\"><img class=\"k-media-card-icon k-media-error-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_25770_6789)%22%3E%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25770_6789)%22%2F%3E%3Cpath%20d%3D%22M13.4815%2012.9907C13.2152%2012.8215%2012.8669%2013.0128%2012.8669%2013.3283V21.8719C12.8669%2022.1874%2013.2152%2022.3787%2013.4815%2022.2095L20.2025%2017.9377C20.4497%2017.7805%2020.4497%2017.4197%2020.2025%2017.2625L13.4815%2012.9907Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_25770_6789)%22%3E%3Cpath%20d%3D%22M18.4001%200L30.4001%2012H21.6001C19.8328%2012%2018.4001%2010.5673%2018.4001%208.8V0Z%22%20fill%3D%22%23C9CAD6%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M19.2001%200L30.4001%2011.2H22.4001C20.6328%2011.2%2019.2001%209.76731%2019.2001%208V0Z%22%20fill%3D%22%23F2F2F3%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_25770_6789%22%20x%3D%2214.4001%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25770_6789%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_25770_6789%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ECECEC%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23D6DCE7%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_25770_6789%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div></div></div></div></div></div></div><div class=\"file-card-demo-loading-section\"><div class=\"file-card-demo-loading-title\">音频</div><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-audio k-file-card-default k-file-card-loading\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-audio k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"品牌旁白.mp3\"><div class=\"k-media-shell\"><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-audio k-file-card-default k-file-card-loading k-file-card-progressing\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-audio k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"采访录音.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-file-card-media-status-layer\"><span class=\"k-file-card-media-loading-text\">上传中</span></div><div class=\"k-file-card-media-progress-text\">36%</div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-audio k-file-card-default k-file-card-error\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-audio k-media-default k-media-error k-file-card-media-view css-bh0jn3\" title=\"最终旁白.m4a\"><div class=\"k-media-shell\"><div class=\"k-media-error-card\"><img class=\"k-media-card-icon k-media-error-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_25770_6777)%22%3E%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25770_6777)%22%2F%3E%3Cpath%20d%3D%22M21.0556%2013.7107C20.2305%2013.7107%2019.4391%2013.3829%2018.8557%2012.7995C18.2722%2012.2161%2017.9445%2011.4247%2017.9445%2010.5996H16.3889V18.1907C15.7401%2017.7572%2014.965%2017.5529%2014.1868%2017.6104C13.4086%2017.6679%2012.6719%2017.9837%2012.0937%2018.5078C11.5156%2019.0319%2011.1292%2019.7342%2010.9959%2020.503C10.8626%2021.2719%2010.9901%2022.0633%2011.3581%2022.7514C11.726%2023.4395%2012.3134%2023.9849%2013.0269%2024.301C13.7403%2024.617%2014.539%2024.6856%2015.2958%2024.4958C16.0527%2024.306%2016.7245%2023.8686%2017.2044%2023.2533C17.6843%2022.638%2017.9448%2021.8799%2017.9445%2021.0996V14.0724C18.7992%2014.8397%2019.9069%2015.2648%2021.0556%2015.2663V13.7107Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_25770_6777)%22%3E%3Cpath%20d%3D%22M18.4001%200L30.4001%2012H21.6001C19.8328%2012%2018.4001%2010.5673%2018.4001%208.8V0Z%22%20fill%3D%22%23C9CAD6%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M19.2001%200L30.4001%2011.2H22.4001C20.6328%2011.2%2019.2001%209.76731%2019.2001%208V0Z%22%20fill%3D%22%23F2F2F3%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_25770_6777%22%20x%3D%2214.4001%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25770_6777%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_25770_6777%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ECECEC%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23D6DCE7%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_25770_6777%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-audio k-file-card-mini k-file-card-error\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-audio k-media-mini k-media-error k-file-card-media-view css-bh0jn3\" title=\"小尺寸错误音频.mp3\"><div class=\"k-media-shell\"><div class=\"k-media-error-card\"><img class=\"k-media-card-icon k-media-error-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_25770_6777)%22%3E%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25770_6777)%22%2F%3E%3Cpath%20d%3D%22M21.0556%2013.7107C20.2305%2013.7107%2019.4391%2013.3829%2018.8557%2012.7995C18.2722%2012.2161%2017.9445%2011.4247%2017.9445%2010.5996H16.3889V18.1907C15.7401%2017.7572%2014.965%2017.5529%2014.1868%2017.6104C13.4086%2017.6679%2012.6719%2017.9837%2012.0937%2018.5078C11.5156%2019.0319%2011.1292%2019.7342%2010.9959%2020.503C10.8626%2021.2719%2010.9901%2022.0633%2011.3581%2022.7514C11.726%2023.4395%2012.3134%2023.9849%2013.0269%2024.301C13.7403%2024.617%2014.539%2024.6856%2015.2958%2024.4958C16.0527%2024.306%2016.7245%2023.8686%2017.2044%2023.2533C17.6843%2022.638%2017.9448%2021.8799%2017.9445%2021.0996V14.0724C18.7992%2014.8397%2019.9069%2015.2648%2021.0556%2015.2663V13.7107Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_25770_6777)%22%3E%3Cpath%20d%3D%22M18.4001%200L30.4001%2012H21.6001C19.8328%2012%2018.4001%2010.5673%2018.4001%208.8V0Z%22%20fill%3D%22%23C9CAD6%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M19.2001%200L30.4001%2011.2H22.4001C20.6328%2011.2%2019.2001%209.76731%2019.2001%208V0Z%22%20fill%3D%22%23F2F2F3%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_25770_6777%22%20x%3D%2214.4001%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25770_6777%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_25770_6777%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ECECEC%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23D6DCE7%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_25770_6777%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div></div></div></div></div></div></div></div>"
145
+ ```
146
+
147
+ #### `FileCard media`
148
+
149
+ ```
150
+ "<div class=\"file-card-demo-media\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-video k-file-card-default\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-video k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"模型预览.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"metadata\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\" poster=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-audio k-file-card-default\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-audio k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"品牌旁白.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"auto\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div></div>"
151
+ ```
152
+
153
+ #### `FileCard size`
154
+
155
+ ```
156
+ "<div class=\"file-card-demo-size\"><div class=\"file-card-demo-size-row\"><div class=\"file-card-demo-size-label\">文件</div><div class=\"file-card-demo-size-list\"><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-large\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"品牌规范.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"品牌规范.pdf\"><span class=\"k-file-card-title-prefix\">品牌规范</span><span class=\"k-file-card-title-suffix\">.pdf</span></div><div class=\"k-file-card-description\"><span>1.8 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"品牌规范.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"品牌规范.pdf\"><span class=\"k-file-card-title-prefix\">品牌规范</span><span class=\"k-file-card-title-suffix\">.pdf</span></div><div class=\"k-file-card-description\"><span>1.8 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-small\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"品牌规范.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"品牌规范.pdf\"><span class=\"k-file-card-title-prefix\">品牌规范</span><span class=\"k-file-card-title-suffix\">.pdf</span></div><div class=\"k-file-card-description\"><span>1.8 MB</span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-mini\"><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"品牌规范.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"品牌规范.pdf\"><span class=\"k-file-card-title-prefix\">品牌规范</span><span class=\"k-file-card-title-suffix\">.pdf</span></div></div></div></div></div></div></div></div><div class=\"file-card-demo-size-row\"><div class=\"file-card-demo-size-label\">图片</div><div class=\"file-card-demo-size-list\"><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-large\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-large k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店参考图.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店参考图.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-default\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店参考图.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店参考图.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-small\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-small k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店参考图.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店参考图.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-image k-file-card-mini\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-image k-media-mini k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"门店参考图.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"门店参考图.jpg\" src=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div></div></div></div></div><div class=\"file-card-demo-size-row\"><div class=\"file-card-demo-size-label\">视频</div><div class=\"file-card-demo-size-list\"><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-video k-file-card-large\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-video k-media-large k-media-loading k-file-card-media-view css-bh0jn3\" title=\"模型预览.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"metadata\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\" poster=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-video k-file-card-default\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-video k-media-default k-media-loading k-file-card-media-view css-bh0jn3\" title=\"模型预览.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"metadata\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\" poster=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-video k-file-card-small\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-video k-media-small k-media-loading k-file-card-media-view css-bh0jn3\" title=\"模型预览.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"metadata\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\" poster=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-video k-file-card-mini\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-video k-media-mini k-media-loading k-file-card-media-view css-bh0jn3\" title=\"模型预览.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"metadata\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\" poster=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div></div></div></div><div class=\"file-card-demo-size-row\"><div class=\"file-card-demo-size-label\">音频</div><div class=\"file-card-demo-size-list\"><div class=\"k-file-card-list k-file-card-list-scrollX css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-audio k-file-card-large k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-audio k-media-large k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"品牌旁白.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"播放音频\"><i class=\"k-icon k-media-preview-icon ion-ios-play k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-audio k-file-card-default k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-audio k-media-default k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"品牌旁白.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"播放音频\"><i class=\"k-icon k-media-preview-icon ion-ios-play k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-audio k-file-card-small k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-audio k-media-small k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"品牌旁白.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"播放音频\"><i class=\"k-icon k-media-preview-icon ion-ios-play k-large css-16qej3\"></i></button></div></div></div></div></div><div class=\"k-file-card css-il2rwy k-file-card-media k-file-card-type-audio k-file-card-mini k-file-card-done\"><div class=\"k-file-card-media-shell\"><div class=\"k-media k-media-audio k-media-mini k-media-done k-media-previewable k-file-card-media-view css-bh0jn3\" title=\"品牌旁白.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"播放音频\"><i class=\"k-icon k-media-preview-icon ion-ios-play k-large css-16qej3\"></i></button></div></div></div></div></div></div></div></div></div>"
157
+ ```
158
+
159
+ ## `media`
160
+
161
+ #### `Media basic`
162
+
163
+ ```
164
+ "<div class=\"media-demo-basic\"><div class=\"k-media k-media-image k-media-default k-media-loading css-bh0jn3\" title=\"参考图.png\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"参考图.png\" src=\"https://images.unsplash.com/photo-1495567720989-cebdbdd97913?auto=format&amp;fit=crop&amp;w=640&amp;q=80\" draggable=\"false\"><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-media k-media-video k-media-default k-media-loading css-bh0jn3\" title=\"产品预告.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"metadata\" playsinline=\"true\" tabindex=\"-1\" src=\"https://www.w3schools.com/html/mov_bbb.mp4\" poster=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=640&amp;q=80\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-media k-media-audio k-media-default k-media-loading css-bh0jn3\" title=\"播客片段.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div>"
165
+ ```
166
+
167
+ #### `Media group`
168
+
169
+ ```
170
+ "<div class=\"k-media-group css-1h47iwr\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable css-bh0jn3\" title=\"场景图 1\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"场景图 1\" src=\"https://images.unsplash.com/photo-1493246507139-91e8fad9978e?auto=format&amp;fit=crop&amp;w=640&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable css-bh0jn3\" title=\"场景图 2\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"场景图 2\" src=\"https://images.unsplash.com/photo-1494783367193-149034c05e8f?auto=format&amp;fit=crop&amp;w=640&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable css-bh0jn3\" title=\"场景图 3\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"场景图 3\" src=\"https://images.unsplash.com/photo-1495567720989-cebdbdd97913?auto=format&amp;fit=crop&amp;w=640&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div></div>"
171
+ ```
172
+
173
+ #### `Media size`
174
+
175
+ ```
176
+ "<div class=\"media-demo-size\"><div class=\"media-demo-size-section\"><div class=\"media-demo-size-label\">图片</div><div class=\"media-demo-size-row\"><div class=\"k-media k-media-image k-media-small k-media-loading css-bh0jn3\" title=\"photo-1521572267360-ee0c2909d518\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"photo-1521572267360-ee0c2909d518\" src=\"https://images.unsplash.com/photo-1521572267360-ee0c2909d518?auto=format&amp;fit=crop&amp;w=240&amp;q=80\" draggable=\"false\"><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-media k-media-image k-media-default k-media-loading css-bh0jn3\" title=\"photo-1500534314209-a25ddb2bd429\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"photo-1500534314209-a25ddb2bd429\" src=\"https://images.unsplash.com/photo-1500534314209-a25ddb2bd429?auto=format&amp;fit=crop&amp;w=240&amp;q=80\" draggable=\"false\"><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-media k-media-image k-media-large k-media-loading css-bh0jn3\" title=\"photo-1519389950473-47ba0277781c\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"photo-1519389950473-47ba0277781c\" src=\"https://images.unsplash.com/photo-1519389950473-47ba0277781c?auto=format&amp;fit=crop&amp;w=320&amp;q=80\" draggable=\"false\"><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"media-demo-size-section\"><div class=\"media-demo-size-label\">视频</div><div class=\"media-demo-size-row\"><div class=\"k-media k-media-video k-media-small k-media-loading css-bh0jn3\" title=\"预告片.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"auto\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-media k-media-video k-media-default k-media-loading css-bh0jn3\" title=\"预告片.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"auto\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-media k-media-video k-media-large k-media-loading css-bh0jn3\" title=\"预告片.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"auto\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"media-demo-size-section\"><div class=\"media-demo-size-label\">音频</div><div class=\"media-demo-size-row\"><div class=\"k-media k-media-audio k-media-small k-media-loading css-bh0jn3\" title=\"品牌播客.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-media k-media-audio k-media-default k-media-loading css-bh0jn3\" title=\"品牌播客.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-media k-media-audio k-media-large k-media-loading css-bh0jn3\" title=\"品牌播客.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"media-demo-size-section\"><div class=\"media-demo-size-label\">自定义宽高</div><div class=\"media-demo-size-row\"><div class=\"k-media k-media-video k-media-default k-media-loading css-bh0jn3\" title=\"横向海报.mp4\" style=\"width: 120px; height: 72px;\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"auto\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\"></video><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-media k-media-audio k-media-default k-media-loading css-bh0jn3\" title=\"音频片段.mp3\" style=\"width: 72px; height: 96px;\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div></div>"
177
+ ```
178
+
179
+ #### `Media slots`
180
+
181
+ ```
182
+ "<div class=\"media-demo-slots\"><div class=\"k-media k-media-video k-media-default k-media-loading k-media-custom-loading css-bh0jn3\" title=\"转码中.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"auto\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\"></video><div class=\"k-media-state-layer k-media-loading-layer\"><div class=\"media-demo-slots-progress\"><div class=\"k-progress k-circle k-mini css-1rcjjev\"><svg class=\"k-progress-canvas\" viewBox=\"0 0 120 120\"><circle class=\"k-progress-meter\" cx=\"60\" cy=\"60\" r=\"57\" stroke-width=\"6\"></circle><circle class=\"k-progress-value\" cx=\"60\" cy=\"60\" r=\"57\" stroke-dashoffset=\"114.60530000295563\" stroke-dasharray=\"358.1415625092364\" stroke-width=\"6\"></circle></svg><div class=\"k-progress-text\"><span>68%</span></div></div></div></div></div></div><div class=\"k-media k-media-video k-media-default k-media-loading k-media-custom-loading css-bh0jn3\" title=\"转码中.mp4\"><div class=\"k-media-shell\"><div class=\"k-media-state-layer k-media-loading-layer\"><div class=\"media-demo-slots-progress\"><div class=\"k-progress k-circle k-mini css-1rcjjev\"><svg class=\"k-progress-canvas\" viewBox=\"0 0 120 120\"><circle class=\"k-progress-meter\" cx=\"60\" cy=\"60\" r=\"57\" stroke-width=\"6\"></circle><circle class=\"k-progress-value\" cx=\"60\" cy=\"60\" r=\"57\" stroke-dashoffset=\"257.8619250066502\" stroke-dasharray=\"358.1415625092364\" stroke-width=\"6\"></circle></svg><div class=\"k-progress-text\"><span>28%</span></div></div></div></div></div></div><div class=\"k-media k-media-image k-media-default k-media-error k-media-custom-error css-bh0jn3\" title=\"封面加载失败.png\"><div class=\"k-media-shell\"><div class=\"k-media-state-layer k-media-error-layer\"><div class=\"media-demo-slots-error\"><i class=\"k-icon ion-alert-circled css-16qej3\"></i><span>{media.resolvedType === 'image' ? '图片不可用' : '加载失败'}</span></div></div></div></div><div class=\"k-media k-media-audio k-media-default k-media-loading k-media-custom-loading css-bh0jn3\" title=\"播客转码中.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-state-layer k-media-loading-layer\"><span class=\"media-demo-slots-audio-loading\">42%</span></div></div></div><div class=\"k-media k-media-audio k-media-default k-media-error k-media-custom-error css-bh0jn3\" title=\"播客资源失效.mp3\"><div class=\"k-media-shell\"><div class=\"k-media-state-layer k-media-error-layer\"><span class=\"media-demo-slots-audio-error\">已失效</span></div></div></div><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable k-media-custom-mask css-bh0jn3\" title=\"海边步道.jpg\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"海边步道.jpg\" src=\"https://images.unsplash.com/photo-1470770841072-f978cf4d019e?auto=format&amp;fit=crop&amp;w=640&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><div class=\"media-demo-slots-mask\"><button class=\"media-demo-slots-mask-button\" type=\"button\"><i class=\"k-icon k-icon-visible css-16qej3\"></i></button><i class=\"k-icon k-icon-download css-16qej3\"></i></div></div></div></div><div class=\"k-media k-media-video k-media-default k-media-done k-media-previewable k-media-custom-mask css-bh0jn3\" title=\"产品预告.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"auto\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\"></video><div class=\"k-media-overlay\"><div class=\"media-demo-slots-mask\"><button class=\"media-demo-slots-mask-button\" type=\"button\"><i class=\"k-icon ion-ios-play css-16qej3\"></i></button></div></div></div></div><div class=\"k-media k-media-audio k-media-default k-media-done k-media-previewable k-media-custom-mask css-bh0jn3\" title=\"播客片段.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-overlay\"><div class=\"media-demo-slots-mask\"><button class=\"media-demo-slots-mask-button\" type=\"button\"><i class=\"k-icon ion-ios-play css-16qej3\"></i></button></div></div></div></div></div>"
183
+ ```
184
+
185
+ #### `Media status`
186
+
187
+ ```
188
+ "<div class=\"media-demo-status\"><div class=\"media-demo-status-section\"><div class=\"media-demo-status-label\">加载中</div><div class=\"media-demo-status-row\"><div class=\"k-media k-media-image k-media-default k-media-loading css-bh0jn3\" title=\"图片加载中.png\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"图片加载中.png\" src=\"https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&amp;fit=crop&amp;w=320&amp;q=80\" draggable=\"false\"><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-media k-media-video k-media-default k-media-loading css-bh0jn3\" title=\"视频加载中.mp4\"><div class=\"k-media-shell\"><div class=\"k-media-placeholder\"><i class=\"k-icon ion-videocamera css-16qej3\"></i></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div><div class=\"k-media k-media-audio k-media-default k-media-loading css-bh0jn3\" title=\"音频加载中.mp3\"><div class=\"k-media-shell\"><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-loading-indicator\"><span class=\"k-media-loading-spinner\"></span></div></div></div></div></div><div class=\"media-demo-status-section\"><div class=\"media-demo-status-label\">加载失败</div><div class=\"media-demo-status-row\"><div class=\"k-media k-media-image k-media-default k-media-error css-bh0jn3\" title=\"图片加载失败.png\"><div class=\"k-media-shell\"><div class=\"k-media-error-card\"><img class=\"k-media-card-icon k-media-error-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_25770_6783)%22%3E%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25770_6783)%22%2F%3E%3Cpath%20d%3D%22M8.24289%2022.3474L11.1107%2018.1323C11.1475%2018.0783%2011.1956%2018.033%2011.2518%2017.9996C11.3079%2017.9663%2011.3707%2017.9457%2011.4357%2017.9393C11.5007%2017.9329%2011.5664%2017.9408%2011.628%2017.9626C11.6895%2017.9844%2011.7456%2018.0194%2011.7921%2018.0652L13.6875%2019.9222L17.8459%2013.4042C17.8871%2013.3395%2017.9442%2013.2865%2018.0119%2013.2504C18.0795%2013.2142%2018.1553%2013.1961%2018.232%2013.1979C18.3086%2013.1996%2018.3835%2013.2211%2018.4495%2013.2602C18.5154%2013.2993%2018.5701%2013.3548%2018.6084%2013.4213L23.7752%2022.3756C23.8144%2022.4434%2023.8351%2022.5203%2023.8351%2022.5986C23.8352%2022.6769%2023.8146%2022.7539%2023.7754%2022.8217C23.7362%2022.8896%2023.6799%2022.9459%2023.612%2022.985C23.5441%2023.0241%2023.4672%2023.0447%2023.3888%2023.0446H8.61173C8.53054%2023.0447%208.45085%2023.0227%208.38126%2022.9809C8.31167%2022.9391%208.25481%2022.8791%208.21683%2022.8074C8.17885%2022.7356%208.16118%2022.6548%208.16574%2022.5738C8.1703%2022.4927%208.19691%2022.4145%208.2427%2022.3474H8.24289Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M9.10168%2012.8034C9.10168%2013.3996%209.33855%2013.9715%209.76017%2014.3931C10.1818%2014.8147%2010.7536%2015.0516%2011.3499%2015.0516C11.9462%2015.0516%2012.518%2014.8147%2012.9396%2014.3931C13.3612%2013.9715%2013.5981%2013.3996%2013.5981%2012.8034C13.5981%2012.2071%2013.3612%2011.6353%2012.9396%2011.2137C12.518%2010.792%2011.9462%2010.5552%2011.3499%2010.5552C10.7536%2010.5552%2010.1818%2010.792%209.76017%2011.2137C9.33855%2011.6353%209.10168%2012.2071%209.10168%2012.8034Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_25770_6783)%22%3E%3Cpath%20d%3D%22M18.4001%200L30.4001%2012H21.6001C19.8328%2012%2018.4001%2010.5673%2018.4001%208.8V0Z%22%20fill%3D%22%23C9CAD6%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M19.2001%200L30.4001%2011.2H22.4001C20.6328%2011.2%2019.2001%209.76731%2019.2001%208V0Z%22%20fill%3D%22%23F2F2F3%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_25770_6783%22%20x%3D%2214.4001%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25770_6783%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_25770_6783%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ECECEC%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23D6DCE7%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_25770_6783%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div></div></div><div class=\"k-media k-media-video k-media-default k-media-error css-bh0jn3\" title=\"视频加载失败.mp4\"><div class=\"k-media-shell\"><div class=\"k-media-error-card\"><img class=\"k-media-card-icon k-media-error-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_25770_6789)%22%3E%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25770_6789)%22%2F%3E%3Cpath%20d%3D%22M13.4815%2012.9907C13.2152%2012.8215%2012.8669%2013.0128%2012.8669%2013.3283V21.8719C12.8669%2022.1874%2013.2152%2022.3787%2013.4815%2022.2095L20.2025%2017.9377C20.4497%2017.7805%2020.4497%2017.4197%2020.2025%2017.2625L13.4815%2012.9907Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_25770_6789)%22%3E%3Cpath%20d%3D%22M18.4001%200L30.4001%2012H21.6001C19.8328%2012%2018.4001%2010.5673%2018.4001%208.8V0Z%22%20fill%3D%22%23C9CAD6%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M19.2001%200L30.4001%2011.2H22.4001C20.6328%2011.2%2019.2001%209.76731%2019.2001%208V0Z%22%20fill%3D%22%23F2F2F3%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_25770_6789%22%20x%3D%2214.4001%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25770_6789%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_25770_6789%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ECECEC%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23D6DCE7%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_25770_6789%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div></div></div><div class=\"k-media k-media-audio k-media-default k-media-error css-bh0jn3\" title=\"音频加载失败.mp3\"><div class=\"k-media-shell\"><div class=\"k-media-error-card\"><img class=\"k-media-card-icon k-media-error-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_25770_6777)%22%3E%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25770_6777)%22%2F%3E%3Cpath%20d%3D%22M21.0556%2013.7107C20.2305%2013.7107%2019.4391%2013.3829%2018.8557%2012.7995C18.2722%2012.2161%2017.9445%2011.4247%2017.9445%2010.5996H16.3889V18.1907C15.7401%2017.7572%2014.965%2017.5529%2014.1868%2017.6104C13.4086%2017.6679%2012.6719%2017.9837%2012.0937%2018.5078C11.5156%2019.0319%2011.1292%2019.7342%2010.9959%2020.503C10.8626%2021.2719%2010.9901%2022.0633%2011.3581%2022.7514C11.726%2023.4395%2012.3134%2023.9849%2013.0269%2024.301C13.7403%2024.617%2014.539%2024.6856%2015.2958%2024.4958C16.0527%2024.306%2016.7245%2023.8686%2017.2044%2023.2533C17.6843%2022.638%2017.9448%2021.8799%2017.9445%2021.0996V14.0724C18.7992%2014.8397%2019.9069%2015.2648%2021.0556%2015.2663V13.7107Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_25770_6777)%22%3E%3Cpath%20d%3D%22M18.4001%200L30.4001%2012H21.6001C19.8328%2012%2018.4001%2010.5673%2018.4001%208.8V0Z%22%20fill%3D%22%23C9CAD6%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M19.2001%200L30.4001%2011.2H22.4001C20.6328%2011.2%2019.2001%209.76731%2019.2001%208V0Z%22%20fill%3D%22%23F2F2F3%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_25770_6777%22%20x%3D%2214.4001%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25770_6777%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_25770_6777%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ECECEC%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23D6DCE7%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_25770_6777%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div></div></div></div></div><div class=\"media-demo-status-section\"><div class=\"media-demo-status-label\">已完成</div><div class=\"media-demo-status-row\"><div class=\"k-media k-media-image k-media-default k-media-done k-media-previewable css-bh0jn3\" title=\"参考图.png\"><div class=\"k-media-shell\"><img class=\"k-media-image\" alt=\"参考图.png\" src=\"https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&amp;fit=crop&amp;w=320&amp;q=80\" draggable=\"false\"><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"查看图片\"><i class=\"k-icon k-media-preview-icon ion-ios-eye-outline k-large css-16qej3\"></i></button></div></div></div><div class=\"k-media k-media-video k-media-default k-media-done k-media-previewable css-bh0jn3\" title=\"产品预告.mp4\"><div class=\"k-media-shell\"><video class=\"k-media-video\" preload=\"metadata\" playsinline=\"true\" tabindex=\"-1\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4\" poster=\"https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?auto=format&amp;fit=crop&amp;w=320&amp;q=80\"></video><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"播放视频\"><i class=\"k-icon k-media-preview-icon ion-ios-play k-large css-16qej3\"></i></button></div></div></div><div class=\"k-media k-media-audio k-media-default k-media-done k-media-previewable css-bh0jn3\" title=\"播客片段.mp3\"><div class=\"k-media-shell\"><audio class=\"k-media-audio-loader\" preload=\"metadata\" src=\"https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3\"></audio><div class=\"k-media-audio-card\"><img class=\"k-media-card-icon k-media-audio-card-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_24923_23617)%22%3E%3Cpath%20d%3D%22M1.19995%202.4C1.19995%201.07452%202.27447%200%203.59995%200H14.4017L22.8%208.39355V21.6C22.8%2022.9255%2021.7254%2024%2020.4%2024H3.59995C2.27447%2024%201.19995%2022.9255%201.19995%2021.6V2.4Z%22%20fill%3D%22url(%23paint0_linear_24923_23617)%22%2F%3E%3Cpath%20d%3D%22M15.7916%2010.2829C15.1728%2010.2829%2014.5793%2010.037%2014.1417%209.59944C13.7041%209.16185%2013.4583%208.56836%2013.4583%207.94952H12.2916V13.6429C11.805%2013.3177%2011.2236%2013.1645%2010.64%2013.2076C10.0563%2013.2507%209.50381%2013.4876%209.07021%2013.8807C8.63661%2014.2738%208.3468%2014.8005%208.24683%2015.3771C8.14687%2015.9537%208.24247%2016.5473%208.51845%2017.0634C8.79444%2017.5794%209.23497%2017.9885%209.77007%2018.2255C10.3052%2018.4626%2010.9041%2018.514%2011.4718%2018.3716C12.0395%2018.2293%2012.5433%2017.9013%2012.9032%2017.4398C13.2631%2016.9783%2013.4585%2016.4098%2013.4583%2015.8245V10.5541C14.0993%2011.1296%2014.9301%2011.4484%2015.7916%2011.4495V10.2829Z%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_24923_23617)%22%3E%3Cpath%20d%3D%22M13.8%200L22.8%209H16.2C14.8746%209%2013.8%207.92548%2013.8%206.6V0Z%22%20fill%3D%22%23FA655E%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M14.3999%200L22.7999%208.4H16.7999C15.4744%208.4%2014.3999%207.32548%2014.3999%206V0Z%22%20fill%3D%22%23FEC6C2%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_24923_23617%22%20x%3D%2210.8%22%20y%3D%22-3%22%20width%3D%2215%22%20height%3D%2215%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%221.5%22%20result%3D%22effect1_foregroundBlur_24923_23617%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_24923_23617%22%20x1%3D%221.19995%22%20y1%3D%220%22%20x2%3D%2225.2%22%20y2%3D%2224%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23FDA79C%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8787%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22clip0_24923_23617%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></div><div class=\"k-media-overlay\"><button class=\"k-media-preview-trigger\" type=\"button\" title=\"播放音频\"><i class=\"k-icon k-media-preview-icon ion-ios-play k-large css-16qej3\"></i></button></div></div></div></div></div></div>"
189
+ ```
190
+
191
+ ## `sender`
192
+
193
+ #### `Sender attachments`
194
+
195
+ ```
196
+ "<div class=\"k-sender k-sender-text css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-shell\"><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 64px; overflow-y: hidden;\"></textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-left\"><button class=\"k-sender-attach-btn\" type=\"button\" title=\"上传附件\" aria-label=\"上传附件\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M8.23567 3.18836L3.28591 8.13812C2.11433 9.30969 2.11433 11.2092 3.28591 12.3808C4.45747 13.5523 6.35697 13.5523 7.52854 12.3808L13.4211 6.48819C14.2021 5.70716 14.2021 4.44082 13.4211 3.65975C12.6401 2.87871 11.3737 2.87871 10.5927 3.65975L4.70014 9.55232C4.3096 9.94286 4.3096 10.576 4.70014 10.9665C5.09064 11.3571 5.7238 11.3571 6.11434 10.9665L11.0641 6.01679\" stroke=\"currentColor\" stroke-linecap=\"square\" stroke-linejoin=\"round\"></path></svg></button></div><div class=\"k-sender-toolbar-right\"><button class=\"k-sender-send-btn\" type=\"button\" disabled=\"\" title=\"发送\" aria-label=\"发送\"><img class=\"k-sender-send-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20rx%3D%2216%22%20fill%3D%22url(%23b)%22%2F%3E%3Cpath%20d%3D%22M22.3337%209.6666L17.9003%2022.3333L16.0003%2016L9.667%2014.1L22.3337%209.6666Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2232%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300DDDD%22%2F%3E%3Cstop%20offset%3D%220.538462%22%20stop-color%3D%22%235370FF%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23712FFF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" accept=\".pdf,.doc,.docx,image/*\" multiple=\"\"></div></div>"
197
+ ```
198
+
199
+ #### `Sender basic`
200
+
201
+ ```
202
+ "<div class=\"k-sender k-sender-text css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-shell\"><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 64px; overflow-y: hidden;\"></textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-left\"><button class=\"k-sender-attach-btn\" type=\"button\" title=\"上传附件\" aria-label=\"上传附件\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M8.23567 3.18836L3.28591 8.13812C2.11433 9.30969 2.11433 11.2092 3.28591 12.3808C4.45747 13.5523 6.35697 13.5523 7.52854 12.3808L13.4211 6.48819C14.2021 5.70716 14.2021 4.44082 13.4211 3.65975C12.6401 2.87871 11.3737 2.87871 10.5927 3.65975L4.70014 9.55232C4.3096 9.94286 4.3096 10.576 4.70014 10.9665C5.09064 11.3571 5.7238 11.3571 6.11434 10.9665L11.0641 6.01679\" stroke=\"currentColor\" stroke-linecap=\"square\" stroke-linejoin=\"round\"></path></svg></button></div><div class=\"k-sender-toolbar-right\"><button class=\"k-sender-send-btn\" type=\"button\" disabled=\"\" title=\"发送\" aria-label=\"发送\"><img class=\"k-sender-send-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20rx%3D%2216%22%20fill%3D%22url(%23b)%22%2F%3E%3Cpath%20d%3D%22M22.3337%209.6666L17.9003%2022.3333L16.0003%2016L9.667%2014.1L22.3337%209.6666Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2232%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300DDDD%22%2F%3E%3Cstop%20offset%3D%220.538462%22%20stop-color%3D%22%235370FF%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23712FFF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" multiple=\"\"></div></div>"
203
+ ```
204
+
205
+ #### `Sender beforeInput`
206
+
207
+ ```
208
+ "<div class=\"k-sender k-sender-text css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-shell\"><div class=\"k-sender-before-input\"><div class=\"sender-demo-suggestions\"><span class=\"sender-demo-suggestions-title\">试试这些问题:</span><div class=\"k-tag k-none css-1blxads\">帮我总结这份会议纪要</div><div class=\"k-tag k-none css-1blxads\">生成一段产品介绍</div><div class=\"k-tag k-none css-1blxads\">解释一下 React Server Components</div></div></div><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 64px; overflow-y: hidden;\"></textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-left\"><button class=\"k-sender-attach-btn\" type=\"button\" title=\"上传附件\" aria-label=\"上传附件\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M8.23567 3.18836L3.28591 8.13812C2.11433 9.30969 2.11433 11.2092 3.28591 12.3808C4.45747 13.5523 6.35697 13.5523 7.52854 12.3808L13.4211 6.48819C14.2021 5.70716 14.2021 4.44082 13.4211 3.65975C12.6401 2.87871 11.3737 2.87871 10.5927 3.65975L4.70014 9.55232C4.3096 9.94286 4.3096 10.576 4.70014 10.9665C5.09064 11.3571 5.7238 11.3571 6.11434 10.9665L11.0641 6.01679\" stroke=\"currentColor\" stroke-linecap=\"square\" stroke-linejoin=\"round\"></path></svg></button></div><div class=\"k-sender-toolbar-right\"><button class=\"k-sender-send-btn\" type=\"button\" disabled=\"\" title=\"发送\" aria-label=\"发送\"><img class=\"k-sender-send-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20rx%3D%2216%22%20fill%3D%22url(%23b)%22%2F%3E%3Cpath%20d%3D%22M22.3337%209.6666L17.9003%2022.3333L16.0003%2016L9.667%2014.1L22.3337%209.6666Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2232%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300DDDD%22%2F%3E%3Cstop%20offset%3D%220.538462%22%20stop-color%3D%22%235370FF%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23712FFF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" multiple=\"\"></div></div>"
209
+ ```
210
+
211
+ #### `Sender configure`
212
+
213
+ ```
214
+ "<div class=\"k-sender k-sender-text css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-shell\"><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 64px; overflow-y: hidden;\"></textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-left\"><button class=\"k-sender-attach-btn\" type=\"button\" title=\"上传附件\" aria-label=\"上传附件\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M8.23567 3.18836L3.28591 8.13812C2.11433 9.30969 2.11433 11.2092 3.28591 12.3808C4.45747 13.5523 6.35697 13.5523 7.52854 12.3808L13.4211 6.48819C14.2021 5.70716 14.2021 4.44082 13.4211 3.65975C12.6401 2.87871 11.3737 2.87871 10.5927 3.65975L4.70014 9.55232C4.3096 9.94286 4.3096 10.576 4.70014 10.9665C5.09064 11.3571 5.7238 11.3571 6.11434 10.9665L11.0641 6.01679\" stroke=\"currentColor\" stroke-linecap=\"square\" stroke-linejoin=\"round\"></path></svg></button></div><div class=\"k-sender-toolbar-middle\"><div class=\"sender-demo-configure\"><div class=\"k-btns k-separate css-z9s2vw\"><button class=\"k-btn k-small k-default k-active css-spvvi2\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-think css-18c3toa\" style=\"color: rgb(0, 145, 234);\"></i> 深度 <input class=\"k-button-input\" type=\"checkbox\" tabindex=\"-1\"></button><button class=\"k-btn k-small k-default k-active css-spvvi2\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-internet css-18c3toa\" style=\"color: rgb(0, 145, 234);\"></i> 联网 <input class=\"k-button-input\" type=\"checkbox\" tabindex=\"-1\"></button></div><div class=\"k-select k-small css-1ti24q0\" tabindex=\"0\" style=\"width: px;\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"gpt-4o\"><div class=\"k-select-value c-ellipsis\">GPT-4o</div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-select-arrow k-icon-down css-16qej3\"></i></span></span></div><!--portal--></div></div><div class=\"k-sender-toolbar-right\"><button class=\"k-sender-send-btn\" type=\"button\" disabled=\"\" title=\"发送\" aria-label=\"发送\"><img class=\"k-sender-send-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20rx%3D%2216%22%20fill%3D%22url(%23b)%22%2F%3E%3Cpath%20d%3D%22M22.3337%209.6666L17.9003%2022.3333L16.0003%2016L9.667%2014.1L22.3337%209.6666Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2232%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300DDDD%22%2F%3E%3Cstop%20offset%3D%220.538462%22%20stop-color%3D%22%235370FF%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23712FFF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" multiple=\"\"></div></div>"
215
+ ```
216
+
217
+ #### `Sender custom`
218
+
219
+ ```
220
+ "<div class=\"k-sender k-sender-text css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-shell\"><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 64px; overflow-y: hidden;\"></textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-left\"><button class=\"k-btn k-small k-none css-spvvi2\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-paper css-16qej3\"></i> 上传文件 </button></div><div class=\"k-sender-toolbar-right\"><button class=\"k-btn k-primary k-disabled css-h31bz\" tabindex=\"-1\" type=\"button\">{scope.generating ? '停止' : '发送'}</button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" multiple=\"\"></div></div>"
221
+ ```
222
+
223
+ #### `Sender directory`
224
+
225
+ ```
226
+ "<div class=\"k-sender k-sender-text css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-shell\"><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 64px; overflow-y: hidden;\"></textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-left\"><button class=\"k-sender-attach-btn\" type=\"button\" title=\"上传文件夹\" aria-label=\"上传文件夹\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M8.23567 3.18836L3.28591 8.13812C2.11433 9.30969 2.11433 11.2092 3.28591 12.3808C4.45747 13.5523 6.35697 13.5523 7.52854 12.3808L13.4211 6.48819C14.2021 5.70716 14.2021 4.44082 13.4211 3.65975C12.6401 2.87871 11.3737 2.87871 10.5927 3.65975L4.70014 9.55232C4.3096 9.94286 4.3096 10.576 4.70014 10.9665C5.09064 11.3571 5.7238 11.3571 6.11434 10.9665L11.0641 6.01679\" stroke=\"currentColor\" stroke-linecap=\"square\" stroke-linejoin=\"round\"></path></svg></button></div><div class=\"k-sender-toolbar-right\"><button class=\"k-sender-send-btn\" type=\"button\" disabled=\"\" title=\"发送\" aria-label=\"发送\"><img class=\"k-sender-send-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20rx%3D%2216%22%20fill%3D%22url(%23b)%22%2F%3E%3Cpath%20d%3D%22M22.3337%209.6666L17.9003%2022.3333L16.0003%2016L9.667%2014.1L22.3337%209.6666Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2232%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300DDDD%22%2F%3E%3Cstop%20offset%3D%220.538462%22%20stop-color%3D%22%235370FF%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23712FFF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" directory=\"\" webkitdirectory=\"\" multiple=\"\"></div></div>"
227
+ ```
228
+
229
+ #### `Sender drag`
230
+
231
+ ```
232
+ "<div class=\"k-sender k-sender-text css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-shell\"><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 64px; overflow-y: hidden;\"></textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-left\"><button class=\"k-sender-attach-btn\" type=\"button\" title=\"上传附件\" aria-label=\"上传附件\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M8.23567 3.18836L3.28591 8.13812C2.11433 9.30969 2.11433 11.2092 3.28591 12.3808C4.45747 13.5523 6.35697 13.5523 7.52854 12.3808L13.4211 6.48819C14.2021 5.70716 14.2021 4.44082 13.4211 3.65975C12.6401 2.87871 11.3737 2.87871 10.5927 3.65975L4.70014 9.55232C4.3096 9.94286 4.3096 10.576 4.70014 10.9665C5.09064 11.3571 5.7238 11.3571 6.11434 10.9665L11.0641 6.01679\" stroke=\"currentColor\" stroke-linecap=\"square\" stroke-linejoin=\"round\"></path></svg></button></div><div class=\"k-sender-toolbar-right\"><button class=\"k-sender-send-btn\" type=\"button\" disabled=\"\" title=\"发送\" aria-label=\"发送\"><img class=\"k-sender-send-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20rx%3D%2216%22%20fill%3D%22url(%23b)%22%2F%3E%3Cpath%20d%3D%22M22.3337%209.6666L17.9003%2022.3333L16.0003%2016L9.667%2014.1L22.3337%209.6666Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2232%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300DDDD%22%2F%3E%3Cstop%20offset%3D%220.538462%22%20stop-color%3D%22%235370FF%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23712FFF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" accept=\"image/*\" multiple=\"\"></div></div>"
233
+ ```
234
+
235
+ #### `Sender generating`
236
+
237
+ ```
238
+ "<div class=\"k-sender k-sender-text css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-shell\"><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 64px; overflow-y: hidden;\"></textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-left\"><button class=\"k-sender-attach-btn\" type=\"button\" title=\"上传附件\" aria-label=\"上传附件\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M8.23567 3.18836L3.28591 8.13812C2.11433 9.30969 2.11433 11.2092 3.28591 12.3808C4.45747 13.5523 6.35697 13.5523 7.52854 12.3808L13.4211 6.48819C14.2021 5.70716 14.2021 4.44082 13.4211 3.65975C12.6401 2.87871 11.3737 2.87871 10.5927 3.65975L4.70014 9.55232C4.3096 9.94286 4.3096 10.576 4.70014 10.9665C5.09064 11.3571 5.7238 11.3571 6.11434 10.9665L11.0641 6.01679\" stroke=\"currentColor\" stroke-linecap=\"square\" stroke-linejoin=\"round\"></path></svg></button></div><div class=\"k-sender-toolbar-right\"><button class=\"k-sender-send-btn\" type=\"button\" disabled=\"\" title=\"发送\" aria-label=\"发送\"><img class=\"k-sender-send-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20rx%3D%2216%22%20fill%3D%22url(%23b)%22%2F%3E%3Cpath%20d%3D%22M22.3337%209.6666L17.9003%2022.3333L16.0003%2016L9.667%2014.1L22.3337%209.6666Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2232%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300DDDD%22%2F%3E%3Cstop%20offset%3D%220.538462%22%20stop-color%3D%22%235370FF%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23712FFF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" multiple=\"\"></div></div>"
239
+ ```
240
+
241
+ #### `Sender headerFooter`
242
+
243
+ ```
244
+ "<div class=\"k-sender k-sender-text css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-header\"><div class=\"sender-demo-header\"><button class=\"k-btn k-small k-default css-h31bz\" tabindex=\"0\" type=\"button\">+ 开启新对话</button></div></div><div class=\"k-sender-shell\"><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 64px; overflow-y: hidden;\"></textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-left\"><button class=\"k-sender-attach-btn\" type=\"button\" title=\"上传附件\" aria-label=\"上传附件\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M8.23567 3.18836L3.28591 8.13812C2.11433 9.30969 2.11433 11.2092 3.28591 12.3808C4.45747 13.5523 6.35697 13.5523 7.52854 12.3808L13.4211 6.48819C14.2021 5.70716 14.2021 4.44082 13.4211 3.65975C12.6401 2.87871 11.3737 2.87871 10.5927 3.65975L4.70014 9.55232C4.3096 9.94286 4.3096 10.576 4.70014 10.9665C5.09064 11.3571 5.7238 11.3571 6.11434 10.9665L11.0641 6.01679\" stroke=\"currentColor\" stroke-linecap=\"square\" stroke-linejoin=\"round\"></path></svg></button></div><div class=\"k-sender-toolbar-right\"><button class=\"k-sender-send-btn\" type=\"button\" disabled=\"\" title=\"发送\" aria-label=\"发送\"><img class=\"k-sender-send-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20rx%3D%2216%22%20fill%3D%22url(%23b)%22%2F%3E%3Cpath%20d%3D%22M22.3337%209.6666L17.9003%2022.3333L16.0003%2016L9.667%2014.1L22.3337%209.6666Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2232%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300DDDD%22%2F%3E%3Cstop%20offset%3D%220.538462%22%20stop-color%3D%22%235370FF%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23712FFF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" multiple=\"\"></div><div class=\"k-sender-footer\"><div class=\"sender-demo-footer\">AI生成,仅供参考。</div></div></div>"
245
+ ```
246
+
247
+ #### `Sender image`
248
+
249
+ ```
250
+ "<div class=\"k-sender k-sender-image css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-shell\"><div class=\"k-sender-attachments k-sender-attachments-image\"><div class=\"k-file-card-list k-file-card-list-scrollY css-il2rwy\"><div class=\"k-file-card-list-extension\"><div class=\"k-sender-image-add\" role=\"button\" title=\"上传图片\" aria-label=\"上传图片\"><i class=\"k-icon k-icon-add-bold k-large css-16qej3\"></i></div></div></div></div><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 20px; overflow-y: hidden;\"></textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-middle\"><div class=\"k-select k-small css-1ti24q0\" tabindex=\"0\" style=\"width: 92px;\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"image\"><div class=\"k-select-value c-ellipsis\">图片</div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-select-arrow k-icon-down css-16qej3\"></i></span></span></div><!--portal--></div><div class=\"k-sender-toolbar-right\"><button class=\"k-sender-send-btn\" type=\"button\" disabled=\"\" title=\"发送\" aria-label=\"发送\"><img class=\"k-sender-send-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20rx%3D%2216%22%20fill%3D%22url(%23b)%22%2F%3E%3Cpath%20d%3D%22M22.3337%209.6666L17.9003%2022.3333L16.0003%2016L9.667%2014.1L22.3337%209.6666Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2232%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300DDDD%22%2F%3E%3Cstop%20offset%3D%220.538462%22%20stop-color%3D%22%235370FF%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23712FFF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" accept=\"image/*\" multiple=\"\"></div></div>"
251
+ ```
252
+
253
+ #### `Sender methods`
254
+
255
+ ```
256
+ "<div class=\"sender-demo-methods\"><div class=\"sender-demo-methods-actions\"><button class=\"k-btn k-small k-default css-h31bz\" tabindex=\"0\" type=\"button\">focus</button><button class=\"k-btn k-small k-default k-disabled css-h31bz\" tabindex=\"-1\" type=\"button\">blur</button><button class=\"k-btn k-small k-primary css-h31bz\" tabindex=\"0\" type=\"button\">submit</button><button class=\"k-btn k-small k-default css-h31bz\" tabindex=\"0\" type=\"button\">clear</button><button class=\"k-btn k-small k-default k-disabled css-h31bz\" tabindex=\"-1\" type=\"button\">stopGenerate</button></div><div class=\"k-sender k-sender-text css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-shell\"><div class=\"k-sender-attachments k-sender-attachments-text\"><div class=\"k-file-card-list k-file-card-list-scrollY css-il2rwy\"><div class=\"k-file-card css-il2rwy k-file-card-file k-file-card-type-file k-file-card-default k-file-card-done k-file-card-deletable\"><div class=\"k-file-card-delete\" title=\"删除\"><i class=\"k-icon k-icon-close-bold css-14db6ta\" style=\"color: inherit;\"></i></div><div class=\"k-file-card-file-shell\"><div class=\"k-file-card-file-main\"><div class=\"k-file-card-file-icon k-file-card-file-icon-pdf\"><img class=\"k-file-card-file-icon-img\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M1.6001%203.2C1.6001%201.43269%203.03279%200%204.8001%200H19.2024L30.4001%2011.1914V28.8C30.4001%2030.5673%2028.9674%2032%2027.2001%2032H4.8001C3.03279%2032%201.6001%2030.5673%201.6001%2028.8V3.2Z%22%20fill%3D%22url(%23paint0_linear_25057_14412)%22%2F%3E%0A%3Cg%20clip-path%3D%22url(%23clip1_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M20.6223%2021.564C19.6623%2021.4929%2018.7379%2021.1373%2017.9912%2020.4973C16.5334%2020.8173%2015.1468%2021.2795%2013.7601%2021.8484C12.6579%2023.804%2011.6268%2024.7995%2010.7379%2024.7995C10.5601%2024.7995%2010.3468%2024.764%2010.2045%2024.6573C9.81343%2024.4795%209.6001%2024.0884%209.6001%2023.6973C9.6001%2023.3773%209.67121%2022.4884%2013.049%2021.0306C13.8312%2019.6084%2014.4357%2018.1506%2014.9334%2016.6218C14.5068%2015.7684%2013.5823%2013.6706%2014.2223%2012.604C14.4357%2012.2129%2014.8623%2011.9995%2015.3245%2012.0351C15.6801%2012.0351%2016.0357%2012.2129%2016.249%2012.4973C16.7112%2013.1373%2016.6757%2014.4884%2016.0712%2016.4795C16.6401%2017.5462%2017.3868%2018.5062%2018.2757%2019.324C19.0223%2019.1818%2019.769%2019.0751%2020.5157%2019.0751C22.1868%2019.1106%2022.4357%2019.8929%2022.4001%2020.3551C22.4001%2021.564%2021.2268%2021.564%2020.6223%2021.564ZM10.6668%2023.7684L10.7734%2023.7329C11.2712%2023.5551%2011.6623%2023.1995%2011.9468%2022.7373C11.4134%2022.9506%2010.9868%2023.3062%2010.6668%2023.7684ZM15.3957%2013.1018H15.289C15.2534%2013.1018%2015.1823%2013.1018%2015.1468%2013.1373C15.0045%2013.7418%2015.1112%2014.3818%2015.3601%2014.9506C15.5734%2014.3462%2015.5734%2013.7062%2015.3957%2013.1018ZM15.6445%2018.2573L15.609%2018.3284L15.5734%2018.2929C15.2534%2019.1106%2014.8979%2019.9284%2014.5068%2020.7106L14.5779%2020.6751V20.7462C15.3601%2020.4618%2016.2134%2020.2129%2016.9957%2020.0351L16.9601%2019.9995H17.0668C16.5334%2019.4662%2016.0357%2018.8618%2015.6445%2018.2573ZM20.4801%2020.1418C20.1601%2020.1418%2019.8757%2020.1418%2019.5557%2020.2129C19.9112%2020.3906%2020.2668%2020.4618%2020.6223%2020.4973C20.8712%2020.5329%2021.1201%2020.4973%2021.3334%2020.4262C21.3334%2020.3195%2021.1912%2020.1418%2020.4801%2020.1418Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20filter%3D%22url(%23filter0_f_25057_14412)%22%3E%0A%3Cpath%20d%3D%22M18.3999%200L30.3999%2012H21.5999C19.8326%2012%2018.3999%2010.5673%2018.3999%208.8V0Z%22%20fill%3D%22%23F61E22%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20d%3D%22M19.2002%200L30.4002%2011.2H22.4002C20.6329%2011.2%2019.2002%209.76731%2019.2002%208V0Z%22%20fill%3D%22%23FCAFB0%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3Cfilter%20id%3D%22filter0_f_25057_14412%22%20x%3D%2214.3999%22%20y%3D%22-4%22%20width%3D%2220%22%20height%3D%2220%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%0A%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%0A%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%0A%3CfeGaussianBlur%20stdDeviation%3D%222%22%20result%3D%22effect1_foregroundBlur_25057_14412%22%2F%3E%0A%3C%2Ffilter%3E%0A%3ClinearGradient%20id%3D%22paint0_linear_25057_14412%22%20x1%3D%221.6001%22%20y1%3D%220%22%20x2%3D%2233.6001%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%3Cstop%20stop-color%3D%22%23FF7375%22%2F%3E%0A%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF4447%22%2F%3E%0A%3C%2FlinearGradient%3E%0A%3CclipPath%20id%3D%22clip0_25057_14412%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip1_25057_14412%22%3E%0A%3Crect%20width%3D%2212.8%22%20height%3D%2212.8%22%20fill%3D%22white%22%20transform%3D%22translate(9.6001%2012)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E\" alt=\"brief.pdf\"></div><div class=\"k-file-card-file-content\"><div class=\"k-file-card-title\" title=\"brief.pdf\"><span class=\"k-file-card-title-prefix\">brief</span><span class=\"k-file-card-title-suffix\">.pdf</span></div><div class=\"k-file-card-description\"><span>128 KB</span></div></div></div></div></div></div></div><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 64px; overflow-y: hidden;\">帮我整理一下这份附件内容</textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-left\"><button class=\"k-sender-attach-btn\" type=\"button\" title=\"上传附件\" aria-label=\"上传附件\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M8.23567 3.18836L3.28591 8.13812C2.11433 9.30969 2.11433 11.2092 3.28591 12.3808C4.45747 13.5523 6.35697 13.5523 7.52854 12.3808L13.4211 6.48819C14.2021 5.70716 14.2021 4.44082 13.4211 3.65975C12.6401 2.87871 11.3737 2.87871 10.5927 3.65975L4.70014 9.55232C4.3096 9.94286 4.3096 10.576 4.70014 10.9665C5.09064 11.3571 5.7238 11.3571 6.11434 10.9665L11.0641 6.01679\" stroke=\"currentColor\" stroke-linecap=\"square\" stroke-linejoin=\"round\"></path></svg></button></div><div class=\"k-sender-toolbar-right\"><button class=\"k-sender-send-btn\" type=\"button\" title=\"发送\" aria-label=\"发送\"><img class=\"k-sender-send-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20rx%3D%2216%22%20fill%3D%22url(%23b)%22%2F%3E%3Cpath%20d%3D%22M22.3337%209.6666L17.9003%2022.3333L16.0003%2016L9.667%2014.1L22.3337%209.6666Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2232%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300DDDD%22%2F%3E%3Cstop%20offset%3D%220.538462%22%20stop-color%3D%22%235370FF%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23712FFF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" multiple=\"\"></div></div></div>"
257
+ ```
258
+
259
+ #### `Sender pasteFile`
260
+
261
+ ```
262
+ "<div class=\"k-sender k-sender-text css-merq82\" style=\"width: 640px;\"><div class=\"k-sender-shell\"><div class=\"k-sender-input-area\"><textarea class=\"k-sender-input\" rows=\"1\" placeholder=\"输入对话内容(Enter发送, Shift + Enter 换行)\" style=\"height: 64px; overflow-y: hidden;\"></textarea></div><div class=\"k-sender-toolbar\"><div class=\"k-sender-toolbar-left\"><button class=\"k-sender-attach-btn\" type=\"button\" title=\"上传附件\" aria-label=\"上传附件\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M8.23567 3.18836L3.28591 8.13812C2.11433 9.30969 2.11433 11.2092 3.28591 12.3808C4.45747 13.5523 6.35697 13.5523 7.52854 12.3808L13.4211 6.48819C14.2021 5.70716 14.2021 4.44082 13.4211 3.65975C12.6401 2.87871 11.3737 2.87871 10.5927 3.65975L4.70014 9.55232C4.3096 9.94286 4.3096 10.576 4.70014 10.9665C5.09064 11.3571 5.7238 11.3571 6.11434 10.9665L11.0641 6.01679\" stroke=\"currentColor\" stroke-linecap=\"square\" stroke-linejoin=\"round\"></path></svg></button></div><div class=\"k-sender-toolbar-right\"><button class=\"k-sender-send-btn\" type=\"button\" disabled=\"\" title=\"发送\" aria-label=\"发送\"><img class=\"k-sender-send-icon\" src=\"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20rx%3D%2216%22%20fill%3D%22url(%23b)%22%2F%3E%3Cpath%20d%3D%22M22.3337%209.6666L17.9003%2022.3333L16.0003%2016L9.667%2014.1L22.3337%209.6666Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2232%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300DDDD%22%2F%3E%3Cstop%20offset%3D%220.538462%22%20stop-color%3D%22%235370FF%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23712FFF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\" alt=\"\" draggable=\"false\"></button></div></div><!-- 放末尾,避免挡住 attachments + input-area 等相邻选择器,且 absolute 不影响布局 --><input class=\"k-sender-file-input\" type=\"file\" accept=\"image/*\" multiple=\"\"></div></div>"
263
+ ```
264
+
265
+ ## `think`
266
+
267
+ #### `Think basic`
268
+
269
+ ```
270
+ "<div class=\"think-demo-basic\"><div class=\"k-think k-think-expanded css-etgavx\" style=\"max-width: 640px;\"><button class=\"k-think-status\" type=\"button\"><div class=\"k-think-status-main\"><span class=\"k-think-icon\"><i class=\"k-icon k-icon-think css-16qej3\"></i></span><span class=\"k-think-title\"><span>已思考(用时 6 秒)</span></span></div><div class=\"k-think-status-side\"><i class=\"k-icon k-think-arrow k-icon-right css-16qej3\"></i></div></button><div class=\"k-think-wrapper\"><div class=\"k-think-content\"><div class=\"k-think-text\">嗯,用户问的是 KingDesign 的发展情况,核心是现在值不值得持续使用和长期前景如何。</div></div></div></div></div>"
271
+ ```
272
+
273
+ #### `Think collapse`
274
+
275
+ ```
276
+ "<div class=\"think-demo-collapse\"><div class=\"think-demo-collapse-actions\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">切换展开状态</button></div><div class=\"k-think css-etgavx\" style=\"max-width: 640px;\"><button class=\"k-think-status\" type=\"button\"><div class=\"k-think-status-main\"><span class=\"k-think-icon\"><i class=\"k-icon k-icon-think css-16qej3\"></i></span><span class=\"k-think-title\"><span>已思考(用时 6 秒)</span></span></div><div class=\"k-think-status-side\"><div class=\"k-think-extra\"><span class=\"think-demo-collapse-extra\">思考深度:高</span></div><i class=\"k-icon k-think-arrow k-icon-right css-16qej3\"></i></div></button><div class=\"k-think-wrapper\" style=\"display: none;\"><div class=\"k-think-content\"><div class=\"k-think-text\">DeepSeek 在技术层面采用了混合专家模型(MoE)架构,能够在保持性能的同时降低推理成本。开源版本已经支持多轮对话、代码生成等功能,开发者可以直接部署使用。</div></div></div></div><div class=\"think-demo-collapse-status\"> 当前状态:{this.get('expanded') ? '已展开' : '已折叠'} </div></div>"
277
+ ```
278
+
279
+ #### `Think loading`
280
+
281
+ ```
282
+ "<div class=\"think-demo-loading\"><div class=\"think-demo-loading-actions\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">开始思考</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">停止思考</button></div><div class=\"k-think k-think-expanded css-etgavx\" style=\"max-width: 640px;\"><button class=\"k-think-status\" type=\"button\"><div class=\"k-think-status-main\"><span class=\"k-think-icon\"><i class=\"k-icon k-icon-think css-16qej3\"></i></span><span class=\"k-think-title\"><span>已思考(用时 5 秒)</span></span></div><div class=\"k-think-status-side\"><i class=\"k-icon k-think-arrow k-icon-right css-16qej3\"></i></div></button><div class=\"k-think-wrapper\"><div class=\"k-think-content\"><div class=\"k-think-text\">用户想了解 KingDesign 的使用建议,需要从技术特点、应用场景、成本效益等多个角度分析。</div></div></div></div></div>"
283
+ ```
284
+
285
+ #### `Think slots`
286
+
287
+ ```
288
+ "<div class=\"think-demo-slots\"><div class=\"k-think k-think-expanded css-etgavx\" style=\"max-width: 640px;\"><button class=\"k-think-status\" type=\"button\"><div class=\"k-think-status-main\"><span class=\"k-think-icon\"><i class=\"k-icon ion-lightbulb css-16qej3\" style=\"color: rgb(22, 119, 255);\"></i></span><span class=\"k-think-title\"><span>自定义思考标题</span></span></div><div class=\"k-think-status-side\"><div class=\"k-think-extra\"><span class=\"think-demo-slots-extra\">耗时 3s</span></div><i class=\"k-icon k-think-arrow k-icon-right css-16qej3\"></i></div></button><div class=\"k-think-wrapper\"><div class=\"k-think-content\"><div class=\"think-demo-slots-content\"><div class=\"think-demo-slots-item\"><strong>问题分析:</strong><p>用户询问关于 AI 模型选择的问题,需要从性能、成本、易用性等维度综合评估。</p></div><div class=\"think-demo-slots-item\"><strong>技术考量:</strong><p>模型参数量、推理速度、显存占用是关键指标,需要根据实际使用场景权衡。</p></div><div class=\"think-demo-slots-item\"><strong>建议方案:</strong><p>建议从开源模型开始尝试,确认效果后再考虑商业化方案。</p></div></div></div></div></div></div>"
289
+ ```
290
+
291
+ #### `Think withBubble`
292
+
293
+ ```
294
+ "<div class=\"think-demo-with-bubble\"><div class=\"think-demo-with-bubble-actions\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">开始流式思考</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">重置</button></div><div class=\"k-bubble k-bubble-start k-bubble-plain k-bubble-square css-4kzzel\"><div class=\"k-bubble-main\" style=\"max-width: 640px;\"><div class=\"k-bubble-meta\"><div class=\"k-bubble-avatar\"><span>A</span></div><div class=\"k-bubble-header\"><span>AI 助手</span></div></div><div class=\"k-bubble-content\"><div class=\"k-bubble-loading\"><span class=\"k-bubble-loading-dot\"></span><span class=\"k-bubble-loading-dot\"></span><span class=\"k-bubble-loading-dot\"></span></div></div></div></div></div>"
295
+ ```
296
+
297
+ ## `anchor`
298
+
299
+ #### `Anchor basic`
300
+
301
+ ```
302
+ "<div class=\"anchor-demo\"><div class=\"k-anchor k-anchor-vertical css-4crbop\"><div class=\"k-tabs k-size-default k-vertical k-type-default css-zo0w25\"><div class=\"k-tabs-scroll c-clearfix\"><div class=\"k-tabs-wrapper\" style=\"transform: translateY(0px);\"><div class=\"k-tab k-anchor-link\">基础用法</div><div class=\"k-tab k-anchor-link\">水平排列</div><div class=\"k-tab k-anchor-link k-disabled\">自定义滚动容器</div><div class=\"k-tabs-active-bar\" style=\"height: 0px;\"></div></div></div></div></div></div>"
303
+ ```
304
+
305
+ #### `Anchor container`
306
+
307
+ ```
308
+ "<div class=\"anchor-demo\"><div class=\"k-anchor k-anchor-vertical css-4crbop\"><div class=\"k-tabs k-size-default k-vertical k-type-default css-zo0w25\"><div class=\"k-tabs-scroll c-clearfix\"><div class=\"k-tabs-wrapper\" style=\"transform: translateY(0px);\"><div class=\"k-tab k-anchor-link\">基础信息</div><div class=\"k-tab k-active k-anchor-link\">配置信息</div><div class=\"k-tab k-anchor-link\">其他信息</div><div class=\"k-tabs-active-bar\" style=\"top: 32px; height: 32px;\"></div></div></div></div></div><div id=\"scroll-container1\" class=\"scroll-container1\"><div id=\"basic-info-card\" class=\"section basic-info\"><h2>基础信息</h2><p>这是基础信息</p></div><div id=\"config-info-card\" class=\"section config-info\"><h2>配置信息</h2><p>这是配置信息</p></div><div id=\"other-info-card\" class=\"section other-info\"><h2>其他信息</h2><p>这是其他信息</p></div></div></div>"
309
+ ```
310
+
311
+ #### `Anchor events`
312
+
313
+ ```
314
+ "<div class=\"anchor-demo\"><div class=\"k-anchor css-1a4h0jy\"><div class=\"k-tabs k-size-default k-type-default css-zo0w25\"><div class=\"k-tabs-scroll c-clearfix\"><div class=\"k-tabs-wrapper\" style=\"transform: translateX(0px);\"><div class=\"k-tab k-active k-anchor-link\">section1</div><div class=\"k-tab k-anchor-link\">section2</div><div class=\"k-tab k-anchor-link\">section3</div><div class=\"k-tabs-active-bar\" style=\"left: 0px; width: 120px;\"></div></div></div></div></div><div id=\"scroll-container2\" class=\"scroll-container2\"><div id=\"section_one\" class=\"section section1\"><h2>Section1</h2></div><div id=\"section_two\" class=\"section section2\"><h2>Section2</h2></div><div id=\"section_three\" class=\"section section3\"><h2>Section3</h2></div></div><!--v-if--></div>"
315
+ ```
316
+
317
+ #### `Anchor horizontal`
318
+
319
+ ```
320
+ "<div class=\"anchor-demo\"><div class=\"k-anchor css-1a4h0jy\"><div class=\"k-tabs k-size-default k-type-default css-zo0w25\"><div class=\"k-tabs-scroll c-clearfix\"><div class=\"k-tabs-wrapper\" style=\"transform: translateX(0px);\"><div class=\"k-tab k-anchor-link\">基础用法</div><div class=\"k-tab k-anchor-link\">水平排列</div><div class=\"k-tab k-anchor-link\">自定义滚动容器</div><div class=\"k-tabs-active-bar\" style=\"width: 0px;\"></div></div></div></div></div></div>"
321
+ ```
322
+
323
+ #### `Anchor nested`
324
+
325
+ ```
326
+ "<div class=\"anchor-demo\"><div id=\"scroll-container3\" class=\"scroll-container3\"><div id=\"section1\" class=\"section section1\"><h2>Part1</h2><p>这是Part1的内容</p><div id=\"section1-1\" class=\"subsection\"><h3>Part1.1</h3><p>这是Part1.1</p></div><div id=\"section1-2\" class=\"subsection\"><h3>Part1.2</h3><p>这是Part1.2的内容</p><div id=\"section1-2-1\" class=\"subsubsection\"><h4>Part1.2.1</h4><p>这是Part1.2.1的内容</p></div><div id=\"section1-2-2\" class=\"subsubsection\"><h4>Part1.2.2</h4><p>这是Part1.2.2的内容</p></div></div><div id=\"section1-3\" class=\"subsection\"><h3>Part1.3</h3><p>这是Part1.3的内容</p></div></div><div id=\"section2\" class=\"section section2\"><h2>Part2</h2><p>这是Part2的内容</p><div id=\"section2-1\" class=\"subsection\"><h3>Part2.1</h3><p>这是Part2.1的内容</p></div><div id=\"section2-2\" class=\"subsection\"><h3>Part2.2</h3><p>这是Part2.2的内容</p></div></div><div id=\"section3\" class=\"section section3\"><h2>Part3</h2><p>这是Part3的内容</p></div></div><div class=\"k-anchor k-anchor-vertical css-4crbop\"><div class=\"k-tabs k-size-default k-vertical k-type-default css-zo0w25\"><div class=\"k-tabs-scroll c-clearfix\"><div class=\"k-tabs-wrapper\" style=\"transform: translateY(0px);\"><div class=\"k-tab k-active k-anchor-link k-anchor-link-nested\">Part1</div><div class=\"k-tab k-anchor-link k-anchor-link-level-1\">Part1.1</div><div class=\"k-tab k-anchor-link k-anchor-link-nested k-anchor-link-level-1\">Part1.2</div><div class=\"k-tab k-anchor-link k-anchor-link-level-2\">Part1.2.1</div><div class=\"k-tab k-anchor-link k-anchor-link-level-2\">Part1.2.2</div><div class=\"k-tab k-anchor-link k-anchor-link-level-1\">Part1.3</div><div class=\"k-tab k-anchor-link k-anchor-link-nested\">Part2</div><div class=\"k-tab k-anchor-link k-anchor-link-level-1\">Part2.1</div><div class=\"k-tab k-anchor-link k-anchor-link-level-1\">Part2.2</div><div class=\"k-tab k-anchor-link\">Part3</div><div class=\"k-tabs-active-bar\" style=\"top: 0px; height: 32px;\"></div></div></div></div></div></div>"
327
+ ```
328
+
3
329
  ## `badge`
4
330
 
5
331
  #### `Badge alone`
@@ -204,6 +530,79 @@
204
530
  "<div class=\"k-select k-cascader css-1ti24q0\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-select-placeholder c-ellipsis\">请选择</div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-select-arrow k-icon-down css-16qej3\"></i></span></span></div><!--portal-->"
205
531
  ```
206
532
 
533
+ ## `xmarkdown`
534
+
535
+ #### `Xmarkdown basic`
536
+
537
+ ```
538
+ "<div class=\"xmarkdown-demo-basic\"><div class=\"xmarkdown-demo-basic-actions\"><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\"> {this.get('rerendering') ? '重新渲染中...' : '重新渲染'} </button><span>showCodeHeader: <div class=\"k-switch k-checked k-default css-1kd39ob\" tabindex=\"0\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-bar\"><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div></span></div><div class=\"k-xmarkdown css-1yrs8qv\"><div class=\"k-xmarkdown-content\"><div class=\"k-xmarkdown-stable\"><h1>一级标题 H1</h1><p>这是一个基础段落,包含 <strong>粗体强调</strong>、<em>斜体强调</em>、<s>删除线</s>、<code class=\"k-xmarkdown-inline-code\">inline code</code> 和 <a href=\"https://design.ksyun.com/\" target=\"_blank\" rel=\"noopener noreferrer\">链接</a>。</p><h2>二级标题 H2</h2><blockquote><p>这是引用块内容,适合展示说明、提示或总结。</p><blockquote><p>这是嵌套引用,用来展示多层 blockquote 的效果。</p></blockquote></blockquote><h3>三级标题 H3</h3><ul><li><p>无序列表第一项</p></li><li><p>无序列表第二项</p></li><li><p>无序列表第三项</p></li></ul><h4>四级标题 H4</h4><ol><li><p>有序列表第一项</p></li><li><p>有序列表第二项</p></li><li><p>有序列表第三项</p></li></ol><p><img src=\"/imgs/favicon.ico\" alt=\"KPC 示例图片\" loading=\"lazy\" decoding=\"async\"></p><h5>五级标题 H5</h5><div class=\"k-xmarkdown-table-wrap\"><table><thead><tr><th>能力</th><th>状态</th><th>说明</th></tr></thead><tbody><tr><td>标题</td><td>已支持</td><td>支持 H1-H6</td></tr><tr><td>代码块</td><td>已支持</td><td>默认支持语言头和复制</td></tr><tr><td>Mermaid</td><td>已支持</td><td>支持图表预览与源码切换</td></tr><tr><td>公式</td><td>已支持</td><td>支持行内与块级公式</td></tr></tbody></table></div><div class=\"k-xmarkdown-table-wrap\"><table><thead><tr><th>阶段</th><th>模块</th><th>输入</th><th>输出</th><th>状态</th><th>负责人</th><th>备注</th></tr></thead><tbody><tr><td>解析阶段</td><td>Markdown Parser</td><td>原始 Markdown 文本</td><td>结构化节点树</td><td>已完成</td><td>XMarkdown</td><td>这里故意放宽表格,用来演示横向溢出后的滚动效果</td></tr><tr><td>渲染阶段</td><td>Render Tree</td><td>结构化节点树</td><td>VNode 列表</td><td>已完成</td><td>XMarkdown</td><td>表格列较多时,容器会保留横向滚动能力</td></tr><tr><td>交互阶段</td><td>Mermaid / Code Block</td><td>代码块与图表源码</td><td>可交互展示结果</td><td>已完成</td><td>XMarkdown</td><td>适合确认表格在窄容器下的展示体验</td></tr></tbody></table></div><h6>六级标题 H6</h6><div class=\"k-xmarkdown-code-block\" data-kpc-code-block=\"true\" data-kpc-language=\"ts\" data-kpc-block-id=\"xmarkdown-block-0\"><div class=\"k-xmarkdown-code-toolbar\"><span class=\"k-xmarkdown-code-language\">ts</span><div class=\"k-xmarkdown-code-actions\"><button class=\"k-xmarkdown-toolbar-icon-button\" type=\"button\" title=\"复制代码\" aria-label=\"复制代码\" data-kpc-action=\"copy-code\" data-kpc-feedback-mode=\"icon\" data-kpc-default-title=\"复制代码\" data-kpc-default-icon=\"k-icon-clone\" data-kpc-feedback-icon=\"k-icon-check-outline\"><i class=\"k-xmarkdown-toolbar-icon k-icon k-icon-clone\" data-kpc-icon=\"true\"></i></button></div></div><div class=\"k-xmarkdown-code-body\"><pre class=\"hljs\"><code class=\"hljs language-typescript\"><span class=\"hljs-keyword\">export</span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function</span> <span class=\"hljs-title\">sum</span>(<span class=\"hljs-params\">a: <span class=\"hljs-built_in\">number</span>, b: <span class=\"hljs-built_in\">number</span></span>) </span>{
539
+ <span class=\"hljs-keyword\">return</span> a + b;
540
+ }</code></pre></div></div><div class=\"k-xmarkdown-mermaid-block\" data-kpc-mermaid=\"true\" data-kpc-render-state=\"idle\" data-kpc-view=\"diagram\" data-kpc-language=\"mermaid\" data-kpc-block-id=\"xmarkdown-block-1\" data-kpc-scale=\"1\"><div class=\"k-xmarkdown-code-toolbar\"><span class=\"k-xmarkdown-code-language\">Mermaid</span><div class=\"k-xmarkdown-code-actions\"><div class=\"k-xmarkdown-toolbar-toggle-group\"><button class=\"k-xmarkdown-toolbar-toggle\" type=\"button\" aria-label=\"图表\" aria-pressed=\"true\" data-kpc-action=\"set-mermaid-view-diagram\" data-kpc-selected=\"true\">图表</button><button class=\"k-xmarkdown-toolbar-toggle\" type=\"button\" aria-label=\"源码\" aria-pressed=\"false\" data-kpc-action=\"set-mermaid-view-source\" data-kpc-selected=\"false\">源码</button></div><div class=\"k-xmarkdown-toolbar-action-group\"><button class=\"k-xmarkdown-toolbar-icon-button\" type=\"button\" title=\"缩小\" aria-label=\"缩小\" data-kpc-action=\"zoom-mermaid-out\" data-kpc-feedback-mode=\"icon\" data-kpc-default-title=\"缩小\" data-kpc-default-icon=\"k-icon-zoom-out\" data-kpc-feedback-icon=\"k-icon-zoom-out\"><i class=\"k-xmarkdown-toolbar-icon k-icon k-icon-zoom-out\" data-kpc-icon=\"true\"></i></button><button class=\"k-xmarkdown-toolbar-icon-button\" type=\"button\" title=\"重置缩放\" aria-label=\"重置缩放\" data-kpc-action=\"reset-mermaid-zoom\" data-kpc-feedback-mode=\"icon\" data-kpc-default-title=\"重置缩放\" data-kpc-default-icon=\"k-icon-refresh\" data-kpc-feedback-icon=\"k-icon-refresh\"><i class=\"k-xmarkdown-toolbar-icon k-icon k-icon-refresh\" data-kpc-icon=\"true\"></i></button><button class=\"k-xmarkdown-toolbar-icon-button\" type=\"button\" title=\"放大\" aria-label=\"放大\" data-kpc-action=\"zoom-mermaid-in\" data-kpc-feedback-mode=\"icon\" data-kpc-default-title=\"放大\" data-kpc-default-icon=\"k-icon-zoom-in\" data-kpc-feedback-icon=\"k-icon-zoom-in\"><i class=\"k-xmarkdown-toolbar-icon k-icon k-icon-zoom-in\" data-kpc-icon=\"true\"></i></button><button class=\"k-xmarkdown-toolbar-icon-button\" type=\"button\" title=\"下载图片\" aria-label=\"下载图片\" data-kpc-action=\"download-mermaid\" data-kpc-feedback-mode=\"icon\" data-kpc-default-title=\"下载图片\" data-kpc-default-icon=\"k-icon-download\" data-kpc-feedback-icon=\"k-icon-check-outline\"><i class=\"k-xmarkdown-toolbar-icon k-icon k-icon-download\" data-kpc-icon=\"true\"></i></button><button class=\"k-xmarkdown-toolbar-icon-button\" type=\"button\" title=\"复制源码\" aria-label=\"复制源码\" data-kpc-action=\"copy-mermaid\" data-kpc-feedback-mode=\"icon\" data-kpc-default-title=\"复制源码\" data-kpc-default-icon=\"k-icon-clone\" data-kpc-feedback-icon=\"k-icon-check-outline\"><i class=\"k-xmarkdown-toolbar-icon k-icon k-icon-clone\" data-kpc-icon=\"true\"></i></button></div></div></div><div class=\"k-xmarkdown-mermaid-body\"><div class=\"k-xmarkdown-mermaid-canvas\" data-kpc-mermaid-canvas=\"true\"><div class=\"k-xmarkdown-mermaid-viewport\" data-kpc-mermaid-viewport=\"true\" title=\"Mermaid 图表\"><div class=\"k-xmarkdown-mermaid-stage\" data-kpc-mermaid-stage=\"true\">Mermaid 渲染中...</div></div></div><pre class=\"k-xmarkdown-mermaid-source\"><code class=\"hljs language-mermaid\">flowchart LR
541
+ A[需求输入] --&gt; B{方案评审}
542
+ B --&gt;|通过| C[方案实现]
543
+ B --&gt;|补充信息| D[补充需求]
544
+ D --&gt; B
545
+ C --&gt; E[联调验证]
546
+ E --&gt; F[发版验证]</code></pre></div></div><p>行内公式:$e^{i\\pi} + 1 = 0$。</p><p>块级公式:</p><p>$$<br>\\operatorname{score}(x)=\\sum_{i=1}^{n}\\frac{x_i}{1 + x_i^2}<br>$$</p><hr><p>以上内容用于展示 XMarkdown 的基础渲染能力。</p></div><div class=\"k-xmarkdown-tail\"></div></div></div></div>"
547
+ ```
548
+
549
+ #### `Xmarkdown citations`
550
+
551
+ ```
552
+ "<div class=\"xmarkdown-demo-citations\"><div class=\"xmarkdown-demo-citations-actions\"><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">重新渲染</button></div><div class=\"k-xmarkdown css-1yrs8qv\"><div class=\"k-xmarkdown-content\"><div class=\"k-xmarkdown-stable\"><h1>XMarkdown 引用与来源</h1><p><code class=\"k-xmarkdown-inline-code\">XMarkdown</code> 可以承接标题、列表、代码块和 Mermaid 图表等常见 Markdown 内容<a class=\"xmarkdown-demo-citation-badge\" href=\"https://design.ksyun.com/\" target=\"_blank\" rel=\"noopener noreferrer\" title=\"查看来源 1\" aria-label=\"查看来源 1\">1</a>。</p><p>在组件库接模型 SSE 时,正文往往会先逐步输出;等来源信息整理完成后,再把 <code class=\"k-xmarkdown-inline-code\">Sources</code> 列表追加到内容尾部<a class=\"xmarkdown-demo-citation-badge\" href=\"https://mermaid.js.org/\" target=\"_blank\" rel=\"noopener noreferrer\" title=\"查看来源 2\" aria-label=\"查看来源 2\">2</a>。</p><p>这样既不会在组件内部擅自改写来源标记,也方便不同业务按自己的协议决定来源展示方式。</p><h2>Sources</h2><ol><li><p><a href=\"https://design.ksyun.com/\" target=\"_blank\" rel=\"noopener noreferrer\">King Design 组件文档</a></p></li><li><p><a href=\"https://mermaid.js.org/\" target=\"_blank\" rel=\"noopener noreferrer\">Mermaid 官方文档</a></p></li></ol></div><div class=\"k-xmarkdown-tail\"></div></div></div></div>"
553
+ ```
554
+
555
+ #### `Xmarkdown codeBlockRenderers`
556
+
557
+ ```
558
+ "<div class=\"xmarkdown-demo-code-block-renderers\"><div class=\"k-xmarkdown css-1yrs8qv\"><div class=\"k-xmarkdown-content\"><div class=\"k-xmarkdown-stable\"><h1>代码块接管示例</h1><section class=\"xmarkdown-demo-code-shell\"><div class=\"xmarkdown-demo-code-shell-head\"><span>TypeScript</span><span>code</span></div><pre class=\"xmarkdown-demo-code-shell-body\">export function greet(name: string) {
559
+ return `hello, ${name}`;
560
+ }</pre></section><section class=\"xmarkdown-demo-mermaid-placeholder\"><div class=\"xmarkdown-demo-mermaid-placeholder-title\">这里由业务接管 Mermaid</div><code>flowchart TD
561
+ A[默认 Mermaid] --&gt; B[接管后改成业务卡片]</code></section></div><div class=\"k-xmarkdown-tail\"></div></div></div></div>"
562
+ ```
563
+
564
+ #### `Xmarkdown formula`
565
+
566
+ ```
567
+ "<div class=\"xmarkdown-demo-formula\"><div class=\"xmarkdown-demo-formula-actions\"><span>enableFormula: <div class=\"k-switch k-checked k-default css-1kd39ob\" tabindex=\"0\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-bar\"><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div></span><span>useBrackets: <div class=\"k-switch k-default css-1kd39ob\" tabindex=\"0\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-bar\"><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div></span></div><div class=\"k-xmarkdown css-1yrs8qv\"><div class=\"k-xmarkdown-content\"><div class=\"k-xmarkdown-stable\"><p>欧拉恒等式:$e^{i\\pi} + 1 = 0$。</p><p>定义域:$f: \\RR \\to \\RR$。</p><p>$$<br>\\score(x)=\\sum_{i=1}^{n}\\frac{x_i}{1 + x_i^2}<br>$$</p><p>\\begin{equation}<br>\\int_0^1 x^2 dx = \\frac{1}{3}<br>\\end{equation}</p></div><div class=\"k-xmarkdown-tail\"></div></div></div></div>"
568
+ ```
569
+
570
+ #### `Xmarkdown html`
571
+
572
+ ```
573
+ "<div class=\"xmarkdown-demo-html\"><div class=\"xmarkdown-demo-html-actions\"><span>allowHtml: <div class=\"k-switch k-checked k-default css-1kd39ob\" tabindex=\"0\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-bar\"><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div></span><span>allowNoticeCard: <div class=\"k-switch k-checked k-default css-1kd39ob\" tabindex=\"0\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-bar\"><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div></span></div><div class=\"k-xmarkdown css-1yrs8qv\"><div class=\"k-xmarkdown-content\"><div class=\"k-xmarkdown-stable\"><h1>HTML 与安全策略</h1><p><mark>这段高亮文字依赖 allowHtml。</mark></p><p><notice-card data-track=\"xmarkdown-demo-card\" title=\"发布建议\">先确认允许的标签和属性,再开放给业务接入。</notice-card></p><p>更多规范可以参考 <a href=\"https://design.ksyun.com/\" target=\"_blank\" rel=\"noopener noreferrer\">King Design</a>。</p></div><div class=\"k-xmarkdown-tail\"></div></div></div></div>"
574
+ ```
575
+
576
+ #### `Xmarkdown mermaid`
577
+
578
+ ```
579
+ "<div class=\"xmarkdown-demo-mermaid\"><div class=\"xmarkdown-demo-mermaid-actions\"><span>enableMermaid: <div class=\"k-switch k-checked k-default css-1kd39ob\" tabindex=\"0\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-bar\"><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div></span><span>brandTheme: <div class=\"k-switch k-checked k-default css-1kd39ob\" tabindex=\"0\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-bar\"><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div></span></div><div class=\"k-xmarkdown css-1yrs8qv\"><div class=\"k-xmarkdown-content\"><div class=\"k-xmarkdown-stable\"><div class=\"k-xmarkdown-mermaid-block\" data-kpc-mermaid=\"true\" data-kpc-render-state=\"loading\" data-kpc-view=\"diagram\" data-kpc-language=\"mermaid\" data-kpc-block-id=\"xmarkdown-block-0\" data-kpc-scale=\"1\"><div class=\"k-xmarkdown-code-toolbar\"><span class=\"k-xmarkdown-code-language\">Mermaid</span><div class=\"k-xmarkdown-code-actions\"><div class=\"k-xmarkdown-toolbar-toggle-group\"><button class=\"k-xmarkdown-toolbar-toggle\" type=\"button\" aria-label=\"图表\" aria-pressed=\"true\" data-kpc-action=\"set-mermaid-view-diagram\" data-kpc-selected=\"true\">图表</button><button class=\"k-xmarkdown-toolbar-toggle\" type=\"button\" aria-label=\"源码\" aria-pressed=\"false\" data-kpc-action=\"set-mermaid-view-source\" data-kpc-selected=\"false\">源码</button></div><div class=\"k-xmarkdown-toolbar-action-group\"><button class=\"k-xmarkdown-toolbar-icon-button\" type=\"button\" title=\"缩小\" aria-label=\"缩小\" data-kpc-action=\"zoom-mermaid-out\" data-kpc-feedback-mode=\"icon\" data-kpc-default-title=\"缩小\" data-kpc-default-icon=\"k-icon-zoom-out\" data-kpc-feedback-icon=\"k-icon-zoom-out\"><i class=\"k-xmarkdown-toolbar-icon k-icon k-icon-zoom-out\" data-kpc-icon=\"true\"></i></button><button class=\"k-xmarkdown-toolbar-icon-button\" type=\"button\" title=\"重置缩放\" aria-label=\"重置缩放\" data-kpc-action=\"reset-mermaid-zoom\" data-kpc-feedback-mode=\"icon\" data-kpc-default-title=\"重置缩放\" data-kpc-default-icon=\"k-icon-refresh\" data-kpc-feedback-icon=\"k-icon-refresh\" disabled=\"\"><i class=\"k-xmarkdown-toolbar-icon k-icon k-icon-refresh\" data-kpc-icon=\"true\"></i></button><button class=\"k-xmarkdown-toolbar-icon-button\" type=\"button\" title=\"放大\" aria-label=\"放大\" data-kpc-action=\"zoom-mermaid-in\" data-kpc-feedback-mode=\"icon\" data-kpc-default-title=\"放大\" data-kpc-default-icon=\"k-icon-zoom-in\" data-kpc-feedback-icon=\"k-icon-zoom-in\"><i class=\"k-xmarkdown-toolbar-icon k-icon k-icon-zoom-in\" data-kpc-icon=\"true\"></i></button><button class=\"k-xmarkdown-toolbar-icon-button\" type=\"button\" title=\"下载图片\" aria-label=\"下载图片\" data-kpc-action=\"download-mermaid\" data-kpc-feedback-mode=\"icon\" data-kpc-default-title=\"下载图片\" data-kpc-default-icon=\"k-icon-download\" data-kpc-feedback-icon=\"k-icon-check-outline\"><i class=\"k-xmarkdown-toolbar-icon k-icon k-icon-download\" data-kpc-icon=\"true\"></i></button><button class=\"k-xmarkdown-toolbar-icon-button\" type=\"button\" title=\"复制源码\" aria-label=\"复制源码\" data-kpc-action=\"copy-mermaid\" data-kpc-feedback-mode=\"icon\" data-kpc-default-title=\"复制源码\" data-kpc-default-icon=\"k-icon-clone\" data-kpc-feedback-icon=\"k-icon-check-outline\"><i class=\"k-xmarkdown-toolbar-icon k-icon k-icon-clone\" data-kpc-icon=\"true\"></i></button></div></div></div><div class=\"k-xmarkdown-mermaid-body\"><div class=\"k-xmarkdown-mermaid-canvas\" data-kpc-mermaid-canvas=\"true\"><div class=\"k-xmarkdown-mermaid-viewport\" data-kpc-mermaid-viewport=\"true\" title=\"Mermaid 图表\"><div class=\"k-xmarkdown-mermaid-stage\" data-kpc-mermaid-stage=\"true\">Mermaid 渲染中...</div></div></div><pre class=\"k-xmarkdown-mermaid-source\"><code class=\"hljs language-mermaid\">flowchart LR
580
+ A[需求输入] --&gt; B{方案评审}
581
+ B --&gt;|通过| C[方案实现]
582
+ B --&gt;|补充信息| D[补充需求]
583
+ D --&gt; B
584
+ C --&gt; E[联调验证]
585
+ E --&gt; F[发版验证]</code></pre></div></div></div><div class=\"k-xmarkdown-tail\"></div></div></div></div>"
586
+ ```
587
+
588
+ #### `Xmarkdown plugins`
589
+
590
+ ```
591
+ "<div class=\"xmarkdown-demo-plugins\"><div class=\"k-xmarkdown css-1yrs8qv\"><div class=\"k-xmarkdown-content\"><div class=\"k-xmarkdown-stable\"><h1>插件扩展示例</h1><blockquote class=\"xmarkdown-demo-plugin-tip\"><p>这段提示块没有额外写 HTML,而是由 <code class=\"k-xmarkdown-inline-code\">extendMarkdown</code> 在 token 阶段给引用块补上样式类名。</p></blockquote><h2>发布建议<span class=\"xmarkdown-demo-plugin-badge\">插件已处理</span></h2><ul><li><p>先把基础渲染能力稳定下来</p></li><li><p>再补正式扩展口子和示例</p></li><li><p>最后完善测试和文档</p></li></ul><h2>实现边界<span class=\"xmarkdown-demo-plugin-badge\">插件已处理</span></h2><p><code class=\"k-xmarkdown-inline-code\">transformRenderTree</code> 更适合做结构层加工,例如统一给标题补徽标、包装节点或插入额外提示。</p></div><div class=\"k-xmarkdown-tail\"></div></div></div></div>"
592
+ ```
593
+
594
+ #### `Xmarkdown streamingRich`
595
+
596
+ ```
597
+ "<div class=\"xmarkdown-demo-streaming-rich\"><div class=\"xmarkdown-demo-streaming-rich-actions\"><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">开始流式输出</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">重置</button></div><div class=\"xmarkdown-demo-streaming-rich-layout\"><div class=\"xmarkdown-demo-streaming-rich-panel\"><div class=\"xmarkdown-demo-streaming-rich-title\">标准宽度</div><div class=\"k-xmarkdown css-1yrs8qv\"></div></div><div class=\"xmarkdown-demo-streaming-rich-panel xmarkdown-demo-streaming-rich-panel-narrow\"><div class=\"xmarkdown-demo-streaming-rich-title\">窄容器</div><div class=\"k-xmarkdown css-1yrs8qv\"></div></div></div></div>"
598
+ ```
599
+
600
+ #### `Xmarkdown tagRenderers`
601
+
602
+ ```
603
+ "<div class=\"xmarkdown-demo-tag-renderers\"><div class=\"xmarkdown-demo-tag-renderers-actions\"><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">重新开始打字</button></div><div class=\"k-xmarkdown css-1yrs8qv\"><div class=\"k-xmarkdown-content\"><div class=\"k-xmarkdown-stable\"><h1>标签增强示例</h1><div class=\"xmarkdown-demo-tag-card\"><div class=\"xmarkdown-demo-tag-card-title\">发布建议</div><div class=\"xmarkdown-demo-tag-card-body\">优先把核心交互、Demo 和单测一起补齐,再进入发版检查。</div></div><div class=\"k-xmarkdown-table-wrap\"><div class=\"xmarkdown-demo-tag-table\"><div class=\"k-table css-52tr45\"><div class=\"k-table-wrapper\"><table><colgroup><col><col><col></colgroup><thead><tr><th title=\"阶段\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">阶段</div></div></th><th title=\"负责人\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">负责人</div></div></th><th title=\"状态\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">状态</div></div></th></tr></thead><tbody><tr data-key=\"row-0\"><td title=\"设计评审\">设计评审</td><td title=\"Daisy\">Daisy</td><td title=\"已完成\">已完成</td></tr><tr data-key=\"row-1\"><td title=\"联调验证\">联调验证</td><td title=\"Alex\">Alex</td><td title=\"进行中\">进行中</td></tr></tbody></table></div></div></div></div><p>更多规范可以参考 <a class=\"xmarkdown-demo-tag-link\" href=\"https://design.ksyun.com/\" target=\"_blank\" rel=\"noopener noreferrer\" data-track=\"xmarkdown-demo-link\">King Design</a>。</p><blockquote><p>这段普通引用块仍然保持默认渲染。</p></blockquote></div><div class=\"k-xmarkdown-tail\"></div></div></div></div>"
604
+ ```
605
+
207
606
  ## `checkbox`
208
607
 
209
608
  #### `Checkbox basic`