@cloudtower/eagle 0.35.1 → 0.35.3

package/dist/cjs/core/LocalUpload/LocalUpload.widget.js

@@ -0,0 +1,379 @@
+'use strict';
+
+var iconsReact = require('@cloudtower/icons-react');
+var core = require('@linaria/core');
+var index$1 = require('../Button/index.js');
+var index$4 = require('../Byte/index.js');
+var index$2 = require('../Icon/index.js');
+var index$5 = require('../Tooltip/index.js');
+var index = require('../Typo/index.js');
+var index$3 = require('../../coreX/OverflowTooltip/index.js');
+var useParrotTranslation = require('../../hooks/useParrotTranslation.js');
+var cs = require('classnames');
+var _ = require('lodash');
+var React = require('react');
+var LocalUpload_hooks = require('./LocalUpload.hooks.js');
+var LocalUpload_style = require('./LocalUpload.style.js');
+var antd = require('antd');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var cs__default = /*#__PURE__*/_interopDefault(cs);
+var ___default = /*#__PURE__*/_interopDefault(_);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const STATUS_ICON_MAP = {
+  error: iconsReact.ExclamationErrorCircleFill16RedIcon,
+  success: iconsReact.File16GradientBlueIcon,
+  validating: iconsReact.Loading16GradientBlueIcon,
+  "need-validate": iconsReact.Loading16GradientBlueIcon
+};
+const createBeforeUploadHandler = ({
+  fileList,
+  setFileList,
+  validate,
+  maxCount,
+  isSingleSelect,
+  setError,
+  t,
+  checkSingleSelectCount = false
+}) => {
+  return (file, _fileList) => {
+    if (isSingleSelect) {
+      if (checkSingleSelectCount && _fileList.length > 1) {
+        setError(t("components.exceed_max_count", { count: 1 }) || "");
+        return false;
+      } else {
+        setError("");
+      }
+      const _file2 = file;
+      _file2.fileStatus = validate ? "need-validate" : "success";
+      setFileList([_file2]);
+      return false;
+    }
+    if (fileList.length + _fileList.length > maxCount) {
+      setError(t("components.exceed_max_count", { count: maxCount }) || "");
+    } else {
+      setError("");
+    }
+    const _file = file;
+    _file.fileStatus = validate ? "need-validate" : "success";
+    const index = _fileList.findIndex((f) => f.uid === _file.uid);
+    if (index !== -1) {
+      const newList = ___default.default.uniqBy(
+        [...fileList, ..._fileList.slice(0, index + 1)],
+        "uid"
+      );
+      setFileList(newList);
+    }
+    return false;
+  };
+};
+const UploadLabel = ({ className, children }) => {
+  return /* @__PURE__ */ React__default.default.createElement("label", { className: core.cx("upload-label", index.Typo.Label.l2_regular, className) }, children);
+};
+const UploadDescription = ({ className, children }) => {
+  return /* @__PURE__ */ React__default.default.createElement("div", { className: core.cx("upload-description", index.Typo.Label.l4_regular, className) }, children);
+};
+const UploadButton = ({
+  children,
+  hideIcon = false,
+  className,
+  fileList,
+  setFileList,
+  validate,
+  maxCount,
+  multiple = false,
+  disabled,
+  accept
+}) => {
+  const { t } = useParrotTranslation();
+  const [error, setError] = React.useState("");
+  const _maxCount = multiple ? maxCount || Infinity : 1;
+  const isSingleSelect = _maxCount === 1;
+  LocalUpload_hooks.useFileValidation({
+    fileList,
+    setFileList,
+    validate,
+    createNewFile: false
+  });
+  LocalUpload_hooks.useFileCountErrorClear({
+    fileList,
+    maxCount: _maxCount,
+    setError
+  });
+  const props = {
+    accept,
+    fileList,
+    showUploadList: false,
+    beforeUpload: createBeforeUploadHandler({
+      fileList,
+      setFileList,
+      validate,
+      maxCount: _maxCount,
+      isSingleSelect,
+      setError,
+      t,
+      checkSingleSelectCount: false
+    }),
+    multiple
+  };
+  return /* @__PURE__ */ React__default.default.createElement(antd.Upload, __spreadProps(__spreadValues({}, props), { className: cs__default.default("upload-button", className) }), /* @__PURE__ */ React__default.default.createElement(
+    index$1,
+    {
+      disabled,
+      prefixIcon: !hideIcon ? /* @__PURE__ */ React__default.default.createElement(index$2, { src: iconsReact.Uploading16GradientGrayIcon }) : void 0,
+      hoverPrefixIcon: !hideIcon ? /* @__PURE__ */ React__default.default.createElement(index$2, { src: iconsReact.Uploading16GradientBlueIcon }) : void 0
+    },
+    children
+  ), error ? /* @__PURE__ */ React__default.default.createElement("div", { className: core.cx("upload-error", index.Typo.Label.l4_regular) }, error) : null);
+};
+const UploadDragger = ({
+  children,
+  className,
+  fileList,
+  setFileList,
+  validate,
+  maxCount,
+  multiple = false,
+  disabled,
+  accept
+}) => {
+  var _a;
+  const { t } = useParrotTranslation();
+  const [error, setError] = React.useState("");
+  const _maxCount = multiple ? maxCount || Infinity : 1;
+  const isSingleSelect = _maxCount === 1;
+  const reachMaxCount = !!maxCount && !isSingleSelect && fileList.length >= maxCount;
+  LocalUpload_hooks.useFileValidation({
+    fileList,
+    setFileList,
+    validate,
+    createNewFile: true
+  });
+  LocalUpload_hooks.useFileCountErrorClear({
+    fileList,
+    maxCount: _maxCount,
+    setError
+  });
+  const props = {
+    accept,
+    fileList,
+    showUploadList: false,
+    beforeUpload: createBeforeUploadHandler({
+      fileList,
+      setFileList,
+      validate,
+      maxCount: _maxCount,
+      isSingleSelect,
+      setError,
+      t,
+      checkSingleSelectCount: true
+    }),
+    disabled,
+    multiple
+  };
+  const DefaultChildren = /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement(
+    index$2,
+    {
+      src: (fileList == null ? void 0 : fileList.length) ? reachMaxCount ? iconsReact.Upload24GradientGrayIcon : iconsReact.Upload24GradientBlueIcon : iconsReact.Upload48GradientBlueIcon,
+      iconHeight: (fileList == null ? void 0 : fileList.length) ? 24 : 48,
+      iconWidth: (fileList == null ? void 0 : fileList.length) ? 24 : 48
+    }
+  ), /* @__PURE__ */ React__default.default.createElement("div", { className: core.cx("upload-drag-text", index.Typo.Label.l2_regular) }, t("components.upload_file_desc")));
+  const fileStatus = isSingleSelect ? ((_a = fileList[0]) == null ? void 0 : _a.fileStatus) || "success" : void 0;
+  const FileInfo = ({ file }) => {
+    const fileStatus2 = file.fileStatus || "success";
+    return /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement("div", { className: "file-info", onClick: (e) => e.preventDefault() }, /* @__PURE__ */ React__default.default.createElement(
+      index$2,
+      {
+        src: STATUS_ICON_MAP[fileStatus2],
+        isRotate: fileStatus2 === "validating" || fileStatus2 === "need-validate"
+      }
+    ), /* @__PURE__ */ React__default.default.createElement("div", { className: core.cx("file-name", index.Typo.Label.l4_regular) }, file.name || file.fileName)), /* @__PURE__ */ React__default.default.createElement(index$1, { className: index.Typo.Label.l2_regular, type: "link" }, t("components.reselect_file")));
+  };
+  const Error2 = () => {
+    if (error) {
+      return /* @__PURE__ */ React__default.default.createElement("div", { className: core.cx("upload-error", index.Typo.Label.l4_regular) }, error);
+    }
+    const file = fileList[0];
+    if (isSingleSelect && (file == null ? void 0 : file.fileStatus) === "error" && file.error) {
+      return /* @__PURE__ */ React__default.default.createElement("div", { className: core.cx("upload-error", index.Typo.Label.l4_regular) }, file.error);
+    }
+    return null;
+  };
+  return /* @__PURE__ */ React__default.default.createElement("div", { className: cs__default.default("upload-drag", className) }, /* @__PURE__ */ React__default.default.createElement(
+    antd.Upload.Dragger,
+    __spreadProps(__spreadValues({}, props), {
+      disabled: disabled || fileStatus === "validating",
+      className: cs__default.default(
+        "upload-drag-area",
+        fileList.length ? "has-file" : "",
+        reachMaxCount && "reach-max-count",
+        isSingleSelect && "single",
+        fileStatus === "error" && "file-error",
+        fileStatus === "validating" && "file-validating"
+      )
+    }),
+    isSingleSelect && fileList.length ? /* @__PURE__ */ React__default.default.createElement(FileInfo, { file: fileList[0] }) : children || DefaultChildren
+  ), /* @__PURE__ */ React__default.default.createElement(Error2, null));
+};
+const UploadFileInfo = ({
+  file,
+  removeFile,
+  disabled,
+  onRemove
+}) => {
+  const fileStatus = file.fileStatus || "success";
+  const handleRemove = () => {
+    var _a;
+    removeFile((_a = file.uid) != null ? _a : "");
+    if (onRemove && "fileStatus" in file) {
+      onRemove(file);
+    }
+  };
+  return /* @__PURE__ */ React__default.default.createElement(
+    "div",
+    {
+      className: cs__default.default(LocalUpload_style.FileInfoWrapperStyle, {
+        "file-error-wrapper": fileStatus === "error",
+        disabled
+      })
+    },
+    /* @__PURE__ */ React__default.default.createElement(
+      index$2,
+      {
+        src: STATUS_ICON_MAP[fileStatus],
+        isRotate: fileStatus === "validating" || fileStatus === "need-validate"
+      }
+    ),
+    /* @__PURE__ */ React__default.default.createElement("div", { className: core.cx("file-info", index.Typo.Label.l4_regular) }, /* @__PURE__ */ React__default.default.createElement(
+      index$3,
+      {
+        className: "file-name",
+        content: file.name || file.fileName,
+        tooltip: file.name || file.fileName
+      }
+    ), file.size ? /* @__PURE__ */ React__default.default.createElement("div", { className: "file-info" }, /* @__PURE__ */ React__default.default.createElement(
+      index$4,
+      {
+        rawValue: file.size,
+        valueClassName: "file-size",
+        unitClassName: "file-size-unit"
+      }
+    )) : /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null), file.fileStatus === "error" && !!file.error && /* @__PURE__ */ React__default.default.createElement("div", { className: core.cx("upload-file-error", index.Typo.Footnote.f2_regular) }, file.error)),
+    /* @__PURE__ */ React__default.default.createElement(
+      index$2,
+      {
+        src: iconsReact.XmarkRemove16SecondaryIcon,
+        onClick: disabled ? void 0 : handleRemove
+      }
+    )
+  );
+};
+const FileListItem = ({ file, removeFile, onRemove }) => {
+  const fileStatus = file.fileStatus || "success";
+  const { t } = useParrotTranslation();
+  const handleRemove = (e) => {
+    e.stopPropagation();
+    removeFile(file.uid);
+    onRemove == null ? void 0 : onRemove(file);
+  };
+  return /* @__PURE__ */ React__default.default.createElement(
+    "div",
+    {
+      className: core.cx("upload-file-item", index.Typo.Label.l4_regular),
+      key: file.uid
+    },
+    /* @__PURE__ */ React__default.default.createElement("div", { className: "upload-file-info" }, /* @__PURE__ */ React__default.default.createElement("div", { className: "file-info" }, /* @__PURE__ */ React__default.default.createElement(
+      index$2,
+      {
+        src: STATUS_ICON_MAP[fileStatus],
+        isRotate: fileStatus === "validating" || fileStatus === "need-validate"
+      }
+    ), /* @__PURE__ */ React__default.default.createElement(
+      "div",
+      {
+        className: fileStatus === "validating" || fileStatus === "need-validate" ? "validating" : ""
+      },
+      file.name || file.fileName
+    )), /* @__PURE__ */ React__default.default.createElement(index$5, { title: t("common.remove") }, /* @__PURE__ */ React__default.default.createElement(
+      index$2,
+      {
+        className: "remove-button",
+        src: iconsReact.XmarkRemove24SecondaryIcon,
+        onClick: handleRemove
+      }
+    ))),
+    file.fileStatus === "error" && !!file.error && /* @__PURE__ */ React__default.default.createElement("div", { className: core.cx("upload-file-error", index.Typo.Footnote.f2_regular) }, file.error)
+  );
+};
+const UploadFileList = ({
+  className,
+  fileList,
+  removeFile,
+  type = "list",
+  disableRemove = false,
+  onRemove
+}) => {
+  if (!fileList.length) {
+    return null;
+  }
+  return /* @__PURE__ */ React__default.default.createElement(
+    "div",
+    {
+      className: cs__default.default(
+        "upload-file-list",
+        type === "list" ? "" : "upload-file-info-list",
+        className
+      )
+    },
+    fileList.map(
+      (file) => type === "list" ? /* @__PURE__ */ React__default.default.createElement(
+        FileListItem,
+        {
+          key: file.uid,
+          file,
+          removeFile,
+          onRemove
+        }
+      ) : /* @__PURE__ */ React__default.default.createElement(
+        UploadFileInfo,
+        {
+          key: file.uid,
+          file,
+          removeFile,
+          disabled: disableRemove,
+          onRemove
+        }
+      )
+    )
+  );
+};
+
+exports.FileListItem = FileListItem;
+exports.UploadButton = UploadButton;
+exports.UploadDescription = UploadDescription;
+exports.UploadDragger = UploadDragger;
+exports.UploadFileInfo = UploadFileInfo;
+exports.UploadFileList = UploadFileList;
+exports.UploadLabel = UploadLabel;

