@ibiz-template-plugin/ibiz-file-previewer 0.0.25 → 0.0.27

package/dist/index.es.js

@@ -917,6 +917,8 @@ var ImageMode = /* @__PURE__ */ ((ImageMode2) => {
 var FileType = /* @__PURE__ */ ((FileType2) => {
   FileType2["HTML"] = "html";
   FileType2["MD"] = "md";
+  FileType2["YAML"] = "yaml";
+  FileType2["YML"] = "yml";
   FileType2["TXT"] = "txt";
   FileType2["JSON"] = "json";
   FileType2["XML"] = "xml";
@@ -940,6 +942,10 @@ var FileType = /* @__PURE__ */ ((FileType2) => {
   FileType2["JPEG"] = "jpeg";
   FileType2["ICO"] = "ico";
   FileType2["CSV"] = "csv";
+  FileType2["VUE"] = "vue";
+  FileType2["TSV"] = "tsv";
+  FileType2["MP4"] = "mp4";
+  FileType2["PHP"] = "php";
   FileType2["UNKNOWN"] = "UNKNOWN";
   return FileType2;
 })(FileType || {});
@@ -984,24 +990,47 @@ const FileTypeEngineMap = /* @__PURE__ */ new Map([
   ]],
   // ET类型文件
   // ------TXT类型文件服务端暂未支持START------
-  // [FileType.TXT, [EngineType.TXT]], // TXT类型文件
-  // [FileType.JSON, [EngineType.TXT]], // JSON类型文件
-  // [FileType.XML, [EngineType.TXT]], // XML类型文件
-  ["txt", [
-    "MD"
-    /* MD */
+  ["yaml", [
+    "TXT"
+    /* TXT */
   ]],
-  // TXT类型文件
+  // YAML类型文件
+  ["yml", [
+    "TXT"
+    /* TXT */
+  ]],
+  // YML类型文件
   ["json", [
-    "MD"
-    /* MD */
+    "TXT"
+    /* TXT */
   ]],
   // JSON类型文件
   ["xml", [
+    "TXT"
+    /* TXT */
+  ]],
+  // XML类型文件
+  ["vue", [
+    "TXT"
+    /* TXT */
+  ]],
+  // VUE类型文件
+  ["tsv", [
+    "TXT"
+    /* TXT */
+  ]],
+  // TSV类型文件
+  ["php", [
+    "TXT"
+    /* TXT */
+  ]],
+  // PHP类型文件
+  // [FileType.TXT, [EngineType.TXT]], // TXT类型文件
+  ["txt", [
     "MD"
     /* MD */
   ]],
-  // XML类型文件
+  // TXT类型文件
   // ------TXT类型文件服务端暂未支持END------
   ["pdf", [
     "PDF"
@@ -1079,8 +1108,13 @@ const FileTypeEngineMap = /* @__PURE__ */ new Map([
   ["ico", [
     "IMG"
     /* IMG */
-  ]]
+  ]],
   // ICO类型文件
+  ["mp4", [
+    "IMG"
+    /* IMG */
+  ]]
+  // MP4类型文件
 ]);
 const contentWidth = 800;
 const imgModes = [
@@ -1163,6 +1197,9 @@ const fileNameToFileType = (fileName) => {
     case "svg":
       fileType = FileType.SVG;
       break;
+    case "mp4":
+      fileType = FileType.MP4;
+      break;
     case "bmp":
       fileType = FileType.BMP;
       break;
@@ -1178,6 +1215,21 @@ const fileNameToFileType = (fileName) => {
     case "csv":
       fileType = FileType.CSV;
       break;
+    case "yaml":
+      fileType = FileType.YAML;
+      break;
+    case "yml":
+      fileType = FileType.YML;
+      break;
+    case "vue":
+      fileType = FileType.VUE;
+      break;
+    case "tsv":
+      fileType = FileType.TSV;
+      break;
+    case "php":
+      fileType = FileType.PHP;
+      break;
     default:
       fileType = FileType.UNKNOWN;
   }
@@ -1241,6 +1293,9 @@ const copyTextToClipboard = async (text) => {
     return fallbackCopyTextToClipboard(text);
   }
 };
+const isObject = (obj) => {
+  return toString.call(obj) === "[object Object]";
+};
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
 function getDefaultExportFromCjs(x2) {
   return x2 && x2.__esModule && Object.prototype.hasOwnProperty.call(x2, "default") ? x2["default"] : x2;
@@ -2268,18 +2323,38 @@ const FilePreviewImage = (props) => {
     if (controller.state.value.fileType === FileType.SVG)
       props.onInitialization();
   }, []);
-  return /* @__PURE__ */ u("div", { className: "file-preview-image ".concat(controller.state.value.theme), children: [
-    controller.state.value.fileType === FileType.SVG ? /* @__PURE__ */ u(
-      "div",
-      {
-        className: "svg-container",
-        style: imgStyle.value,
-        dangerouslySetInnerHTML: {
-          __html: controller.state.value.content
-        },
-        onMouseDown: (evt) => controller.handleMouseDown(evt)
-      }
-    ) : /* @__PURE__ */ u(
+  const renderContent = () => {
+    if (controller.state.value.fileType === FileType.SVG) {
+      return /* @__PURE__ */ u(
+        "div",
+        {
+          className: "svg-container",
+          style: imgStyle.value,
+          dangerouslySetInnerHTML: {
+            __html: controller.state.value.content
+          },
+          onMouseDown: (evt) => controller.handleMouseDown(evt)
+        }
+      );
+    }
+    if (controller.state.value.fileType === FileType.MP4) {
+      return /* @__PURE__ */ u(
+        "video",
+        {
+          controls: true,
+          onLoadedData: () => props.onInitialization(),
+          onError: () => props.onInitialization(),
+          children: /* @__PURE__ */ u(
+            "source",
+            {
+              src: controller.state.value.content,
+              type: "video/mp4"
+            }
+          )
+        }
+      );
+    }
+    return /* @__PURE__ */ u(
       "img",
       {
         style: imgStyle.value,
@@ -2288,7 +2363,10 @@ const FilePreviewImage = (props) => {
         onError: () => props.onInitialization(),
         onMouseDown: (evt) => controller.handleMouseDown(evt)
       }
-    ),
+    );
+  };
+  return /* @__PURE__ */ u("div", { className: "file-preview-image ".concat(controller.state.value.theme), children: [
+    renderContent(),
     /* @__PURE__ */ u(Teleport, { to: "#".concat(controller.controlsId), children: /* @__PURE__ */ u("div", { className: "image-toolbar-container", children: [
       /* @__PURE__ */ u(
         "button",
@@ -18789,14 +18867,228 @@ function xml(hljs) {
     ]
   };
 }
+function yaml(hljs) {
+  const LITERALS = "true false yes no null";
+  const URI_CHARACTERS = "[\\w#;/?:@&=+$,.~*'()[\\]]+";
+  const KEY = {
+    className: "attr",
+    variants: [
+      // added brackets support and special char support
+      { begin: /[\w*@][\w*@ :()\./-]*:(?=[ \t]|$)/ },
+      {
+        // double quoted keys - with brackets and special char support
+        begin: /"[\w*@][\w*@ :()\./-]*":(?=[ \t]|$)/
+      },
+      {
+        // single quoted keys - with brackets and special char support
+        begin: /'[\w*@][\w*@ :()\./-]*':(?=[ \t]|$)/
+      }
+    ]
+  };
+  const TEMPLATE_VARIABLES = {
+    className: "template-variable",
+    variants: [
+      {
+        // jinja templates Ansible
+        begin: /\{\{/,
+        end: /\}\}/
+      },
+      {
+        // Ruby i18n
+        begin: /%\{/,
+        end: /\}/
+      }
+    ]
+  };
+  const SINGLE_QUOTE_STRING = {
+    className: "string",
+    relevance: 0,
+    begin: /'/,
+    end: /'/,
+    contains: [
+      {
+        match: /''/,
+        scope: "char.escape",
+        relevance: 0
+      }
+    ]
+  };
+  const STRING = {
+    className: "string",
+    relevance: 0,
+    variants: [
+      {
+        begin: /"/,
+        end: /"/
+      },
+      { begin: /\S+/ }
+    ],
+    contains: [
+      hljs.BACKSLASH_ESCAPE,
+      TEMPLATE_VARIABLES
+    ]
+  };
+  const CONTAINER_STRING = hljs.inherit(STRING, { variants: [
+    {
+      begin: /'/,
+      end: /'/,
+      contains: [
+        {
+          begin: /''/,
+          relevance: 0
+        }
+      ]
+    },
+    {
+      begin: /"/,
+      end: /"/
+    },
+    { begin: /[^\s,{}[\]]+/ }
+  ] });
+  const DATE_RE = "[0-9]{4}(-[0-9][0-9]){0,2}";
+  const TIME_RE = "([Tt \\t][0-9][0-9]?(:[0-9][0-9]){2})?";
+  const FRACTION_RE = "(\\.[0-9]*)?";
+  const ZONE_RE = "([ \\t])*(Z|[-+][0-9][0-9]?(:[0-9][0-9])?)?";
+  const TIMESTAMP = {
+    className: "number",
+    begin: "\\b" + DATE_RE + TIME_RE + FRACTION_RE + ZONE_RE + "\\b"
+  };
+  const VALUE_CONTAINER = {
+    end: ",",
+    endsWithParent: true,
+    excludeEnd: true,
+    keywords: LITERALS,
+    relevance: 0
+  };
+  const OBJECT = {
+    begin: /\{/,
+    end: /\}/,
+    contains: [VALUE_CONTAINER],
+    illegal: "\\n",
+    relevance: 0
+  };
+  const ARRAY = {
+    begin: "\\[",
+    end: "\\]",
+    contains: [VALUE_CONTAINER],
+    illegal: "\\n",
+    relevance: 0
+  };
+  const MODES2 = [
+    KEY,
+    {
+      className: "meta",
+      begin: "^---\\s*$",
+      relevance: 10
+    },
+    {
+      // multi line string
+      // Blocks start with a | or > followed by a newline
+      //
+      // Indentation of subsequent lines must be the same to
+      // be considered part of the block
+      className: "string",
+      begin: "[\\|>]([1-9]?[+-])?[ ]*\\n( +)[^ ][^\\n]*\\n(\\2[^\\n]+\\n?)*"
+    },
+    {
+      // Ruby/Rails erb
+      begin: "<%[%=-]?",
+      end: "[%-]?%>",
+      subLanguage: "ruby",
+      excludeBegin: true,
+      excludeEnd: true,
+      relevance: 0
+    },
+    {
+      // named tags
+      className: "type",
+      begin: "!\\w+!" + URI_CHARACTERS
+    },
+    // https://yaml.org/spec/1.2/spec.html#id2784064
+    {
+      // verbatim tags
+      className: "type",
+      begin: "!<" + URI_CHARACTERS + ">"
+    },
+    {
+      // primary tags
+      className: "type",
+      begin: "!" + URI_CHARACTERS
+    },
+    {
+      // secondary tags
+      className: "type",
+      begin: "!!" + URI_CHARACTERS
+    },
+    {
+      // fragment id &ref
+      className: "meta",
+      begin: "&" + hljs.UNDERSCORE_IDENT_RE + "$"
+    },
+    {
+      // fragment reference *ref
+      className: "meta",
+      begin: "\\*" + hljs.UNDERSCORE_IDENT_RE + "$"
+    },
+    {
+      // array listing
+      className: "bullet",
+      // TODO: remove |$ hack when we have proper look-ahead support
+      begin: "-(?=[ ]|$)",
+      relevance: 0
+    },
+    hljs.HASH_COMMENT_MODE,
+    {
+      beginKeywords: LITERALS,
+      keywords: { literal: LITERALS }
+    },
+    TIMESTAMP,
+    // numbers are any valid C-style number that
+    // sit isolated from other words
+    {
+      className: "number",
+      begin: hljs.C_NUMBER_RE + "\\b",
+      relevance: 0
+    },
+    OBJECT,
+    ARRAY,
+    SINGLE_QUOTE_STRING,
+    STRING
+  ];
+  const VALUE_MODES = [...MODES2];
+  VALUE_MODES.pop();
+  VALUE_MODES.push(CONTAINER_STRING);
+  VALUE_CONTAINER.contains = VALUE_MODES;
+  return {
+    name: "YAML",
+    case_insensitive: true,
+    aliases: ["yml"],
+    contains: MODES2
+  };
+}
 HighlightJS.registerLanguage("xml", xml);
 HighlightJS.registerLanguage("json", json);
+HighlightJS.registerLanguage("yaml", yaml);
 const FilePreviewText = (props) => {
   const c2 = props.controller;
   const previewRef = A(null);
   y$1(() => {
     try {
-      previewRef.current.textContent = c2.state.value.content;
+      if (c2.state.value.fileType === FileType.JSON) {
+        try {
+          let jsonObject;
+          if (isObject(c2.state.value.content) || Array.isArray(c2.state.value.content)) {
+            jsonObject = c2.state.value.content;
+          } else {
+            jsonObject = JSON.parse(c2.state.value.content);
+          }
+          previewRef.current.textContent = JSON.stringify(jsonObject, null, 2);
+        } catch (error2) {
+          previewRef.current.textContent = c2.state.value.content;
+        }
+      } else {
+        previewRef.current.textContent = c2.state.value.content;
+      }
       HighlightJS.highlightElement(previewRef.current);
     } catch (error2) {
       console.error(error2);