@douyinfe/semi-ui 2.1.0-beta.0 → 2.1.0-next.0

package/lib/cjs/banner/index.js

@@ -0,0 +1,209 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.default = void 0;
+
+var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
+
+var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _iconButton = _interopRequireDefault(require("../iconButton"));
+
+var _constants = require("@douyinfe/semi-foundation/lib/cjs/banner/constants");
+
+var _foundation = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/banner/foundation"));
+
+require("@douyinfe/semi-foundation/lib/cjs/banner/banner.css");
+
+var _typography = _interopRequireDefault(require("../typography"));
+
+var _semiIcons = require("@douyinfe/semi-icons");
+
+var _warning = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/utils/warning"));
+
+var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
+
+/* eslint-disable max-len */
+const prefixCls = _constants.cssClasses.PREFIX;
+const types = _constants.strings.TYPE;
+
+class Banner extends _baseComponent.default {
+  constructor(props) {
+    super(props);
+
+    this.remove = e => {
+      e && e.stopPropagation();
+      this.foundation.removeBanner(e);
+    };
+
+    this.state = {
+      visible: true
+    };
+    (0, _warning.default)('target' in this.props, '[Semi Banner] \'target\' has been deprecated, please write JSX directly instead.');
+  }
+
+  get adapter() {
+    return (0, _assign.default)((0, _assign.default)({}, super.adapter), {
+      setVisible: () => {
+        this.setState({
+          visible: false
+        });
+      },
+      notifyClose: e => {
+        const {
+          onClose
+        } = this.props;
+        onClose(e);
+      }
+    });
+  }
+
+  componentDidMount() {
+    this.foundation = new _foundation.default(this.adapter);
+    this.foundation.init();
+  }
+
+  componentWillUnmount() {
+    this.foundation.destroy();
+  }
+
+  renderCloser() {
+    const {
+      closeIcon
+    } = this.props;
+
+    if (closeIcon === null) {
+      return closeIcon;
+    }
+
+    const closer = /*#__PURE__*/_react.default.createElement(_iconButton.default, {
+      className: "".concat(prefixCls, "-close"),
+      onClick: this.remove,
+      icon: closeIcon || /*#__PURE__*/_react.default.createElement(_semiIcons.IconClose, null),
+      theme: "borderless",
+      size: "small",
+      type: "tertiary"
+    });
+
+    return closer;
+  }
+
+  renderIcon() {
+    const {
+      type,
+      icon
+    } = this.props;
+    const iconMap = {
+      warning: /*#__PURE__*/_react.default.createElement(_semiIcons.IconAlertTriangle, {
+        size: "large"
+      }),
+      success: /*#__PURE__*/_react.default.createElement(_semiIcons.IconTickCircle, {
+        size: "large"
+      }),
+      info: /*#__PURE__*/_react.default.createElement(_semiIcons.IconInfoCircle, {
+        size: "large"
+      }),
+      danger: /*#__PURE__*/_react.default.createElement(_semiIcons.IconAlertCircle, {
+        size: "large"
+      })
+    };
+    let iconType = iconMap[type];
+    const iconCls = (0, _classnames.default)({
+      ["".concat(prefixCls, "-icon")]: true // [prefixCls + '-' + type]: true,
+
+    });
+
+    if (typeof icon !== 'undefined') {
+      iconType = icon;
+    }
+
+    if (iconType) {
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: iconCls
+      }, iconType);
+    }
+
+    return null;
+  }
+
+  render() {
+    var _context;
+
+    const {
+      children,
+      type,
+      className,
+      style,
+      bordered,
+      title,
+      description,
+      fullMode
+    } = this.props;
+    const {
+      visible
+    } = this.state;
+    const wrapper = (0, _classnames.default)(prefixCls, className, {
+      [(0, _concat.default)(_context = "".concat(prefixCls, "-")).call(_context, type)]: type,
+      ["".concat(prefixCls, "-full")]: fullMode,
+      ["".concat(prefixCls, "-in-container")]: !fullMode,
+      ["".concat(prefixCls, "-bordered")]: !fullMode && bordered
+    });
+    const banner = visible ? /*#__PURE__*/_react.default.createElement("div", {
+      className: wrapper,
+      style: style
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(prefixCls, "-content-wrapper")
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(prefixCls, "-content")
+    }, this.renderIcon(), /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(prefixCls, "-content-body")
+    }, title ? /*#__PURE__*/_react.default.createElement(_typography.default.Title, {
+      heading: 5,
+      className: "".concat(prefixCls, "-title"),
+      component: "div"
+    }, title) : null, description ? /*#__PURE__*/_react.default.createElement(_typography.default.Paragraph, {
+      className: "".concat(prefixCls, "-description"),
+      component: "div"
+    }, description) : null)), this.renderCloser()), children ? /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(prefixCls, "-extra")
+    }, children) : null) : null;
+    return banner;
+  }
+
+}
+
+exports.default = Banner;
+Banner.propTypes = {
+  // target: PropTypes.func,
+  fullMode: _propTypes.default.bool,
+  // insertAfter: PropTypes.func,
+  type: _propTypes.default.oneOf(types),
+  title: _propTypes.default.node,
+  description: _propTypes.default.node,
+  icon: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
+  closeIcon: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
+  children: _propTypes.default.node,
+  style: _propTypes.default.object,
+  className: _propTypes.default.string,
+  onClose: _propTypes.default.func,
+  bordered: _propTypes.default.bool
+};
+Banner.defaultProps = {
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  onClose: () => {},
+  type: 'info',
+  fullMode: true
+};

