@guiwzh/small-design 0.1.0

package/dist/index.mjs

@@ -0,0 +1,1143 @@
+// src/components/Button/button.tsx
+import classNames from "classnames";
+import { jsx } from "react/jsx-runtime";
+var Button = (props) => {
+  const { className, disabled = false, size, btnType = "default", href, children, ...restProps } = props;
+  const classes = classNames("btn", className, {
+    [`btn-${btnType}`]: btnType,
+    [`btn-${size}`]: size,
+    "disabled": disabled
+  });
+  if (btnType === "link" && href) {
+    return /* @__PURE__ */ jsx("a", { className: classes, href, ...restProps, children });
+  } else {
+    return /* @__PURE__ */ jsx("button", { className: classes, disabled, ...restProps, children });
+  }
+};
+Button.displayName = "Button";
+var button_default = Button;
+
+// src/components/Menu/menu.tsx
+import React, { useState, createContext, Children } from "react";
+import classNames2 from "classnames";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var MenuContext = createContext({ index: "0" });
+var Menu = (props) => {
+  const { className, mode = "horizontal", style, children, defaultIndex = "0", onSelect, defaultOpenSubMenus = [] } = props;
+  const [currentActive, setActive] = useState(defaultIndex);
+  const handleClick = (index, e) => {
+    setActive(index);
+    if (onSelect) {
+      onSelect(index, e);
+    }
+  };
+  const passedContext = {
+    index: currentActive,
+    onSelect: handleClick,
+    mode,
+    defaultOpenSubMenus
+  };
+  const renderChildren = () => {
+    return Children.map(children, (child, index) => {
+      var _a;
+      const childElement = child;
+      if (typeof child !== "object" || child === null) {
+        console.error("Warning: Menu has a child which is not a MenuItem component");
+        return null;
+      }
+      const displayName = (_a = childElement.type) == null ? void 0 : _a.displayName;
+      if (displayName === "MenuItem" || displayName === "SubMenu") {
+        return React.cloneElement(childElement, {
+          index: index.toString()
+        });
+      } else {
+        console.error("Warning: Menu has a child which is not a MenuItem component");
+      }
+    });
+  };
+  const classes = classNames2("viking-menu", className, {
+    "menu-vertical": mode === "vertical",
+    "menu-horizontal": mode !== "vertical"
+  });
+  return /* @__PURE__ */ jsx2("ul", { className: classes, style, role: "menubar", children: /* @__PURE__ */ jsx2(MenuContext.Provider, { value: passedContext, children: renderChildren() }) });
+};
+var menu_default = Menu;
+
+// src/components/Menu/subMenu.tsx
+import React2, { useContext, useState as useState2, useRef } from "react";
+import classNames4 from "classnames";
+
+// src/components/Icon/icon.tsx
+import classNames3 from "classnames";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Icon = (props) => {
+  const { className, theme, ...restProps } = props;
+  const classes = classNames3("viking-icon", className, {
+    [`icon-${theme}`]: theme
+  });
+  return /* @__PURE__ */ jsx3(FontAwesomeIcon, { className: classes, ...restProps });
+};
+var icon_default = Icon;
+
+// src/components/Transition/transition.tsx
+import { CSSTransition } from "react-transition-group";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Transition = (props) => {
+  const {
+    children,
+    classNames: classNames9,
+    animation,
+    wrapper,
+    unmountOnExit = true,
+    //该属性可以根据in属性的true和false实现子节点的挂载与卸载，从而无需自行添加display:none与block的转换
+    appear = true,
+    ...restProps
+  } = props;
+  return /* @__PURE__ */ jsx4(
+    CSSTransition,
+    {
+      classNames: classNames9 ? classNames9 : animation,
+      unmountOnExit,
+      appear,
+      ...restProps,
+      children: wrapper ? /* @__PURE__ */ jsx4("div", { children }) : children
+    }
+  );
+};
+var transition_default = Transition;
+
+// src/components/Menu/subMenu.tsx
+import { jsx as jsx5, jsxs } from "react/jsx-runtime";
+var SubMenu = ({ index, title, children, className }) => {
+  const context = useContext(MenuContext);
+  const openedSubMenus = context.defaultOpenSubMenus;
+  const isOpend = index && context.mode === "vertical" ? openedSubMenus.includes(index) : false;
+  const [menuOpen, setOpen] = useState2(isOpend);
+  const classes = classNames4("menu-item submenu-item", className, {
+    "is-active": context.index === index,
+    "is-opened": menuOpen,
+    "is-vertical": context.mode === "vertical"
+  });
+  const handleClick = (e) => {
+    e.preventDefault();
+    setOpen(!menuOpen);
+  };
+  const timer = useRef();
+  const handleMouse = (e, toggle) => {
+    clearTimeout(timer.current);
+    e.preventDefault();
+    timer.current = setTimeout(() => {
+      setOpen(toggle);
+    }, 300);
+  };
+  const clickEvents = context.mode === "vertical" ? {
+    onClick: handleClick
+  } : {};
+  const hoverEvents = context.mode !== "vertical" ? {
+    onMouseEnter: (e) => {
+      handleMouse(e, true);
+    },
+    onMouseLeave: (e) => {
+      handleMouse(e, false);
+    }
+  } : {};
+  const renderChildren = () => {
+    const childrenComponent = React2.Children.map(children, (child, i) => {
+      const childElement = child;
+      if (childElement.type.displayName === "MenuItem" || childElement.type.displayName === "SubMenu") {
+        return React2.cloneElement(childElement, {
+          index: `${index}-${i}`
+        });
+      } else {
+        console.error("Warning: SubMenu has a child which is not a MenuItem component");
+      }
+    });
+    return /* @__PURE__ */ jsx5(
+      transition_default,
+      {
+        in: menuOpen,
+        timeout: 300,
+        animation: "zoom-in-top",
+        children: /* @__PURE__ */ jsx5("ul", { className: "viking-submenu", children: childrenComponent })
+      }
+    );
+  };
+  return /* @__PURE__ */ jsxs("li", { className: classes, ...hoverEvents, children: [
+    /* @__PURE__ */ jsxs("div", { className: "submenu-title", ...clickEvents, children: [
+      title,
+      /* @__PURE__ */ jsx5(icon_default, { icon: "angle-down", className: "arrow-icon" })
+    ] }),
+    renderChildren()
+  ] }, index);
+};
+SubMenu.displayName = "SubMenu";
+var subMenu_default = SubMenu;
+
+// src/components/Menu/menuItem.tsx
+import { useContext as useContext2 } from "react";
+import classNames5 from "classnames";
+import { jsx as jsx6 } from "react/jsx-runtime";
+var MenuItem = (props) => {
+  const { index, disabled, className, style, children } = props;
+  const context = useContext2(MenuContext);
+  const classes = classNames5("menu-item", className, {
+    "is-disabled": disabled,
+    "is-active": context.index === index
+  });
+  const handleClick = (e) => {
+    if (context.onSelect && !disabled && index) {
+      context.onSelect(index, e);
+    }
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      if (context.onSelect && !disabled && index) {
+        context.onSelect(index, e);
+      }
+    }
+  };
+  return /* @__PURE__ */ jsx6(
+    "li",
+    {
+      className: classes,
+      style,
+      onClick: handleClick,
+      onKeyDown: handleKeyDown,
+      role: "menuitem",
+      tabIndex: disabled ? -1 : 0,
+      "aria-disabled": disabled,
+      children
+    }
+  );
+};
+MenuItem.displayName = "MenuItem";
+var menuItem_default = MenuItem;
+
+// src/components/Menu/index.tsx
+var TransMenu = menu_default;
+TransMenu.Item = menuItem_default;
+TransMenu.SubMenu = subMenu_default;
+var Menu_default = TransMenu;
+
+// src/components/AutoComplete/autoComplete.tsx
+import { useState as useState4, useEffect as useEffect3, useRef as useRef2 } from "react";
+
+// src/components/Input/input.tsx
+import { forwardRef } from "react";
+import classNames6 from "classnames";
+import { jsx as jsx7, jsxs as jsxs2 } from "react/jsx-runtime";
+var Input = forwardRef((props, ref) => {
+  const {
+    disabled,
+    size,
+    icon,
+    prepend,
+    append,
+    style,
+    ...restProps
+  } = props;
+  const cnames = classNames6("viking-input-wrapper", {
+    [`input-size-${size}`]: size,
+    "is-disabled": disabled,
+    "input-group": prepend || append,
+    "input-group-append": !!append,
+    "input-group-prepend": !!prepend
+  });
+  const fixControlledValue = (value) => {
+    if (typeof value === "undefined" || value === null) {
+      return "";
+    }
+    return value;
+  };
+  if ("value" in props) {
+    delete restProps.defaultValue;
+    restProps.value = fixControlledValue(props.value);
+  }
+  return /* @__PURE__ */ jsxs2("div", { className: cnames, style, children: [
+    prepend && /* @__PURE__ */ jsx7("div", { className: "viking-input-group-prepend", children: prepend }),
+    icon && /* @__PURE__ */ jsx7("div", { className: "icon-wrapper", children: /* @__PURE__ */ jsx7(icon_default, { icon, title: `title-${icon}` }) }),
+    /* @__PURE__ */ jsx7(
+      "input",
+      {
+        ref,
+        className: "viking-input-inner",
+        disabled,
+        ...restProps
+      }
+    ),
+    append && /* @__PURE__ */ jsx7("div", { className: "viking-input-group-append", children: append })
+  ] });
+});
+var input_default = Input;
+
+// src/hooks/useDebounce.tsx
+import { useState as useState3, useEffect } from "react";
+function useDebounce(value, delay = 300) {
+  const [debouncedValue, setDebouncedValue] = useState3(value);
+  useEffect(() => {
+    const handler = setTimeout(() => {
+      setDebouncedValue(value);
+    }, delay);
+    return () => {
+      clearTimeout(handler);
+    };
+  }, [value, delay]);
+  return debouncedValue;
+}
+var useDebounce_default = useDebounce;
+
+// src/components/AutoComplete/autoComplete.tsx
+import classNames7 from "classnames";
+
+// src/hooks/useClickOutside.tsx
+import { useEffect as useEffect2 } from "react";
+function useClickOutside(ref, handler) {
+  useEffect2(() => {
+    const listener = (event) => {
+      if (!ref.current || ref.current.contains(event.target)) {
+        return;
+      }
+      handler(event);
+    };
+    document.addEventListener("click", listener);
+    return () => {
+      document.removeEventListener("click", listener);
+    };
+  }, [ref, handler]);
+}
+var useClickOutside_default = useClickOutside;
+
+// src/components/AutoComplete/autoComplete.tsx
+import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
+var AutoComplete = (props) => {
+  const { value, fetchSuggestions, onSelect, onChange, onEnterDown, onError, renderOption, style, debounceTime = 300, expireTime = 36e5, ...restprops } = props;
+  const [inputValue, setInputValue] = useState4(value || "");
+  const [suggestions, setSuggestions] = useState4([]);
+  const [loading, setloading] = useState4(false);
+  const [highlightIndex, sethighlightIndex] = useState4(-1);
+  const [isFocus, setisFocus] = useState4(true);
+  const componentRef = useRef2(null);
+  const triggerSearch = useRef2(false);
+  const fetchId = useRef2(0);
+  const intialInputvalue = useRef2(value || "");
+  const debouncedValue = useDebounce_default(inputValue, debounceTime);
+  useClickOutside_default(componentRef, () => {
+    setisFocus(false);
+  });
+  useEffect3(() => {
+    function getData() {
+      async function fetchData() {
+        fetchId.current++;
+        if (debouncedValue) {
+          const Id = fetchId.current;
+          setloading(true);
+          setSuggestions([]);
+          try {
+            const results = await fetchSuggestions(debouncedValue);
+            if (Id === fetchId.current && results) {
+              setloading(false);
+              setSuggestions(results);
+              const item = {
+                value: results,
+                // 实际数据
+                expiry: Date.now() + expireTime
+                // 当前时间加上1小时的过期时间 (单位毫秒)
+              };
+              localStorage.setItem(debouncedValue, JSON.stringify(item));
+            }
+          } catch (e) {
+            onError == null ? void 0 : onError(e);
+            setloading(false);
+            setSuggestions([]);
+          }
+        } else {
+          setloading(false);
+          setSuggestions([]);
+        }
+      }
+      if (triggerSearch.current) {
+        if (localStorage.getItem(debouncedValue)) {
+          const item = JSON.parse(localStorage.getItem(debouncedValue));
+          if (item.expiry > (/* @__PURE__ */ new Date()).getTime()) {
+            fetchId.current++;
+            setloading(false);
+            setSuggestions(item.value);
+          } else {
+            localStorage.removeItem(debouncedValue);
+            fetchData();
+          }
+        } else {
+          fetchData();
+        }
+        sethighlightIndex(-1);
+      }
+    }
+    getData();
+  }, [debouncedValue, fetchSuggestions, expireTime, onError]);
+  const handleChange = (e) => {
+    const value2 = e.target.value.trim();
+    setInputValue(value2);
+    onChange == null ? void 0 : onChange(value2);
+    intialInputvalue.current = value2;
+    triggerSearch.current = true;
+  };
+  const handleSelect = (item) => {
+    setInputValue(item.value);
+    intialInputvalue.current = item.value;
+    setSuggestions([]);
+    onSelect == null ? void 0 : onSelect(item);
+    triggerSearch.current = false;
+  };
+  const handleUpDown = (item) => {
+    setInputValue(item.value);
+    triggerSearch.current = false;
+  };
+  const handleArrowDown = () => {
+    if (highlightIndex + 1 > suggestions.length - 1) {
+      sethighlightIndex(-1);
+      setInputValue(intialInputvalue.current);
+      triggerSearch.current = false;
+    } else {
+      sethighlightIndex(highlightIndex + 1);
+      if (suggestions[highlightIndex + 1]) handleUpDown(suggestions[highlightIndex + 1]);
+    }
+  };
+  const handleArrowUp = () => {
+    if (highlightIndex - 1 === -1) {
+      sethighlightIndex(highlightIndex - 1);
+      setInputValue(intialInputvalue.current);
+      triggerSearch.current = false;
+    } else if (highlightIndex - 1 < -1) {
+      sethighlightIndex(suggestions.length - 1);
+      if (suggestions[suggestions.length - 1]) handleUpDown(suggestions[suggestions.length - 1]);
+    } else {
+      sethighlightIndex(highlightIndex - 1);
+      handleUpDown(suggestions[highlightIndex - 1]);
+    }
+  };
+  const handleKeyDown = (e) => {
+    switch (e.key) {
+      case "Enter":
+        if (suggestions[highlightIndex]) {
+          handleSelect(suggestions[highlightIndex]);
+          onEnterDown == null ? void 0 : onEnterDown(suggestions[highlightIndex]);
+        } else {
+          onEnterDown == null ? void 0 : onEnterDown({ value: intialInputvalue.current });
+        }
+        break;
+      case "ArrowDown":
+        handleArrowDown();
+        break;
+      case "ArrowUp":
+        handleArrowUp();
+        break;
+      case "Escape":
+        setisFocus(false);
+        break;
+      default:
+        break;
+    }
+  };
+  const handleClick = (e) => {
+    setisFocus(true);
+  };
+  const generateDropdown = () => {
+    return /* @__PURE__ */ jsx8("ul", { className: "viking-suggestion-list", role: "listbox", id: "suggestion-listbox", children: suggestions.map(
+      (item, index) => {
+        const cnames = classNames7("suggestion-item", {
+          "item-highlighted": index === highlightIndex
+        });
+        return /* @__PURE__ */ jsx8(
+          "li",
+          {
+            onClick: () => handleSelect(item),
+            className: cnames,
+            role: "option",
+            id: `suggestion-item-${index}`,
+            "aria-selected": index === highlightIndex,
+            children: renderOption ? renderOption(item) : item.value
+          },
+          index
+        );
+      }
+    ) });
+  };
+  const showSuggestions = isFocus && suggestions.length > 0;
+  return /* @__PURE__ */ jsxs3("div", { className: "viking-auto-complete", style, ref: componentRef, children: [
+    /* @__PURE__ */ jsx8(
+      input_default,
+      {
+        value: inputValue,
+        onChange: handleChange,
+        ...restprops,
+        onKeyDown: handleKeyDown,
+        onClick: handleClick,
+        "aria-expanded": showSuggestions,
+        "aria-autocomplete": "list",
+        "aria-controls": showSuggestions ? "suggestion-listbox" : void 0,
+        "aria-activedescendant": highlightIndex >= 0 ? `suggestion-item-${highlightIndex}` : void 0,
+        role: "combobox"
+      }
+    ),
+    isFocus && loading && /* @__PURE__ */ jsxs3("ul", { children: [
+      /* @__PURE__ */ jsx8(icon_default, { icon: "spinner", spin: true }),
+      "loading..."
+    ] }),
+    showSuggestions && generateDropdown()
+  ] });
+};
+var autoComplete_default = AutoComplete;
+
+// src/components/Upload/upload.tsx
+import { useRef as useRef4, useState as useState6 } from "react";
+import axios from "axios";
+
+// src/components/Progress/progress.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+var Progress = (props) => {
+  const {
+    percent,
+    strokeHeight = 15,
+    showText = true,
+    style,
+    theme = "primary"
+  } = props;
+  return /* @__PURE__ */ jsx9("div", { className: "viking-progress-bar", style, children: /* @__PURE__ */ jsx9("div", { className: "viking-progress-bar-outer", style: { height: `${strokeHeight}px` }, children: /* @__PURE__ */ jsx9(
+    "div",
+    {
+      className: `viking-progress-bar-inner color-${theme}`,
+      style: { width: `${percent}%` },
+      children: showText && /* @__PURE__ */ jsx9("span", { className: "inner-text", children: `${percent}%` })
+    }
+  ) }) });
+};
+var progress_default = Progress;
+
+// src/components/Upload/uploadList.tsx
+import { jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
+var UploadList = (props) => {
+  const {
+    fileList,
+    onRemove,
+    style
+  } = props;
+  return /* @__PURE__ */ jsx10("ul", { className: "viking-upload-list", style, children: fileList.map((item) => {
+    return /* @__PURE__ */ jsxs4("li", { className: "viking-upload-list-item", children: [
+      /* @__PURE__ */ jsxs4("span", { className: `file-name file-name-${item.status}`, children: [
+        /* @__PURE__ */ jsx10(icon_default, { icon: "file-alt", theme: "secondary" }),
+        item.name
+      ] }),
+      /* @__PURE__ */ jsxs4("span", { className: "file-status", children: [
+        (item.status === "uploading" || item.status === "ready") && /* @__PURE__ */ jsx10(icon_default, { icon: "spinner", spin: true, theme: "primary" }),
+        item.status === "success" && /* @__PURE__ */ jsx10(icon_default, { icon: "check-circle", theme: "success" }),
+        item.status === "error" && /* @__PURE__ */ jsx10(icon_default, { icon: "times-circle", theme: "danger" })
+      ] }),
+      /* @__PURE__ */ jsx10("span", { className: "file-actions", children: /* @__PURE__ */ jsx10(icon_default, { icon: "times", onClick: () => {
+        onRemove(item);
+      } }) }),
+      item.status === "uploading" && /* @__PURE__ */ jsx10(
+        progress_default,
+        {
+          percent: item.percent || 0
+        }
+      )
+    ] }, item.uid);
+  }) });
+};
+var uploadList_default = UploadList;
+
+// src/components/Upload/dragger.tsx
+import { useState as useState5, useRef as useRef3 } from "react";
+import classNames8 from "classnames";
+import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
+var Dragger = (props) => {
+  const { onFile, children, style } = props;
+  const [dragOver, setDragOver] = useState5(false);
+  const fileInput = useRef3(null);
+  const klass = classNames8("viking-uploader-dragger", {
+    "is-dragover": dragOver
+  });
+  const handleDrop = (e) => {
+    e.preventDefault();
+    setDragOver(false);
+    onFile(e.dataTransfer.files);
+  };
+  const handleDrag = (e, over) => {
+    e.preventDefault();
+    setDragOver(over);
+  };
+  const handleKeyDown = (e) => {
+    var _a;
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      (_a = fileInput.current) == null ? void 0 : _a.click();
+    }
+  };
+  return /* @__PURE__ */ jsxs5(
+    "div",
+    {
+      className: klass,
+      onDragOver: (e) => {
+        handleDrag(e, true);
+      },
+      onDragLeave: (e) => {
+        handleDrag(e, false);
+      },
+      onDrop: handleDrop,
+      style,
+      role: "button",
+      tabIndex: 0,
+      onKeyDown: handleKeyDown,
+      "aria-label": "\u62D6\u62FD\u4E0A\u4F20\u533A\u57DF",
+      children: [
+        /* @__PURE__ */ jsx11(
+          "input",
+          {
+            type: "file",
+            ref: fileInput,
+            style: { display: "none" },
+            onChange: (e) => {
+              if (e.target.files) {
+                onFile(e.target.files);
+                e.target.value = "";
+              }
+            }
+          }
+        ),
+        children
+      ]
+    }
+  );
+};
+var dragger_default = Dragger;
+
+// src/components/Upload/upload.tsx
+import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+var Upload = (props) => {
+  const {
+    action,
+    beforeUpload,
+    onprogress,
+    onSuccess,
+    onError,
+    onChange,
+    onRemove,
+    onExceed,
+    name = "file",
+    headers,
+    data,
+    withCredentials,
+    accept,
+    multiple,
+    children,
+    drag,
+    maxsize,
+    maxnum,
+    styleButton,
+    styleDrag,
+    styleUploadList,
+    failednums = 0,
+    limit = Infinity
+  } = props;
+  const fileInput = useRef4(null);
+  const abortRecord = useRef4({});
+  const FileRecord = useRef4(/* @__PURE__ */ new Set());
+  const [fileList, setFileList] = useState6([]);
+  const handleClick = () => {
+    var _a;
+    (_a = fileInput.current) == null ? void 0 : _a.click();
+  };
+  const uploadFiles = (files) => {
+    if (maxnum && files.length > maxnum) {
+      onExceed == null ? void 0 : onExceed(`\u6587\u4EF6\u6570\u91CF\u4E0D\u80FD\u8D85\u8FC7${maxnum}`);
+      return;
+    }
+    let concurrency = 0;
+    const queue = [];
+    function AskTask(task) {
+      return new Promise(() => {
+        const executeRequest = () => {
+          concurrency++;
+          task[0]().then(() => {
+            concurrency--;
+            nextTask();
+          });
+        };
+        if (concurrency < limit) {
+          executeRequest();
+        } else {
+          queue.push([executeRequest, task[1]]);
+        }
+      });
+    }
+    function nextTask() {
+      if (concurrency < limit && queue.length > 0) {
+        while (queue.length > 0) {
+          const [task, fileName] = queue.shift();
+          if (FileRecord.current.has(fileName)) {
+            task();
+            break;
+          }
+        }
+      }
+    }
+    let uidCounter = 0;
+    function dealFile(file) {
+      let _file = {
+        uid: `upload-file-${Date.now()}-${uidCounter++}`,
+        size: file.size,
+        name: file.name,
+        percent: 0,
+        status: "ready",
+        raw: file
+      };
+      setFileList((prevList) => {
+        let isSame = false;
+        for (let i = 0; i < prevList.length; i++) {
+          if (prevList[i].name === _file.name) {
+            prevList[i] = _file;
+            isSame = true;
+          }
+        }
+        if (isSame) return prevList;
+        return [_file, ...prevList];
+      });
+      const formData = new FormData();
+      formData.append(name || "file", file);
+      data && Object.keys(data).forEach((key) => formData.append(key, data[key]));
+      const controller = new AbortController();
+      abortRecord.current = { ...abortRecord.current, [_file.uid]: controller };
+      return [_file, formData, controller];
+    }
+    const post = (_file, formData, controller, try_nums) => {
+      return new Promise((resolve) => {
+        axios.post(action, formData, {
+          headers: {
+            ...headers,
+            "Content-Type": "multipart/form-data"
+          },
+          withCredentials,
+          signal: controller.signal,
+          onUploadProgress: (e) => {
+            let percentage = Math.floor(e.loaded * 100 / e.total || 0);
+            if (percentage < 100) {
+              updateFileList(_file, {
+                percent: percentage,
+                status: "uploading"
+              });
+              _file.status = "uploading";
+              _file.percent = percentage;
+              onprogress == null ? void 0 : onprogress(percentage, _file);
+            }
+          }
+        }).then((res) => {
+          updateFileList(_file, { status: "success", response: res.data });
+          _file.status = "success";
+          _file.response = res.data;
+          onSuccess == null ? void 0 : onSuccess(res.data, _file);
+          onChange == null ? void 0 : onChange(_file);
+          resolve("success");
+        }).catch((err) => {
+          if (axios.isCancel(err)) {
+            resolve("cancel");
+          } else {
+            if (try_nums < failednums) {
+              const [_file_new, formData2, controller2] = dealFile(_file.raw);
+              AskTask([
+                () => post(_file_new, formData2, controller2, try_nums + 1),
+                _file.name
+              ]);
+            }
+            updateFileList(_file, { status: "error", error: err });
+            _file.status = "error";
+            _file.error = err;
+            onError == null ? void 0 : onError(err, _file);
+            onChange == null ? void 0 : onChange(_file);
+            resolve("failed");
+          }
+        });
+      });
+    };
+    let postFiles = Array.from(files);
+    postFiles.forEach((file) => {
+      if (maxsize && file.size > maxsize * 1024 * 1024) {
+        onExceed == null ? void 0 : onExceed(`\u6587\u4EF6\u5927\u5C0F\u4E0D\u80FD\u8D85\u8FC7${maxsize}Mb`);
+        return;
+      }
+      FileRecord.current.add(file.name);
+      if (!beforeUpload) {
+        const [_file, formData, source] = dealFile(file);
+        AskTask([() => post(_file, formData, source, 0), file.name]);
+      } else {
+        const result = beforeUpload(file);
+        if (result && result instanceof Promise) {
+          result.then((processedFile) => {
+            const [_file, formData, source] = dealFile(file);
+            AskTask([() => post(_file, formData, source, 0), file.name]);
+          });
+        } else if (result) {
+          const [_file, formData, source] = dealFile(file);
+          AskTask([() => post(_file, formData, source, 0), file.name]);
+        }
+      }
+    });
+  };
+  const updateFileList = (updateFile, uploadobj) => {
+    setFileList((prevList) => {
+      return prevList.map(
+        (file) => file.uid === updateFile.uid ? { ...file, ...uploadobj } : file
+      );
+    });
+  };
+  const handleFileChange = (e) => {
+    const files = e.target.files;
+    if (files) {
+      uploadFiles(files);
+      if (fileInput.current) {
+        fileInput.current.value = "";
+      }
+    }
+  };
+  const handleRemove = (file) => {
+    var _a;
+    setFileList((prevList) => {
+      return prevList.filter((item) => item.uid !== file.uid);
+    });
+    (_a = abortRecord.current[file.uid]) == null ? void 0 : _a.abort();
+    delete abortRecord.current[file.uid];
+    FileRecord.current.delete(file.name);
+    onRemove == null ? void 0 : onRemove(file);
+  };
+  return /* @__PURE__ */ jsxs6("div", { className: "viking-upload-component", children: [
+    drag ? /* @__PURE__ */ jsx12(
+      dragger_default,
+      {
+        style: styleDrag,
+        onFile: (files) => {
+          uploadFiles(files);
+        },
+        children
+      }
+    ) : /* @__PURE__ */ jsx12(button_default, { btnType: "default", onClick: handleClick, style: styleButton, children }),
+    /* @__PURE__ */ jsx12(
+      "input",
+      {
+        type: "file",
+        className: "viking-file-input",
+        style: { display: "none" },
+        ref: fileInput,
+        onChange: handleFileChange,
+        accept,
+        multiple
+      }
+    ),
+    /* @__PURE__ */ jsx12(
+      uploadList_default,
+      {
+        style: styleUploadList,
+        fileList,
+        onRemove: handleRemove
+      }
+    )
+  ] });
+};
+var upload_default = Upload;
+
+// src/components/Signature/signature.tsx
+import { useState as useState7, useRef as useRef5, useEffect as useEffect4 } from "react";
+import { Fragment, jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
+var Signature = ({
+  width = 400,
+  height = 200,
+  style,
+  onSave
+}) => {
+  const [isDrawing, setIsDrawing] = useState7(false);
+  const [strokeStyle, setStrokeStyle] = useState7("pen");
+  const [points, setPoints] = useState7({
+    x: 0,
+    y: 0
+  });
+  const canvas = useRef5(null);
+  const ctx = useRef5();
+  useEffect4(() => {
+    var _a;
+    ctx.current = (_a = canvas.current) == null ? void 0 : _a.getContext("2d");
+  }, []);
+  useEffect4(() => {
+    if (!ctx.current) return;
+    if (strokeStyle === "pen") {
+      ctx.current.lineWidth = 2;
+      ctx.current.lineCap = "round";
+    } else if (strokeStyle === "brush") {
+      ctx.current.lineWidth = 5;
+      ctx.current.lineCap = "round";
+    }
+  }, [strokeStyle]);
+  const startDrawing = (e) => {
+    var _a, _b;
+    setIsDrawing(true);
+    (_a = ctx.current) == null ? void 0 : _a.beginPath();
+    const { offsetX, offsetY } = getEventPosition(e);
+    setPoints({ x: offsetX, y: offsetY });
+    (_b = ctx.current) == null ? void 0 : _b.moveTo(offsetX, offsetY);
+  };
+  const draw = (e) => {
+    var _a, _b;
+    if (!isDrawing) return;
+    const { offsetX, offsetY } = getEventPosition(e);
+    (_a = ctx.current) == null ? void 0 : _a.quadraticCurveTo(
+      points["x"],
+      points["y"],
+      (points["x"] + offsetX) / 2,
+      (points["y"] + offsetY) / 2
+    );
+    (_b = ctx.current) == null ? void 0 : _b.stroke();
+    setPoints({ x: offsetX, y: offsetY });
+  };
+  const stopDrawing = (e) => {
+    setIsDrawing(false);
+  };
+  const getEventPosition = (e) => {
+    var _a, _b;
+    const offsetX = (_a = e.nativeEvent.offsetX) != null ? _a : e.touches[0].clientX - canvas.current.offsetLeft;
+    const offsetY = (_b = e.nativeEvent.offsetY) != null ? _b : e.touches[0].clientY - canvas.current.offsetTop;
+    return { offsetX, offsetY };
+  };
+  const handleStrokeStyle = (e) => {
+    setStrokeStyle(e.target.value);
+  };
+  const handleSave = () => {
+    var _a;
+    const dataURL = (_a = canvas.current) == null ? void 0 : _a.toDataURL();
+    onSave == null ? void 0 : onSave(dataURL);
+  };
+  return /* @__PURE__ */ jsxs7(Fragment, { children: [
+    /* @__PURE__ */ jsx13(
+      "canvas",
+      {
+        ref: canvas,
+        onMouseDown: startDrawing,
+        onMouseUp: stopDrawing,
+        onMouseMove: draw,
+        onMouseOut: stopDrawing,
+        onTouchStart: startDrawing,
+        onTouchEnd: stopDrawing,
+        onTouchMove: draw,
+        onTouchCancel: stopDrawing,
+        style: { border: "1px solid black", ...style },
+        width,
+        height,
+        className: "viking-signature",
+        "aria-label": "\u7B7E\u540D\u753B\u5E03",
+        role: "img"
+      }
+    ),
+    /* @__PURE__ */ jsxs7("div", { className: "controls", style: { width }, children: [
+      /* @__PURE__ */ jsx13("label", { htmlFor: "stroke-style-select", children: "\u7B14\u89E6\u6837\u5F0F" }),
+      /* @__PURE__ */ jsxs7("select", { id: "stroke-style-select", onChange: handleStrokeStyle, children: [
+        /* @__PURE__ */ jsx13("option", { value: "pen", children: "\u94A2\u7B14" }),
+        /* @__PURE__ */ jsx13("option", { value: "brush", children: "\u6BDB\u7B14" })
+      ] }),
+      /* @__PURE__ */ jsx13(
+        "button",
+        {
+          type: "button",
+          onClick: () => ctx.current.clearRect(
+            0,
+            0,
+            canvas.current.width,
+            canvas.current.height
+          ),
+          children: "\u6E05\u7A7A"
+        }
+      ),
+      /* @__PURE__ */ jsx13("button", { type: "button", onClick: handleSave, children: "\u4FDD\u5B58" })
+    ] })
+  ] });
+};
+var signature_default = Signature;
+
+// src/components/VirtualList/virtualList.tsx
+import { useState as useState8, Children as Children2, cloneElement } from "react";
+import { jsx as jsx14 } from "react/jsx-runtime";
+var VirtualList = ({
+  containerHeight,
+  itemHeight,
+  itemCount,
+  children
+}) => {
+  if (Children2.count(children) > 1) {
+    throw new Error("VirtualList only accept one child");
+  }
+  const contentHeight = itemHeight * itemCount;
+  const [scrollTop, setScrollTop] = useState8(0);
+  let startIdx = Math.floor(scrollTop / itemHeight);
+  let endIdx = Math.floor((scrollTop + containerHeight) / itemHeight);
+  const paddingCount = 2;
+  startIdx = Math.max(startIdx - paddingCount, 0);
+  endIdx = Math.min(endIdx + paddingCount, itemCount - 1);
+  const top = itemHeight * startIdx;
+  const items = [];
+  for (let i = startIdx; i <= endIdx; i++) {
+    items.push(
+      cloneElement(children, {
+        index: i,
+        style: { height: itemHeight }
+      })
+    );
+  }
+  return /* @__PURE__ */ jsx14(
+    "div",
+    {
+      style: { height: containerHeight, overflow: "auto" },
+      onScroll: (e) => {
+        setScrollTop(e.target.scrollTop);
+      },
+      children: /* @__PURE__ */ jsx14("div", { style: { height: contentHeight }, children: /* @__PURE__ */ jsx14("div", { style: { transform: `translate3d(0px, ${top}px, 0` }, children: items }) })
+    }
+  );
+};
+var virtualList_default = VirtualList;
+
+// src/components/LazyLoad/lazyLoad.tsx
+import {
+  useEffect as useEffect5,
+  useRef as useRef6,
+  useState as useState9
+} from "react";
+import { jsx as jsx15 } from "react/jsx-runtime";
+var Lazyload = (props) => {
+  const {
+    className = "",
+    style,
+    offset = 0,
+    width,
+    onContentVisible,
+    placeholder,
+    height,
+    children
+  } = props;
+  const containerRef = useRef6(null);
+  const [visible, setVisible] = useState9(false);
+  const elementObserver = useRef6();
+  useEffect5(() => {
+    function lazyLoadHandler(entries) {
+      var _a;
+      const [entry] = entries;
+      const { isIntersecting } = entry;
+      if (isIntersecting) {
+        setVisible(true);
+        onContentVisible == null ? void 0 : onContentVisible();
+        const node2 = containerRef.current;
+        if (node2 && node2 instanceof HTMLElement) {
+          (_a = elementObserver.current) == null ? void 0 : _a.unobserve(node2);
+        }
+      }
+    }
+    const options = {
+      rootMargin: typeof offset === "number" ? `${offset}px` : offset || "0px",
+      threshold: 0
+    };
+    elementObserver.current = new IntersectionObserver(
+      lazyLoadHandler,
+      options
+    );
+    const node = containerRef.current;
+    if (node instanceof HTMLElement) {
+      elementObserver.current.observe(node);
+    }
+    return () => {
+      var _a;
+      if (node && node instanceof HTMLElement) {
+        (_a = elementObserver.current) == null ? void 0 : _a.unobserve(node);
+      }
+    };
+  }, [offset, onContentVisible]);
+  const styles = { height, width, ...style };
+  return /* @__PURE__ */ jsx15("div", { ref: containerRef, className, style: styles, children: visible ? children : placeholder });
+};
+var lazyLoad_default = Lazyload;
+
+// src/components/Keepalive/Keepalive.tsx
+import { createContext as createContext2, useContext as useContext3, useEffect as useEffect6, useRef as useRef7, useState as useState10 } from "react";
+import { useOutlet, useLocation, matchPath } from "react-router-dom";
+import { Fragment as Fragment2, jsx as jsx16, jsxs as jsxs8 } from "react/jsx-runtime";
+var KeepAliveContext = createContext2({
+  keepPaths: [],
+  keepElements: {},
+  dropByPath() {
+  }
+});
+var isKeepPath = (keepPaths, path) => {
+  for (let i = 0; i < keepPaths.length; i++) {
+    let item = keepPaths[i];
+    if (item === path) return true;
+    if (item instanceof RegExp && item.test(path)) return true;
+    if (typeof item === "string" && item.toLowerCase() === path) return true;
+  }
+  return false;
+};
+function useKeepOutlet() {
+  const location = useLocation();
+  const element = useOutlet();
+  const { keepElements, keepPaths } = useContext3(KeepAliveContext);
+  const isKeep = isKeepPath(keepPaths, location.pathname);
+  const keepElementsRef = useRef7(keepElements);
+  keepElementsRef.current = keepElements;
+  useEffect6(() => {
+    if (isKeep && element) {
+      keepElementsRef.current[location.pathname] = element;
+    }
+  });
+  return /* @__PURE__ */ jsxs8(Fragment2, { children: [
+    Object.entries(keepElements).map(([pathname, el]) => /* @__PURE__ */ jsx16(
+      "div",
+      {
+        style: {
+          height: "100%",
+          width: "100%",
+          position: "relative",
+          overflow: "hidden auto"
+        },
+        className: "keep-alive-page",
+        hidden: !matchPath(location.pathname, pathname),
+        children: el
+      },
+      pathname
+    )),
+    !isKeep && element
+  ] });
+}
+var KeepAliveLayout = (props) => {
+  const { keepPaths, children } = props;
+  const [keepElements] = useState10({});
+  const dropByPath = (path) => {
+    delete keepElements[path];
+  };
+  return /* @__PURE__ */ jsx16(KeepAliveContext.Provider, { value: { keepPaths, keepElements, dropByPath }, children });
+};
+var Keepalive_default = KeepAliveLayout;
+export {
+  autoComplete_default as AutoComplete,
+  button_default as Button,
+  icon_default as Icon,
+  input_default as Input,
+  KeepAliveContext,
+  Keepalive_default as KeepAliveLayout,
+  lazyLoad_default as LazyLoad,
+  Menu_default as Menu,
+  menuItem_default as MenuItem,
+  progress_default as Progress,
+  signature_default as Signature,
+  subMenu_default as SubMenu,
+  transition_default as Transition,
+  upload_default as Upload,
+  virtualList_default as VirtualList,
+  useClickOutside_default as useClickOutside,
+  useDebounce_default as useDebounce,
+  useKeepOutlet
+};
+//# sourceMappingURL=index.mjs.map