@cloudtower/eagle 0.0.0-testid-rc-0 → 0.0.0-theme-rc-1

package/dist/cjs/coreX/NamesTooltip/index.js

@@ -0,0 +1,38 @@
+'use strict';
+
+var react = require('@linaria/react');
+var index = require('../../core/Tooltip/index.js');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const NameItem = /*#__PURE__*/react.styled('div')({
+  name: "NameItem",
+  class: "E_0_0_0_theme_rc_1_n12mqh7z",
+  propsAsIs: false
+});
+const TooltipText = /*#__PURE__*/react.styled('span')({
+  name: "TooltipText",
+  class: "E_0_0_0_theme_rc_1_tf5bynu",
+  propsAsIs: false
+});
+const ToolTipStyle = "E_0_0_0_theme_rc_1_tcckoz1";
+const NamesTooltip = props => {
+  const {
+    names,
+    children
+  } = props;
+  return /* @__PURE__ */React__default.default.createElement(index, {
+    title: /* @__PURE__ */React__default.default.createElement(React__default.default.Fragment, null, names.map(name => /* @__PURE__ */React__default.default.createElement(NameItem, {
+      key: name.id
+    }, name.name))),
+    overlayClassName: ToolTipStyle
+  }, /* @__PURE__ */React__default.default.createElement(TooltipText, {
+    className: "dashed-border-bottom"
+  }, children));
+};
+var NamesTooltip$1 = NamesTooltip;
+
+module.exports = NamesTooltip$1;

package/dist/cjs/coreX/OverflowTooltip/index.js

@@ -0,0 +1,109 @@
+'use strict';
+
+var core = require('@linaria/core');
+var react = require('@linaria/react');
+var index = require('../../core/Tooltip/index.js');
+var _ = require('lodash');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+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));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source) if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0) target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols) for (var prop of __getOwnPropSymbols(source)) {
+    if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop)) target[prop] = source[prop];
+  }
+  return target;
+};
+const OverflowText = "E_0_0_0_theme_rc_1_ou7iq30";
+const SingleLineStyle = "E_0_0_0_theme_rc_1_s1tui002";
+const _exp = /*#__PURE__*/() => ({
+  lineClamp = 2
+}) => lineClamp;
+const MultipleLine = /*#__PURE__*/react.styled('div')({
+  name: "MultipleLine",
+  class: "E_0_0_0_theme_rc_1_mxrc2zg",
+  propsAsIs: false,
+  vars: {
+    "mxrc2zg-0": [_exp()]
+  }
+});
+const TooltipDefaultClass = "E_0_0_0_theme_rc_1_t1vv6d68";
+const OverflowTooltip = props => {
+  const _a = props,
+    {
+      content,
+      className,
+      onClick,
+      multiLines,
+      overlayClassName
+    } = _a,
+    restProps = __objRest(_a, ["content", "className", "onClick", "multiLines", "overlayClassName"]);
+  const tooltip = props.tooltip || content;
+  const [ellipsis, setEllipsis] = React.useState(false);
+  const textRef = React.useRef(null);
+  const isMultiLine = multiLines && multiLines > 1;
+  React.useEffect(() => {
+    const ele = textRef.current;
+    let observer;
+    if (ele) {
+      const handleResize = _.debounce(() => {
+        if (isMultiLine) {
+          setEllipsis(ele.scrollHeight > ele.offsetHeight);
+        } else {
+          setEllipsis(ele.scrollWidth > ele.offsetWidth);
+        }
+      }, 200);
+      observer = new ResizeObserver(handleResize);
+      observer.observe(ele);
+    }
+    return () => {
+      observer == null ? void 0 : observer.disconnect();
+    };
+  });
+  return /* @__PURE__ */React__default.default.createElement(index, __spreadProps(__spreadValues(__spreadValues({}, restProps), !ellipsis && {
+    visible: false
+  }), {
+    title: tooltip,
+    overlayClassName: core.cx(TooltipDefaultClass, overlayClassName)
+  }), isMultiLine ? /* @__PURE__ */React__default.default.createElement(MultipleLine, {
+    ref: textRef,
+    className: core.cx(OverflowText, className),
+    lineClamp: multiLines,
+    onClick: () => {
+      onClick && onClick();
+    }
+  }, /* @__PURE__ */React__default.default.createElement("span", null, content)) : /* @__PURE__ */React__default.default.createElement("div", {
+    ref: textRef,
+    className: core.cx(OverflowText, SingleLineStyle, className),
+    onClick: () => {
+      onClick && onClick();
+    }
+  }, /* @__PURE__ */React__default.default.createElement("span", null, content)));
+};
+var OverflowTooltip$1 = OverflowTooltip;
+
+module.exports = OverflowTooltip$1;

