wiki
/
weseek__growi
зеркало из https://github.com/weseek/growi


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
							import type { IGraphViewerGlobal } from '@growi/remark-drawio';
import Head from 'next/head';
import { type JSX, useCallback } from 'react';

import { generateViewerMinJsUrl } from './use-viewer-min-js-url';

declare global {
  // eslint-disable-next-line vars-on-top, no-var
  var GraphViewer: IGraphViewerGlobal;
}

type Props = {
  drawioUri: string;
};

export const DrawioViewerScript = ({ drawioUri }: Props): JSX.Element => {
  const loadedHandler = useCallback(() => {
    // disable useResizeSensor and checkVisibleState
    //   for preventing resize event by viewer-static.min.js
    GraphViewer.useResizeSensor = false;
    GraphViewer.prototype.checkVisibleState = false;

    // Set responsive option.
    // refs: https://github.com/jgraph/drawio/blob/v13.9.1/src/main/webapp/js/diagramly/GraphViewer.js#L89-L95
    // GraphViewer.prototype.responsive = true;

    // Set z-index ($zindex-dropdown + 200) for lightbox.
    // 'lightbox' is like a modal dialog that appears when click on a drawio diagram.
    // z-index refs: https://github.com/twbs/bootstrap/blob/v4.6.2/scss/_variables.scss#L681
    GraphViewer.prototype.lightboxZIndex = 1200;
    GraphViewer.prototype.toolbarZIndex = 1200;

    GraphViewer.processElements();
  }, []);

  // Return empty element if drawioUri is not provided to avoid Invalid URL error
  if (!drawioUri) {
    return <></>;
  }

  const viewerMinJsSrc = generateViewerMinJsUrl(drawioUri);

  return (
    <Head>
      <script
        type="text/javascript"
        async
        src={viewerMinJsSrc}
        onLoad={loadedHandler}
      />
    </Head>
  );
};