package/lib/cjs/breadcrumb/bread-context.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { showToolTipProps } from './index';
+import { BreadcrumbItemInfo } from './item';
+export interface BreadContextProps {
+    onClick?: (info: BreadcrumbItemInfo, event: React.MouseEvent) => void;
+    showTooltip?: boolean | showToolTipProps;
+    compact?: boolean;
+    separator?: string | React.ReactNode;
+}
+declare const BreadContext: React.Context<BreadContextProps>;
+export default BreadContext;

package/lib/cjs/breadcrumb/bread-context.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+const BreadContext = /*#__PURE__*/_react.default.createContext({});
+
+var _default = BreadContext;
+exports.default = _default;

package/lib/cjs/breadcrumb/index.d.ts

@@ -0,0 +1,81 @@
+import React from 'react';
+import propTypes from 'prop-types';
+import { BreadcrumbAdapter } from '@douyinfe/semi-foundation/lib/cjs/breadcrumb/foundation';
+import '@douyinfe/semi-foundation/lib/cjs/breadcrumb/breadcrumb.css';
+import { noop } from '@douyinfe/semi-foundation/lib/cjs/utils/function';
+import BaseComponent, { BaseProps } from '../_base/baseComponent';
+import BreadcrumbItem, { RouteProps, BreadcrumbItemInfo } from './item';
+import { BreadContextProps } from './bread-context';
+import { TooltipProps } from '../tooltip';
+export { RouteProps, BreadcrumbItemProps, BreadcrumbItemInfo } from './item';
+export interface showToolTipProps {
+    width?: string | number;
+    ellipsisPos?: 'end' | 'middle';
+    opts?: TooltipProps;
+}
+export declare type MoreType = 'default' | 'popover';
+export interface BreadcrumbProps extends BaseProps {
+    routes?: Array<RouteProps | string>;
+    onClick?: (route: RouteProps, event: React.MouseEvent) => void;
+    separator?: React.ReactNode;
+    compact?: boolean;
+    style?: React.CSSProperties;
+    renderItem?: (route: RouteProps) => React.ReactNode;
+    className?: string;
+    showTooltip?: boolean | showToolTipProps;
+    maxItemCount?: number;
+    autoCollapse?: boolean;
+    renderMore?: (restItem: Array<React.ReactNode>) => React.ReactNode;
+    moreType?: MoreType;
+}
+interface BreadcrumbState {
+    isCollapsed: boolean;
+}
+declare class Breadcrumb extends BaseComponent<BreadcrumbProps, BreadcrumbState> {
+    static contextType: React.Context<BreadContextProps>;
+    static Item: typeof BreadcrumbItem;
+    static propTypes: {
+        routes: propTypes.Requireable<any[]>;
+        onClick: propTypes.Requireable<(...args: any[]) => any>;
+        separator: propTypes.Requireable<propTypes.ReactNodeLike>;
+        compact: propTypes.Requireable<boolean>;
+        children: propTypes.Requireable<propTypes.ReactNodeLike>;
+        style: propTypes.Requireable<object>;
+        renderItem: propTypes.Requireable<(...args: any[]) => any>;
+        showTooltip: propTypes.Requireable<boolean | propTypes.InferProps<{
+            width: propTypes.Requireable<string | number>;
+            ellipsisPos: propTypes.Requireable<string>;
+            opts: propTypes.Requireable<object>;
+        }>>;
+        className: propTypes.Requireable<string>;
+        autoCollapse: propTypes.Requireable<boolean>;
+        maxItemCount: propTypes.Requireable<number>;
+        renderMore: propTypes.Requireable<(...args: any[]) => any>;
+        moreType: propTypes.Requireable<string>;
+    };
+    static defaultProps: {
+        routes: [];
+        onClick: typeof noop;
+        renderItem: undefined;
+        separator: string;
+        compact: boolean;
+        showTooltip: {
+            width: number;
+            ellipsisPos: string;
+        };
+        autoCollapse: boolean;
+        moreType: string;
+        maxItemCount: number;
+    };
+    constructor(props: BreadcrumbProps);
+    get adapter(): BreadcrumbAdapter<BreadcrumbProps, BreadcrumbState>;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    renderPopoverMore(restItem: Array<React.ReactNode>): JSX.Element;
+    handleCollapse: (template: Array<React.ReactNode>, itemsLen: number) => React.ReactNode[];
+    renderRouteItems: (items: Array<RouteProps>, shouldCollapse: boolean, moreTypeIsPopover: boolean) => JSX.Element[];
+    renderList: () => Array<React.ReactNode>;
+    onClick: (info: BreadcrumbItemInfo, event: React.MouseEvent) => void;
+    render(): JSX.Element;
+}
+export default Breadcrumb;

