@douyinfe/semi-ui 2.27.0-alpha.2 → 2.27.0-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-ui",
-    "version": "2.27.0-alpha.2",
+    "version": "2.27.0-beta.0",
     "description": "",
     "main": "lib/cjs/index.js",
     "module": "lib/es/index.js",
@@ -17,12 +17,12 @@
         "lib/*"
     ],
     "dependencies": {
-        "@douyinfe/semi-animation": "2.27.0-alpha.2",
-        "@douyinfe/semi-animation-react": "2.27.0-alpha.2",
-        "@douyinfe/semi-foundation": "2.27.0-alpha.2",
-        "@douyinfe/semi-icons": "2.27.0-alpha.2",
-        "@douyinfe/semi-illustrations": "2.27.0-alpha.2",
-        "@douyinfe/semi-theme-default": "2.27.0-alpha.2",
+        "@douyinfe/semi-animation": "2.27.0-beta.0",
+        "@douyinfe/semi-animation-react": "2.27.0-beta.0",
+        "@douyinfe/semi-foundation": "2.27.0-beta.0",
+        "@douyinfe/semi-icons": "2.27.0-beta.0",
+        "@douyinfe/semi-illustrations": "2.27.0-beta.0",
+        "@douyinfe/semi-theme-default": "2.27.0-beta.0",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "copy-text-to-clipboard": "^2.1.1",
@@ -69,7 +69,7 @@
     ],
     "author": "",
     "license": "MIT",
-    "gitHead": "c0cf24387dbafffb2d26f77d2f757ac5238ca0ec",
+    "gitHead": "fa59dd4e1bce1f81bb2d8cce4118a26354476c91",
     "devDependencies": {
         "@babel/plugin-proposal-decorators": "^7.15.8",
         "@babel/plugin-transform-runtime": "^7.15.8",

package/lib/cjs/tabs/TabItem.d.ts

@@ -1,18 +0,0 @@
-import React, { ReactNode, MouseEvent } from 'react';
-import { TabType, TabSize, TabPosition } from './interface';
-export interface TabItemProps {
-    tab?: ReactNode;
-    icon?: ReactNode;
-    size?: TabSize;
-    type?: TabType;
-    tabPosition?: TabPosition;
-    selected?: boolean;
-    closable?: boolean;
-    disabled?: boolean;
-    itemKey?: string;
-    handleKeyDown?: (event: React.KeyboardEvent, itemKey: string, closable: boolean) => void;
-    deleteTabItem?: (tabKey: string, event: MouseEvent<Element>) => void;
-    onClick?: (itemKey: string, e: MouseEvent<Element>) => void;
-}
-declare const ForwardTabItem: React.ForwardRefExoticComponent<TabItemProps & React.RefAttributes<HTMLDivElement>>;
-export default ForwardTabItem;

package/lib/cjs/tabs/TabItem.js

@@ -1,95 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _constants = require("@douyinfe/semi-foundation/lib/cjs/tabs/constants");
-
-var _semiIcons = require("@douyinfe/semi-icons");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-var __rest = void 0 && (void 0).__rest || function (s, e) {
-  var t = {};
-
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-  }
-  return t;
-};
-
-const TabItem = (props, ref) => {
-  const {
-    tab,
-    size,
-    type,
-    icon,
-    selected,
-    closable,
-    disabled,
-    itemKey,
-    deleteTabItem,
-    tabPosition,
-    handleKeyDown,
-    onClick
-  } = props,
-        resetProps = __rest(props, ["tab", "size", "type", "icon", "selected", "closable", "disabled", "itemKey", "deleteTabItem", "tabPosition", "handleKeyDown", "onClick"]);
-
-  const closableIcon = (0, _react.useMemo)(() => {
-    return type === 'card' && closable ? /*#__PURE__*/_react.default.createElement(_semiIcons.IconClose, {
-      "aria-label": "Close",
-      role: "button",
-      className: "".concat(_constants.cssClasses.TABS_TAB, "-icon-close"),
-      onClick: e => deleteTabItem(itemKey, e)
-    }) : null;
-  }, [type, closable, deleteTabItem, itemKey]);
-  const renderIcon = (0, _react.useCallback)(icon => /*#__PURE__*/_react.default.createElement("span", null, icon), []);
-  const handleKeyDownInItem = (0, _react.useCallback)(event => {
-    handleKeyDown && handleKeyDown(event, itemKey, closable);
-  }, [handleKeyDown, itemKey, closable]);
-  const handleItemClick = (0, _react.useCallback)(e => {
-    !disabled && onClick && onClick(itemKey, e);
-  }, [itemKey, disabled, onClick]);
-  const panelIcon = icon ? renderIcon(icon) : null;
-  const className = (0, _classnames.default)(_constants.cssClasses.TABS_TAB, "".concat(_constants.cssClasses.TABS_TAB, "-").concat(type), "".concat(_constants.cssClasses.TABS_TAB, "-").concat(tabPosition), "".concat(_constants.cssClasses.TABS_TAB, "-single"), {
-    [_constants.cssClasses.TABS_TAB_ACTIVE]: selected,
-    [_constants.cssClasses.TABS_TAB_DISABLED]: disabled,
-    ["".concat(_constants.cssClasses.TABS_TAB, "-small")]: size === 'small',
-    ["".concat(_constants.cssClasses.TABS_TAB, "-medium")]: size === 'medium'
-  });
-  return /*#__PURE__*/_react.default.createElement("div", Object.assign({
-    role: "tab",
-    id: "semiTab".concat(itemKey),
-    "data-tabkey": "semiTab".concat(itemKey),
-    "aria-controls": "semiTabPanel".concat(itemKey),
-    "aria-disabled": disabled ? 'true' : 'false',
-    "aria-selected": selected ? 'true' : 'false',
-    tabIndex: selected ? 0 : -1,
-    onKeyDown: handleKeyDownInItem,
-    onClick: handleItemClick,
-    className: className
-  }, resetProps, {
-    ref: ref
-  }), panelIcon, tab, closableIcon);
-}; // Why is forwardRef needed here？
-// Because TabItem needs to be used in OverflowList （when tabs' type is collapsible), 
-// OverflowList will pass ref to the outermost div DOM node of TabItem
-
-
-const ForwardTabItem = /*#__PURE__*/(0, _react.forwardRef)(TabItem); // @ts-ignore 
-
-ForwardTabItem.elementType = 'TabItem';
-var _default = ForwardTabItem;
-exports.default = _default;