package/dist/cjs/core/MediumDialog/MediumDialog.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var React = require('react');
 var core = require('@linaria/core');
+var React = require('react');
 var index = require('../Typo/index.js');
 var SmallDialog = require('../SmallDialog/SmallDialog.js');
 

package/dist/cjs/core/SmallDialog/SmallDialog.js

@@ -3,14 +3,14 @@
 var iconsReact = require('@cloudtower/icons-react');
 var core = require('@linaria/core');
 var index = require('../KitStoreProvider/index.js');
+var useParrotTranslation = require('../../hooks/useParrotTranslation.js');
 var antd = require('antd');
-var React = require('react');
 var cs = require('classnames');
+var React = require('react');
 var index$4 = require('../../coreX/OverflowTooltip/index.js');
 var index$1 = require('../../coreX/Show/index.js');
 var SmallDialog_style = require('./SmallDialog.style.js');
 var SmallDialog_widget = require('./SmallDialog.widget.js');
-var useParrotTranslation = require('../../hooks/useParrotTranslation.js');
 var index$3 = require('../Icon/index.js');
 var index$5 = require('../Button/index.js');
 var antd5 = require('antd5');
@@ -18,8 +18,8 @@ var index$2 = require('../Typo/index.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
-var React__default = /*#__PURE__*/_interopDefault(React);
 var cs__default = /*#__PURE__*/_interopDefault(cs);
+var React__default = /*#__PURE__*/_interopDefault(React);
 
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -58,6 +58,7 @@ const SmallDialog = ({
   okButtonProps,
   cancelButtonProps,
   children,
+  hideFooter = false,
   showFooterErrorIcon = true,
   error,
   confirmLoading,
@@ -91,7 +92,7 @@ const SmallDialog = ({
       visible: true,
       width,
       title: initializing ? /* @__PURE__ */ React__default.default.createElement(SmallDialog_widget.ModelTitleSkeleton, null) : /* @__PURE__ */ React__default.default.createElement(CustomTitleRender, { title: title || defaultTitle }),
-      footer: initializing ? null : /* @__PURE__ */ React__default.default.createElement(
+      footer: initializing ? null : hideFooter ? /* @__PURE__ */ React__default.default.createElement("div", null) : /* @__PURE__ */ React__default.default.createElement(
         "div",
         {
           className: cs__default.default(SmallDialog_style.FooterStyle, footerClassName, {
@@ -144,7 +145,8 @@ const SmallDialog = ({
       closable,
       maskClosable,
       className: cs__default.default(SmallDialog_style.DialogStyle, className, {
-        "initializing-error": initializingError
+        "initializing-error": initializingError,
+        "no-footer": hideFooter
       }),
       closeIcon: /* @__PURE__ */ React__default.default.createElement(
         index$3,

package/dist/cjs/core/Tab/Tab.js

@@ -0,0 +1,113 @@
+'use strict';
+
+var iconsReact = require('@cloudtower/icons-react');
+var core = require('@linaria/core');
+var antd = require('antd');
+var React = require('react');
+var index$1 = require('../Icon/index.js');
+var index = require('../Typo/index.js');
+var Tab_style = require('./Tab.style.js');
+var Tab_type = require('./Tab.type.js');
+var useTabAdaptiveLayout = require('./useTabAdaptiveLayout.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const getSelectedStyle = (key, type, selectedKey, activeTabType) => {
+  return key === selectedKey && activeTabType === type ? ["__selected", index.Typo.Label.l1_bold_title] : [index.Typo.Label.l1_regular];
+};
+const Tab = props => {
+  const {
+    className,
+    contentClassName,
+    tabs,
+    onChange,
+    selectedKey,
+    extraSlot,
+    size = "medium"
+  } = props;
+  const tabsRef = React.useRef(null);
+  const extraSlotRef = React.useRef(null);
+  const [isClickedMoreTabItem, setIsClickedMoreTabItem] = React.useState(false);
+  const allTabs = React.useMemo(() => {
+    return tabs.reduce((map, tab) => {
+      map.set(tab.key, tab);
+      return map;
+    }, /* @__PURE__ */new Map([]));
+  }, [tabs]);
+  const selectedTab = React.useMemo(() => allTabs.get(selectedKey), [allTabs, selectedKey]);
+  const moreTabs = useTabAdaptiveLayout.useTabAdaptiveLayout(tabs, tabsRef, extraSlotRef, selectedKey);
+  const activeTabType = React.useMemo(() => {
+    if (moreTabs == null ? void 0 : moreTabs.find(tab => tab.key === (selectedTab == null ? void 0 : selectedTab.key))) {
+      return Tab_type.ActiveTabType.More;
+    }
+    if ((selectedTab == null ? void 0 : selectedTab.key) && allTabs.get(selectedTab.key)) {
+      return Tab_type.ActiveTabType.Common;
+    }
+  }, [moreTabs, allTabs, selectedTab == null ? void 0 : selectedTab.key]);
+  React.useLayoutEffect(() => {
+    var _a;
+    if (!allTabs.get(selectedKey) && ((_a = tabs == null ? void 0 : tabs[0]) == null ? void 0 : _a.key)) {
+      onChange == null ? void 0 : onChange(tabs[0].key);
+    }
+  }, [allTabs, onChange, selectedKey, tabs]);
+  return /* @__PURE__ */React__default.default.createElement(Tab_style.TabMenuWrapper, {
+    className: core.cx(className, size)
+  }, /* @__PURE__ */React__default.default.createElement("div", {
+    className: "tab-bar"
+  }, /* @__PURE__ */React__default.default.createElement("div", {
+    ref: tabsRef,
+    className: "common-tab-bar"
+  }, /* tab items */
+  tabs.map(tab => /* @__PURE__ */React__default.default.createElement("span", {
+    className: core.cx("tab-item-title", "common", ...getSelectedStyle(tab.key, Tab_type.ActiveTabType.Common, selectedKey, activeTabType)),
+    key: tab.key,
+    onClick: () => onChange == null ? void 0 : onChange(tab.key)
+  }, typeof tab.title === "function" ? tab.title({
+    isActive: tab.key === selectedKey
+  }) : tab.title)), /* more tab items */
+  moreTabs.length > 0 && /* @__PURE__ */React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */React__default.default.createElement(antd.Dropdown, {
+    trigger: ["click"],
+    overlayClassName: Tab_style.MoreThanTooltipStyle,
+    onVisibleChange: visible => setIsClickedMoreTabItem(visible),
+    getPopupContainer: triggerNode => document.querySelector(".tab-bar") || triggerNode,
+    overlay: /* @__PURE__ */React__default.default.createElement(antd.Menu, {
+      className: "menu-wrapper",
+      onClick: params => {
+        setIsClickedMoreTabItem(false);
+        onChange == null ? void 0 : onChange(params.key);
+      }
+    }, moreTabs.map(tab => {
+      return /* @__PURE__ */React__default.default.createElement(antd.Menu.Item, {
+        className: core.cx("tab-menu-item", ...getSelectedStyle(tab.key, Tab_type.ActiveTabType.More, selectedKey, activeTabType)),
+        key: tab.key
+      }, typeof tab.title === "function" ? tab.title({
+        isActive: tab.key === selectedKey
+      }) : tab.title);
+    }))
+  }, /* @__PURE__ */React__default.default.createElement("span", {
+    className: core.cx("tab-item-title", "more", Tab_style.TabTitleElStyle, activeTabType === Tab_type.ActiveTabType.More && "__selected", activeTabType === Tab_type.ActiveTabType.More ? index.Typo.Label.l1_bold_title : index.Typo.Label.l1_regular)
+  }, /* @__PURE__ */React__default.default.createElement(index$1, {
+    className: Tab_style.IconStyle,
+    hoverSrc: iconsReact.MoreMenu16BlueIcon,
+    src: iconsReact.MoreMenu16GrayIcon,
+    active: isClickedMoreTabItem
+  }), activeTabType === Tab_type.ActiveTabType.More && /* @__PURE__ */React__default.default.createElement("span", {
+    className: "tab-title-text"
+  }, typeof (selectedTab == null ? void 0 : selectedTab.title) === "function" ? selectedTab == null ? void 0 : selectedTab.title({
+    isActive: true
+  }) : selectedTab == null ? void 0 : selectedTab.title))), extraSlot && /* @__PURE__ */React__default.default.createElement("span", {
+    className: "E_ckaaqep"
+  }))), extraSlot && /* @__PURE__ */React__default.default.createElement("div", {
+    ref: extraSlotRef
+  }, extraSlot)), tabs.map(tab => /* @__PURE__ */React__default.default.createElement("div", {
+    style: {
+      display: tab.key === selectedKey ? "block" : "none"
+    },
+    key: tab.key,
+    className: contentClassName
+  }, tab == null ? void 0 : tab.children)));
+};
+
+exports.Tab = Tab;

package/dist/cjs/core/Tab/Tab.style.js

@@ -0,0 +1,17 @@
+'use strict';
+
+var react = require('@linaria/react');
+
+const TabMenuWrapper = /*#__PURE__*/react.styled('div')({
+  name: "TabMenuWrapper",
+  class: "E_t1tbywr9",
+  propsAsIs: false
+});
+const TabTitleElStyle = "E_ti12z2";
+const MoreThanTooltipStyle = "E_m19lu3v";
+const IconStyle = "E_i1bmwe2m";
+
+exports.IconStyle = IconStyle;
+exports.MoreThanTooltipStyle = MoreThanTooltipStyle;
+exports.TabMenuWrapper = TabMenuWrapper;
+exports.TabTitleElStyle = TabTitleElStyle;

package/dist/cjs/core/Tab/Tab.type.js

@@ -0,0 +1,9 @@
+'use strict';
+
+var ActiveTabType = /* @__PURE__ */ ((ActiveTabType2) => {
+  ActiveTabType2[ActiveTabType2["Common"] = 0] = "Common";
+  ActiveTabType2[ActiveTabType2["More"] = 1] = "More";
+  return ActiveTabType2;
+})(ActiveTabType || {});
+
+exports.ActiveTabType = ActiveTabType;

package/dist/cjs/core/Tab/useTabAdaptiveLayout.js

@@ -0,0 +1,73 @@
+'use strict';
+
+var _ = require('lodash');
+var React = require('react');
+
+const getPlacementWidth = (el) => {
+  if (!el) {
+    return 0;
+  }
+  const computedStyle = window.getComputedStyle(el);
+  const width = el.offsetWidth;
+  const marginLeft = parseInt(computedStyle.marginLeft || "0");
+  const marginRight = parseInt(computedStyle.marginRight || "0");
+  return width + marginLeft + marginRight;
+};
+const useTabAdaptiveLayout = (tabs, tabsRef, extraSlotRef, selectedKey) => {
+  const [moreTabs, setMoreTabs] = React.useState([]);
+  const doAdapt = React.useCallback(() => {
+    if (!tabsRef.current)
+      return;
+    const tabBarEl = tabsRef.current;
+    const tabNodeList = tabBarEl.querySelectorAll(".tab-item-title.common");
+    const moreTabNode = tabBarEl.querySelector(
+      ".tab-item-title.more"
+    );
+    const moreTabPlacementWidth = getPlacementWidth(moreTabNode);
+    tabNodeList.forEach((tab) => tab.classList.remove("__hidden"));
+    const maxContentWidth = getPlacementWidth(tabBarEl.parentElement) - getPlacementWidth(extraSlotRef.current) - moreTabPlacementWidth;
+    let tabsTotalWidth = 24;
+    const hiddenItems = [];
+    let endIndex = Infinity;
+    for (let i = 0; i < tabNodeList.length; i++) {
+      const tab = tabNodeList[i];
+      const tabWidth = getPlacementWidth(tab);
+      if (maxContentWidth >= tabsTotalWidth + tabWidth) {
+        tabsTotalWidth += tabWidth;
+      } else {
+        endIndex = i;
+        break;
+      }
+    }
+    while (endIndex <= tabNodeList.length - 1) {
+      tabNodeList[endIndex].classList.add("__hidden");
+      hiddenItems.push(tabs[endIndex]);
+      endIndex++;
+    }
+    setMoreTabs((prevMoreTabs) => {
+      if (!_.isEqual(hiddenItems, prevMoreTabs)) {
+        return hiddenItems;
+      }
+      return prevMoreTabs;
+    });
+  }, [tabs, tabsRef, extraSlotRef]);
+  React.useEffect(() => {
+    doAdapt();
+  }, [doAdapt, selectedKey]);
+  React.useEffect(() => {
+    var _a;
+    const parentElement = (_a = tabsRef.current) == null ? void 0 : _a.parentElement;
+    if (!parentElement)
+      return;
+    const resizeObserver = new ResizeObserver(() => {
+      doAdapt();
+    });
+    resizeObserver.observe(parentElement);
+    return () => {
+      resizeObserver.disconnect();
+    };
+  }, [doAdapt, tabsRef]);
+  return moreTabs;
+};
+
+exports.useTabAdaptiveLayout = useTabAdaptiveLayout;