package/lib/cjs/breadcrumb/index.js

@@ -0,0 +1,286 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.default = void 0;
+
+var _slice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/slice"));
+
+var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
+
+var _splice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/splice"));
+
+var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
+
+var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
+
+var _bind = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/bind"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _constants = require("@douyinfe/semi-foundation/lib/cjs/breadcrumb/constants");
+
+var _foundation = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/breadcrumb/foundation"));
+
+var _warning = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/utils/warning"));
+
+var _lodashEs = require("lodash-es");
+
+require("@douyinfe/semi-foundation/lib/cjs/breadcrumb/breadcrumb.css");
+
+var _function = require("@douyinfe/semi-foundation/lib/cjs/utils/function");
+
+var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
+
+var _popover = _interopRequireDefault(require("../popover"));
+
+var _item = _interopRequireDefault(require("./item"));
+
+var _breadContext = _interopRequireDefault(require("./bread-context"));
+
+var _semiIcons = require("@douyinfe/semi-icons");
+
+/* eslint-disable max-len */
+const clsPrefix = _constants.cssClasses.PREFIX;
+
+class Breadcrumb extends _baseComponent.default {
+  constructor(props) {
+    var _context3;
+
+    super(props);
+
+    this.handleCollapse = (template, itemsLen) => {
+      var _context;
+
+      const {
+        maxItemCount,
+        renderMore,
+        moreType
+      } = this.props;
+      const hasRenderMore = (0, _lodashEs.isFunction)(renderMore);
+      const restItem = (0, _slice.default)(template).call(template, 1, itemsLen - 3);
+
+      const spread = /*#__PURE__*/_react.default.createElement("span", {
+        className: "".concat(clsPrefix, "-collapse"),
+        key: "more-".concat(itemsLen)
+      }, /*#__PURE__*/_react.default.createElement("span", {
+        className: "".concat(clsPrefix, "-item-wrap")
+      }, /*#__PURE__*/_react.default.createElement("span", {
+        className: (0, _concat.default)(_context = "".concat(clsPrefix, "-item ")).call(_context, clsPrefix, "-item-more"),
+        onClick: item => this.foundation.handleExpand(item)
+      }, hasRenderMore && renderMore(restItem), !hasRenderMore && moreType === 'default' && /*#__PURE__*/_react.default.createElement(_semiIcons.IconMore, null), !hasRenderMore && moreType === 'popover' && this.renderPopoverMore(restItem)), /*#__PURE__*/_react.default.createElement("span", {
+        className: "".concat(clsPrefix, "-separator")
+      }, this.props.separator)));
+
+      (0, _splice.default)(template).call(template, 1, itemsLen - maxItemCount, spread);
+      return template;
+    };
+
+    this.renderRouteItems = (items, shouldCollapse, moreTypeIsPopover) => {
+      const {
+        renderItem,
+        renderMore,
+        maxItemCount
+      } = this.props;
+      const restItemLength = items.length - maxItemCount;
+      const hasRenderMore = (0, _lodashEs.isFunction)(renderMore);
+      const template = (0, _map.default)(items).call(items, (route, idx) => {
+        var _context2;
+
+        const key = route._origin.key || (0, _concat.default)(_context2 = "item-".concat(route.name || route.path, "-")).call(_context2, idx);
+        const inCollapseArea = idx > 0 && idx <= restItemLength;
+        return /*#__PURE__*/_react.default.createElement(_item.default, (0, _assign.default)({}, route, {
+          key: key,
+          active: idx === items.length - 1,
+          route: route._origin,
+          // eslint-disable-next-line max-len
+          shouldRenderSeparator: !(shouldCollapse && (hasRenderMore || moreTypeIsPopover) && inCollapseArea)
+        }), renderItem ? renderItem(route._origin) : route.name);
+      });
+      return template;
+    };
+
+    this.renderList = () => {
+      const {
+        routes,
+        children,
+        autoCollapse,
+        maxItemCount,
+        renderMore,
+        moreType
+      } = this.props;
+      const {
+        isCollapsed
+      } = this.state;
+      const hasRoutes = routes && routes.length > 0;
+      const items = hasRoutes ? this.foundation.genRoutes(routes) : _react.default.Children.toArray(children);
+      let template;
+      const itemLength = items.length; // children length
+
+      const restItemLength = itemLength - maxItemCount; // Omitted children items
+
+      const shouldCollapse = items && autoCollapse && itemLength > maxItemCount && isCollapsed; // Whether the number of children exceeds, need to collapse
+
+      const hasRenderMore = (0, _lodashEs.isFunction)(renderMore); // Whether the user passes in the renderMore method
+
+      const moreTypeIsPopover = moreType === 'popover';
+
+      if (hasRoutes) {
+        template = this.renderRouteItems(items, shouldCollapse, moreTypeIsPopover);
+      } else {
+        template = (0, _map.default)(items).call(items, (item, idx) => {
+          const inCollapseArea = idx > 0 && idx <= restItemLength;
+
+          if (!item) {
+            return item;
+          }
+
+          (0, _warning.default)(item.type && !item.type.isBreadcrumbItem, '[Semi Breadcrumb]: Only accepts Breadcrumb.Item as its children');
+          return /*#__PURE__*/_react.default.cloneElement(item, {
+            key: "".concat(idx, "-item"),
+            active: idx === items.length - 1,
+            shouldRenderSeparator: !(shouldCollapse && (hasRenderMore || moreTypeIsPopover) && inCollapseArea)
+          });
+        });
+      }
+
+      if (shouldCollapse) {
+        return this.handleCollapse(template, items.length);
+      }
+
+      return template;
+    };
+
+    this.onClick = (info, event) => {
+      this.foundation.handleClick(info, event);
+    };
+
+    this.foundation = new _foundation.default(this.adapter);
+    this.state = {
+      isCollapsed: true
+    };
+    this.onClick = (0, _bind.default)(_context3 = this.onClick).call(_context3, this);
+  }
+
+  get adapter() {
+    var _this = this;
+
+    return (0, _assign.default)((0, _assign.default)({}, super.adapter), {
+      notifyClick: function () {
+        _this.props.onClick(...arguments);
+      },
+      expandCollapsed: () => this.setState({
+        isCollapsed: false
+      })
+    });
+  }
+
+  componentDidMount() {
+    this.foundation.init();
+  }
+
+  componentWillUnmount() {
+    this.foundation.destroy();
+  }
+
+  renderPopoverMore(restItem) {
+    const {
+      separator
+    } = this.props;
+
+    const content = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (0, _map.default)(restItem).call(restItem, (item, idx) => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
+      key: "restItem-".concat(idx)
+    }, item, idx !== restItem.length - 1 && /*#__PURE__*/_react.default.createElement("span", {
+      className: "".concat(clsPrefix, "-restItem")
+    }, separator))));
+
+    return /*#__PURE__*/_react.default.createElement(_popover.default, {
+      content: content,
+      style: {
+        padding: 12
+      },
+      showArrow: true
+    }, /*#__PURE__*/_react.default.createElement(_semiIcons.IconMore, null));
+  }
+
+  render() {
+    const breadcrumbs = this.renderList();
+    const {
+      compact,
+      className,
+      style,
+      separator,
+      showTooltip
+    } = this.props;
+    const sizeCls = (0, _classnames.default)(className, {
+      ["".concat(clsPrefix, "-wrapper")]: true,
+      ["".concat(clsPrefix, "-wrapper-compact")]: compact,
+      ["".concat(clsPrefix, "-wrapper-loose")]: !compact
+    });
+    return /*#__PURE__*/_react.default.createElement(_breadContext.default.Provider, {
+      value: {
+        onClick: this.onClick,
+        showTooltip,
+        compact,
+        separator
+      }
+    }, /*#__PURE__*/_react.default.createElement("nav", {
+      "aria-label": "".concat(clsPrefix),
+      className: sizeCls,
+      style: style
+    }, breadcrumbs));
+  }
+
+}
+
+Breadcrumb.contextType = _breadContext.default;
+Breadcrumb.Item = _item.default;
+Breadcrumb.propTypes = {
+  routes: _propTypes.default.array,
+  onClick: _propTypes.default.func,
+  separator: _propTypes.default.node,
+  compact: _propTypes.default.bool,
+  children: _propTypes.default.node,
+  style: _propTypes.default.object,
+  renderItem: _propTypes.default.func,
+  showTooltip: _propTypes.default.oneOfType([_propTypes.default.shape({
+    width: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
+    ellipsisPos: _propTypes.default.oneOf(['end', 'middle']),
+    opts: _propTypes.default.object
+  }), _propTypes.default.bool]),
+  className: _propTypes.default.string,
+  autoCollapse: _propTypes.default.bool,
+  maxItemCount: _propTypes.default.number,
+
+  /* Customize the contents of the ellipsis area */
+  renderMore: _propTypes.default.func,
+
+  /* Type of ellipsis area */
+  moreType: _propTypes.default.oneOf(_constants.strings.MORE_TYPE)
+};
+Breadcrumb.defaultProps = {
+  routes: [],
+  onClick: _function.noop,
+  renderItem: undefined,
+  separator: '/',
+  compact: true,
+  showTooltip: {
+    width: 150,
+    ellipsisPos: 'end'
+  },
+  autoCollapse: true,
+  moreType: 'default',
+  maxItemCount: 4
+};
+var _default = Breadcrumb;
+exports.default = _default;