package/lib/es/tabs/TabItem.d.ts

@@ -1,18 +0,0 @@
-import React, { ReactNode, MouseEvent } from 'react';
-import { TabType, TabSize, TabPosition } from './interface';
-export interface TabItemProps {
-    tab?: ReactNode;
-    icon?: ReactNode;
-    size?: TabSize;
-    type?: TabType;
-    tabPosition?: TabPosition;
-    selected?: boolean;
-    closable?: boolean;
-    disabled?: boolean;
-    itemKey?: string;
-    handleKeyDown?: (event: React.KeyboardEvent, itemKey: string, closable: boolean) => void;
-    deleteTabItem?: (tabKey: string, event: MouseEvent<Element>) => void;
-    onClick?: (itemKey: string, e: MouseEvent<Element>) => void;
-}
-declare const ForwardTabItem: React.ForwardRefExoticComponent<TabItemProps & React.RefAttributes<HTMLDivElement>>;
-export default ForwardTabItem;

package/lib/es/tabs/TabItem.js

@@ -1,78 +0,0 @@
-var __rest = this && this.__rest || function (s, e) {
-  var t = {};
-
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-  }
-  return t;
-};
-
-import React, { forwardRef, useCallback, useMemo } from 'react';
-import cls from 'classnames';
-import { cssClasses } from '@douyinfe/semi-foundation/lib/es/tabs/constants';
-import { IconClose } from '@douyinfe/semi-icons';
-
-const TabItem = (props, ref) => {
-  const {
-    tab,
-    size,
-    type,
-    icon,
-    selected,
-    closable,
-    disabled,
-    itemKey,
-    deleteTabItem,
-    tabPosition,
-    handleKeyDown,
-    onClick
-  } = props,
-        resetProps = __rest(props, ["tab", "size", "type", "icon", "selected", "closable", "disabled", "itemKey", "deleteTabItem", "tabPosition", "handleKeyDown", "onClick"]);
-
-  const closableIcon = useMemo(() => {
-    return type === 'card' && closable ? /*#__PURE__*/React.createElement(IconClose, {
-      "aria-label": "Close",
-      role: "button",
-      className: "".concat(cssClasses.TABS_TAB, "-icon-close"),
-      onClick: e => deleteTabItem(itemKey, e)
-    }) : null;
-  }, [type, closable, deleteTabItem, itemKey]);
-  const renderIcon = useCallback(icon => /*#__PURE__*/React.createElement("span", null, icon), []);
-  const handleKeyDownInItem = useCallback(event => {
-    handleKeyDown && handleKeyDown(event, itemKey, closable);
-  }, [handleKeyDown, itemKey, closable]);
-  const handleItemClick = useCallback(e => {
-    !disabled && onClick && onClick(itemKey, e);
-  }, [itemKey, disabled, onClick]);
-  const panelIcon = icon ? renderIcon(icon) : null;
-  const className = cls(cssClasses.TABS_TAB, "".concat(cssClasses.TABS_TAB, "-").concat(type), "".concat(cssClasses.TABS_TAB, "-").concat(tabPosition), "".concat(cssClasses.TABS_TAB, "-single"), {
-    [cssClasses.TABS_TAB_ACTIVE]: selected,
-    [cssClasses.TABS_TAB_DISABLED]: disabled,
-    ["".concat(cssClasses.TABS_TAB, "-small")]: size === 'small',
-    ["".concat(cssClasses.TABS_TAB, "-medium")]: size === 'medium'
-  });
-  return /*#__PURE__*/React.createElement("div", Object.assign({
-    role: "tab",
-    id: "semiTab".concat(itemKey),
-    "data-tabkey": "semiTab".concat(itemKey),
-    "aria-controls": "semiTabPanel".concat(itemKey),
-    "aria-disabled": disabled ? 'true' : 'false',
-    "aria-selected": selected ? 'true' : 'false',
-    tabIndex: selected ? 0 : -1,
-    onKeyDown: handleKeyDownInItem,
-    onClick: handleItemClick,
-    className: className
-  }, resetProps, {
-    ref: ref
-  }), panelIcon, tab, closableIcon);
-}; // Why is forwardRef needed here？
-// Because TabItem needs to be used in OverflowList （when tabs' type is collapsible), 
-// OverflowList will pass ref to the outermost div DOM node of TabItem
-
-
-const ForwardTabItem = /*#__PURE__*/forwardRef(TabItem); // @ts-ignore 
-
-ForwardTabItem.elementType = 'TabItem';
-export default ForwardTabItem;