package/dist/cjs/coreX/Show/index.js

@@ -0,0 +1,20 @@
+'use strict';
+
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const Show = ({
+  condition,
+  children,
+  fallback
+}) => {
+  if (typeof condition === "function") {
+    condition = condition();
+  }
+  return condition ? /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, children) : fallback != null ? fallback : /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null);
+};
+
+exports.Show = Show;

package/dist/cjs/coreX/SidebarSubtitle/index.js

@@ -0,0 +1,17 @@
+'use strict';
+
+var core = require('@linaria/core');
+var index = require('../../core/Typo/index.js');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const SidebarSubtitle = (props) => {
+  const { title, className } = props;
+  return /* @__PURE__ */ React__default.default.createElement("span", { className: core.cx(index.Typo.Heading.h3_regular_upper, className) }, title);
+};
+var SidebarSubtitle$1 = SidebarSubtitle;
+
+module.exports = SidebarSubtitle$1;

package/dist/cjs/coreX/Sider/index.js

@@ -0,0 +1,109 @@
+'use strict';
+
+var core = require('@linaria/core');
+var antd = require('antd');
+var cs = require('classnames');
+var React = require('react');
+var index$1 = require('../../core/Icon/index.js');
+var index = require('../../core/Typo/index.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var cs__default = /*#__PURE__*/_interopDefault(cs);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+var __defProp = Object.defineProperty;
+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;
+};
+const SiderStyle = "E_0_0_0_theme_rc_1_s1at6qmn";
+const ShrinkStyle = "E_0_0_0_theme_rc_1_s1wu0lms";
+const NavLinkStyle = "E_0_0_0_theme_rc_1_n1ugzfva";
+const NormalWidth = 256;
+const ShrinkWidth = 52;
+const Sider = ({
+  config = [],
+  selectedKeys,
+  isShrink,
+  onClick,
+  children,
+  antdSiderProps
+}) => {
+  const renderItem = item => {
+    const iconSrc = selectedKeys.includes(item.key || "") ? item.icon.active : item.icon.normal;
+    const icon = /* @__PURE__ */React__default.default.createElement(index$1, {
+      iconWidth: 24,
+      iconHeight: 24,
+      src: iconSrc,
+      style: {
+        opacity: item.disabled ? 0.5 : 1
+      }
+    });
+    const _onClick = () => {
+      if (item.onClick) {
+        item.onClick(item.key);
+      }
+      onClick == null ? void 0 : onClick(item.key);
+    };
+    if (isShrink) {
+      return /* @__PURE__ */React__default.default.createElement("div", {
+        className: NavLinkStyle,
+        onClick: _onClick
+      }, /* @__PURE__ */React__default.default.createElement(antd.Tooltip, {
+        title: item.title,
+        placement: "right"
+      }, icon));
+    } else {
+      return /* @__PURE__ */React__default.default.createElement("div", {
+        className: NavLinkStyle,
+        onClick: _onClick
+      }, icon, /* @__PURE__ */React__default.default.createElement("span", {
+        className: "link-title"
+      }, item.title));
+    }
+  };
+  return /* @__PURE__ */React__default.default.createElement(antd.Layout.Sider, __spreadValues({
+    className: core.cx(SiderStyle, ShrinkStyle, isShrink ? "shrink" : ""),
+    width: isShrink ? ShrinkWidth : NormalWidth
+  }, antdSiderProps), /* @__PURE__ */React__default.default.createElement(antd.Menu, {
+    className: core.cx(index.Typo.Label.l2_regular),
+    selectedKeys
+  }, config.filter(item => !item.hidden).map(item => {
+    if ("items" in item) {
+      return /* @__PURE__ */React__default.default.createElement(antd.Menu.ItemGroup, {
+        className: cs__default.default({
+          split: item.isShowDivider
+        }),
+        key: item.key,
+        title: item.title ? /* @__PURE__ */React__default.default.createElement("span", {
+          className: index.Typo.Heading.h3_regular_upper
+        }, item.title) : null
+      }, (item.items || []).filter(childItem => !childItem.hidden).map(childItem => {
+        return /* @__PURE__ */React__default.default.createElement(antd.Menu.Item, {
+          key: childItem.key,
+          disabled: childItem.disabled
+        }, renderItem(childItem));
+      }));
+    }
+    return /* @__PURE__ */React__default.default.createElement(antd.Menu.Item, {
+      key: item.key,
+      disabled: item.disabled
+    }, renderItem(item));
+  })), /* @__PURE__ */React__default.default.createElement("footer", null, children));
+};
+var Sider$1 = Sider;
+
+module.exports = Sider$1;

