@elice/material-exercise 1.230325.0 → 1.230418.0

package/cjs/components/shared/file-viewer/FileViewer.js

@@ -1,5 +1,8 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var reactIntl = require('react-intl');
 var blocks = require('@elice/blocks');
@@ -20,82 +23,86 @@ var FileViewerNonViewable = require('./FileViewerNonViewable.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-function _interopNamespaceDefaultOnly (e) { return Object.freeze({ __proto__: null, 'default': e }); }
-
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var FileSaver__default = /*#__PURE__*/_interopDefaultLegacy(FileSaver);
 var mime__default = /*#__PURE__*/_interopDefaultLegacy(mime);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-const AsyncFileViewerCsv = React__default["default"].lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespaceDefaultOnly(require('./FileViewerCsv.js')); }));
-const AsyncFileViewerImage = React__default["default"].lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespaceDefaultOnly(require('./FileViewerImage.js')); }));
-const AsyncFileViewerIpynb = React__default["default"].lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespaceDefaultOnly(require('./FileViewerIpynb.js')); }));
-const AsyncFileViewerText = React__default["default"].lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespaceDefaultOnly(require('./FileViewerText.js')); }));
-const StyledFileWrapper = styled__default["default"].div.withConfig({
+var AsyncFileViewerCsv = React__default["default"].lazy(function () {
+  return Promise.resolve().then(function () { return require('./FileViewerCsv.js'); });
+});
+var AsyncFileViewerImage = React__default["default"].lazy(function () {
+  return Promise.resolve().then(function () { return require('./FileViewerImage.js'); });
+});
+var AsyncFileViewerIpynb = React__default["default"].lazy(function () {
+  return Promise.resolve().then(function () { return require('./FileViewerIpynb.js'); });
+});
+var AsyncFileViewerText = React__default["default"].lazy(function () {
+  return Promise.resolve().then(function () { return require('./FileViewerText.js'); });
+});
+var StyledFileWrapper = styled__default["default"].div.withConfig({
   componentId: "sc-197v06u-0"
 })(["display:flex;justify-content:center;align-items:center;background-color:", ";width:100%;height:100%;"], designTokens.base.color.navy9);
-const StyledReadonlyBanner = styled__default["default"].div.withConfig({
+var StyledReadonlyBanner = styled__default["default"].div.withConfig({
   componentId: "sc-197v06u-1"
 })(["width:100%;padding:0.7rem;color:white;font-size:0.7rem;a{color:", ";font-weight:bold;text-decoration:underline;.eb-icon{margin-right:0.25rem;}}"], designTokens.base.color.primary5);
-
-const FileViewer = ({
-  filename,
-  fileurl,
-  locale
-}) => {
-  const [showInTextViewer, setShowInTextViewer] = React.useState(false);
+var FileViewer = function FileViewer(_ref) {
+  var filename = _ref.filename,
+    fileurl = _ref.fileurl,
+    locale = _ref.locale;
+  var _useState = React.useState(false),
+    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
+    showInTextViewer = _useState2[0],
+    setShowInTextViewer = _useState2[1];
   /**
    * Mime type of file.
    */
-
-  const mimeType = React__default["default"].useMemo(() => mime__default["default"].getType(filename || '') || filename.split('.').pop() || '', [filename]);
+  var mimeType = React__default["default"].useMemo(function () {
+    return mime__default["default"].getType(filename || '') || filename.split('.').pop() || '';
+  }, [filename]);
   /**
    * Preview component.
    */
-
-  const PreviewComponent = React__default["default"].useMemo(() => {
+  var PreviewComponent = React__default["default"].useMemo(function () {
     // Binary file which shows as text
     if (showInTextViewer) {
       return AsyncFileViewerText;
-    } // Text file
-
-
+    }
+    // Text file
     if (mimeType.startsWith('text/')) {
       // csv
       if (mimeType === 'text/csv') {
         return AsyncFileViewerCsv;
-      } // other text file
+      }
+      // other text file
       else {
         return AsyncFileViewerText;
       }
-    } // Image file
-
-
+    }
+    // Image file
     if (mimeType.startsWith('image/')) {
       return AsyncFileViewerImage;
-    } // ipynb (Jupyter Notebook)
-
-
+    }
+    // ipynb (Jupyter Notebook)
     if (mimeType === 'ipynb') {
       return AsyncFileViewerIpynb;
     }
-
     return null;
   }, [mimeType, showInTextViewer]);
   /**
    * Handle download button click.
    */
-
-  const handleDownloadClick = e => {
+  var handleDownloadClick = function handleDownloadClick(e) {
     e.preventDefault();
-
     if (!fileurl) {
       return;
     }
-
-    fetch(fileurl).then(res => res.blob()).then(blob => FileSaver__default["default"].saveAs(blob, filename)).catch(() => {
-      const win = window.open(fileurl, '_blank');
-
+    fetch(fileurl).then(function (res) {
+      return res.blob();
+    }).then(function (blob) {
+      return FileSaver__default["default"].saveAs(blob, filename);
+    }).catch(function () {
+      var win = window.open(fileurl, '_blank');
       if (win) {
         win.focus();
       }
@@ -104,13 +111,10 @@ const FileViewer = ({
   /**
    * Readonly banner.
    */
-
-
-  const renderReadonlyBanner = () => {
+  var renderReadonlyBanner = function renderReadonlyBanner() {
     if (!fileurl) {
       return null;
     }
-
     return React__default["default"].createElement(StyledReadonlyBanner, null, React__default["default"].createElement(reactIntl.FormattedMessage, {
       id: "fileViewer.readOnlyBanner.content"
     }), React__default["default"].createElement(blocks.Hspace, {
@@ -128,13 +132,11 @@ const FileViewer = ({
   /**
    * File viewer.
    */
-
-
-  const renderFileViewer = () => {
+  var renderFileViewer = function renderFileViewer() {
     // preview-able file
     if (PreviewComponent) {
       return React__default["default"].createElement(React__default["default"].Suspense, {
-        fallback: React__default["default"].createElement(ExerciseFileShimmer, null)
+        fallback: React__default["default"].createElement(ExerciseFileShimmer["default"], null)
       }, React__default["default"].createElement(blocks.Flex, {
         column: true,
         width: "100%",
@@ -143,38 +145,35 @@ const FileViewer = ({
         filename: filename,
         fileurl: fileurl
       })));
-    } // binary file
-
-
-    return React__default["default"].createElement(FileViewerNonViewable, {
+    }
+    // binary file
+    return React__default["default"].createElement(FileViewerNonViewable["default"], {
       fileurl: fileurl,
       filename: filename,
       locale: locale,
-      onTextViewerClick: () => {
+      onTextViewerClick: function onTextViewerClick() {
         setShowInTextViewer(true);
       }
     });
-  }; //
+  };
+  //
   //
   //
-
-
   return React__default["default"].createElement(StyledFileWrapper, {
     children: renderFileViewer()
   });
-}; //
+};
 //
 //
-
-
-var FileViewer$1 = (props => {
+//
+var FileViewer$1 = (function (props) {
   return React__default["default"].createElement(materialSharedUtils.MaterialIntlProvider, {
     locale: props.locale,
     phrases: {
-      en: en,
-      ko: ko
+      en: en["default"],
+      ko: ko["default"]
     }
   }, React__default["default"].createElement(FileViewer, Object.assign({}, props)));
 });
 
-module.exports = FileViewer$1;
+exports["default"] = FileViewer$1;

package/cjs/components/shared/file-viewer/FileViewerCsv.js

@@ -1,5 +1,8 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var reactIntl = require('react-intl');
 var blocks = require('@elice/blocks');
@@ -19,9 +22,9 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
 //
 //
-
-const OPTIONS_PER_PAGE = [10, 25, 50];
-const OPTIONS_DELIMITER = [{
+//
+var OPTIONS_PER_PAGE = [10, 25, 50];
+var OPTIONS_DELIMITER = [{
   char: ',',
   label: 'Comma [,]'
 }, {
@@ -36,130 +39,161 @@ const OPTIONS_DELIMITER = [{
 }, {
   char: '|',
   label: 'Vertical Bar [|]'
-}]; //
+}];
 //
 //
-
-const StyledViewer = styled__default["default"].div.withConfig({
+//
+var StyledViewer = styled__default["default"].div.withConfig({
   componentId: "sc-pyv7uu-0"
 })(["flex:1;display:flex;flex-direction:column;width:100%;height:100%;min-width:0;min-height:0;background-color:", ";"], designTokens.base.color.navy9);
-const StyledViewerTableWrap = styled__default["default"].div.withConfig({
+var StyledViewerTableWrap = styled__default["default"].div.withConfig({
   componentId: "sc-pyv7uu-1"
 })(["flex:1;overflow:auto;"]);
-const StyledViewerTable = styled__default["default"].table.withConfig({
+var StyledViewerTable = styled__default["default"].table.withConfig({
   componentId: "sc-pyv7uu-2"
 })(["border:none;border-collapse:collapse;color:", ";font-family:'Elice Digital Coding',monospace,fixed-width;th,td{border:1px solid ", ";padding:0.5rem;white-space:pre;&:first-of-type{color:", ";border-left:none;}&:last-of-type{border-right:none;}}tbody{tr:nth-child(odd){background:", ";}tr:hover{background:", ";}}"], designTokens.base.color.white, designTokens.base.color.navy5, designTokens.base.color.gray5, designTokens.base.color.navy8, designTokens.base.color.navy6);
-const StyledViewerFooter = styled__default["default"].div.withConfig({
+var StyledViewerFooter = styled__default["default"].div.withConfig({
   componentId: "sc-pyv7uu-3"
 })(["flex:0 0 auto;display:flex;justify-content:space-between;align-items:center;padding:0.5rem;"]);
-const StyledViewerFooterSelect = styled__default["default"].select.withConfig({
+var StyledViewerFooterSelect = styled__default["default"].select.withConfig({
   componentId: "sc-pyv7uu-4"
-})(["width:", "rem;border-radius:0.25rem;"], props => props.width);
-const StyledViewerFooterHr = styled__default["default"](blocks.Hr).withConfig({
+})(["width:", "rem;border-radius:0.25rem;"], function (props) {
+  return props.width;
+});
+var StyledViewerFooterHr = styled__default["default"](blocks.Hr).withConfig({
   componentId: "sc-pyv7uu-5"
-})(["height:1rem;"]); //
+})(["height:1rem;"]);
 //
 //
-
-const FileViewerCsv = ({
-  fileurl
-}) => {
-  const [csv, setCsv] = React__default["default"].useState('');
-  const [csvHeader, setCsvHeader] = React__default["default"].useState(null);
-  const [csvRecords, setCsvRecords] = React__default["default"].useState([]);
-  const [csvStatus, setCsvStatus] = React__default["default"].useState('idle');
-  const [page, setPage] = React__default["default"].useState(1);
-  const [perPage, setPerPage] = React__default["default"].useState(OPTIONS_PER_PAGE[0]);
-  const [delimiter, setDelimiter] = React__default["default"].useState(OPTIONS_DELIMITER[0].char);
-  const [isUsingHeader, setUsingHeader] = React__default["default"].useState(true);
-  const csvRecordCount = csvRecords.length + (csvHeader ? -1 : 0);
-  const maxPage = Math.ceil(csvRecordCount / perPage);
-  const tableWrapElRef = React__default["default"].useRef(null); //
+//
+var FileViewerCsv = function FileViewerCsv(_ref) {
+  var fileurl = _ref.fileurl;
+  var _React$useState = React__default["default"].useState(''),
+    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
+    csv = _React$useState2[0],
+    setCsv = _React$useState2[1];
+  var _React$useState3 = React__default["default"].useState(null),
+    _React$useState4 = _rollupPluginBabelHelpers.slicedToArray(_React$useState3, 2),
+    csvHeader = _React$useState4[0],
+    setCsvHeader = _React$useState4[1];
+  var _React$useState5 = React__default["default"].useState([]),
+    _React$useState6 = _rollupPluginBabelHelpers.slicedToArray(_React$useState5, 2),
+    csvRecords = _React$useState6[0],
+    setCsvRecords = _React$useState6[1];
+  var _React$useState7 = React__default["default"].useState('idle'),
+    _React$useState8 = _rollupPluginBabelHelpers.slicedToArray(_React$useState7, 2),
+    csvStatus = _React$useState8[0],
+    setCsvStatus = _React$useState8[1];
+  var _React$useState9 = React__default["default"].useState(1),
+    _React$useState10 = _rollupPluginBabelHelpers.slicedToArray(_React$useState9, 2),
+    page = _React$useState10[0],
+    setPage = _React$useState10[1];
+  var _React$useState11 = React__default["default"].useState(OPTIONS_PER_PAGE[0]),
+    _React$useState12 = _rollupPluginBabelHelpers.slicedToArray(_React$useState11, 2),
+    perPage = _React$useState12[0],
+    setPerPage = _React$useState12[1];
+  var _React$useState13 = React__default["default"].useState(OPTIONS_DELIMITER[0].char),
+    _React$useState14 = _rollupPluginBabelHelpers.slicedToArray(_React$useState13, 2),
+    delimiter = _React$useState14[0],
+    setDelimiter = _React$useState14[1];
+  var _React$useState15 = React__default["default"].useState(true),
+    _React$useState16 = _rollupPluginBabelHelpers.slicedToArray(_React$useState15, 2),
+    isUsingHeader = _React$useState16[0],
+    setUsingHeader = _React$useState16[1];
+  var csvRecordCount = csvRecords.length + (csvHeader ? -1 : 0);
+  var maxPage = Math.ceil(csvRecordCount / perPage);
+  var tableWrapElRef = React__default["default"].useRef(null);
+  //
   // Fetch csv file
   //
-
-  React__default["default"].useEffect(() => {
+  React__default["default"].useEffect(function () {
     if (!fileurl) {
       setCsvRecords([]);
       return;
     }
-
-    const abortCtrl = new AbortController();
+    var abortCtrl = new AbortController();
     setCsvStatus('pending');
     fetch(fileurl, {
       signal: abortCtrl.signal
-    }).then(res => res.text()).then(setCsv).then(() => setCsvStatus('resolved')).catch(err => {
+    }).then(function (res) {
+      return res.text();
+    }).then(setCsv).then(function () {
+      return setCsvStatus('resolved');
+    }).catch(function (err) {
       if (err.name === 'AbortError') {
         return;
       }
-
       setCsvRecords([]);
       setCsvStatus('rejected');
     });
-    return () => {
+    return function () {
       abortCtrl.abort();
     };
-  }, [fileurl]); //
+  }, [fileurl]);
+  //
   // Parse csv file and save as records
   //
-
-  React__default["default"].useEffect(() => setCsvRecords(csv.split('\n').filter(Boolean).map(row => row.split(delimiter))), [csv, delimiter]); //
+  React__default["default"].useEffect(function () {
+    return setCsvRecords(csv.split('\n').filter(Boolean).map(function (row) {
+      return row.split(delimiter);
+    }));
+  }, [csv, delimiter]);
+  //
   // Set CSV header.
   //
-
-  React__default["default"].useEffect(() => setCsvHeader(isUsingHeader ? csvRecords[0] : null), [csvRecords, isUsingHeader]); //
+  React__default["default"].useEffect(function () {
+    return setCsvHeader(isUsingHeader ? csvRecords[0] : null);
+  }, [csvRecords, isUsingHeader]);
+  //
   // Scroll to top when page changes.
   //
-
-  React__default["default"].useEffect(() => {
+  React__default["default"].useEffect(function () {
     var _a;
-
     return (_a = tableWrapElRef.current) === null || _a === void 0 ? void 0 : _a.scrollTo(0, 0);
   }, [page]);
   /**
    *
    */
-
-  const renderViewerTableThead = () => {
+  var renderViewerTableThead = function renderViewerTableThead() {
     if (!csvHeader) {
       return null;
     }
-
-    const colunms = ['', ...csvHeader];
-    return React__default["default"].createElement("thead", null, React__default["default"].createElement("tr", null, colunms.map((col, colIdx) => React__default["default"].createElement("th", {
-      key: colIdx
-    }, col))));
+    var colunms = [''].concat(_rollupPluginBabelHelpers.toConsumableArray(csvHeader));
+    return React__default["default"].createElement("thead", null, React__default["default"].createElement("tr", null, colunms.map(function (col, colIdx) {
+      return React__default["default"].createElement("th", {
+        key: colIdx
+      }, col);
+    })));
   };
   /**
    *
    */
-
-
-  const renderViewerTableTbody = () => {
-    const start = (page - 1) * perPage;
-    const end = page * perPage;
-    const records = csvRecords.slice(csvHeader ? 1 : 0).slice(start, end);
-    return React__default["default"].createElement("tbody", null, records.map((row, rowIdx) => {
-      const curRecordNo = start + rowIdx + 1;
-      const curRow = [curRecordNo, ...row];
+  var renderViewerTableTbody = function renderViewerTableTbody() {
+    var start = (page - 1) * perPage;
+    var end = page * perPage;
+    var records = csvRecords.slice(csvHeader ? 1 : 0).slice(start, end);
+    return React__default["default"].createElement("tbody", null, records.map(function (row, rowIdx) {
+      var curRecordNo = start + rowIdx + 1;
+      var curRow = [curRecordNo].concat(_rollupPluginBabelHelpers.toConsumableArray(row));
       return React__default["default"].createElement("tr", {
         key: curRecordNo
-      }, curRow.map((col, colIdx) => React__default["default"].createElement("td", {
-        key: colIdx,
-        style: {
-          // test whether the column is number, and align right
-          textAlign: // eslint-disable-next-line no-self-compare
-          +col === +col ? 'right' : 'left'
-        }
-      }, col)));
+      }, curRow.map(function (col, colIdx) {
+        return React__default["default"].createElement("td", {
+          key: colIdx,
+          style: {
+            // test whether the column is number, and align right
+            textAlign:
+            // eslint-disable-next-line no-self-compare
+            +col === +col ? 'right' : 'left'
+          }
+        }, col);
+      }));
     }));
   };
   /**
    *
    */
-
-
-  const renderViewerTable = () => {
+  var renderViewerTable = function renderViewerTable() {
     return React__default["default"].createElement(StyledViewerTableWrap, {
       ref: tableWrapElRef
     }, React__default["default"].createElement(StyledViewerTable, null, renderViewerTableThead(), renderViewerTableTbody()));
@@ -167,9 +201,7 @@ const FileViewerCsv = ({
   /**
    *
    */
-
-
-  const renderViewerFooterPagination = () => {
+  var renderViewerFooterPagination = function renderViewerFooterPagination() {
     return React__default["default"].createElement(blocks.Flex, {
       align: "center"
     }, React__default["default"].createElement(blocks.Text, {
@@ -185,7 +217,9 @@ const FileViewerCsv = ({
       role: "navy3",
       size: "nano",
       disabled: page <= 1,
-      onClick: () => setPage(1)
+      onClick: function onClick() {
+        return setPage(1);
+      }
     }), React__default["default"].createElement(blocks.Hspace, {
       width: 0.25
     }), React__default["default"].createElement(blocks.IconButton, {
@@ -193,7 +227,11 @@ const FileViewerCsv = ({
       role: "navy3",
       size: "nano",
       disabled: page <= 1,
-      onClick: () => setPage(prevPage => prevPage - 1)
+      onClick: function onClick() {
+        return setPage(function (prevPage) {
+          return prevPage - 1;
+        });
+      }
     }), React__default["default"].createElement(blocks.Hspace, {
       width: 0.5
     }), React__default["default"].createElement(blocks.Text, {
@@ -206,7 +244,11 @@ const FileViewerCsv = ({
       role: "navy3",
       size: "nano",
       disabled: page >= maxPage,
-      onClick: () => setPage(prevPage => prevPage + 1)
+      onClick: function onClick() {
+        return setPage(function (prevPage) {
+          return prevPage + 1;
+        });
+      }
     }), React__default["default"].createElement(blocks.Hspace, {
       width: 0.25
     }), React__default["default"].createElement(blocks.IconButton, {
@@ -214,15 +256,15 @@ const FileViewerCsv = ({
       role: "navy3",
       size: "nano",
       disabled: page >= maxPage,
-      onClick: () => setPage(maxPage)
+      onClick: function onClick() {
+        return setPage(maxPage);
+      }
     })));
   };
   /**
    *
    */
-
-
-  const renderViewerFooterSettings = () => {
+  var renderViewerFooterSettings = function renderViewerFooterSettings() {
     return React__default["default"].createElement(blocks.Flex, {
       align: "center"
     }, React__default["default"].createElement(blocks.Flex, {
@@ -253,13 +295,16 @@ const FileViewerCsv = ({
     }), React__default["default"].createElement(StyledViewerFooterSelect, {
       width: 7.5,
       value: delimiter,
-      onChange: e => setDelimiter(e.target.value)
-    }, OPTIONS_DELIMITER.map(({
-      char,
-      label
-    }) => React__default["default"].createElement("option", {
-      value: char
-    }, label)))), React__default["default"].createElement(StyledViewerFooterHr, {
+      onChange: function onChange(e) {
+        return setDelimiter(e.target.value);
+      }
+    }, OPTIONS_DELIMITER.map(function (_ref2) {
+      var char = _ref2.char,
+        label = _ref2.label;
+      return React__default["default"].createElement("option", {
+        value: char
+      }, label);
+    }))), React__default["default"].createElement(StyledViewerFooterHr, {
       vertical: true,
       color: designTokens.base.color.navy5
     }), React__default["default"].createElement(blocks.Flex, {
@@ -274,32 +319,31 @@ const FileViewerCsv = ({
     }), React__default["default"].createElement(StyledViewerFooterSelect, {
       width: 3,
       value: perPage,
-      onChange: e => setPerPage(Number(e.target.value))
-    }, OPTIONS_PER_PAGE.map(perPage => React__default["default"].createElement("option", {
-      value: perPage
-    }, perPage)))));
+      onChange: function onChange(e) {
+        return setPerPage(Number(e.target.value));
+      }
+    }, OPTIONS_PER_PAGE.map(function (perPage) {
+      return React__default["default"].createElement("option", {
+        value: perPage
+      }, perPage);
+    }))));
   };
   /**
    *
    */
-
-
-  const renderViewerFooter = () => {
+  var renderViewerFooter = function renderViewerFooter() {
     return React__default["default"].createElement(StyledViewerFooter, null, renderViewerFooterPagination(), renderViewerFooterSettings());
-  }; //
+  };
+  //
   //
   //
-
-
   if (csvStatus === 'idle' || csvStatus === 'pending') {
-    return React__default["default"].createElement(ExerciseFileShimmer, null);
+    return React__default["default"].createElement(ExerciseFileShimmer["default"], null);
   }
-
   if (csvStatus === 'rejected') {
     return React__default["default"].createElement("div", null, "error");
   }
-
   return React__default["default"].createElement(StyledViewer, null, renderViewerTable(), renderViewerFooter());
 };
 
-module.exports = FileViewerCsv;
+exports["default"] = FileViewerCsv;

package/cjs/components/shared/file-viewer/FileViewerImage.js

@@ -1,5 +1,7 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 var React = require('react');
 var blocks = require('@elice/blocks');
 var styled = require('styled-components');
@@ -14,17 +16,14 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-const StyledImage = styled__default["default"].img.withConfig({
+var StyledImage = styled__default["default"].img.withConfig({
   componentId: "sc-1bnx7lz-0"
 })(["max-width:100%;max-height:100%;height:auto;width:auto;"]);
-
-const FileViewerImage = ({
-  fileurl
-}) => {
+var FileViewerImage = function FileViewerImage(_ref) {
+  var fileurl = _ref.fileurl;
   if (!fileurl) {
-    return React__default["default"].createElement(ExerciseFileShimmer, null);
+    return React__default["default"].createElement(ExerciseFileShimmer["default"], null);
   }
-
   return React__default["default"].createElement(blocks.Flex, {
     align: "center",
     justify: "center",
@@ -36,4 +35,4 @@ const FileViewerImage = ({
   }));
 };
 
-module.exports = FileViewerImage;
+exports["default"] = FileViewerImage;