package/lib/cjs/breadcrumb/item.d.ts

@@ -0,0 +1,53 @@
+import React from 'react';
+import propTypes from 'prop-types';
+import { BreadcrumbItemAdapter, BreadcrumbItemInfo, Route } from '@douyinfe/semi-foundation/lib/cjs/breadcrumb/itemFoundation';
+import BaseComponent, { BaseProps } from '../_base/baseComponent';
+import { noop } from '@douyinfe/semi-foundation/lib/cjs/utils/function';
+export { BreadcrumbItemInfo };
+export interface RouteProps extends Route {
+    icon?: React.ReactNode;
+}
+export interface BreadcrumbItemProps extends BaseProps {
+    onClick?: (item: RouteProps, e: React.MouseEvent) => void;
+    icon?: React.ReactNode;
+    href?: string;
+    separator?: React.ReactNode;
+    noLink?: boolean;
+    active?: boolean;
+    shouldRenderSeparator?: boolean;
+    route?: RouteProps;
+}
+declare type BreadcrumbItemState = Record<string, never>;
+export default class BreadcrumbItem extends BaseComponent<BreadcrumbItemProps, BreadcrumbItemState> {
+    static isBreadcrumbItem: boolean;
+    static contextType: React.Context<import("./bread-context").BreadContextProps>;
+    static propTypes: {
+        onClick: propTypes.Requireable<(...args: any[]) => any>;
+        route: propTypes.Requireable<string | object>;
+        name: propTypes.Requireable<string>;
+        children: propTypes.Requireable<propTypes.ReactNodeLike>;
+        active: propTypes.Requireable<boolean>;
+        shouldRenderSeparator: propTypes.Requireable<boolean>;
+        icon: propTypes.Requireable<propTypes.ReactNodeLike>;
+        separator: propTypes.Requireable<propTypes.ReactNodeLike>;
+        noLink: propTypes.Requireable<boolean>;
+    };
+    static defaultProps: {
+        onClick: typeof noop;
+        shouldRenderSeparator: boolean;
+    };
+    get adapter(): BreadcrumbItemAdapter<BreadcrumbItemProps, BreadcrumbItemState>;
+    constructor(props: BreadcrumbItemProps);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    renderIcon: () => {};
+    getTooltipOpt: () => any;
+    getItemInfo: () => BreadcrumbItemInfo;
+    renderBreadItem: () => JSX.Element;
+    renderItem: () => React.DetailedReactHTMLElement<{
+        className: string;
+        onClick: (e: React.MouseEvent<HTMLElement, MouseEvent>) => any;
+        href: string;
+    }, HTMLElement>;
+    render(): JSX.Element;
+}