package/dist/cjs/coreX/SortableList/index.js

@@ -0,0 +1,37 @@
+'use strict';
+
+var React = require('react');
+var reactBeautifulDnd = require('react-beautiful-dnd');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+var __defProp = Object.defineProperty;
+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;
+};
+const SortableList = ({ moveItem, children }) => {
+  const onDragEnd = (result) => {
+    if (!result.destination)
+      return;
+    moveItem(result.source.index, result.destination.index);
+  };
+  return /* @__PURE__ */ React__default.default.createElement(reactBeautifulDnd.DragDropContext, { onDragEnd }, /* @__PURE__ */ React__default.default.createElement(reactBeautifulDnd.Droppable, { droppableId: "droppable" }, (provided) => /* @__PURE__ */ React__default.default.createElement("div", __spreadValues({ ref: provided.innerRef }, provided.droppableProps), children, provided.placeholder)));
+};
+SortableList.Item = reactBeautifulDnd.Draggable;
+var SortableList$1 = SortableList;
+
+module.exports = SortableList$1;

package/dist/cjs/coreX/SummaryTable/index.js

@@ -0,0 +1,122 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var icons = require('@ant-design/icons');
+var react = require('@linaria/react');
+var index = require('../../core/Empty/index.js');
+var cs = require('classnames');
+var _ = require('lodash');
+var React = require('react');
+
+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);
+
+const Table = /*#__PURE__*/react.styled('div')({
+  name: "Table",
+  class: "E_0_0_0_theme_rc_1_t1sqg15u",
+  propsAsIs: false
+});
+const TableHeader = /*#__PURE__*/react.styled('header')({
+  name: "TableHeader",
+  class: "E_0_0_0_theme_rc_1_t4zczcp",
+  propsAsIs: false
+});
+const TableContent = /*#__PURE__*/react.styled('div')({
+  name: "TableContent",
+  class: "E_0_0_0_theme_rc_1_t1s7goww",
+  propsAsIs: false
+});
+const TableRow = /*#__PURE__*/react.styled('div')({
+  name: "TableRow",
+  class: "E_0_0_0_theme_rc_1_t93e4cf",
+  propsAsIs: false
+});
+const _exp = /*#__PURE__*/() => props => props.width;
+const RowLabel = /*#__PURE__*/react.styled('label')({
+  name: "RowLabel",
+  class: "E_0_0_0_theme_rc_1_rhz2uv5",
+  propsAsIs: false,
+  vars: {
+    "rhz2uv5-0": [_exp()]
+  }
+});
+const SummaryTableRow = props => {
+  const {
+    labelWidth = "42%",
+    title,
+    children,
+    hiddenTitle = false,
+    hiddenBorder = false,
+    dataKey
+  } = props;
+  return /* @__PURE__ */React__default.default.createElement(TableRow, {
+    className: cs__default.default("table-row", {
+      hiddenBorder
+    }),
+    "data-key": dataKey
+  }, /* @__PURE__ */React__default.default.createElement(RowLabel, {
+    width: labelWidth,
+    className: cs__default.default({
+      hidden: hiddenTitle
+    })
+  }, title), /* @__PURE__ */React__default.default.createElement("div", {
+    className: "content"
+  }, children));
+};
+const SummaryTableContent = props => {
+  const {
+    items,
+    labelWidth,
+    dataSource
+  } = props;
+  return /* @__PURE__ */React__default.default.createElement(React__default.default.Fragment, null, items.map(item => {
+    if (item.dataIndex === "[__typename]") {
+      return null;
+    }
+    const value = ___default.default.get(dataSource, item.dataIndex);
+    return /* @__PURE__ */React__default.default.createElement(SummaryTableRow, {
+      key: item.key,
+      labelWidth,
+      hiddenTitle: item == null ? void 0 : item.hiddenTitle,
+      hiddenBorder: item == null ? void 0 : item.hiddenBorder,
+      title: item.title,
+      dataKey: item.key
+    }, item.render ? item.render(value, dataSource) : ___default.default.isNull(value) || ___default.default.isUndefined(value) || value === "" ? index : value);
+  }));
+};
+const SummaryTable = props => {
+  const {
+    showHeader = true,
+    border = true,
+    className,
+    title,
+    showEdit,
+    onEdit,
+    rightAlign,
+    layout = "horizontal"
+  } = props;
+  return /* @__PURE__ */React__default.default.createElement(Table, {
+    className: cs__default.default(["summary-table", className, border ? "has-border" : "", rightAlign ? "align-right" : "", layout])
+  }, showHeader && /* @__PURE__ */React__default.default.createElement(TableHeader, {
+    className: "table-header"
+  }, /* @__PURE__ */React__default.default.createElement("span", {
+    className: "table-title"
+  }, title), showEdit && /* @__PURE__ */React__default.default.createElement(icons.FormOutlined, {
+    className: "edit-icon",
+    onClick: () => {
+      onEdit && onEdit();
+    }
+  })), /* @__PURE__ */React__default.default.createElement(TableContent, null, "children" in props ? props.children : /* @__PURE__ */React__default.default.createElement(SummaryTableContent, {
+    items: props.items,
+    labelWidth: props.labelWidth,
+    dataSource: props.dataSource
+  })));
+};
+var SummaryTable$1 = SummaryTable;
+
+exports.SummaryTableRow = SummaryTableRow;
+exports.default = SummaryTable$1;

