@lobehub/ui 1.148.0 → 1.148.2

package/es/ChatItem/components/MessageContent.d.ts

@@ -1,8 +1,10 @@
 import { type ReactNode } from 'react';
 import { ChatItemProps } from "..";
+import type { MarkdownProps } from "../../Markdown";
 export interface MessageContentProps {
     editing?: ChatItemProps['editing'];
     fontSize?: number;
+    markdownProps?: Omit<MarkdownProps, 'className' | 'style' | 'children'>;
     message?: ReactNode;
     messageExtra?: ChatItemProps['messageExtra'];
     onChange?: ChatItemProps['onChange'];

package/es/ChatItem/components/MessageContent.js

@@ -17,7 +17,8 @@ var MessageContent = /*#__PURE__*/memo(function (_ref) {
     type = _ref.type,
     primary = _ref.primary,
     onDoubleClick = _ref.onDoubleClick,
-    fontSize = _ref.fontSize;
+    fontSize = _ref.fontSize,
+    markdownProps = _ref.markdownProps;
   var _useStyles = useStyles({
       editing: editing,
       placement: placement,
@@ -36,6 +37,7 @@ var MessageContent = /*#__PURE__*/memo(function (_ref) {
     editing: editing,
     fontSize: fontSize,
     fullFeaturedCodeBlock: true,
+    markdownProps: markdownProps,
     onChange: onChange,
     onEditingChange: onEditingChange,
     openModal: mobile ? editing : undefined,

package/es/ChatItem/index.js

@@ -2,7 +2,7 @@
 
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["avatarAddon", "onAvatarClick", "avatarProps", "actions", "className", "primary", "loading", "message", "placement", "type", "avatar", "error", "showTitle", "time", "editing", "onChange", "onEditingChange", "messageExtra", "renderMessage", "text", "errorMessage", "onDoubleClick", "fontSize", "aboveMessage", "belowMessage"];
+var _excluded = ["avatarAddon", "onAvatarClick", "avatarProps", "actions", "className", "primary", "loading", "message", "placement", "type", "avatar", "error", "showTitle", "time", "editing", "onChange", "onEditingChange", "messageExtra", "renderMessage", "text", "errorMessage", "onDoubleClick", "fontSize", "aboveMessage", "belowMessage", "markdownProps"];
 import { useResponsive } from 'antd-style';
 import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
@@ -44,6 +44,7 @@ var ChatItem = /*#__PURE__*/memo(function (_ref) {
     fontSize = _ref.fontSize,
     aboveMessage = _ref.aboveMessage,
     belowMessage = _ref.belowMessage,
+    markdownProps = _ref.markdownProps,
     rest = _objectWithoutProperties(_ref, _excluded);
   var _useResponsive = useResponsive(),
     mobile = _useResponsive.mobile;
@@ -90,6 +91,7 @@ var ChatItem = /*#__PURE__*/memo(function (_ref) {
         }) : /*#__PURE__*/_jsx(MessageContent, {
           editing: editing,
           fontSize: fontSize,
+          markdownProps: markdownProps,
           message: message,
           messageExtra: messageExtra,
           onChange: onChange,

package/es/ChatItem/type.d.ts

@@ -3,6 +3,7 @@ import { FlexboxProps } from 'react-layout-kit';
 import { AlertProps } from "../Alert";
 import { AvatarProps } from "../Avatar";
 import { EditableMessageProps } from "../EditableMessage";
+import type { MarkdownProps } from "../Markdown";
 import { DivProps, MetaData } from "../types";
 export interface ChatItemProps extends Omit<FlexboxProps, 'children' | 'onChange'> {
     aboveMessage?: ReactNode;
@@ -31,6 +32,7 @@ export interface ChatItemProps extends Omit<FlexboxProps, 'children' | 'onChange
      * @description Whether the chat item is in loading state
      */
     loading?: boolean;
+    markdownProps?: Omit<MarkdownProps, 'className' | 'style' | 'children'>;
     /**
      * @description The message content of the chat item
      */

package/es/EditableMessage/index.d.ts

@@ -1,4 +1,5 @@
 import { CSSProperties } from 'react';
+import { type MarkdownProps } from "../Markdown";
 import { type MessageInputProps } from "../MessageInput";
 import { type MessageModalProps } from "../MessageModal";
 export interface EditableMessageProps {
@@ -26,6 +27,7 @@ export interface EditableMessageProps {
     fullFeaturedCodeBlock?: boolean;
     height?: MessageInputProps['height'];
     inputType?: MessageInputProps['type'];
+    markdownProps?: Omit<MarkdownProps, 'className' | 'style' | 'children'>;
     model?: {
         extra?: MessageModalProps['extra'];
         footer?: MessageModalProps['footer'];

package/es/EditableMessage/index.js

@@ -29,7 +29,8 @@ var EditableMessage = /*#__PURE__*/memo(function (_ref) {
     text = _ref.text,
     fullFeaturedCodeBlock = _ref.fullFeaturedCodeBlock,
     model = _ref.model,
-    fontSize = _ref.fontSize;
+    fontSize = _ref.fontSize,
+    markdownProps = _ref.markdownProps;
   var _useControlledState = useControlledState(false, {
       onChange: onEditingChange,
       value: editing
@@ -68,16 +69,17 @@ var EditableMessage = /*#__PURE__*/memo(function (_ref) {
   });
   if (!value && showEditWhenEmpty) return input;
   return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [!expand && isEdit ? input : /*#__PURE__*/_jsx(Markdown, {
+    children: [!expand && isEdit ? input : /*#__PURE__*/_jsx(Markdown, _objectSpread(_objectSpread({
       className: classNames === null || classNames === void 0 ? void 0 : classNames.markdown,
       fontSize: fontSize,
       fullFeaturedCodeBlock: fullFeaturedCodeBlock,
       style: _objectSpread({
         height: isAutoSize ? 'unset' : height
       }, stylesProps === null || stylesProps === void 0 ? void 0 : stylesProps.markdown),
-      variant: 'chat',
+      variant: 'chat'
+    }, markdownProps), {}, {
       children: value || placeholder || ''
-    }), expand && /*#__PURE__*/_jsx(MessageModal, {
+    })), expand && /*#__PURE__*/_jsx(MessageModal, {
       editing: isEdit,
       extra: model === null || model === void 0 ? void 0 : model.extra,
       footer: model === null || model === void 0 ? void 0 : model.footer,

package/es/FileTypeIcon/index.d.ts

@@ -1,9 +1,10 @@
-/// <reference types="react" />
+import { ReactNode } from 'react';
 import { DivProps, SvgProps } from "../types";
 type IconProps = SvgProps & DivProps;
 export interface FileTypeIconProps extends IconProps {
     color?: string;
     filetype?: string;
+    icon?: ReactNode;
     size?: number;
     type?: 'file' | 'folder';
     variant?: 'color' | 'mono';

package/es/FileTypeIcon/index.js

@@ -2,36 +2,51 @@
 
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["color", "filetype", "type", "size", "style", "variant"];
-import { useTheme } from 'antd-style';
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+var _excluded = ["icon", "color", "filetype", "type", "size", "style", "variant", "className"];
+var _templateObject, _templateObject2;
+import { createStyles } from 'antd-style';
 import { memo, useMemo } from 'react';
+import { Center } from 'react-layout-kit';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var FileTypeIcon = /*#__PURE__*/memo(function (_ref) {
-  var color = _ref.color,
-    filetype = _ref.filetype,
-    _ref$type = _ref.type,
-    type = _ref$type === void 0 ? 'file' : _ref$type,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 48 : _ref$size,
-    style = _ref.style,
-    variant = _ref.variant,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var theme = useTheme();
+var useStyles = createStyles(function (_ref) {
+  var css = _ref.css;
+  return {
+    container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      position: relative;\n    "]))),
+    icon: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      position: relative;\n      flex: none;\n      line-height: 1;\n    "])))
+  };
+});
+var FileTypeIcon = /*#__PURE__*/memo(function (_ref2) {
+  var icon = _ref2.icon,
+    color = _ref2.color,
+    filetype = _ref2.filetype,
+    _ref2$type = _ref2.type,
+    type = _ref2$type === void 0 ? 'file' : _ref2$type,
+    _ref2$size = _ref2.size,
+    size = _ref2$size === void 0 ? 48 : _ref2$size,
+    style = _ref2.style,
+    variant = _ref2.variant,
+    className = _ref2.className,
+    rest = _objectWithoutProperties(_ref2, _excluded);
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles,
+    theme = _useStyles.theme;
+  var filetypeShort = filetype && filetype.length > 4 ? filetype.slice(0, 4) : filetype;
   var fontSize = useMemo(function () {
-    if (filetype && filetype.length > 3) {
-      return 24 / (4 + (filetype.length - 3));
+    if (filetypeShort && filetypeShort.length > 3) {
+      return 24 / (4 + (filetypeShort.length - 3));
     }
     return 6;
-  }, [filetype]);
+  }, [filetypeShort]);
   var isMono = variant === 'mono';
   var iconColor = isMono ? theme.isDarkMode ? theme.colorFill : theme.colorBgContainer : color || theme.geekblue;
-  if (type === 'file') return /*#__PURE__*/_jsxs("svg", _objectSpread(_objectSpread({
+  var content;
+  content = type === 'file' ? /*#__PURE__*/_jsxs("svg", _objectSpread(_objectSpread({
+    className: cx(styles.icon, !icon && className),
     height: size,
-    style: _objectSpread({
-      flex: 'none',
-      lineHeight: 1
-    }, style),
+    style: icon ? undefined : style,
     viewBox: "0 0 24 24",
     width: size,
     xmlns: "http://www.w3.org/2000/svg"
@@ -43,27 +58,24 @@ var FileTypeIcon = /*#__PURE__*/memo(function (_ref) {
       d: "M14 2l6 6h-4a2 2 0 01-2-2V2z",
       fill: isMono ? theme.colorFill : '#fff',
       fillOpacity: ".5"
-    }), filetype && /*#__PURE__*/_jsx("text", {
+    }), filetypeShort && /*#__PURE__*/_jsx("text", {
       fill: isMono ? theme.colorTextSecondary : '#fff',
       fontSize: fontSize,
       fontWeight: "bold",
       textAnchor: "middle",
       x: "50%",
       y: "70%",
-      children: filetype.toUpperCase()
+      children: filetypeShort.toUpperCase()
     }), /*#__PURE__*/_jsx("path", {
       d: "M6 2a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6H6z",
       fill: 'transparent',
       stroke: theme.colorFillSecondary,
       strokeWidth: 0.5
     })]
-  }));
-  return /*#__PURE__*/_jsxs("svg", _objectSpread(_objectSpread({
+  })) : /*#__PURE__*/_jsxs("svg", _objectSpread(_objectSpread({
+    className: cx(styles.icon, !icon && className),
     height: size,
-    style: _objectSpread({
-      flex: 'none',
-      lineHeight: 1
-    }, style),
+    style: icon ? undefined : style,
     viewBox: "0 0 24 24",
     width: size,
     xmlns: "http://www.w3.org/2000/svg"
@@ -73,7 +85,7 @@ var FileTypeIcon = /*#__PURE__*/memo(function (_ref) {
       fill: iconColor,
       stroke: theme.colorFillSecondary,
       strokeWidth: 0.5
-    }), filetype && /*#__PURE__*/_jsx("text", {
+    }), !icon && filetype && /*#__PURE__*/_jsx("text", {
       fill: isMono ? theme.colorTextSecondary : '#fff',
       fontSize: fontSize,
       fontWeight: "bold",
@@ -83,5 +95,23 @@ var FileTypeIcon = /*#__PURE__*/memo(function (_ref) {
       children: filetype.toUpperCase()
     })]
   }));
+  if (!icon) return content;
+  return /*#__PURE__*/_jsxs(Center, _objectSpread(_objectSpread({
+    className: cx(styles.container, className),
+    flex: 'none',
+    height: size,
+    style: style,
+    width: size
+  }, rest), {}, {
+    children: [/*#__PURE__*/_jsx("div", {
+      style: {
+        fontSize: size / 2.4,
+        position: 'absolute',
+        top: type === 'file' ? '20%' : '16%',
+        zIndex: 1
+      },
+      children: icon
+    }), content]
+  }));
 });
 export default FileTypeIcon;

package/es/MaterialFileTypeIcon/index.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 import { DivProps } from "../types";
 export interface MaterialFileTypeIconProps extends DivProps {
+    fallbackUnknownType?: boolean;
     filename: string;
     open?: boolean;
     size?: number;

package/es/MaterialFileTypeIcon/index.js

@@ -2,7 +2,7 @@
 
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["filename", "size", "variant", "type", "style", "open"];
+var _excluded = ["fallbackUnknownType", "filename", "size", "variant", "type", "style", "open"];
 import { memo, useMemo } from 'react';
 import { Center } from 'react-layout-kit';
 import { useCdnFn } from "../ConfigProvider";
@@ -12,7 +12,9 @@ import { getIconUrlForDirectoryPath, getIconUrlForFilePath } from "./utils";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var MaterialFileTypeIcon = /*#__PURE__*/memo(function (_ref) {
-  var filename = _ref.filename,
+  var _ref$fallbackUnknownT = _ref.fallbackUnknownType,
+    fallbackUnknownType = _ref$fallbackUnknownT === void 0 ? true : _ref$fallbackUnknownT,
+    filename = _ref.filename,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 48 : _ref$size,
     _ref$variant = _ref.variant,
@@ -28,8 +30,23 @@ var MaterialFileTypeIcon = /*#__PURE__*/memo(function (_ref) {
     version: '1.0.0'
   });
   var iconUrl = useMemo(function () {
-    return type === 'file' ? getIconUrlForFilePath(filename, ICONS_URL) : getIconUrlForDirectoryPath(filename, ICONS_URL, open);
+    return type === 'file' ? getIconUrlForFilePath({
+      fallbackUnknownType: fallbackUnknownType,
+      iconsUrl: ICONS_URL,
+      path: filename
+    }) : getIconUrlForDirectoryPath({
+      fallbackUnknownType: fallbackUnknownType,
+      iconsUrl: ICONS_URL,
+      open: open,
+      path: filename
+    });
   }, [ICONS_URL, type, filename, open]);
+  if (!iconUrl) return /*#__PURE__*/_jsx(FileTypeIcon, {
+    filetype: filename.split('.')[1],
+    size: size,
+    type: type,
+    variant: 'mono'
+  });
   if (variant === 'pure') return /*#__PURE__*/_jsx(Img, _objectSpread({
     height: size,
     src: iconUrl,

package/es/MaterialFileTypeIcon/utils.d.ts

@@ -5,5 +5,14 @@ export declare function getIconNameForDirectoryName(dirName: string): IconDefini
 export declare function getIconForFilePath(path: string): "audio" | "html" | "ruby" | "search" | "table" | "template" | "video" | "svg" | "image" | "blink" | "red" | "d" | "r" | "key" | "css" | "auto" | "document" | "log" | "tree" | "url" | "email" | "azure" | "teal" | "flow" | "next" | "3d" | "robot" | "mermaid" | "panda" | "coconut" | "cucumber" | "jar" | "yarn" | "razor" | "gemini" | "http" | "font" | "file" | "go" | "processing" | "diff" | "abap" | "ada" | "applescript" | "astro" | "ballerina" | "bicep" | "c" | "cadence" | "clojure" | "cmake" | "cobol" | "coffee" | "cpp" | "crystal" | "csharp" | "dart" | "docker" | "elixir" | "elm" | "erlang" | "fsharp" | "graphql" | "groovy" | "hack" | "haml" | "handlebars" | "haskell" | "hcl" | "hjson" | "imba" | "java" | "javascript" | "json" | "julia" | "kotlin" | "kusto" | "less" | "liquid" | "lisp" | "lua" | "markdown" | "matlab" | "mdx" | "mojo" | "nginx" | "nim" | "nix" | "objective-c" | "objective-cpp" | "ocaml" | "pascal" | "perl" | "php" | "postcss" | "powershell" | "prisma" | "prolog" | "proto" | "pug" | "puppet" | "purescript" | "python" | "rust" | "sas" | "sass" | "scala" | "scheme" | "shaderlab" | "solidity" | "stylus" | "svelte" | "swift" | "tcl" | "tex" | "twig" | "typescript" | "verilog" | "vue" | "xml" | "yaml" | "zig" | "console" | "makefile" | "shader" | "vim" | "asciidoc" | "codeowners" | "edge" | "gleam" | "haxe" | "jinja" | "racket" | "templ" | "terraform" | "typst" | "vala" | "virtual" | "h" | "folder" | "sublime" | "twine" | "react" | "react_ts" | "routing" | "settings" | "typescript-def" | "markojs" | "pdf" | "vscode" | "visualstudio" | "database" | "qsharp" | "zip" | "exe" | "hex" | "javaclass" | "hpp" | "rc" | "python-misc" | "gradle" | "word" | "certificate" | "lib" | "dll" | "arduino" | "powerpoint" | "vedic" | "raml" | "xaml" | "otne" | "git" | "dart_generated" | "actionscript" | "mxml" | "autohotkey" | "flash" | "swc" | "assembly" | "odin" | "javascript-map" | "css-map" | "lock" | "test-ts" | "test-jsx" | "test-js" | "angular" | "angular-component" | "angular-guard" | "angular-service" | "angular-pipe" | "angular-directive" | "angular-resolver" | "livescript" | "smarty" | "reason" | "bucklescript" | "merlin" | "mathematica" | "wolframlanguage" | "nunjucks" | "autoit" | "yang" | "mjml" | "laravel" | "cake" | "apiblueprint" | "riot" | "vfl" | "kl" | "todo" | "coldfusion" | "cabal" | "slim" | "restql" | "kivy" | "graphcool" | "sbt" | "android" | "tune" | "gitlab" | "jenkins" | "figma" | "huff" | "drone" | "cuda" | "dotjs" | "ejs" | "wakatime" | "storybook" | "wepy" | "san" | "quokka" | "django" | "foxpro" | "i18n" | "webassembly" | "jupyter" | "mdsvex" | "bazel" | "mint" | "velocity" | "godot" | "godot-assets" | "azure-pipelines" | "vagrant" | "abc" | "moonscript" | "advpl_prw" | "advpl_ptm" | "advpl_tlpp" | "advpl_include" | "disc" | "fortran" | "sketch" | "pawn" | "forth" | "uml" | "meson" | "dhall" | "sml" | "opam" | "drawio" | "nuget" | "command" | "denizenscript" | "minecraft" | "rescript" | "rescript-interface" | "brainfuck" | "grain" | "lolcode" | "idris" | "pipeline" | "opa" | "windicss" | "lilypond" | "vlang" | "chess" | "tsconfig" | "tauri" | "jsconfig" | "horusec" | "pdm" | "coala" | "dinophp" | "siyuan" | "ndst" | "tobi" | "steadybit" | "capnp" | "openapi" | "swagger" | "antlr" | "stylable" | "pinejs" | "taskfile" | "gamemaker" | "tldraw" | "roblox" | "spwn" | "chrome" | "stan" | "lottie" | "apps-script" | "pkl" | "playwright" | "go-mod" | "gemfile" | "rubocop" | "rspec" | "semgrep" | "vue-config" | "nuxt" | "vercel" | "verdaccio" | "payload" | "remix" | "posthtml" | "webpack" | "ionic" | "gulp" | "nodejs" | "npm" | "turborepo" | "babel" | "blitz" | "contributing" | "readme" | "changelog" | "architecture" | "credits" | "authors" | "favicon" | "karma" | "bithound" | "svgo" | "appveyor" | "travis" | "codecov" | "sonarcloud" | "protractor" | "fusebox" | "heroku" | "editorconfig" | "bower" | "eslint" | "conduct" | "watchman" | "aurelia" | "mocha" | "firebase" | "rollup" | "hardhat" | "stylelint" | "code-climate" | "prettier" | "renovate" | "apollo" | "nodemon" | "webhint" | "browserlist" | "snyk" | "sequelize" | "gatsby" | "circleci" | "cloudfoundry" | "grunt" | "jest" | "fastlane" | "helm" | "wallaby" | "stencil" | "semantic-release" | "bitbucket" | "istanbul" | "tailwindcss" | "buildkite" | "netlify" | "nest" | "moon" | "percy" | "gitpod" | "gcp" | "husky" | "tilt" | "capacitor" | "adonis" | "commitlint" | "buck" | "nx" | "dune" | "roadmap" | "stryker" | "modernizr" | "slug" | "stitches" | "replit" | "snowpack" | "quasar" | "dependabot" | "vite" | "vitest" | "lerna" | "textlint" | "sentry" | "phpunit" | "php-cs-fixer" | "robots" | "maven" | "serverless" | "supabase" | "ember" | "poetry" | "parcel" | "astyle" | "lighthouse" | "svgr" | "rome" | "cypress" | "plop" | "tobimake" | "pnpm" | "gridsome" | "caddy" | "bun" | "nano-staged" | "knip" | "craco" | "mercurial" | "deno" | "plastic" | "unocss" | "ifanr-cloud" | "concourse" | "syncpack" | "werf" | "biome" | "esbuild" | "puppeteer" | "kubernetes" | "folder-open" | "folder-robot" | "folder-src" | "folder-dist" | "folder-css" | "folder-sass" | "folder-television" | "folder-desktop" | "folder-console" | "folder-images" | "folder-scripts" | "folder-node" | "folder-javascript" | "folder-json" | "folder-font" | "folder-bower" | "folder-test" | "folder-jinja" | "folder-markdown" | "folder-pdm" | "folder-php" | "folder-phpmailer" | "folder-sublime" | "folder-docs" | "folder-git" | "folder-github" | "folder-gitlab" | "folder-vscode" | "folder-views" | "folder-vue" | "folder-vuepress" | "folder-expo" | "folder-config" | "folder-i18n" | "folder-components" | "folder-verdaccio" | "folder-aurelia" | "folder-resource" | "folder-lib" | "folder-theme" | "folder-webpack" | "folder-global" | "folder-public" | "folder-include" | "folder-docker" | "folder-database" | "folder-log" | "folder-target" | "folder-temp" | "folder-aws" | "folder-audio" | "folder-video" | "folder-kubernetes" | "folder-import" | "folder-export" | "folder-wakatime" | "folder-circleci" | "folder-wordpress" | "folder-gradle" | "folder-coverage" | "folder-class" | "folder-other" | "folder-lua" | "folder-typescript" | "folder-graphql" | "folder-routes" | "folder-ci" | "folder-benchmark" | "folder-messages" | "folder-less" | "folder-gulp" | "folder-python" | "folder-mojo" | "folder-moon" | "folder-debug" | "folder-fastlane" | "folder-plugin" | "folder-middleware" | "folder-controller" | "folder-ansible" | "folder-server" | "folder-client" | "folder-tasks" | "folder-android" | "folder-ios" | "folder-upload" | "folder-download" | "folder-tools" | "folder-helper" | "folder-serverless" | "folder-api" | "folder-app" | "folder-apollo" | "folder-archive" | "folder-batch" | "folder-buildkite" | "folder-cluster" | "folder-command" | "folder-constant" | "folder-container" | "folder-content" | "folder-context" | "folder-core" | "folder-delta" | "folder-dump" | "folder-examples" | "folder-environment" | "folder-functions" | "folder-generator" | "folder-hook" | "folder-job" | "folder-keys" | "folder-layout" | "folder-mail" | "folder-mappings" | "folder-meta" | "folder-changesets" | "folder-packages" | "folder-shared" | "folder-shader" | "folder-stack" | "folder-template" | "folder-utils" | "folder-supabase" | "folder-private" | "folder-linux" | "folder-windows" | "folder-macos" | "folder-error" | "folder-event" | "folder-secure" | "folder-custom" | "folder-mock" | "folder-syntax" | "folder-vm" | "folder-stylus" | "folder-flow" | "folder-rules" | "folder-review" | "folder-animation" | "folder-guard" | "folder-prisma" | "folder-pipe" | "folder-svg" | "folder-terraform" | "folder-mobile" | "folder-stencil" | "folder-firebase" | "folder-svelte" | "folder-update" | "folder-intellij" | "folder-azure-pipelines" | "folder-mjml" | "folder-admin" | "folder-scala" | "folder-connection" | "folder-quasar" | "folder-next" | "folder-cobol" | "folder-yarn" | "folder-husky" | "folder-storybook" | "folder-base" | "folder-cart" | "folder-home" | "folder-project" | "folder-interface" | "folder-netlify" | "folder-enum" | "folder-contract" | "folder-queue" | "folder-vercel" | "folder-cypress" | "folder-decorators" | "folder-java" | "folder-resolver" | "folder-angular" | "folder-unity" | "folder-pdf" | "folder-proto" | "folder-plastic" | "folder-gamemaker" | "folder-mercurial" | "folder-godot" | "folder-lottie" | "folder-taskfile" | "folder-cloudflare" | "folder-seeders" | "folder-robot-open" | "folder-src-open" | "folder-dist-open" | "folder-css-open" | "folder-sass-open" | "folder-television-open" | "folder-desktop-open" | "folder-console-open" | "folder-images-open" | "folder-scripts-open" | "folder-node-open" | "folder-javascript-open" | "folder-json-open" | "folder-font-open" | "folder-bower-open" | "folder-test-open" | "folder-jinja-open" | "folder-markdown-open" | "folder-pdm-open" | "folder-php-open" | "folder-phpmailer-open" | "folder-sublime-open" | "folder-docs-open" | "folder-git-open" | "folder-github-open" | "folder-gitlab-open" | "folder-vscode-open" | "folder-views-open" | "folder-vue-open" | "folder-vuepress-open" | "folder-expo-open" | "folder-config-open" | "folder-i18n-open" | "folder-components-open" | "folder-verdaccio-open" | "folder-aurelia-open" | "folder-resource-open" | "folder-lib-open" | "folder-theme-open" | "folder-webpack-open" | "folder-global-open" | "folder-public-open" | "folder-include-open" | "folder-docker-open" | "folder-database-open" | "folder-log-open" | "folder-target-open" | "folder-temp-open" | "folder-aws-open" | "folder-audio-open" | "folder-video-open" | "folder-kubernetes-open" | "folder-import-open" | "folder-export-open" | "folder-wakatime-open" | "folder-circleci-open" | "folder-wordpress-open" | "folder-gradle-open" | "folder-coverage-open" | "folder-class-open" | "folder-other-open" | "folder-lua-open" | "folder-typescript-open" | "folder-graphql-open" | "folder-routes-open" | "folder-ci-open" | "folder-benchmark-open" | "folder-messages-open" | "folder-less-open" | "folder-gulp-open" | "folder-python-open" | "folder-mojo-open" | "folder-moon-open" | "folder-debug-open" | "folder-fastlane-open" | "folder-plugin-open" | "folder-middleware-open" | "folder-controller-open" | "folder-ansible-open" | "folder-server-open" | "folder-client-open" | "folder-tasks-open" | "folder-android-open" | "folder-ios-open" | "folder-upload-open" | "folder-download-open" | "folder-tools-open" | "folder-helper-open" | "folder-serverless-open" | "folder-api-open" | "folder-app-open" | "folder-apollo-open" | "folder-archive-open" | "folder-batch-open" | "folder-buildkite-open" | "folder-cluster-open" | "folder-command-open" | "folder-constant-open" | "folder-container-open" | "folder-content-open" | "folder-context-open" | "folder-core-open" | "folder-delta-open" | "folder-dump-open" | "folder-examples-open" | "folder-environment-open" | "folder-functions-open" | "folder-generator-open" | "folder-hook-open" | "folder-job-open" | "folder-keys-open" | "folder-layout-open" | "folder-mail-open" | "folder-mappings-open" | "folder-meta-open" | "folder-changesets-open" | "folder-packages-open" | "folder-shared-open" | "folder-shader-open" | "folder-stack-open" | "folder-template-open" | "folder-utils-open" | "folder-supabase-open" | "folder-private-open" | "folder-linux-open" | "folder-windows-open" | "folder-macos-open" | "folder-error-open" | "folder-event-open" | "folder-secure-open" | "folder-custom-open" | "folder-mock-open" | "folder-syntax-open" | "folder-vm-open" | "folder-stylus-open" | "folder-flow-open" | "folder-rules-open" | "folder-review-open" | "folder-animation-open" | "folder-guard-open" | "folder-prisma-open" | "folder-pipe-open" | "folder-svg-open" | "folder-terraform-open" | "folder-mobile-open" | "folder-stencil-open" | "folder-firebase-open" | "folder-svelte-open" | "folder-update-open" | "folder-intellij-open" | "folder-azure-pipelines-open" | "folder-mjml-open" | "folder-admin-open" | "folder-scala-open" | "folder-connection-open" | "folder-quasar-open" | "folder-next-open" | "folder-cobol-open" | "folder-yarn-open" | "folder-husky-open" | "folder-storybook-open" | "folder-base-open" | "folder-cart-open" | "folder-home-open" | "folder-project-open" | "folder-interface-open" | "folder-netlify-open" | "folder-enum-open" | "folder-contract-open" | "folder-queue-open" | "folder-vercel-open" | "folder-cypress-open" | "folder-decorators-open" | "folder-java-open" | "folder-resolver-open" | "folder-angular-open" | "folder-unity-open" | "folder-pdf-open" | "folder-proto-open" | "folder-plastic-open" | "folder-gamemaker-open" | "folder-mercurial-open" | "folder-godot-open" | "folder-lottie-open" | "folder-taskfile-open" | "folder-cloudflare-open" | "folder-seeders-open" | "salesforce" | "blink_light" | "jinja_light" | "huff_light" | "crystal_light" | "drone_light" | "wakatime_light" | "hcl_light" | "uml_light" | "chess_light" | "openapi_light" | "tldraw_light" | "rubocop_light" | "vercel_light" | "payload_light" | "next_light" | "remix_light" | "turborepo_light" | "auto_light" | "stylelint_light" | "code-climate_light" | "browserlist_light" | "circleci_light" | "semantic-release_light" | "netlify_light" | "stitches_light" | "snowpack_light" | "pnpm_light" | "bun_light" | "nano-staged_light" | "deno_light" | "folder-jinja_light" | "folder-intellij_light" | "folder-jinja-open_light" | "folder-intellij-open_light" | "folder-root" | "folder-root-open" | "php_elephant" | "php_elephant_pink" | "go_gopher" | "nodejs_alt" | "silverstripe";
 export declare function getIconForDirectoryPath(path: string): "audio" | "html" | "ruby" | "search" | "table" | "template" | "video" | "svg" | "image" | "blink" | "red" | "d" | "r" | "key" | "css" | "auto" | "document" | "log" | "tree" | "url" | "email" | "azure" | "teal" | "flow" | "next" | "3d" | "robot" | "mermaid" | "panda" | "coconut" | "cucumber" | "jar" | "yarn" | "razor" | "gemini" | "http" | "font" | "file" | "go" | "processing" | "diff" | "abap" | "ada" | "applescript" | "astro" | "ballerina" | "bicep" | "c" | "cadence" | "clojure" | "cmake" | "cobol" | "coffee" | "cpp" | "crystal" | "csharp" | "dart" | "docker" | "elixir" | "elm" | "erlang" | "fsharp" | "graphql" | "groovy" | "hack" | "haml" | "handlebars" | "haskell" | "hcl" | "hjson" | "imba" | "java" | "javascript" | "json" | "julia" | "kotlin" | "kusto" | "less" | "liquid" | "lisp" | "lua" | "markdown" | "matlab" | "mdx" | "mojo" | "nginx" | "nim" | "nix" | "objective-c" | "objective-cpp" | "ocaml" | "pascal" | "perl" | "php" | "postcss" | "powershell" | "prisma" | "prolog" | "proto" | "pug" | "puppet" | "purescript" | "python" | "rust" | "sas" | "sass" | "scala" | "scheme" | "shaderlab" | "solidity" | "stylus" | "svelte" | "swift" | "tcl" | "tex" | "twig" | "typescript" | "verilog" | "vue" | "xml" | "yaml" | "zig" | "console" | "makefile" | "shader" | "vim" | "asciidoc" | "codeowners" | "edge" | "gleam" | "haxe" | "jinja" | "racket" | "templ" | "terraform" | "typst" | "vala" | "virtual" | "h" | "folder" | "sublime" | "twine" | "react" | "react_ts" | "routing" | "settings" | "typescript-def" | "markojs" | "pdf" | "vscode" | "visualstudio" | "database" | "qsharp" | "zip" | "exe" | "hex" | "javaclass" | "hpp" | "rc" | "python-misc" | "gradle" | "word" | "certificate" | "lib" | "dll" | "arduino" | "powerpoint" | "vedic" | "raml" | "xaml" | "otne" | "git" | "dart_generated" | "actionscript" | "mxml" | "autohotkey" | "flash" | "swc" | "assembly" | "odin" | "javascript-map" | "css-map" | "lock" | "test-ts" | "test-jsx" | "test-js" | "angular" | "angular-component" | "angular-guard" | "angular-service" | "angular-pipe" | "angular-directive" | "angular-resolver" | "livescript" | "smarty" | "reason" | "bucklescript" | "merlin" | "mathematica" | "wolframlanguage" | "nunjucks" | "autoit" | "yang" | "mjml" | "laravel" | "cake" | "apiblueprint" | "riot" | "vfl" | "kl" | "todo" | "coldfusion" | "cabal" | "slim" | "restql" | "kivy" | "graphcool" | "sbt" | "android" | "tune" | "gitlab" | "jenkins" | "figma" | "huff" | "drone" | "cuda" | "dotjs" | "ejs" | "wakatime" | "storybook" | "wepy" | "san" | "quokka" | "django" | "foxpro" | "i18n" | "webassembly" | "jupyter" | "mdsvex" | "bazel" | "mint" | "velocity" | "godot" | "godot-assets" | "azure-pipelines" | "vagrant" | "abc" | "moonscript" | "advpl_prw" | "advpl_ptm" | "advpl_tlpp" | "advpl_include" | "disc" | "fortran" | "sketch" | "pawn" | "forth" | "uml" | "meson" | "dhall" | "sml" | "opam" | "drawio" | "nuget" | "command" | "denizenscript" | "minecraft" | "rescript" | "rescript-interface" | "brainfuck" | "grain" | "lolcode" | "idris" | "pipeline" | "opa" | "windicss" | "lilypond" | "vlang" | "chess" | "tsconfig" | "tauri" | "jsconfig" | "horusec" | "pdm" | "coala" | "dinophp" | "siyuan" | "ndst" | "tobi" | "steadybit" | "capnp" | "openapi" | "swagger" | "antlr" | "stylable" | "pinejs" | "taskfile" | "gamemaker" | "tldraw" | "roblox" | "spwn" | "chrome" | "stan" | "lottie" | "apps-script" | "pkl" | "playwright" | "go-mod" | "gemfile" | "rubocop" | "rspec" | "semgrep" | "vue-config" | "nuxt" | "vercel" | "verdaccio" | "payload" | "remix" | "posthtml" | "webpack" | "ionic" | "gulp" | "nodejs" | "npm" | "turborepo" | "babel" | "blitz" | "contributing" | "readme" | "changelog" | "architecture" | "credits" | "authors" | "favicon" | "karma" | "bithound" | "svgo" | "appveyor" | "travis" | "codecov" | "sonarcloud" | "protractor" | "fusebox" | "heroku" | "editorconfig" | "bower" | "eslint" | "conduct" | "watchman" | "aurelia" | "mocha" | "firebase" | "rollup" | "hardhat" | "stylelint" | "code-climate" | "prettier" | "renovate" | "apollo" | "nodemon" | "webhint" | "browserlist" | "snyk" | "sequelize" | "gatsby" | "circleci" | "cloudfoundry" | "grunt" | "jest" | "fastlane" | "helm" | "wallaby" | "stencil" | "semantic-release" | "bitbucket" | "istanbul" | "tailwindcss" | "buildkite" | "netlify" | "nest" | "moon" | "percy" | "gitpod" | "gcp" | "husky" | "tilt" | "capacitor" | "adonis" | "commitlint" | "buck" | "nx" | "dune" | "roadmap" | "stryker" | "modernizr" | "slug" | "stitches" | "replit" | "snowpack" | "quasar" | "dependabot" | "vite" | "vitest" | "lerna" | "textlint" | "sentry" | "phpunit" | "php-cs-fixer" | "robots" | "maven" | "serverless" | "supabase" | "ember" | "poetry" | "parcel" | "astyle" | "lighthouse" | "svgr" | "rome" | "cypress" | "plop" | "tobimake" | "pnpm" | "gridsome" | "caddy" | "bun" | "nano-staged" | "knip" | "craco" | "mercurial" | "deno" | "plastic" | "unocss" | "ifanr-cloud" | "concourse" | "syncpack" | "werf" | "biome" | "esbuild" | "puppeteer" | "kubernetes" | "folder-open" | "folder-robot" | "folder-src" | "folder-dist" | "folder-css" | "folder-sass" | "folder-television" | "folder-desktop" | "folder-console" | "folder-images" | "folder-scripts" | "folder-node" | "folder-javascript" | "folder-json" | "folder-font" | "folder-bower" | "folder-test" | "folder-jinja" | "folder-markdown" | "folder-pdm" | "folder-php" | "folder-phpmailer" | "folder-sublime" | "folder-docs" | "folder-git" | "folder-github" | "folder-gitlab" | "folder-vscode" | "folder-views" | "folder-vue" | "folder-vuepress" | "folder-expo" | "folder-config" | "folder-i18n" | "folder-components" | "folder-verdaccio" | "folder-aurelia" | "folder-resource" | "folder-lib" | "folder-theme" | "folder-webpack" | "folder-global" | "folder-public" | "folder-include" | "folder-docker" | "folder-database" | "folder-log" | "folder-target" | "folder-temp" | "folder-aws" | "folder-audio" | "folder-video" | "folder-kubernetes" | "folder-import" | "folder-export" | "folder-wakatime" | "folder-circleci" | "folder-wordpress" | "folder-gradle" | "folder-coverage" | "folder-class" | "folder-other" | "folder-lua" | "folder-typescript" | "folder-graphql" | "folder-routes" | "folder-ci" | "folder-benchmark" | "folder-messages" | "folder-less" | "folder-gulp" | "folder-python" | "folder-mojo" | "folder-moon" | "folder-debug" | "folder-fastlane" | "folder-plugin" | "folder-middleware" | "folder-controller" | "folder-ansible" | "folder-server" | "folder-client" | "folder-tasks" | "folder-android" | "folder-ios" | "folder-upload" | "folder-download" | "folder-tools" | "folder-helper" | "folder-serverless" | "folder-api" | "folder-app" | "folder-apollo" | "folder-archive" | "folder-batch" | "folder-buildkite" | "folder-cluster" | "folder-command" | "folder-constant" | "folder-container" | "folder-content" | "folder-context" | "folder-core" | "folder-delta" | "folder-dump" | "folder-examples" | "folder-environment" | "folder-functions" | "folder-generator" | "folder-hook" | "folder-job" | "folder-keys" | "folder-layout" | "folder-mail" | "folder-mappings" | "folder-meta" | "folder-changesets" | "folder-packages" | "folder-shared" | "folder-shader" | "folder-stack" | "folder-template" | "folder-utils" | "folder-supabase" | "folder-private" | "folder-linux" | "folder-windows" | "folder-macos" | "folder-error" | "folder-event" | "folder-secure" | "folder-custom" | "folder-mock" | "folder-syntax" | "folder-vm" | "folder-stylus" | "folder-flow" | "folder-rules" | "folder-review" | "folder-animation" | "folder-guard" | "folder-prisma" | "folder-pipe" | "folder-svg" | "folder-terraform" | "folder-mobile" | "folder-stencil" | "folder-firebase" | "folder-svelte" | "folder-update" | "folder-intellij" | "folder-azure-pipelines" | "folder-mjml" | "folder-admin" | "folder-scala" | "folder-connection" | "folder-quasar" | "folder-next" | "folder-cobol" | "folder-yarn" | "folder-husky" | "folder-storybook" | "folder-base" | "folder-cart" | "folder-home" | "folder-project" | "folder-interface" | "folder-netlify" | "folder-enum" | "folder-contract" | "folder-queue" | "folder-vercel" | "folder-cypress" | "folder-decorators" | "folder-java" | "folder-resolver" | "folder-angular" | "folder-unity" | "folder-pdf" | "folder-proto" | "folder-plastic" | "folder-gamemaker" | "folder-mercurial" | "folder-godot" | "folder-lottie" | "folder-taskfile" | "folder-cloudflare" | "folder-seeders" | "folder-robot-open" | "folder-src-open" | "folder-dist-open" | "folder-css-open" | "folder-sass-open" | "folder-television-open" | "folder-desktop-open" | "folder-console-open" | "folder-images-open" | "folder-scripts-open" | "folder-node-open" | "folder-javascript-open" | "folder-json-open" | "folder-font-open" | "folder-bower-open" | "folder-test-open" | "folder-jinja-open" | "folder-markdown-open" | "folder-pdm-open" | "folder-php-open" | "folder-phpmailer-open" | "folder-sublime-open" | "folder-docs-open" | "folder-git-open" | "folder-github-open" | "folder-gitlab-open" | "folder-vscode-open" | "folder-views-open" | "folder-vue-open" | "folder-vuepress-open" | "folder-expo-open" | "folder-config-open" | "folder-i18n-open" | "folder-components-open" | "folder-verdaccio-open" | "folder-aurelia-open" | "folder-resource-open" | "folder-lib-open" | "folder-theme-open" | "folder-webpack-open" | "folder-global-open" | "folder-public-open" | "folder-include-open" | "folder-docker-open" | "folder-database-open" | "folder-log-open" | "folder-target-open" | "folder-temp-open" | "folder-aws-open" | "folder-audio-open" | "folder-video-open" | "folder-kubernetes-open" | "folder-import-open" | "folder-export-open" | "folder-wakatime-open" | "folder-circleci-open" | "folder-wordpress-open" | "folder-gradle-open" | "folder-coverage-open" | "folder-class-open" | "folder-other-open" | "folder-lua-open" | "folder-typescript-open" | "folder-graphql-open" | "folder-routes-open" | "folder-ci-open" | "folder-benchmark-open" | "folder-messages-open" | "folder-less-open" | "folder-gulp-open" | "folder-python-open" | "folder-mojo-open" | "folder-moon-open" | "folder-debug-open" | "folder-fastlane-open" | "folder-plugin-open" | "folder-middleware-open" | "folder-controller-open" | "folder-ansible-open" | "folder-server-open" | "folder-client-open" | "folder-tasks-open" | "folder-android-open" | "folder-ios-open" | "folder-upload-open" | "folder-download-open" | "folder-tools-open" | "folder-helper-open" | "folder-serverless-open" | "folder-api-open" | "folder-app-open" | "folder-apollo-open" | "folder-archive-open" | "folder-batch-open" | "folder-buildkite-open" | "folder-cluster-open" | "folder-command-open" | "folder-constant-open" | "folder-container-open" | "folder-content-open" | "folder-context-open" | "folder-core-open" | "folder-delta-open" | "folder-dump-open" | "folder-examples-open" | "folder-environment-open" | "folder-functions-open" | "folder-generator-open" | "folder-hook-open" | "folder-job-open" | "folder-keys-open" | "folder-layout-open" | "folder-mail-open" | "folder-mappings-open" | "folder-meta-open" | "folder-changesets-open" | "folder-packages-open" | "folder-shared-open" | "folder-shader-open" | "folder-stack-open" | "folder-template-open" | "folder-utils-open" | "folder-supabase-open" | "folder-private-open" | "folder-linux-open" | "folder-windows-open" | "folder-macos-open" | "folder-error-open" | "folder-event-open" | "folder-secure-open" | "folder-custom-open" | "folder-mock-open" | "folder-syntax-open" | "folder-vm-open" | "folder-stylus-open" | "folder-flow-open" | "folder-rules-open" | "folder-review-open" | "folder-animation-open" | "folder-guard-open" | "folder-prisma-open" | "folder-pipe-open" | "folder-svg-open" | "folder-terraform-open" | "folder-mobile-open" | "folder-stencil-open" | "folder-firebase-open" | "folder-svelte-open" | "folder-update-open" | "folder-intellij-open" | "folder-azure-pipelines-open" | "folder-mjml-open" | "folder-admin-open" | "folder-scala-open" | "folder-connection-open" | "folder-quasar-open" | "folder-next-open" | "folder-cobol-open" | "folder-yarn-open" | "folder-husky-open" | "folder-storybook-open" | "folder-base-open" | "folder-cart-open" | "folder-home-open" | "folder-project-open" | "folder-interface-open" | "folder-netlify-open" | "folder-enum-open" | "folder-contract-open" | "folder-queue-open" | "folder-vercel-open" | "folder-cypress-open" | "folder-decorators-open" | "folder-java-open" | "folder-resolver-open" | "folder-angular-open" | "folder-unity-open" | "folder-pdf-open" | "folder-proto-open" | "folder-plastic-open" | "folder-gamemaker-open" | "folder-mercurial-open" | "folder-godot-open" | "folder-lottie-open" | "folder-taskfile-open" | "folder-cloudflare-open" | "folder-seeders-open" | "salesforce" | "blink_light" | "jinja_light" | "huff_light" | "crystal_light" | "drone_light" | "wakatime_light" | "hcl_light" | "uml_light" | "chess_light" | "openapi_light" | "tldraw_light" | "rubocop_light" | "vercel_light" | "payload_light" | "next_light" | "remix_light" | "turborepo_light" | "auto_light" | "stylelint_light" | "code-climate_light" | "browserlist_light" | "circleci_light" | "semantic-release_light" | "netlify_light" | "stitches_light" | "snowpack_light" | "pnpm_light" | "bun_light" | "nano-staged_light" | "deno_light" | "folder-jinja_light" | "folder-intellij_light" | "folder-jinja-open_light" | "folder-intellij-open_light" | "folder-root" | "folder-root-open" | "php_elephant" | "php_elephant_pink" | "go_gopher" | "nodejs_alt" | "silverstripe";
 export declare function getIconUrlByName(iconName: IconDefinitionsKey, iconsUrl: string, open?: boolean): string;
-export declare function getIconUrlForFilePath(path: string, iconsUrl: string): string;
-export declare function getIconUrlForDirectoryPath(path: string, iconsUrl: string, open?: boolean): string;
+export declare function getIconUrlForFilePath({ path, iconsUrl, fallbackUnknownType, }: {
+    fallbackUnknownType: boolean;
+    iconsUrl: string;
+    path: string;
+}): string;
+export declare function getIconUrlForDirectoryPath({ path, iconsUrl, open, fallbackUnknownType, }: {
+    fallbackUnknownType: boolean;
+    iconsUrl: string;
+    open?: boolean;
+    path: string;
+}): string;

package/es/MaterialFileTypeIcon/utils.js

@@ -29,11 +29,20 @@ export function getIconForDirectoryPath(path) {
 export function getIconUrlByName(iconName, iconsUrl, open) {
   return "".concat(iconsUrl, "/").concat(iconName.toString()).concat(open ? '-open' : '', ".svg");
 }
-export function getIconUrlForFilePath(path, iconsUrl) {
+export function getIconUrlForFilePath(_ref8) {
+  var path = _ref8.path,
+    iconsUrl = _ref8.iconsUrl,
+    fallbackUnknownType = _ref8.fallbackUnknownType;
   var iconName = getIconForFilePath(path);
+  if (fallbackUnknownType && iconName === 'file') return '';
   return getIconUrlByName(iconName, iconsUrl);
 }
-export function getIconUrlForDirectoryPath(path, iconsUrl, open) {
+export function getIconUrlForDirectoryPath(_ref9) {
+  var path = _ref9.path,
+    iconsUrl = _ref9.iconsUrl,
+    open = _ref9.open,
+    fallbackUnknownType = _ref9.fallbackUnknownType;
   var iconName = getIconForDirectoryPath(path);
+  if (fallbackUnknownType && iconName === 'folder') return '';
   return getIconUrlByName(iconName, iconsUrl, open);
 }

package/es/Mermaid/useMermaid.js

@@ -1,8 +1,15 @@
+import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { useTheme } from 'antd-style';
 import mermaid from 'mermaid';
-import { useCallback, useEffect } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
 export var useMermaid = function useMermaid(content) {
+  var _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    mermaidContent = _useState2[0],
+    setMermaidContent = _useState2[1];
   var theme = useTheme();
   useEffect(function () {
     mermaid.initialize({
@@ -11,6 +18,8 @@ export var useMermaid = function useMermaid(content) {
       startOnLoad: true,
       theme: 'base',
       themeVariables: {
+        errorBkgColor: theme.colorError,
+        errorTextColor: theme.colorText,
         fontSize: 14,
         lineColor: theme.colorBorderSecondary,
         primaryBorderColor: theme.colorPrimaryBorder,
@@ -21,7 +30,40 @@ export var useMermaid = function useMermaid(content) {
       }
     });
     mermaid.contentLoaded();
-  }, [content, theme.isDarkMode]);
+  }, [mermaidContent, theme.isDarkMode]);
+  var checkSyntax = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(textStr) {
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _context.prev = 0;
+            _context.next = 3;
+            return mermaid.parse(textStr);
+          case 3:
+            if (!_context.sent) {
+              _context.next = 5;
+              break;
+            }
+            setMermaidContent(textStr);
+          case 5:
+            _context.next = 9;
+            break;
+          case 7:
+            _context.prev = 7;
+            _context.t0 = _context["catch"](0);
+          case 9:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee, null, [[0, 7]]);
+    }));
+    return function checkSyntax(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+  useEffect(function () {
+    checkSyntax(content);
+  }, [content]);
   return useCallback(function () {
     return /*#__PURE__*/_jsx("pre", {
       className: 'mermaid',
@@ -32,7 +74,7 @@ export var useMermaid = function useMermaid(content) {
         justifyContent: 'center',
         overflow: 'auto'
       },
-      children: content
+      children: mermaidContent
     });
-  }, [content, theme.isDarkMode]);
+  }, [mermaidContent, theme.isDarkMode]);
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/ui",
-  "version": "1.148.0",
+  "version": "1.148.2",
   "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
   "keywords": [
     "lobehub",