@wix/ricos 10.110.0 → 10.112.0

package/dist/cjs/plugin-video/toolbar/upload-video.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugin-video/toolbar/upload-video.tsx"],
-  "sourcesContent": ["import { Button, FileUpload, Text } from '@wix/design-system';\nimport React, { useContext, useMemo } from 'react';\n\nimport { EditorContext, RicosContext } from './../../ricos-context';\nimport type { VideoData } from './../../ricos-schema/legacy/wix/rich_content/v1';\nimport defaultData from './../../ricos-schema/legacy/statics/video.defaults.json';\nimport type {\n  EditorCommands,\n  Helpers,\n  IFileUploader,\n  IMediaPluginService,\n  IUpdateService,\n  IUploadService,\n  UpdateEntityFunctionParams,\n} from './../../wix-rich-content-common';\nimport { MEDIA_POPOVERS_BUTTONS_NAMES_BI } from './../../wix-rich-content-common';\nimport { Uploader } from './../../plugin-commons';\n\nimport { UPLOAD_TAB_UPLOAD_BUTTON } from '../dataHooks';\nimport type { VideoPluginEditorConfig } from '../types';\nimport { VIDEO_TYPE } from '../types';\nimport { VideoPluginService } from './videoPluginService';\n\nconst FILE_INPUT_ACCEPT = 'video/*';\n\ntype UploadVideoProps = {\n  nodeId?: string;\n  helpers: Helpers;\n  enableCustomUploadOnMobile?: boolean;\n  uploadService?: IUploadService;\n  updateService?: IUpdateService;\n  closeModal: () => void;\n} & Pick<\n  VideoPluginEditorConfig,\n  'disableDownloadDefault' | 'handleFileSelection' | 'handleFileUpload'\n>;\n\nexport const UploadVideo: React.FC<UploadVideoProps> = ({\n  nodeId,\n  helpers,\n  enableCustomUploadOnMobile,\n  uploadService,\n  updateService,\n  closeModal,\n  disableDownloadDefault,\n  handleFileSelection,\n  handleFileUpload,\n}) => {\n  const { t, isMobile } = useContext(RicosContext);\n  const { getEditorCommands } = useContext(EditorContext);\n\n  const hasCustomFileUpload = Boolean(handleFileUpload || handleFileSelection);\n  const showUploadSection = (!isMobile || enableCustomUploadOnMobile) && hasCustomFileUpload;\n\n  const videoPluginService = useMemo(\n    () => new VideoPluginService({ disableDownloadDefault }),\n    [disableDownloadDefault]\n  );\n\n  const handleUploadClick = () => {\n    helpers?.onPluginsPopOverClick?.({\n      pluginId: VIDEO_TYPE,\n      buttonName: MEDIA_POPOVERS_BUTTONS_NAMES_BI.upload,\n    });\n\n    if (handleFileSelection) {\n      handleFileSelection(\n        handleExternalFileChange(nodeId, getEditorCommands(), updateService, videoPluginService)\n      );\n      closeModal();\n      return;\n    }\n    uploadService?.selectFiles(\n      FILE_INPUT_ACCEPT,\n      false,\n      handleNativeFileChange(\n        nodeId,\n        getEditorCommands(),\n        uploadService,\n        new Uploader(handleFileUpload),\n        videoPluginService\n      )\n    );\n    closeModal();\n  };\n\n  return (\n    <>\n      <Text size=\"small\" weight=\"thin\">\n        {t('VideoCustomUploadModal_Title')}\n      </Text>\n      {showUploadSection ? (\n        <FileUpload onChange={() => {}} accept={FILE_INPUT_ACCEPT}>\n          {() => (\n            <Button dataHook={UPLOAD_TAB_UPLOAD_BUTTON} onClick={handleUploadClick} fullWidth>\n              {t('VideoUploadModal_CustomVideoClickText')}\n            </Button>\n          )}\n        </FileUpload>\n      ) : null}\n    </>\n  );\n};\n\nconst handleExternalFileChange =\n  (\n    nodeId: string | undefined,\n    editorCommands: EditorCommands,\n    updateService: IUpdateService | undefined,\n    videoPluginService: IMediaPluginService\n  ) =>\n  ({ data }: UpdateEntityFunctionParams<VideoData | VideoData[]>) => {\n    const id = nodeId || editorCommands.insertBlockWithBlankLines(VIDEO_TYPE, defaultData);\n    const file = data instanceof Array ? data[0] : data;\n\n    queueMicrotask(() => {\n      updateService?.updatePluginData({ data: file }, id, VIDEO_TYPE, videoPluginService);\n    });\n  };\n\nconst handleNativeFileChange =\n  (\n    nodeId: string | undefined,\n    editorCommands: EditorCommands,\n    uploadService: IUploadService,\n    uploader: IFileUploader,\n    videoPluginService: IMediaPluginService\n  ) =>\n  (files: File[] | File) => {\n    const id = nodeId || editorCommands.insertBlockWithBlankLines(VIDEO_TYPE, defaultData);\n    const file = files instanceof Array ? files[0] : files;\n    queueMicrotask(() => {\n      uploadService.uploadFile(\n        new File([file], file.name, { type: file.type }),\n        id,\n        uploader,\n        VIDEO_TYPE,\n        videoPluginService\n      );\n    });\n  };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAAyC;AACzC,mBAA2C;AAE3C,2BAA4C;AAE5C,4BAAwB;AAUxB,qCAAgD;AAChD,4BAAyB;AAEzB,uBAAyC;AAEzC,mBAA2B;AAC3B,gCAAmC;AAEnC,MAAM,oBAAoB;AAcnB,MAAM,cAA0C,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,GAAG,SAAS,QAAI,yBAAW,iCAAY;AAC/C,QAAM,EAAE,kBAAkB,QAAI,yBAAW,kCAAa;AAEtD,QAAM,sBAAsB,QAAQ,oBAAoB,mBAAmB;AAC3E,QAAM,qBAAqB,CAAC,YAAY,+BAA+B;AAEvE,QAAM,yBAAqB;AAAA,IACzB,MAAM,IAAI,6CAAmB,EAAE,uBAAuB,CAAC;AAAA,IACvD,CAAC,sBAAsB;AAAA,EACzB;AAEA,QAAM,oBAAoB,MAAM;AAC9B,aAAS,wBAAwB;AAAA,MAC/B,UAAU;AAAA,MACV,YAAY,+DAAgC;AAAA,IAC9C,CAAC;AAED,QAAI,qBAAqB;AACvB;AAAA,QACE,yBAAyB,QAAQ,kBAAkB,GAAG,eAAe,kBAAkB;AAAA,MACzF;AACA,iBAAW;AACX;AAAA,IACF;AACA,mBAAe;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,QACE;AAAA,QACA,kBAAkB;AAAA,QAClB;AAAA,QACA,IAAI,+BAAS,gBAAgB;AAAA,QAC7B;AAAA,MACF;AAAA,IACF;AACA,eAAW;AAAA,EACb;AAEA,SACE,6BAAAA,QAAA,2BAAAA,QAAA,gBACE,6BAAAA,QAAA,cAAC,6BAAK,MAAK,SAAQ,QAAO,UACvB,EAAE,8BAA8B,CACnC,GACC,oBACC,6BAAAA,QAAA,cAAC,mCAAW,UAAU,MAAM;AAAA,EAAC,GAAG,QAAQ,qBACrC,MACC,6BAAAA,QAAA,cAAC,+BAAO,UAAU,2CAA0B,SAAS,mBAAmB,WAAS,QAC9E,EAAE,uCAAuC,CAC5C,CAEJ,IACE,IACN;AAEJ;AAEA,MAAM,2BACJ,CACE,QACA,gBACA,eACA,uBAEF,CAAC,EAAE,KAAK,MAA2D;AACjE,QAAM,KAAK,UAAU,eAAe,0BAA0B,yBAAY,sBAAAC,OAAW;AACrF,QAAM,OAAO,gBAAgB,QAAQ,KAAK,CAAC,IAAI;AAE/C,iBAAe,MAAM;AACnB,mBAAe,iBAAiB,EAAE,MAAM,KAAK,GAAG,IAAI,yBAAY,kBAAkB;AAAA,EACpF,CAAC;AACH;AAEF,MAAM,yBACJ,CACE,QACA,gBACA,eACA,UACA,uBAEF,CAAC,UAAyB;AACxB,QAAM,KAAK,UAAU,eAAe,0BAA0B,yBAAY,sBAAAA,OAAW;AACrF,QAAM,OAAO,iBAAiB,QAAQ,MAAM,CAAC,IAAI;AACjD,iBAAe,MAAM;AACnB,kBAAc;AAAA,MACZ,IAAI,KAAK,CAAC,IAAI,GAAG,KAAK,MAAM,EAAE,MAAM,KAAK,KAAK,CAAC;AAAA,MAC/C;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
-  "names": ["React", "defaultData"]
+  "sourcesContent": ["import { Button, FileUpload, Text } from '@wix/design-system';\nimport React, { useContext, useMemo } from 'react';\n\nimport { EditorContext, RicosContext } from './../../ricos-context';\nimport type { VideoData } from './../../ricos-schema/legacy/wix/rich_content/v1';\nimport type {\n  EditorCommands,\n  Helpers,\n  IFileUploader,\n  IMediaPluginService,\n  IUpdateService,\n  IUploadService,\n  UpdateEntityFunctionParams,\n} from './../../wix-rich-content-common';\nimport { MEDIA_POPOVERS_BUTTONS_NAMES_BI } from './../../wix-rich-content-common';\nimport { Uploader } from './../../plugin-commons';\n\nimport { RICOS_DEFAULTS } from '../constants';\nimport { UPLOAD_TAB_UPLOAD_BUTTON } from '../dataHooks';\nimport type { VideoPluginEditorConfig } from '../types';\nimport { VIDEO_TYPE } from '../types';\nimport { VideoPluginService } from './videoPluginService';\n\nconst FILE_INPUT_ACCEPT = 'video/*';\n\ntype UploadVideoProps = {\n  nodeId?: string;\n  helpers: Helpers;\n  enableCustomUploadOnMobile?: boolean;\n  uploadService?: IUploadService;\n  updateService?: IUpdateService;\n  closeModal: () => void;\n} & Pick<\n  VideoPluginEditorConfig,\n  'disableDownloadDefault' | 'handleFileSelection' | 'handleFileUpload'\n>;\n\nexport const UploadVideo: React.FC<UploadVideoProps> = ({\n  nodeId,\n  helpers,\n  enableCustomUploadOnMobile,\n  uploadService,\n  updateService,\n  closeModal,\n  disableDownloadDefault,\n  handleFileSelection,\n  handleFileUpload,\n}) => {\n  const { t, isMobile } = useContext(RicosContext);\n  const { getEditorCommands } = useContext(EditorContext);\n\n  const hasCustomFileUpload = Boolean(handleFileUpload || handleFileSelection);\n  const showUploadSection = (!isMobile || enableCustomUploadOnMobile) && hasCustomFileUpload;\n\n  const videoPluginService = useMemo(\n    () => new VideoPluginService({ disableDownloadDefault }),\n    [disableDownloadDefault]\n  );\n\n  const handleUploadClick = () => {\n    helpers?.onPluginsPopOverClick?.({\n      pluginId: VIDEO_TYPE,\n      buttonName: MEDIA_POPOVERS_BUTTONS_NAMES_BI.upload,\n    });\n\n    if (handleFileSelection) {\n      handleFileSelection(\n        handleExternalFileChange(nodeId, getEditorCommands(), updateService, videoPluginService)\n      );\n      closeModal();\n      return;\n    }\n    uploadService?.selectFiles(\n      FILE_INPUT_ACCEPT,\n      false,\n      handleNativeFileChange(\n        nodeId,\n        getEditorCommands(),\n        uploadService,\n        new Uploader(handleFileUpload),\n        videoPluginService\n      )\n    );\n    closeModal();\n  };\n\n  return (\n    <>\n      <Text size=\"small\" weight=\"thin\">\n        {t('VideoCustomUploadModal_Title')}\n      </Text>\n      {showUploadSection ? (\n        <FileUpload onChange={() => {}} accept={FILE_INPUT_ACCEPT}>\n          {() => (\n            <Button dataHook={UPLOAD_TAB_UPLOAD_BUTTON} onClick={handleUploadClick} fullWidth>\n              {t('VideoUploadModal_CustomVideoClickText')}\n            </Button>\n          )}\n        </FileUpload>\n      ) : null}\n    </>\n  );\n};\n\nconst handleExternalFileChange =\n  (\n    nodeId: string | undefined,\n    editorCommands: EditorCommands,\n    updateService: IUpdateService | undefined,\n    videoPluginService: IMediaPluginService\n  ) =>\n  ({ data }: UpdateEntityFunctionParams<VideoData | VideoData[]>) => {\n    const id = nodeId || editorCommands.insertBlockWithBlankLines(VIDEO_TYPE, RICOS_DEFAULTS);\n    const file = data instanceof Array ? data[0] : data;\n\n    queueMicrotask(() => {\n      updateService?.updatePluginData({ data: file }, id, VIDEO_TYPE, videoPluginService);\n    });\n  };\n\nconst handleNativeFileChange =\n  (\n    nodeId: string | undefined,\n    editorCommands: EditorCommands,\n    uploadService: IUploadService,\n    uploader: IFileUploader,\n    videoPluginService: IMediaPluginService\n  ) =>\n  (files: File[] | File) => {\n    const id = nodeId || editorCommands.insertBlockWithBlankLines(VIDEO_TYPE, RICOS_DEFAULTS);\n    const file = files instanceof Array ? files[0] : files;\n    queueMicrotask(() => {\n      uploadService.uploadFile(\n        new File([file], file.name, { type: file.type }),\n        id,\n        uploader,\n        VIDEO_TYPE,\n        videoPluginService\n      );\n    });\n  };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAAyC;AACzC,mBAA2C;AAE3C,2BAA4C;AAW5C,qCAAgD;AAChD,4BAAyB;AAEzB,uBAA+B;AAC/B,uBAAyC;AAEzC,mBAA2B;AAC3B,gCAAmC;AAEnC,MAAM,oBAAoB;AAcnB,MAAM,cAA0C,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,GAAG,SAAS,QAAI,yBAAW,iCAAY;AAC/C,QAAM,EAAE,kBAAkB,QAAI,yBAAW,kCAAa;AAEtD,QAAM,sBAAsB,QAAQ,oBAAoB,mBAAmB;AAC3E,QAAM,qBAAqB,CAAC,YAAY,+BAA+B;AAEvE,QAAM,yBAAqB;AAAA,IACzB,MAAM,IAAI,6CAAmB,EAAE,uBAAuB,CAAC;AAAA,IACvD,CAAC,sBAAsB;AAAA,EACzB;AAEA,QAAM,oBAAoB,MAAM;AAC9B,aAAS,wBAAwB;AAAA,MAC/B,UAAU;AAAA,MACV,YAAY,+DAAgC;AAAA,IAC9C,CAAC;AAED,QAAI,qBAAqB;AACvB;AAAA,QACE,yBAAyB,QAAQ,kBAAkB,GAAG,eAAe,kBAAkB;AAAA,MACzF;AACA,iBAAW;AACX;AAAA,IACF;AACA,mBAAe;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,QACE;AAAA,QACA,kBAAkB;AAAA,QAClB;AAAA,QACA,IAAI,+BAAS,gBAAgB;AAAA,QAC7B;AAAA,MACF;AAAA,IACF;AACA,eAAW;AAAA,EACb;AAEA,SACE,6BAAAA,QAAA,2BAAAA,QAAA,gBACE,6BAAAA,QAAA,cAAC,6BAAK,MAAK,SAAQ,QAAO,UACvB,EAAE,8BAA8B,CACnC,GACC,oBACC,6BAAAA,QAAA,cAAC,mCAAW,UAAU,MAAM;AAAA,EAAC,GAAG,QAAQ,qBACrC,MACC,6BAAAA,QAAA,cAAC,+BAAO,UAAU,2CAA0B,SAAS,mBAAmB,WAAS,QAC9E,EAAE,uCAAuC,CAC5C,CAEJ,IACE,IACN;AAEJ;AAEA,MAAM,2BACJ,CACE,QACA,gBACA,eACA,uBAEF,CAAC,EAAE,KAAK,MAA2D;AACjE,QAAM,KAAK,UAAU,eAAe,0BAA0B,yBAAY,+BAAc;AACxF,QAAM,OAAO,gBAAgB,QAAQ,KAAK,CAAC,IAAI;AAE/C,iBAAe,MAAM;AACnB,mBAAe,iBAAiB,EAAE,MAAM,KAAK,GAAG,IAAI,yBAAY,kBAAkB;AAAA,EACpF,CAAC;AACH;AAEF,MAAM,yBACJ,CACE,QACA,gBACA,eACA,UACA,uBAEF,CAAC,UAAyB;AACxB,QAAM,KAAK,UAAU,eAAe,0BAA0B,yBAAY,+BAAc;AACxF,QAAM,OAAO,iBAAiB,QAAQ,MAAM,CAAC,IAAI;AACjD,iBAAe,MAAM;AACnB,kBAAc;AAAA,MACZ,IAAI,KAAK,CAAC,IAAI,GAAG,KAAK,MAAM,EAAE,MAAM,KAAK,KAAK,CAAC;AAAA,MAC/C;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
+  "names": ["React"]
 }

package/dist/cjs/plugin-video/viewer/nodeViewRenderers-loadable.js

@@ -42,7 +42,7 @@ const VideoRenderer = ({
   const Video = (0, import_react.useMemo)(
     () => (0, import_component.default)(() => Promise.resolve().then(() => __toESM(require(
       /* webpackChunkName: "ricos_plugin_video" */
-      "./video"
+      "./viewer-video"
     )))),
     []
   );
@@ -51,7 +51,37 @@ const VideoRenderer = ({
 const VideoLoadable = ({ node, ...props }) => {
   return /* @__PURE__ */ import_react.default.createElement(VideoRenderer, { key: node.id, node, ...props });
 };
+const CaptionRenderer = ({
+  node,
+  nodeIndex,
+  NodeViewContainer,
+  ...props
+}) => {
+  const ImageCaption = (0, import_react.useMemo)(
+    () => (0, import_component.default)(
+      () => Promise.resolve().then(() => __toESM(require(
+        /* webpackChunkName: "ricos_plugin_image_caption" */
+        "../../plugin-figure/viewer/viewer-caption"
+      )))
+    ),
+    []
+  );
+  return /* @__PURE__ */ import_react.default.createElement(
+    ImageCaption,
+    {
+      key: node.id,
+      node,
+      nodeIndex,
+      NodeViewContainer,
+      ...props
+    }
+  );
+};
+const CaptionLoadable = ({ node, ...props }) => {
+  return /* @__PURE__ */ import_react.default.createElement(CaptionRenderer, { key: node.id, node, ...props });
+};
 const nodeViewRenderers = {
-  [import_ricos_types.Node_Type.VIDEO]: VideoLoadable
+  [import_ricos_types.Node_Type.VIDEO]: VideoLoadable,
+  [import_ricos_types.Node_Type.CAPTION]: CaptionLoadable
 };
 //# sourceMappingURL=nodeViewRenderers-loadable.js.map

package/dist/cjs/plugin-video/viewer/nodeViewRenderers-loadable.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugin-video/viewer/nodeViewRenderers-loadable.tsx"],
-  "sourcesContent": ["import loadable from '@loadable/component';\nimport type { FC } from 'react';\nimport React, { useMemo } from 'react';\n\nimport type { NodeViewRendererProps, NodeViewRenderers } from './../../ricos-types';\nimport { Node_Type } from './../../ricos-types';\n\nconst VideoRenderer: FC<NodeViewRendererProps> = ({\n  node,\n  nodeIndex,\n  NodeViewContainer,\n  ...props\n}: NodeViewRendererProps) => {\n  const Video = useMemo(\n    () => loadable(() => import(/* webpackChunkName: \"ricos_plugin_video\" */ './video')),\n    []\n  );\n  return (\n    <Video node={node} nodeIndex={nodeIndex} NodeViewContainer={NodeViewContainer} {...props} />\n  );\n};\n\nconst VideoLoadable = ({ node, ...props }: NodeViewRendererProps) => {\n  return <VideoRenderer key={node.id} node={node} {...props} />;\n};\n\nexport const nodeViewRenderers: NodeViewRenderers = {\n  [Node_Type.VIDEO]: VideoLoadable,\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAqB;AAErB,mBAA+B;AAG/B,yBAA0B;AAE1B,MAAM,gBAA2C,CAAC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA6B;AAC3B,QAAM,YAAQ;AAAA,IACZ,UAAM,iBAAAA,SAAS,MAAM;AAAA;AAAA,MAAoD;AAAA,IAAS,GAAC;AAAA,IACnF,CAAC;AAAA,EACH;AACA,SACE,6BAAAC,QAAA,cAAC,SAAM,MAAY,WAAsB,mBAAuC,GAAG,OAAO;AAE9F;AAEA,MAAM,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,MAA6B;AACnE,SAAO,6BAAAA,QAAA,cAAC,iBAAc,KAAK,KAAK,IAAI,MAAa,GAAG,OAAO;AAC7D;AAEO,MAAM,oBAAuC;AAAA,EAClD,CAAC,6BAAU,KAAK,GAAG;AACrB;",
+  "sourcesContent": ["import loadable from '@loadable/component';\nimport type { FC } from 'react';\nimport React, { useMemo } from 'react';\n\nimport type { NodeViewRendererProps, NodeViewRenderers } from './../../ricos-types';\nimport { Node_Type } from './../../ricos-types';\n\nconst VideoRenderer: FC<NodeViewRendererProps> = ({\n  node,\n  nodeIndex,\n  NodeViewContainer,\n  ...props\n}: NodeViewRendererProps) => {\n  const Video = useMemo(\n    () => loadable(() => import(/* webpackChunkName: \"ricos_plugin_video\" */ './viewer-video')),\n    []\n  );\n  return (\n    <Video node={node} nodeIndex={nodeIndex} NodeViewContainer={NodeViewContainer} {...props} />\n  );\n};\n\nconst VideoLoadable = ({ node, ...props }: NodeViewRendererProps) => {\n  return <VideoRenderer key={node.id} node={node} {...props} />;\n};\n\nconst CaptionRenderer: FC<NodeViewRendererProps> = ({\n  node,\n  nodeIndex,\n  NodeViewContainer,\n  ...props\n}) => {\n  const ImageCaption = useMemo(\n    () =>\n      loadable(\n        () =>\n          import(\n            /* webpackChunkName: \"ricos_plugin_image_caption\" */ '../../plugin-figure/viewer/viewer-caption'\n          )\n      ),\n    []\n  );\n  return (\n    <ImageCaption\n      key={node.id}\n      node={node}\n      nodeIndex={nodeIndex}\n      NodeViewContainer={NodeViewContainer}\n      {...props}\n    />\n  );\n};\n\nconst CaptionLoadable = ({ node, ...props }: NodeViewRendererProps) => {\n  return <CaptionRenderer key={node.id} node={node} {...props} />;\n};\n\nexport const nodeViewRenderers: NodeViewRenderers = {\n  [Node_Type.VIDEO]: VideoLoadable,\n  [Node_Type.CAPTION]: CaptionLoadable,\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAqB;AAErB,mBAA+B;AAG/B,yBAA0B;AAE1B,MAAM,gBAA2C,CAAC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA6B;AAC3B,QAAM,YAAQ;AAAA,IACZ,UAAM,iBAAAA,SAAS,MAAM;AAAA;AAAA,MAAoD;AAAA,IAAgB,GAAC;AAAA,IAC1F,CAAC;AAAA,EACH;AACA,SACE,6BAAAC,QAAA,cAAC,SAAM,MAAY,WAAsB,mBAAuC,GAAG,OAAO;AAE9F;AAEA,MAAM,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,MAA6B;AACnE,SAAO,6BAAAA,QAAA,cAAC,iBAAc,KAAK,KAAK,IAAI,MAAa,GAAG,OAAO;AAC7D;AAEA,MAAM,kBAA6C,CAAC;AAAA,EAClD;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,mBAAe;AAAA,IACnB,UACE,iBAAAD;AAAA,MACE,MACE;AAAA;AAAA,QACuD;AAAA,MACvD;AAAA,IACJ;AAAA,IACF,CAAC;AAAA,EACH;AACA,SACE,6BAAAC,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,KAAK,KAAK;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,MAAM,kBAAkB,CAAC,EAAE,MAAM,GAAG,MAAM,MAA6B;AACrE,SAAO,6BAAAA,QAAA,cAAC,mBAAgB,KAAK,KAAK,IAAI,MAAa,GAAG,OAAO;AAC/D;AAEO,MAAM,oBAAuC;AAAA,EAClD,CAAC,6BAAU,KAAK,GAAG;AAAA,EACnB,CAAC,6BAAU,OAAO,GAAG;AACvB;",
   "names": ["loadable", "React"]
 }

package/dist/cjs/plugin-video/viewer/nodeViewRenderers.js

@@ -31,8 +31,10 @@ __export(nodeViewRenderers_exports, {
 });
 module.exports = __toCommonJS(nodeViewRenderers_exports);
 var import_ricos_types = require("./../../ricos-types");
-var import_video = __toESM(require("./video"));
+var import_viewer_caption = __toESM(require("../../plugin-figure/viewer/viewer-caption"));
+var import_viewer_video = __toESM(require("./viewer-video"));
 const nodeViewRenderers = {
-  [import_ricos_types.Node_Type.VIDEO]: import_video.default
+  [import_ricos_types.Node_Type.VIDEO]: import_viewer_video.default,
+  [import_ricos_types.Node_Type.CAPTION]: import_viewer_caption.default
 };
 //# sourceMappingURL=nodeViewRenderers.js.map

package/dist/cjs/plugin-video/viewer/nodeViewRenderers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugin-video/viewer/nodeViewRenderers.ts"],
-  "sourcesContent": ["import type { NodeViewRenderers } from './../../ricos-types';\nimport { Node_Type } from './../../ricos-types';\n\nimport Video from './video';\n\nexport const nodeViewRenderers: NodeViewRenderers = {\n  [Node_Type.VIDEO]: Video,\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,yBAA0B;AAE1B,mBAAkB;AAEX,MAAM,oBAAuC;AAAA,EAClD,CAAC,6BAAU,KAAK,GAAG,aAAAA;AACrB;",
-  "names": ["Video"]
+  "sourcesContent": ["import type { NodeViewRenderers } from './../../ricos-types';\nimport { Node_Type } from './../../ricos-types';\n\nimport Caption from '../../plugin-figure/viewer/viewer-caption';\nimport Video from './viewer-video';\n\nexport const nodeViewRenderers: NodeViewRenderers = {\n  [Node_Type.VIDEO]: Video,\n  [Node_Type.CAPTION]: Caption,\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,yBAA0B;AAE1B,4BAAoB;AACpB,0BAAkB;AAEX,MAAM,oBAAuC;AAAA,EAClD,CAAC,6BAAU,KAAK,GAAG,oBAAAA;AAAA,EACnB,CAAC,6BAAU,OAAO,GAAG,sBAAAC;AACvB;",
+  "names": ["Video", "Caption"]
 }

package/dist/cjs/plugin-video/viewer/video.js

@@ -27,28 +27,287 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var video_exports = {};
 __export(video_exports, {
-  default: () => video_default
+  Video: () => Video
 });
 module.exports = __toCommonJS(video_exports);
 var import_react = __toESM(require("react"));
-var import_ricos_context = require("./../../ricos-context");
-var import_dataHooks = require("../dataHooks");
+var import_react_dom = __toESM(require("react-dom"));
+var import_wix_rich_content_common = require("./../../wix-rich-content-common");
+var import_IframePlayer = __toESM(require("../IframePlayer"));
+var import_reactPlayerWrapper = require("../reactPlayerWrapper");
 var import_video_viewer_scss = __toESM(require("../statics/styles/video-viewer-scss"));
-var import_types = require("../types");
-var import_video_viewer = require("./video-viewer");
-const Video = ({ node, nodeIndex, NodeViewContainer }) => {
-  const { seoMode, config } = (0, import_react.useContext)(import_ricos_context.RicosViewerContext);
-  const { videoData } = node;
-  return /* @__PURE__ */ import_react.default.createElement(NodeViewContainer, { node, nodeIndex, key: node.id }, /* @__PURE__ */ import_react.default.createElement("div", { className: import_video_viewer_scss.default.video_container, "data-hook": import_dataHooks.ROOT }, !!videoData && /* @__PURE__ */ import_react.default.createElement(
-    import_video_viewer.VideoViewer,
+const Video = ({
+  config,
+  componentData,
+  nodeId,
+  isLight,
+  onReady,
+  isLoaded,
+  seoMode,
+  muted,
+  onDuration,
+  disabled
+}) => {
+  const [key, setKey] = (0, import_react.useState)("");
+  const [state, setState] = (0, import_react.useState)(() => {
+    const getInitialUrlState = () => {
+      const { src } = componentData.video || {};
+      if (src?.url) {
+        const normalizedUrl = normalizeUrl(src.url);
+        return {
+          type: "READY",
+          loadedUrl: normalizedUrl
+        };
+      }
+      if (src?.id && config.getVideoUrl) {
+        try {
+          const videoUrl = config.getVideoUrl({ pathname: src.id });
+          if (typeof videoUrl === "string") {
+            return {
+              type: "READY",
+              loadedUrl: normalizeUrl(videoUrl),
+              startingId: src.id
+            };
+          }
+          return { type: "INITIAL" };
+        } catch (e) {
+          return { type: "INITIAL" };
+        }
+      }
+      return { type: "INITIAL" };
+    };
+    const getInitialThumbnailUrlState = () => {
+      const thumbnailId = componentData?.thumbnail?.src?.id;
+      const thumbnailSrc = componentData?.thumbnail?.src?.url;
+      if (thumbnailSrc) {
+        return {
+          type: "READY",
+          loadedUrl: thumbnailSrc
+        };
+      }
+      if (!thumbnailId || !config.getThumbnailUrl) {
+        return { type: "INITIAL" };
+      }
+      try {
+        const thumbnailUrl = config.getThumbnailUrl({ pathname: thumbnailId });
+        if (typeof thumbnailUrl === "string") {
+          return {
+            type: "READY",
+            loadedUrl: thumbnailUrl,
+            startingId: thumbnailId
+          };
+        }
+      } catch (e) {
+        return { type: "INITIAL" };
+      }
+      return { type: "INITIAL" };
+    };
+    return {
+      isLoaded: false,
+      isVideoWrapperAttachedToDom: false,
+      url: getInitialUrlState(),
+      thumbnailUrl: getInitialThumbnailUrlState()
+    };
+  });
+  (0, import_react.useEffect)(() => {
+    setKey("mounted");
+  }, []);
+  (0, import_react.useEffect)(() => {
+    const updateUrl = async () => {
+      const { src } = componentData.video || {};
+      const currentUrl = state.url;
+      if (currentUrl.type === "LOADING") {
+        return;
+      }
+      if (src?.url) {
+        const normalizedUrl = normalizeUrl(src.url);
+        if (currentUrl.type === "READY" && currentUrl.loadedUrl === normalizedUrl) {
+          return;
+        }
+        setState((prev) => ({
+          ...prev,
+          url: {
+            type: "READY",
+            loadedUrl: normalizedUrl
+          }
+        }));
+        return;
+      }
+      if (src?.id && config.getVideoUrl) {
+        if (currentUrl.type === "READY" && currentUrl.startingId === src.id) {
+          return;
+        }
+        setState((prev) => ({ ...prev, url: { type: "LOADING" } }));
+        try {
+          const videoUrl = await config.getVideoUrl({ pathname: src.id });
+          setState((prev) => ({
+            ...prev,
+            url: {
+              type: "READY",
+              loadedUrl: normalizeUrl(videoUrl),
+              startingId: src.id
+            }
+          }));
+          return;
+        } catch (e) {
+          setState((prev) => ({ ...prev, url: { type: "READY", startingId: src.id } }));
+          return;
+        }
+      }
+      if (currentUrl.type !== "READY") {
+        setState((prev) => ({ ...prev, url: { type: "READY" } }));
+      }
+    };
+    updateUrl();
+  }, [componentData.video, config.getVideoUrl, state.url]);
+  (0, import_react.useEffect)(() => {
+    const updateThumbnail = async () => {
+      const { src } = componentData.thumbnail || {};
+      const thumbnailId = src?.id;
+      const thumbnailSrc = src?.url;
+      const thumbnailState = state.thumbnailUrl;
+      if (thumbnailSrc) {
+        if (state.thumbnailUrl.type === "READY" && thumbnailSrc === state.thumbnailUrl.loadedUrl) {
+          return;
+        }
+        setState((prev) => ({
+          ...prev,
+          thumbnailUrl: {
+            type: "READY",
+            loadedUrl: thumbnailSrc
+          }
+        }));
+        return;
+      }
+      if (thumbnailState.type === "LOADING") {
+        return;
+      }
+      if (!thumbnailId) {
+        if (thumbnailState.type === "INITIAL") {
+          setState((prev) => ({ ...prev, thumbnailUrl: { type: "READY" } }));
+        }
+        return;
+      }
+      if (!config.getThumbnailUrl) {
+        if (thumbnailState.type === "INITIAL" || thumbnailState.type === "READY" && thumbnailState.startingId !== thumbnailId) {
+          setState((prev) => ({ ...prev, thumbnailUrl: { type: "READY", startingId: thumbnailId } }));
+        }
+        return;
+      }
+      if (thumbnailState.type === "READY" && thumbnailState.startingId === thumbnailId && !!thumbnailState.loadedUrl) {
+        return;
+      }
+      try {
+        setState((prev) => ({ ...prev, thumbnailUrl: { type: "LOADING" } }));
+        const thumbnailUrl = await config.getThumbnailUrl({ pathname: thumbnailId });
+        setState((prev) => ({
+          ...prev,
+          thumbnailUrl: {
+            type: "READY",
+            loadedUrl: thumbnailUrl,
+            startingId: thumbnailId
+          }
+        }));
+      } catch (e) {
+        setState((prev) => ({ ...prev, thumbnailUrl: { type: "READY", startingId: thumbnailId } }));
+      }
+    };
+    updateThumbnail();
+  }, [componentData.thumbnail, config.getThumbnailUrl, state.thumbnailUrl]);
+  (0, import_react.useEffect)(() => {
+    if (!state.isVideoWrapperAttachedToDom) {
+      const videoRatio = getVideoRatio();
+      if (videoRatio) {
+        setVideoRatio(videoRatio.ratio, videoRatio.wrapper);
+        setState((prev) => ({ ...prev, isVideoWrapperAttachedToDom: true }));
+      }
+    }
+  }, [state.isVideoWrapperAttachedToDom]);
+  const getVideoRatio = () => {
+    const wrapper = import_react_dom.default.findDOMNode(void 0)?.parentNode;
+    if (!wrapper) {
+      return void 0;
+    }
+    const element = wrapper.querySelector("iframe, video");
+    if (!element) {
+      return void 0;
+    }
+    const ratio = element.clientHeight / element.clientWidth;
+    return !isNaN(ratio) ? { ratio, wrapper } : void 0;
+  };
+  const setVideoRatio = (ratio, wrapper) => {
+    wrapper.style["padding-bottom"] = ratio * 100 + "%";
+  };
+  const onReactPlayerReady = (player) => {
+    if (onReady) {
+      onReady(player);
+      return;
+    }
+    if (!isLoaded) {
+      setState((prev) => ({ ...prev, isLoaded: true }));
+    }
+  };
+  const handleContextMenu = (e) => componentData.disableDownload && e.preventDefault();
+  const getDownloadProps = () => {
+    if ((0, import_wix_rich_content_common.isDefined)(componentData?.disableDownload) && componentData.disableDownload || (0, import_wix_rich_content_common.isDefined)(config?.disableDownload) && config.disableDownload) {
+      return {
+        config: {
+          file: {
+            attributes: {
+              controlsList: "nodownload"
+            }
+          }
+        }
+      };
+    }
+    return {
+      config: {}
+    };
+  };
+  const getLightProps = () => {
+    if (!isLight) {
+      return {
+        isLight: false
+      };
+    }
+    return {
+      isLight: true,
+      thumbnail: state.thumbnailUrl.type === "READY" ? state.thumbnailUrl.loadedUrl : void 0
+    };
+  };
+  const url = state.url.type === "READY" ? state.url.loadedUrl : void 0;
+  if (!url) {
+    return null;
+  }
+  const isCustomVideo = !!componentData.video?.src?.id;
+  const shouldRenderIframe = (0, import_wix_rich_content_common.isSSR)() && seoMode && url;
+  const { autoPlay = false, playInLoop = false, showControls = true } = componentData.options || {};
+  return shouldRenderIframe ? /* @__PURE__ */ import_react.default.createElement(import_IframePlayer.default, { isCustomVideo, url }) : /* @__PURE__ */ import_react.default.createElement(
+    import_reactPlayerWrapper.ReactPlayerWrapper,
     {
-      config: config[import_types.VIDEO_TYPE] || {},
-      componentData: videoData,
-      nodeId: node.id,
-      seoMode: !!seoMode,
-      isLight: true
+      className: import_video_viewer_scss.default.video_player,
+      onContextMenu: handleContextMenu,
+      controls: isLoaded !== false && showControls,
+      url,
+      onReady: onReactPlayerReady,
+      disabled,
+      width: "100%",
+      height: "100%",
+      key,
+      onDuration,
+      onProgress: (progress) => {
+        config.onProgress?.({ ...progress, id: nodeId });
+      },
+      progressInterval: config.progressInterval || 1e3,
+      muted: muted || autoPlay,
+      isLoaded: isLoaded || state.isLoaded,
+      autoPlay,
+      loop: playInLoop,
+      isCustomVideo,
+      ...getLightProps(),
+      ...getDownloadProps()
     }
-  )));
+  );
 };
-var video_default = Video;
+const normalizeUrl = (url) => url && (url.toLowerCase().indexOf("vimeo") === 0 ? "https://" + url : url);
 //# sourceMappingURL=video.js.map

package/dist/cjs/plugin-video/viewer/video.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugin-video/viewer/video.tsx"],
-  "sourcesContent": ["import React, { useContext } from 'react';\n\nimport { RicosViewerContext } from './../../ricos-context';\nimport type { NodeViewRendererProps } from './../../ricos-types';\n\nimport { ROOT } from '../dataHooks';\nimport styles from '../statics/styles/video-viewer-scss';\nimport { VIDEO_TYPE } from '../types';\nimport { VideoViewer } from './video-viewer';\n\nconst Video = ({ node, nodeIndex, NodeViewContainer }: NodeViewRendererProps) => {\n  const { seoMode, config } = useContext(RicosViewerContext);\n  const { videoData } = node;\n\n  return (\n    <NodeViewContainer node={node} nodeIndex={nodeIndex} key={node.id}>\n      <div className={styles.video_container} data-hook={ROOT}>\n        {!!videoData && (\n          <VideoViewer\n            config={config[VIDEO_TYPE] || {}}\n            componentData={videoData}\n            nodeId={node.id}\n            seoMode={!!seoMode}\n            isLight\n          />\n        )}\n      </div>\n    </NodeViewContainer>\n  );\n};\n\nexport default Video;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkC;AAElC,2BAAmC;AAGnC,uBAAqB;AACrB,+BAAmB;AACnB,mBAA2B;AAC3B,0BAA4B;AAE5B,MAAM,QAAQ,CAAC,EAAE,MAAM,WAAW,kBAAkB,MAA6B;AAC/E,QAAM,EAAE,SAAS,OAAO,QAAI,yBAAW,uCAAkB;AACzD,QAAM,EAAE,UAAU,IAAI;AAEtB,SACE,6BAAAA,QAAA,cAAC,qBAAkB,MAAY,WAAsB,KAAK,KAAK,MAC7D,6BAAAA,QAAA,cAAC,SAAI,WAAW,yBAAAC,QAAO,iBAAiB,aAAW,yBAChD,CAAC,CAAC,aACD,6BAAAD,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,QAAQ,OAAO,uBAAU,KAAK,CAAC;AAAA,MAC/B,eAAe;AAAA,MACf,QAAQ,KAAK;AAAA,MACb,SAAS,CAAC,CAAC;AAAA,MACX,SAAO;AAAA;AAAA,EACT,CAEJ,CACF;AAEJ;AAEA,IAAO,gBAAQ;",
-  "names": ["React", "styles"]
+  "sourcesContent": ["import React, { useEffect, useState } from 'react';\nimport ReactDOM from 'react-dom';\n\nimport type { VideoData } from './../../ricos-schema/legacy/wix/rich_content/v1';\nimport { isDefined, isSSR } from './../../wix-rich-content-common';\n\nimport IframePlayer from '../IframePlayer';\nimport type { ReactPlayerWrapperProps } from '../reactPlayerWrapper';\nimport { ReactPlayerWrapper } from '../reactPlayerWrapper';\nimport styles from '../statics/styles/video-viewer-scss';\nimport type { VideoPluginEditorConfig } from '../types';\n\ntype Props = {\n  config: VideoPluginEditorConfig;\n  componentData: VideoData;\n  nodeId: string;\n  isLight: boolean;\n  onReady?: ReactPlayerWrapperProps['onReady'];\n  isLoaded?: boolean;\n  seoMode?: boolean;\n  muted?: boolean;\n  onDuration?: (duration: number) => void;\n  disabled?: boolean;\n};\n\ntype UrlState =\n  | {\n      type: 'LOADING' | 'INITIAL';\n    }\n  | {\n      type: 'READY';\n      loadedUrl?: string;\n      startingId?: string;\n    };\n\ntype State = {\n  url: UrlState;\n  thumbnailUrl: UrlState;\n  isLoaded: boolean;\n  isVideoWrapperAttachedToDom: boolean;\n};\n\nexport const Video: React.FC<Props> = ({\n  config,\n  componentData,\n  nodeId,\n  isLight,\n  onReady,\n  isLoaded,\n  seoMode,\n  muted,\n  onDuration,\n  disabled,\n}) => {\n  const [key, setKey] = useState('');\n  const [state, setState] = useState<State>(() => {\n    const getInitialUrlState = (): UrlState => {\n      const { src } = componentData.video || {};\n\n      if (src?.url) {\n        const normalizedUrl = normalizeUrl(src.url);\n\n        return {\n          type: 'READY',\n          loadedUrl: normalizedUrl,\n        };\n      }\n      if (src?.id && config.getVideoUrl) {\n        try {\n          const videoUrl = config.getVideoUrl({ pathname: src.id });\n          if (typeof videoUrl === 'string') {\n            return {\n              type: 'READY',\n              loadedUrl: normalizeUrl(videoUrl),\n              startingId: src.id,\n            };\n          }\n\n          return { type: 'INITIAL' };\n        } catch (e) {\n          return { type: 'INITIAL' };\n        }\n      }\n\n      return { type: 'INITIAL' };\n    };\n\n    const getInitialThumbnailUrlState = (): UrlState => {\n      const thumbnailId = componentData?.thumbnail?.src?.id;\n      const thumbnailSrc = componentData?.thumbnail?.src?.url;\n\n      if (thumbnailSrc) {\n        return {\n          type: 'READY',\n          loadedUrl: thumbnailSrc,\n        };\n      }\n      if (!thumbnailId || !config.getThumbnailUrl) {\n        return { type: 'INITIAL' };\n      }\n\n      try {\n        const thumbnailUrl = config.getThumbnailUrl({ pathname: thumbnailId });\n\n        if (typeof thumbnailUrl === 'string') {\n          return {\n            type: 'READY',\n            loadedUrl: thumbnailUrl,\n            startingId: thumbnailId,\n          };\n        }\n      } catch (e) {\n        return { type: 'INITIAL' };\n      }\n\n      return { type: 'INITIAL' };\n    };\n\n    return {\n      isLoaded: false,\n      isVideoWrapperAttachedToDom: false,\n      url: getInitialUrlState(),\n      thumbnailUrl: getInitialThumbnailUrlState(),\n    };\n  });\n\n  useEffect(() => {\n    setKey('mounted'); //remounts reactPlayer after ssr. Fixes bug where internal player id changes in client\n  }, []);\n\n  useEffect(() => {\n    const updateUrl = async () => {\n      const { src } = componentData.video || {};\n      const currentUrl = state.url;\n\n      if (currentUrl.type === 'LOADING') {\n        return;\n      }\n\n      if (src?.url) {\n        const normalizedUrl = normalizeUrl(src.url);\n        if (currentUrl.type === 'READY' && currentUrl.loadedUrl === normalizedUrl) {\n          return;\n        }\n        setState(prev => ({\n          ...prev,\n          url: {\n            type: 'READY',\n            loadedUrl: normalizedUrl,\n          },\n        }));\n        return;\n      }\n\n      if (src?.id && config.getVideoUrl) {\n        if (currentUrl.type === 'READY' && currentUrl.startingId === src.id) {\n          return;\n        }\n\n        setState(prev => ({ ...prev, url: { type: 'LOADING' } }));\n\n        try {\n          const videoUrl = await config.getVideoUrl({ pathname: src.id });\n          setState(prev => ({\n            ...prev,\n            url: {\n              type: 'READY',\n              loadedUrl: normalizeUrl(videoUrl),\n              startingId: src.id,\n            },\n          }));\n          return;\n        } catch (e) {\n          setState(prev => ({ ...prev, url: { type: 'READY', startingId: src.id } }));\n          return;\n        }\n      }\n\n      if (currentUrl.type !== 'READY') {\n        setState(prev => ({ ...prev, url: { type: 'READY' } }));\n      }\n    };\n\n    updateUrl();\n  }, [componentData.video, config.getVideoUrl, state.url]);\n\n  useEffect(() => {\n    const updateThumbnail = async () => {\n      const { src } = componentData.thumbnail || {};\n      const thumbnailId = src?.id;\n      const thumbnailSrc = src?.url;\n      const thumbnailState = state.thumbnailUrl;\n\n      if (thumbnailSrc) {\n        if (state.thumbnailUrl.type === 'READY' && thumbnailSrc === state.thumbnailUrl.loadedUrl) {\n          return;\n        }\n\n        setState(prev => ({\n          ...prev,\n          thumbnailUrl: {\n            type: 'READY',\n            loadedUrl: thumbnailSrc,\n          },\n        }));\n        return;\n      }\n\n      if (thumbnailState.type === 'LOADING') {\n        return;\n      }\n\n      if (!thumbnailId) {\n        if (thumbnailState.type === 'INITIAL') {\n          setState(prev => ({ ...prev, thumbnailUrl: { type: 'READY' } }));\n        }\n        return;\n      }\n\n      if (!config.getThumbnailUrl) {\n        if (\n          thumbnailState.type === 'INITIAL' ||\n          (thumbnailState.type === 'READY' && thumbnailState.startingId !== thumbnailId)\n        ) {\n          setState(prev => ({ ...prev, thumbnailUrl: { type: 'READY', startingId: thumbnailId } }));\n        }\n        return;\n      }\n      if (\n        thumbnailState.type === 'READY' &&\n        thumbnailState.startingId === thumbnailId &&\n        !!thumbnailState.loadedUrl\n      ) {\n        return;\n      }\n\n      try {\n        setState(prev => ({ ...prev, thumbnailUrl: { type: 'LOADING' } }));\n        const thumbnailUrl = await config.getThumbnailUrl({ pathname: thumbnailId });\n        setState(prev => ({\n          ...prev,\n          thumbnailUrl: {\n            type: 'READY',\n            loadedUrl: thumbnailUrl,\n            startingId: thumbnailId,\n          },\n        }));\n      } catch (e) {\n        setState(prev => ({ ...prev, thumbnailUrl: { type: 'READY', startingId: thumbnailId } }));\n      }\n    };\n\n    updateThumbnail();\n  }, [componentData.thumbnail, config.getThumbnailUrl, state.thumbnailUrl]);\n\n  useEffect(() => {\n    if (!state.isVideoWrapperAttachedToDom) {\n      const videoRatio = getVideoRatio();\n      if (videoRatio) {\n        setVideoRatio(videoRatio.ratio, videoRatio.wrapper);\n        setState(prev => ({ ...prev, isVideoWrapperAttachedToDom: true }));\n      }\n    }\n  }, [state.isVideoWrapperAttachedToDom]);\n\n  const getVideoRatio = (): { ratio: number; wrapper: ParentNode } | undefined => {\n    // eslint-disable-next-line react/no-find-dom-node\n    const wrapper = ReactDOM.findDOMNode(this)?.parentNode;\n\n    if (!wrapper) {\n      return undefined;\n    }\n\n    const element = wrapper.querySelector('iframe, video');\n    if (!element) {\n      return undefined;\n    }\n\n    const ratio = element.clientHeight / element.clientWidth;\n\n    return !isNaN(ratio) ? { ratio, wrapper: wrapper as ParentNode } : undefined;\n  };\n\n  const setVideoRatio = (ratio: number, wrapper: ParentNode) => {\n    (wrapper as HTMLElement).style['padding-bottom'] = ratio * 100 + '%';\n  };\n\n  /**\n   * A bit confusing to understand at first, but the idea is that at first\n   * you let the parent control \"isLoaded\" state for themselves and if they do not\n   * want to do that, control it here.\n   */\n  const onReactPlayerReady: ReactPlayerWrapperProps['onReady'] = player => {\n    if (onReady) {\n      onReady(player);\n      return;\n    }\n\n    if (!isLoaded) {\n      setState(prev => ({ ...prev, isLoaded: true }));\n    }\n  };\n\n  const handleContextMenu = (e: React.MouseEvent) =>\n    componentData.disableDownload && e.preventDefault();\n\n  const getDownloadProps = () => {\n    if (\n      (isDefined(componentData?.disableDownload) && componentData.disableDownload) ||\n      (isDefined(config?.disableDownload) && config.disableDownload)\n    ) {\n      return {\n        config: {\n          file: {\n            attributes: {\n              controlsList: 'nodownload',\n            },\n          },\n        },\n      };\n    }\n\n    return {\n      config: {},\n    };\n  };\n\n  const getLightProps = () => {\n    if (!isLight) {\n      return {\n        isLight: false,\n      } as const;\n    }\n\n    return {\n      isLight: true,\n      thumbnail: state.thumbnailUrl.type === 'READY' ? state.thumbnailUrl.loadedUrl : undefined,\n    } as const;\n  };\n\n  const url = state.url.type === 'READY' ? state.url.loadedUrl : undefined;\n\n  if (!url) {\n    return null;\n  }\n\n  const isCustomVideo = !!componentData.video?.src?.id;\n  const shouldRenderIframe = isSSR() && seoMode && url;\n\n  const { autoPlay = false, playInLoop = false, showControls = true } = componentData.options || {};\n\n  return shouldRenderIframe ? (\n    <IframePlayer isCustomVideo={isCustomVideo} url={url} />\n  ) : (\n    <ReactPlayerWrapper\n      className={styles.video_player}\n      onContextMenu={handleContextMenu}\n      controls={isLoaded !== false && showControls}\n      url={url}\n      onReady={onReactPlayerReady}\n      disabled={disabled}\n      width=\"100%\"\n      height=\"100%\"\n      key={key}\n      onDuration={onDuration}\n      onProgress={progress => {\n        config.onProgress?.({ ...progress, id: nodeId });\n      }}\n      progressInterval={config.progressInterval || 1000}\n      muted={muted || autoPlay}\n      isLoaded={isLoaded || state.isLoaded}\n      autoPlay={autoPlay}\n      loop={playInLoop}\n      isCustomVideo={isCustomVideo}\n      {...getLightProps()}\n      {...getDownloadProps()}\n    />\n  );\n};\n\nconst normalizeUrl = (url: string) =>\n  url && (url.toLowerCase().indexOf('vimeo') === 0 ? 'https://' + url : url); //vimeo player needs urls prefixed with http[s]\n"],
+  "mappings": "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",
+  "names": ["ReactDOM", "React", "IframePlayer", "styles"]
 }

package/dist/cjs/plugin-video/viewer/viewer-video.js

@@ -0,0 +1,75 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var viewer_video_exports = {};
+__export(viewer_video_exports, {
+  default: () => viewer_video_default
+});
+module.exports = __toCommonJS(viewer_video_exports);
+var import_react = __toESM(require("react"));
+var import_ricos_context = require("./../../ricos-context");
+var import_viewer_figure = require("../../plugin-figure/viewer/viewer-figure");
+var import_dataHooks = require("../dataHooks");
+var import_video_viewer_scss = __toESM(require("../statics/styles/video-viewer-scss"));
+var import_types = require("../types");
+var import_video = require("./video");
+const ViewerVideo = ({
+  node,
+  nodeIndex,
+  NodeViewContainer,
+  RicosNodesRenderer
+}) => {
+  const { seoMode, config } = (0, import_react.useContext)(import_ricos_context.RicosViewerContext);
+  const { videoData } = node;
+  if (!videoData) {
+    return null;
+  }
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_viewer_figure.ViewerFigure,
+    {
+      node,
+      nodeIndex,
+      NodeViewContainer,
+      RicosNodesRenderer
+    },
+    /* @__PURE__ */ import_react.default.createElement("div", { className: import_video_viewer_scss.default.video_container, "data-hook": import_dataHooks.VIDEO_ROOT }, /* @__PURE__ */ import_react.default.createElement(
+      import_video.Video,
+      {
+        config: config[import_types.VIDEO_TYPE] || {},
+        componentData: videoData,
+        nodeId: node.id,
+        seoMode: !!seoMode,
+        isLight: true
+      }
+    ))
+  );
+};
+const VideoRenderer = ({ node, ...props }) => {
+  return /* @__PURE__ */ import_react.default.createElement(ViewerVideo, { key: node.id, node, ...props });
+};
+var viewer_video_default = VideoRenderer;
+//# sourceMappingURL=viewer-video.js.map

package/dist/cjs/plugin-video/viewer/viewer-video.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/plugin-video/viewer/viewer-video.tsx"],
+  "sourcesContent": ["import React, { useContext } from 'react';\n\nimport { RicosViewerContext } from './../../ricos-context';\nimport type { NodeViewRenderer, NodeViewRendererProps } from './../../ricos-types';\n\nimport { ViewerFigure } from '../../plugin-figure/viewer/viewer-figure';\nimport { VIDEO_ROOT } from '../dataHooks';\nimport styles from '../statics/styles/video-viewer-scss';\nimport { VIDEO_TYPE } from '../types';\nimport { Video } from './video';\n\nconst ViewerVideo = ({\n  node,\n  nodeIndex,\n  NodeViewContainer,\n  RicosNodesRenderer,\n}: NodeViewRendererProps) => {\n  const { seoMode, config } = useContext(RicosViewerContext);\n  const { videoData } = node;\n\n  if (!videoData) {\n    return null;\n  }\n\n  return (\n    <ViewerFigure\n      node={node}\n      nodeIndex={nodeIndex}\n      NodeViewContainer={NodeViewContainer}\n      RicosNodesRenderer={RicosNodesRenderer}\n    >\n      <div className={styles.video_container} data-hook={VIDEO_ROOT}>\n        <Video\n          config={config[VIDEO_TYPE] || {}}\n          componentData={videoData}\n          nodeId={node.id}\n          seoMode={!!seoMode}\n          isLight\n        />\n      </div>\n    </ViewerFigure>\n  );\n};\n\nconst VideoRenderer: NodeViewRenderer = ({ node, ...props }) => {\n  return <ViewerVideo key={node.id} node={node} {...props} />;\n};\n\nexport default VideoRenderer;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkC;AAElC,2BAAmC;AAGnC,2BAA6B;AAC7B,uBAA2B;AAC3B,+BAAmB;AACnB,mBAA2B;AAC3B,mBAAsB;AAEtB,MAAM,cAAc,CAAC;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA6B;AAC3B,QAAM,EAAE,SAAS,OAAO,QAAI,yBAAW,uCAAkB;AACzD,QAAM,EAAE,UAAU,IAAI;AAEtB,MAAI,CAAC,WAAW;AACd,WAAO;AAAA,EACT;AAEA,SACE,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEA,6BAAAA,QAAA,cAAC,SAAI,WAAW,yBAAAC,QAAO,iBAAiB,aAAW,+BACjD,6BAAAD,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ,OAAO,uBAAU,KAAK,CAAC;AAAA,QAC/B,eAAe;AAAA,QACf,QAAQ,KAAK;AAAA,QACb,SAAS,CAAC,CAAC;AAAA,QACX,SAAO;AAAA;AAAA,IACT,CACF;AAAA,EACF;AAEJ;AAEA,MAAM,gBAAkC,CAAC,EAAE,MAAM,GAAG,MAAM,MAAM;AAC9D,SAAO,6BAAAA,QAAA,cAAC,eAAY,KAAK,KAAK,IAAI,MAAa,GAAG,OAAO;AAC3D;AAEA,IAAO,uBAAQ;",
+  "names": ["React", "styles"]
+}

package/dist/cjs/pm-converters/collect.js

@@ -43,8 +43,8 @@ const collectPmConverters = (plugins) => {
 const createFromPmConverters = (converters) => {
   const fromPmNodeChildren = (node) => (node.content || []).map(fromPmNode).filter(import_ts_is_present.isDefined);
   const fromPmNode = (node) => {
-    const convert = converters[node.type] === void 0 ? unsupportedFromPm : converters[node.type];
-    return convert(node, fromPmNodeChildren);
+    const convertersArr = converters[node.type] === void 0 ? [unsupportedFromPm] : converters[node.type];
+    return convertersArr.map((convert) => convert(node, fromPmNodeChildren)).find(import_ts_is_present.isDefined);
   };
   return {
     fromPmNodeChildren,
@@ -90,11 +90,17 @@ const createToPmConverters = (converters) => {
     }
   };
 };
-const collectFromPmNodeConverters = (proseNodeConverters) => Object.fromEntries(
-  proseNodeConverters.flatMap(
-    (converter) => converter.fromPm.types.map((t) => [t, converter.fromPm.convert])
-  )
-);
+const collectFromPmNodeConverters = (proseNodeConverters) => {
+  return proseNodeConverters.reduce((acc, converter) => {
+    converter.fromPm.types.forEach((type) => {
+      if (!acc[type]) {
+        acc[type] = [];
+      }
+      acc[type].push(converter.fromPm.convert);
+    });
+    return acc;
+  }, {});
+};
 const collectFromPmMarkConverters = (proseMarkConverters) => Object.fromEntries(
   proseMarkConverters.map((converter) => [converter.fromPm.type, converter.fromPm.convert])
 );