package/dist/cjs/coreX/SwitchWithText/index.js

@@ -0,0 +1,63 @@
+'use strict';
+
+var react = require('@linaria/react');
+var index = require('../../core/Switch/index.js');
+var useParrotTranslation = require('../../hooks/useParrotTranslation.js');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+var __defProp = Object.defineProperty;
+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 __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source) if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0) target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols) for (var prop of __getOwnPropSymbols(source)) {
+    if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop)) target[prop] = source[prop];
+  }
+  return target;
+};
+const SwitchWrapper = /*#__PURE__*/react.styled('span')({
+  name: "SwitchWrapper",
+  class: "E_0_0_0_theme_rc_1_s1iv0tp1",
+  propsAsIs: false
+});
+const SwitchWithText = props => {
+  const {
+    t
+  } = useParrotTranslation();
+  const _a = props,
+    {
+      text = {
+        checked: t("common.enabled"),
+        unchecked: t("common.disabled")
+      }
+    } = _a,
+    _props = __objRest(_a, ["text"]);
+  return /* @__PURE__ */React__default.default.createElement(SwitchWrapper, {
+    className: "enabled-switch",
+    onClick: e => e.stopPropagation()
+  }, /* @__PURE__ */React__default.default.createElement("span", {
+    className: "enabled-text"
+  }, _props.checked ? text.checked : text.unchecked), /* @__PURE__ */React__default.default.createElement(index, __spreadValues({}, _props)));
+};
+var SwitchWithText$1 = SwitchWithText;
+
+module.exports = SwitchWithText$1;

package/dist/cjs/coreX/TabMenu/index.js

@@ -0,0 +1,157 @@
+'use strict';
+
+var iconsReact = require('@cloudtower/icons-react');
+var index = require('../../core/Typo/index.js');
+var antd = require('antd');
+var cs = require('classnames');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var cs__default = /*#__PURE__*/_interopDefault(cs);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const TabMenuStyle = "E_0_0_0_theme_rc_1_t160l1cm";
+const TabMenuSubMenu = "E_0_0_0_theme_rc_1_t14npdqr";
+const renderExpandArrow = (size, isBold) => {
+  if (size === "medium" && !isBold) return /* @__PURE__ */React__default.default.createElement(iconsReact.ArrowChevronDown16BlueIcon, {
+    className: "expand-arrow"
+  });
+  if (size === "medium" && isBold) return /* @__PURE__ */React__default.default.createElement(iconsReact.ArrowChevronDown16BoldBlueIcon, {
+    className: "expand-arrow"
+  });
+  if (size === "small" && !isBold) return /* @__PURE__ */React__default.default.createElement(iconsReact.ArrowChevronDownSmall16BlueIcon, {
+    className: "expand-arrow"
+  });
+  if (size === "small" && isBold) return /* @__PURE__ */React__default.default.createElement(iconsReact.ArrowChevronDownSmall16BoldBlueIcon, {
+    className: "expand-arrow"
+  });
+};
+const TabMenu = props => {
+  const {
+    tabs,
+    onChange,
+    selectedKey,
+    size = "medium",
+    theme = "default"
+  } = props;
+  const onChangeRef = React.useRef(onChange);
+  const view = React.useMemo(() => {
+    if (tabs.length === 0) return void 0;
+    let result;
+    tabs.some(tab => {
+      var _a;
+      if ("items" in tab) {
+        const select = (_a = tab.items) == null ? void 0 : _a.find(item => item.key === selectedKey);
+        result = select ? {
+          key: tab.key,
+          children: select.children,
+          title: select.title,
+          isAsync: tab.isAsync,
+          skeleton: tab.skeleton,
+          isOverview: select.isOverview
+        } : void 0;
+      } else if (tab.key === selectedKey) {
+        result = {
+          key: tab.key,
+          children: tab.children,
+          title: tab.title,
+          isAsync: tab.isAsync,
+          skeleton: tab.skeleton,
+          isOverview: tab.isOverview
+        };
+      }
+      return result;
+    });
+    if (!result) {
+      setTimeout(() => {
+        var _a;
+        (_a = onChangeRef.current) == null ? void 0 : _a.call(onChangeRef, tabs[0].key);
+      }, 0);
+      return tabs[0];
+    }
+    return result;
+  }, [tabs, selectedKey]);
+  const isMedium = size === "medium";
+  const viewKey = view == null ? void 0 : view.key;
+  const isAsync = view == null ? void 0 : view.isAsync;
+  const [transitioned, setTransitioned] = React.useState(false);
+  const viewKeyRef = React.useRef(view == null ? void 0 : view.key);
+  React.useEffect(() => {
+    setTransitioned(false);
+    viewKeyRef.current = viewKey;
+    const timeout = setTimeout(() => {
+      setTransitioned(true);
+    }, 320);
+    return () => {
+      clearTimeout(timeout);
+    };
+  }, [viewKey]);
+  const renderTabContent = () => {
+    if (!isAsync && (view == null ? void 0 : view.children)) return view.children;
+    if (isAsync && transitioned && viewKey === viewKeyRef.current && (view == null ? void 0 : view.children)) return view.children;
+    if (view == null ? void 0 : view.skeleton) return view.skeleton;
+    return null;
+  };
+  return /* @__PURE__ */React__default.default.createElement("div", {
+    className: cs__default.default(TabMenuStyle, "tab-menu", (view == null ? void 0 : view.isOverview) && "is-overview")
+  }, /* @__PURE__ */React__default.default.createElement("div", {
+    className: "tab-bar"
+  }, tabs.map(tab => {
+    var _a;
+    const isSelected = (view == null ? void 0 : view.key) === tab.key;
+    let typo = index.Typo.Label.l2_regular_title;
+    if (isMedium && isSelected) {
+      typo = index.Typo.Label.l1_bold_title;
+    } else if (isMedium && !isSelected) {
+      typo = index.Typo.Label.l1_regular_title;
+    } else if (!isMedium && isSelected) {
+      typo = index.Typo.Label.l2_bold_title;
+    }
+    if ("items" in tab) {
+      return /* @__PURE__ */React__default.default.createElement(antd.Dropdown, {
+        key: tab.key,
+        overlayClassName: TabMenuSubMenu,
+        transitionName: "no-animation",
+        overlay: /* @__PURE__ */React__default.default.createElement(antd.Menu, {
+          selectedKeys: [selectedKey],
+          onClick: params => onChange == null ? void 0 : onChange(params.key)
+        }, (_a = tab.items) == null ? void 0 : _a.map(item => /* @__PURE__ */React__default.default.createElement(antd.Menu.Item, {
+          "data-test": item.key,
+          key: item.key
+        }, item.title))),
+        trigger: ["click"]
+      }, /* @__PURE__ */React__default.default.createElement("span", {
+        className: cs__default.default(["tab-menu-item", "tab-menu-item-group", isSelected && "tab-menu-item-selected", isMedium && "tab-menu-item-medium", theme === "light" && "tab-menu-item-light"])
+      }, /* @__PURE__ */React__default.default.createElement("span", {
+        className: cs__default.default(["main-title", isMedium ? index.Typo.Label.l1_regular_title : index.Typo.Label.l2_regular_title])
+      }, tab.title), /* @__PURE__ */React__default.default.createElement("span", {
+        className: cs__default.default(["sub-title", typo]),
+        "data-test": isSelected ? view == null ? void 0 : view.title : tab.title
+      }, /* @__PURE__ */React__default.default.createElement("svg", {
+        className: "slash-arrow",
+        width: "8",
+        height: "8",
+        viewBox: "0 0 8 8",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg"
+      }, /* @__PURE__ */React__default.default.createElement("path", {
+        d: "M4.81662 3.33203C5.15455 3.555 5.32351 3.66649 5.38224 3.80736C5.43358 3.93049 5.43358 4.06904 5.38224 4.19218C5.32351 4.33305 5.15455 4.44454 4.81662 4.66751L1.81921 6.64529C1.4159 6.91141 1.21424 7.04446 1.04715 7.03393C0.901576 7.02475 0.767265 6.95246 0.679429 6.836C0.578613 6.70234 0.578613 6.46074 0.578613 5.97755L0.578613 2.02199C0.578613 1.53879 0.578613 1.2972 0.679429 1.16353C0.767265 1.04708 0.901576 0.974785 1.04715 0.965607C1.21424 0.955073 1.4159 1.08813 1.81921 1.35425L4.81662 3.33203Z"
+      })), /* @__PURE__ */React__default.default.createElement("span", {
+        className: "sub-title-text"
+      }, isSelected ? view == null ? void 0 : view.title : tab.title), renderExpandArrow(size, isSelected))));
+    }
+    return /* @__PURE__ */React__default.default.createElement("span", {
+      className: cs__default.default(["tab-menu-item", isSelected && "tab-menu-item-selected", isMedium && "tab-menu-item-medium", theme === "light" && "tab-menu-item-light", typo]),
+      key: tab.key,
+      "data-test": tab.title,
+      onClick: () => onChange == null ? void 0 : onChange(tab.key)
+    }, tab.title);
+  })), /* @__PURE__ */React__default.default.createElement("div", {
+    key: selectedKey,
+    className: "tab-content"
+  }, renderTabContent()));
+};
+var TabMenu$1 = TabMenu;
+
+module.exports = TabMenu$1;