@fle-ui/next 2.0.0-alpha.9 → 3.0.0-alpha.1

package/es/grid/style/index.js

@@ -1,2 +1,141 @@
-import "../../style/default.less";
-import "./index.less";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import { genComponentStyleHook, mergeToken } from "../../theme/internal"; // ============================== Row-Shared ==============================
+
+var genGridRowStyle = function genGridRowStyle(token) {
+  var componentCls = token.componentCls;
+  return _defineProperty({}, componentCls, {
+    display: 'flex',
+    flexFlow: 'row wrap',
+    minWidth: 0,
+    '&::before, &::after': {
+      display: 'flex'
+    },
+    '&-no-wrap': {
+      flexWrap: 'nowrap'
+    },
+    // The origin of the X-axis
+    '&-start': {
+      justifyContent: 'flex-start'
+    },
+    // The center of the X-axis
+    '&-center': {
+      justifyContent: 'center'
+    },
+    // The opposite of the X-axis
+    '&-end': {
+      justifyContent: 'flex-end'
+    },
+    '&-space-between': {
+      justifyContent: 'space-between'
+    },
+    '&-space-around ': {
+      justifyContent: 'space-around'
+    },
+    // Align at the top
+    '&-top': {
+      alignItems: 'flex-start'
+    },
+    // Align at the center
+    '&-middle': {
+      alignItems: 'center'
+    },
+    '&-bottom': {
+      alignItems: 'flex-end'
+    }
+  });
+}; // ============================== Col-Shared ==============================
+
+
+var genGridColStyle = function genGridColStyle(token) {
+  var componentCls = token.componentCls;
+  return _defineProperty({}, componentCls, {
+    position: 'relative',
+    maxWidth: '100%',
+    // Prevent columns from collapsing when empty
+    minHeight: 1
+  });
+};
+
+var genLoopGridColumnsStyle = function genLoopGridColumnsStyle(token, sizeCls) {
+  var componentCls = token.componentCls,
+      gridColumns = token.gridColumns;
+  var gridColumnsStyle = {};
+
+  for (var i = gridColumns; i >= 0; i--) {
+    if (i === 0) {
+      gridColumnsStyle["" + componentCls + sizeCls + "-" + i] = {
+        display: 'none'
+      };
+      gridColumnsStyle[componentCls + "-push-" + i] = {
+        insetInlineStart: 'auto'
+      };
+      gridColumnsStyle[componentCls + "-pull-" + i] = {
+        insetInlineEnd: 'auto'
+      };
+      gridColumnsStyle["" + componentCls + sizeCls + "-push-" + i] = {
+        insetInlineStart: 'auto'
+      };
+      gridColumnsStyle["" + componentCls + sizeCls + "-pull-" + i] = {
+        insetInlineEnd: 'auto'
+      };
+      gridColumnsStyle["" + componentCls + sizeCls + "-offset-" + i] = {
+        marginInlineEnd: 0
+      };
+      gridColumnsStyle["" + componentCls + sizeCls + "-order-" + i] = {
+        order: 0
+      };
+    } else {
+      gridColumnsStyle["" + componentCls + sizeCls + "-" + i] = {
+        display: 'block',
+        flex: "0 0 " + i / gridColumns * 100 + "%",
+        maxWidth: i / gridColumns * 100 + "%"
+      };
+      gridColumnsStyle["" + componentCls + sizeCls + "-push-" + i] = {
+        insetInlineStart: i / gridColumns * 100 + "%"
+      };
+      gridColumnsStyle["" + componentCls + sizeCls + "-pull-" + i] = {
+        insetInlineEnd: i / gridColumns * 100 + "%"
+      };
+      gridColumnsStyle["" + componentCls + sizeCls + "-offset-" + i] = {
+        marginInlineStart: i / gridColumns * 100 + "%"
+      };
+      gridColumnsStyle["" + componentCls + sizeCls + "-order-" + i] = {
+        order: i
+      };
+    }
+  }
+
+  return gridColumnsStyle;
+};
+
+var genGridStyle = function genGridStyle(token, sizeCls) {
+  return genLoopGridColumnsStyle(token, sizeCls);
+};
+
+var genGridMediaStyle = function genGridMediaStyle(token, screenSize, sizeCls) {
+  return _defineProperty({}, "@media (min-width: " + screenSize + "px)", _extends({}, genGridStyle(token, sizeCls)));
+}; // ============================== Export ==============================
+
+
+export var useRowStyle = genComponentStyleHook('Grid', function (token) {
+  return [genGridRowStyle(token)];
+});
+export var useColStyle = genComponentStyleHook('Grid', function (token) {
+  var gridToken = mergeToken(token, {
+    gridColumns: 24 // Row is divided into 24 parts in Grid
+
+  });
+  var gridMediaSizesMap = {
+    '-sm': gridToken.screenSMMin,
+    '-md': gridToken.screenMDMin,
+    '-lg': gridToken.screenLGMin,
+    '-xl': gridToken.screenXLMin,
+    '-xxl': gridToken.screenXXLMin
+  };
+  return [genGridColStyle(gridToken), genGridStyle(gridToken, ''), genGridStyle(gridToken, '-xs'), Object.keys(gridMediaSizesMap).map(function (key) {
+    return genGridMediaStyle(gridToken, gridMediaSizesMap[key], key);
+  }).reduce(function (pre, cur) {
+    return _extends(_extends({}, pre), cur);
+  }, {})];
+});

package/es/image/PreviewGroup.js

@@ -1,5 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _typeof from "@babel/runtime/helpers/esm/typeof";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
@@ -24,7 +25,9 @@ import ZoomOutOutlined from "@ant-design/icons/es/icons/ZoomOutOutlined";
 import RcImage from 'rc-image';
 import * as React from 'react';
 import { ConfigContext } from "../config-provider";
-import { getTransitionName } from "../_util/motion";
+import { getTransitionName } from "../_util/motion"; // CSSINJS
+
+import useStyle from "./style";
 export var icons = {
   rotateLeft: /*#__PURE__*/React.createElement(RotateLeftOutlined, null),
   rotateRight: /*#__PURE__*/React.createElement(RotateRightOutlined, null),
@@ -43,8 +46,15 @@ var InternalPreviewGroup = function InternalPreviewGroup(_a) {
   var _React$useContext = React.useContext(ConfigContext),
       getPrefixCls = _React$useContext.getPrefixCls;
 
-  var prefixCls = getPrefixCls('image-preview', customizePrefixCls);
+  var prefixCls = getPrefixCls('image', customizePrefixCls);
+  var previewPrefixCls = prefixCls + "-preview";
   var rootPrefixCls = getPrefixCls();
+
+  var _useStyle = useStyle(prefixCls),
+      _useStyle2 = _slicedToArray(_useStyle, 2),
+      wrapSSR = _useStyle2[0],
+      hashId = _useStyle2[1];
+
   var mergedPreview = React.useMemo(function () {
     if (preview === false) {
       return preview;
@@ -54,14 +64,15 @@ var InternalPreviewGroup = function InternalPreviewGroup(_a) {
 
     return _extends(_extends({}, _preview), {
       transitionName: getTransitionName(rootPrefixCls, 'zoom', _preview.transitionName),
-      maskTransitionName: getTransitionName(rootPrefixCls, 'fade', _preview.maskTransitionName)
+      maskTransitionName: getTransitionName(rootPrefixCls, 'fade', _preview.maskTransitionName),
+      rootClassName: hashId
     });
   }, [preview]);
-  return /*#__PURE__*/React.createElement(RcImage.PreviewGroup, _extends({
+  return wrapSSR( /*#__PURE__*/React.createElement(RcImage.PreviewGroup, _extends({
     preview: mergedPreview,
-    previewPrefixCls: prefixCls,
+    previewPrefixCls: previewPrefixCls,
     icons: icons
-  }, props));
+  }, props)));
 };
 
 export default InternalPreviewGroup;

package/es/image/index.d.ts

@@ -1,4 +1,4 @@
-import { ImageProps } from 'rc-image';
+import { type ImageProps } from 'rc-image';
 import * as React from 'react';
 import PreviewGroup from './PreviewGroup';
 export interface CompositionImage<P> extends React.FC<P> {

package/es/image/index.js

@@ -1,5 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _typeof from "@babel/runtime/helpers/esm/typeof";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
@@ -15,18 +16,22 @@ var __rest = this && this.__rest || function (s, e) {
 };
 
 import EyeOutlined from "@ant-design/icons/es/icons/EyeOutlined";
+import classNames from 'classnames';
 import RcImage from 'rc-image';
 import * as React from 'react';
 import { useContext } from 'react';
 import { ConfigContext } from "../config-provider";
 import defaultLocale from "../locale/en_US";
-import { getTransitionName } from "../_util/motion";
+import { getTransitionName } from "../_util/motion"; // CSSINJS
+
 import PreviewGroup, { icons } from "./PreviewGroup";
+import useStyle from "./style";
 
 var Image = function Image(_a) {
   var customizePrefixCls = _a.prefixCls,
       preview = _a.preview,
-      otherProps = __rest(_a, ["prefixCls", "preview"]);
+      rootClassName = _a.rootClassName,
+      otherProps = __rest(_a, ["prefixCls", "preview", "rootClassName"]);
 
   var _useContext = useContext(ConfigContext),
       getPrefixCls = _useContext.getPrefixCls,
@@ -36,7 +41,14 @@ var Image = function Image(_a) {
 
   var prefixCls = getPrefixCls('image', customizePrefixCls);
   var rootPrefixCls = getPrefixCls();
-  var imageLocale = contextLocale.Image || defaultLocale.Image;
+  var imageLocale = contextLocale.Image || defaultLocale.Image; // Style
+
+  var _useStyle = useStyle(prefixCls),
+      _useStyle2 = _slicedToArray(_useStyle, 2),
+      wrapSSR = _useStyle2[0],
+      hashId = _useStyle2[1];
+
+  var mergedRootClassName = classNames(rootClassName, hashId);
   var mergedPreview = React.useMemo(function () {
     if (preview === false) {
       return preview;
@@ -49,7 +61,7 @@ var Image = function Image(_a) {
 
     return _extends(_extends({
       mask: /*#__PURE__*/React.createElement("div", {
-        className: "".concat(prefixCls, "-mask-info")
+        className: prefixCls + "-mask-info"
       }, /*#__PURE__*/React.createElement(EyeOutlined, null), imageLocale === null || imageLocale === void 0 ? void 0 : imageLocale.preview),
       icons: icons
     }, restPreviewProps), {
@@ -58,10 +70,11 @@ var Image = function Image(_a) {
       maskTransitionName: getTransitionName(rootPrefixCls, 'fade', _preview.maskTransitionName)
     });
   }, [preview, imageLocale]);
-  return /*#__PURE__*/React.createElement(RcImage, _extends({
-    prefixCls: prefixCls,
-    preview: mergedPreview
-  }, otherProps));
+  return wrapSSR( /*#__PURE__*/React.createElement(RcImage, _extends({
+    prefixCls: "" + prefixCls,
+    preview: mergedPreview,
+    rootClassName: mergedRootClassName
+  }, otherProps)));
 };
 
 Image.PreviewGroup = PreviewGroup;

package/es/image/style/index.d.ts

@@ -1,2 +1,21 @@
-import '../../style/default.less';
-import './index.less';
+import type { CSSObject } from '@ant-design/cssinjs';
+import type { FullToken, GenerateStyle } from '../../theme/internal';
+export interface ComponentToken {
+    zIndexPopup: number;
+}
+export interface ImageToken extends FullToken<'Image'> {
+    previewCls: string;
+    modalMaskBg: string;
+    imagePreviewOperationDisabledColor: string;
+    imagePreviewOperationSize: number;
+    imagePreviewSwitchSize: number;
+    imagePreviewOperationColor: string;
+}
+export type PositionType = 'static' | 'relative' | 'fixed' | 'absolute' | 'sticky' | undefined;
+export declare const genBoxStyle: (position?: PositionType) => CSSObject;
+export declare const genImageMaskStyle: (token: ImageToken) => CSSObject;
+export declare const genPreviewOperationsStyle: (token: ImageToken) => CSSObject;
+export declare const genPreviewSwitchStyle: (token: ImageToken) => CSSObject;
+export declare const genImagePreviewStyle: GenerateStyle<ImageToken>;
+declare const _default: (prefixCls: string) => import("../../theme/internal").UseComponentStyleResult;
+export default _default;

package/es/image/style/index.js

@@ -1,2 +1,229 @@
-import "../../style/default.less";
-import "./index.less";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { TinyColor } from '@ctrl/tinycolor';
+import { genModalMaskStyle } from "../../modal/style";
+import { initZoomMotion, initFadeMotion } from "../../style/motion";
+import { genComponentStyleHook, mergeToken } from "../../theme/internal";
+import { resetComponent, textEllipsis } from "../../style";
+export var genBoxStyle = function genBoxStyle(position) {
+  return {
+    position: position || 'absolute',
+    inset: 0
+  };
+};
+export var genImageMaskStyle = function genImageMaskStyle(token) {
+  var iconCls = token.iconCls,
+      motionDurationSlow = token.motionDurationSlow,
+      paddingXXS = token.paddingXXS,
+      marginXXS = token.marginXXS,
+      prefixCls = token.prefixCls;
+  return _defineProperty({
+    position: 'absolute',
+    inset: 0,
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    color: '#fff',
+    background: new TinyColor('#000').setAlpha(0.5).toRgbString(),
+    cursor: 'pointer',
+    opacity: 0,
+    transition: "opacity " + motionDurationSlow
+  }, "." + prefixCls + "-mask-info", _extends(_extends({}, textEllipsis), _defineProperty({
+    padding: "0 " + paddingXXS + "px"
+  }, iconCls, {
+    marginInlineEnd: marginXXS
+  })));
+};
+export var genPreviewOperationsStyle = function genPreviewOperationsStyle(token) {
+  var previewCls = token.previewCls,
+      modalMaskBg = token.modalMaskBg,
+      paddingSM = token.paddingSM,
+      imagePreviewOperationDisabledColor = token.imagePreviewOperationDisabledColor,
+      zIndexPopup = token.zIndexPopup,
+      motionDurationSlow = token.motionDurationSlow;
+  var operationBg = new TinyColor(modalMaskBg).setAlpha(0.1);
+  var operationBgHover = operationBg.clone().setAlpha(0.2);
+  return _defineProperty({}, previewCls + "-operations", _extends(_extends({}, resetComponent(token)), {
+    position: 'fixed',
+    insetBlockStart: 0,
+    insetInlineEnd: 0,
+    zIndex: zIndexPopup + 1,
+    display: 'flex',
+    flexDirection: 'row-reverse',
+    alignItems: 'center',
+    width: '100%',
+    color: token.imagePreviewOperationColor,
+    listStyle: 'none',
+    background: operationBg.toRgbString(),
+    pointerEvents: 'auto',
+    '&-operation': {
+      marginInlineStart: paddingSM,
+      padding: paddingSM,
+      cursor: 'pointer',
+      transition: "all " + motionDurationSlow,
+      '&:hover': {
+        background: operationBgHover.toRgbString()
+      },
+      '&-disabled': {
+        color: imagePreviewOperationDisabledColor,
+        pointerEvents: 'none'
+      },
+      '&:last-of-type': {
+        marginInlineStart: 0
+      }
+    },
+    '&-progress': {
+      position: 'absolute',
+      left: {
+        _skip_check_: true,
+        value: '50%'
+      },
+      transform: 'translateX(-50%)'
+    },
+    '&-icon': {
+      fontSize: token.imagePreviewOperationSize
+    }
+  }));
+};
+export var genPreviewSwitchStyle = function genPreviewSwitchStyle(token) {
+  var _ref3, _ref4;
+
+  var modalMaskBg = token.modalMaskBg,
+      iconCls = token.iconCls,
+      imagePreviewOperationDisabledColor = token.imagePreviewOperationDisabledColor,
+      previewCls = token.previewCls,
+      zIndexPopup = token.zIndexPopup,
+      motionDurationSlow = token.motionDurationSlow;
+  var operationBg = new TinyColor(modalMaskBg).setAlpha(0.1);
+  var operationBgHover = operationBg.clone().setAlpha(0.2);
+  return _ref4 = {}, _defineProperty(_ref4, previewCls + "-switch-left, " + previewCls + "-switch-right", (_ref3 = {
+    position: 'fixed',
+    insetBlockStart: '50%',
+    zIndex: zIndexPopup + 1,
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    width: token.imagePreviewSwitchSize,
+    height: token.imagePreviewSwitchSize,
+    marginTop: -token.imagePreviewSwitchSize / 2,
+    color: token.imagePreviewOperationColor,
+    background: operationBg.toRgbString(),
+    borderRadius: '50%',
+    transform: "translateY(-50%)",
+    cursor: 'pointer',
+    transition: "all " + motionDurationSlow,
+    pointerEvents: 'auto',
+    '&:hover': {
+      background: operationBgHover.toRgbString()
+    }
+  }, _defineProperty(_ref3, "&-disabled", {
+    '&, &:hover': _defineProperty({
+      color: imagePreviewOperationDisabledColor,
+      background: 'transparent',
+      cursor: 'not-allowed'
+    }, "> " + iconCls, {
+      cursor: 'not-allowed'
+    })
+  }), _defineProperty(_ref3, "> " + iconCls, {
+    fontSize: token.imagePreviewOperationSize
+  }), _ref3)), _defineProperty(_ref4, previewCls + "-switch-left", {
+    insetInlineStart: token.marginSM
+  }), _defineProperty(_ref4, previewCls + "-switch-right", {
+    insetInlineEnd: token.marginSM
+  }), _ref4;
+};
+export var genImagePreviewStyle = function genImagePreviewStyle(token) {
+  var _ref6;
+
+  var motionEaseOut = token.motionEaseOut,
+      previewCls = token.previewCls,
+      motionDurationSlow = token.motionDurationSlow,
+      componentCls = token.componentCls;
+  return [_defineProperty({}, componentCls + "-preview-root", (_ref6 = {}, _defineProperty(_ref6, previewCls, {
+    height: '100%',
+    textAlign: 'center',
+    pointerEvents: 'none'
+  }), _defineProperty(_ref6, previewCls + "-body", _extends(_extends({}, genBoxStyle()), {
+    overflow: 'hidden'
+  })), _defineProperty(_ref6, previewCls + "-img", {
+    maxWidth: '100%',
+    maxHeight: '100%',
+    verticalAlign: 'middle',
+    transform: 'scale3d(1, 1, 1)',
+    cursor: 'grab',
+    transition: "transform " + motionDurationSlow + " " + motionEaseOut + " 0s",
+    userSelect: 'none',
+    pointerEvents: 'auto',
+    '&-wrapper': _extends(_extends({}, genBoxStyle()), {
+      transition: "transform " + motionDurationSlow + " " + motionEaseOut + " 0s",
+      '&::before': {
+        display: 'inline-block',
+        width: 1,
+        height: '50%',
+        marginInlineEnd: -1,
+        content: '""'
+      }
+    })
+  }), _defineProperty(_ref6, previewCls + "-moving", _defineProperty({}, previewCls + "-preview-img", {
+    cursor: 'grabbing',
+    '&-wrapper': {
+      transitionDuration: '0s'
+    }
+  })), _ref6)), // Override
+  _defineProperty({}, componentCls + "-preview-root", _defineProperty({}, previewCls + "-wrap", {
+    zIndex: token.zIndexPopup
+  })), // Preview operations & switch
+  {
+    '&': [genPreviewOperationsStyle(token), genPreviewSwitchStyle(token)]
+  }];
+};
+
+var genImageStyle = function genImageStyle(token) {
+  var _componentCls;
+
+  var componentCls = token.componentCls;
+  return _defineProperty({}, componentCls, (_componentCls = {
+    position: 'relative',
+    display: 'inline-block'
+  }, _defineProperty(_componentCls, componentCls + "-img", {
+    width: '100%',
+    height: 'auto',
+    verticalAlign: 'middle'
+  }), _defineProperty(_componentCls, componentCls + "-img-placeholder", {
+    backgroundColor: token.colorBgContainerDisabled,
+    backgroundImage: "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTQuNSAyLjVoLTEzQS41LjUgMCAwIDAgMSAzdjEwYS41LjUgMCAwIDAgLjUuNWgxM2EuNS41IDAgMCAwIC41LS41VjNhLjUuNSAwIDAgMC0uNS0uNXpNNS4yODEgNC43NWExIDEgMCAwIDEgMCAyIDEgMSAwIDAgMSAwLTJ6bTguMDMgNi44M2EuMTI3LjEyNyAwIDAgMS0uMDgxLjAzSDIuNzY5YS4xMjUuMTI1IDAgMCAxLS4wOTYtLjIwN2wyLjY2MS0zLjE1NmEuMTI2LjEyNiAwIDAgMSAuMTc3LS4wMTZsLjAxNi4wMTZMNy4wOCAxMC4wOWwyLjQ3LTIuOTNhLjEyNi4xMjYgMCAwIDEgLjE3Ny0uMDE2bC4wMTUuMDE2IDMuNTg4IDQuMjQ0YS4xMjcuMTI3IDAgMCAxLS4wMi4xNzV6IiBmaWxsPSIjOEM4QzhDIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48L3N2Zz4=')",
+    backgroundRepeat: 'no-repeat',
+    backgroundPosition: 'center center',
+    backgroundSize: '30%'
+  }), _defineProperty(_componentCls, componentCls + "-mask", _extends({}, genImageMaskStyle(token))), _defineProperty(_componentCls, componentCls + "-mask:hover", {
+    opacity: 1
+  }), _defineProperty(_componentCls, componentCls + "-placeholder", _extends({}, genBoxStyle())), _componentCls));
+};
+
+var genPreviewMotion = function genPreviewMotion(token) {
+  var _ref11;
+
+  var previewCls = token.previewCls;
+  return _ref11 = {}, _defineProperty(_ref11, previewCls + "-root", initZoomMotion(token, 'zoom')), _defineProperty(_ref11, "&", initFadeMotion(token, true)), _ref11;
+}; // ============================== Export ==============================
+
+
+export default genComponentStyleHook('Image', function (token) {
+  var imagePreviewOperationColor = new TinyColor(token.colorTextLightSolid);
+  var previewCls = token.componentCls + "-preview";
+  var imageToken = mergeToken(token, {
+    previewCls: previewCls,
+    imagePreviewOperationColor: imagePreviewOperationColor.toRgbString(),
+    imagePreviewOperationDisabledColor: new TinyColor(imagePreviewOperationColor).setAlpha(0.25).toRgbString(),
+    modalMaskBg: new TinyColor('#000').setAlpha(0.45).toRgbString(),
+    imagePreviewOperationSize: token.fontSizeIcon * 1.5,
+    imagePreviewSwitchSize: token.controlHeightLG
+  });
+  return [genImageStyle(imageToken), genImagePreviewStyle(imageToken), genModalMaskStyle(mergeToken(imageToken, {
+    componentCls: previewCls
+  })), genPreviewMotion(imageToken)];
+}, function (token) {
+  return {
+    zIndexPopup: token.zIndexPopupBase + 80
+  };
+});

package/es/index.d.ts

@@ -1,4 +1,3 @@
-export declare const theme: null;
 export { default as Affix } from './affix';
 export type { AffixProps } from './affix';
 export { default as Alert } from './alert';
@@ -9,6 +8,8 @@ export { default as AutoComplete } from './auto-complete';
 export type { AutoCompleteProps } from './auto-complete';
 export { default as Avatar } from './avatar';
 export type { AvatarProps } from './avatar';
+export { default as FloatButton } from './float-button';
+export type { FloatButtonProps } from './float-button/interface';
 export { default as BackTop } from './back-top';
 export type { BackTopProps } from './back-top';
 export { default as Badge } from './badge';
@@ -31,8 +32,6 @@ export { default as Col } from './col';
 export type { ColProps } from './col';
 export { default as Collapse } from './collapse';
 export type { CollapsePanelProps, CollapseProps } from './collapse';
-export { default as Comment } from './comment';
-export type { CommentProps } from './comment';
 export { default as ConfigProvider } from './config-provider';
 export { default as DatePicker } from './date-picker';
 export type { DatePickerProps } from './date-picker';
@@ -62,14 +61,12 @@ export type { ListProps } from './list';
 export { default as Mentions } from './mentions';
 export type { MentionProps } from './mentions';
 export { default as Menu } from './menu';
-export type { MenuItemProps, MenuProps, MenuTheme, SubMenuProps } from './menu';
+export type { MenuItemProps, MenuProps, MenuTheme, SubMenuProps, MenuRef } from './menu';
 export { default as message } from './message';
 export type { ArgsProps as MessageArgsProps } from './message';
 export { default as Modal } from './modal';
 export type { ModalFuncProps, ModalProps } from './modal';
 export { default as notification } from './notification';
-export { default as PageHeader } from './page-header';
-export type { PageHeaderProps } from './page-header';
 export { default as Pagination } from './pagination';
 export type { PaginationProps } from './pagination';
 export { default as Popconfirm } from './popconfirm';
@@ -110,12 +107,15 @@ export { default as Tabs } from './tabs';
 export type { TabPaneProps, TabsProps } from './tabs';
 export { default as Tag } from './tag';
 export type { TagProps, TagType } from './tag';
+export { default as theme } from './theme';
 export { default as TimePicker } from './time-picker';
 export type { TimePickerProps, TimeRangePickerProps } from './time-picker';
 export { default as Timeline } from './timeline';
 export type { TimelineItemProps, TimelineProps } from './timeline';
 export { default as Tooltip } from './tooltip';
 export type { TooltipProps } from './tooltip';
+export { default as Tour } from './tour';
+export type { TourProps, TourStepProps } from './tour/interface';
 export { default as Transfer } from './transfer';
 export type { TransferProps } from './transfer';
 export { default as Tree } from './tree';

package/es/index.js

@@ -1,10 +1,9 @@
-// Fix vite build error
-export var theme = null;
 export { default as Affix } from "./affix";
 export { default as Alert } from "./alert";
 export { default as Anchor } from "./anchor";
 export { default as AutoComplete } from "./auto-complete";
 export { default as Avatar } from "./avatar";
+export { default as FloatButton } from "./float-button";
 export { default as BackTop } from "./back-top";
 export { default as Badge } from "./badge";
 export { default as Breadcrumb } from "./breadcrumb";
@@ -16,7 +15,6 @@ export { default as Cascader } from "./cascader";
 export { default as Checkbox } from "./checkbox";
 export { default as Col } from "./col";
 export { default as Collapse } from "./collapse";
-export { default as Comment } from "./comment";
 export { default as ConfigProvider } from "./config-provider";
 export { default as DatePicker } from "./date-picker";
 export { default as Descriptions } from "./descriptions";
@@ -36,7 +34,6 @@ export { default as Menu } from "./menu";
 export { default as message } from "./message";
 export { default as Modal } from "./modal";
 export { default as notification } from "./notification";
-export { default as PageHeader } from "./page-header";
 export { default as Pagination } from "./pagination";
 export { default as Popconfirm } from "./popconfirm";
 export { default as Popover } from "./popover";
@@ -57,9 +54,11 @@ export { default as Switch } from "./switch";
 export { default as Table } from "./table";
 export { default as Tabs } from "./tabs";
 export { default as Tag } from "./tag";
+export { default as theme } from "./theme";
 export { default as TimePicker } from "./time-picker";
 export { default as Timeline } from "./timeline";
 export { default as Tooltip } from "./tooltip";
+export { default as Tour } from "./tour";
 export { default as Transfer } from "./transfer";
 export { default as Tree } from "./tree";
 export { default as TreeSelect } from "./tree-select";

package/es/input/ClearableLabeledInput.d.ts

@@ -30,6 +30,7 @@ export interface ClearableInputProps extends BasicProps {
     addonAfter?: React.ReactNode;
     triggerFocus?: () => void;
     status?: InputStatus;
+    hashId?: string;
 }
 declare class ClearableLabeledInput extends React.Component<ClearableInputProps> {
     renderClearIcon(prefixCls: string): JSX.Element;

package/es/input/ClearableLabeledInput.js

@@ -39,7 +39,7 @@ var ClearableLabeledInput = /*#__PURE__*/function (_React$Component) {
           handleReset = _this$props.handleReset,
           suffix = _this$props.suffix;
       var needClear = !disabled && !readOnly && value;
-      var className = "".concat(prefixCls, "-clear-icon");
+      var className = prefixCls + "-clear-icon";
       return /*#__PURE__*/React.createElement(CloseCircleFilled, {
         onClick: handleReset,
         // Do not trigger onBlur when clear input
@@ -47,7 +47,7 @@ var ClearableLabeledInput = /*#__PURE__*/function (_React$Component) {
         onMouseDown: function onMouseDown(e) {
           return e.preventDefault();
         },
-        className: classNames((_classNames = {}, _defineProperty(_classNames, "".concat(className, "-hidden"), !needClear), _defineProperty(_classNames, "".concat(className, "-has-suffix"), !!suffix), _classNames), className),
+        className: classNames((_classNames = {}, _defineProperty(_classNames, className + "-hidden", !needClear), _defineProperty(_classNames, className + "-has-suffix", !!suffix), _classNames), className),
         role: "button"
       });
     }
@@ -64,7 +64,8 @@ var ClearableLabeledInput = /*#__PURE__*/function (_React$Component) {
           direction = _this$props2.direction,
           bordered = _this$props2.bordered,
           hidden = _this$props2.hidden,
-          customStatus = _this$props2.status;
+          customStatus = _this$props2.status,
+          hashId = _this$props2.hashId;
       var contextStatus = statusContext.status,
           hasFeedback = statusContext.hasFeedback;
 
@@ -74,7 +75,7 @@ var ClearableLabeledInput = /*#__PURE__*/function (_React$Component) {
         });
       }
 
-      var affixWrapperCls = classNames("".concat(prefixCls, "-affix-wrapper"), "".concat(prefixCls, "-affix-wrapper-textarea-with-clear-btn"), getStatusClassNames("".concat(prefixCls, "-affix-wrapper"), getMergedStatus(contextStatus, customStatus), hasFeedback), (_classNames2 = {}, _defineProperty(_classNames2, "".concat(prefixCls, "-affix-wrapper-rtl"), direction === 'rtl'), _defineProperty(_classNames2, "".concat(prefixCls, "-affix-wrapper-borderless"), !bordered), _defineProperty(_classNames2, "".concat(className), !hasAddon(this.props) && className), _classNames2));
+      var affixWrapperCls = classNames(prefixCls + "-affix-wrapper", prefixCls + "-affix-wrapper-textarea-with-clear-btn", getStatusClassNames(prefixCls + "-affix-wrapper", getMergedStatus(contextStatus, customStatus), hasFeedback), (_classNames2 = {}, _defineProperty(_classNames2, prefixCls + "-affix-wrapper-rtl", direction === 'rtl'), _defineProperty(_classNames2, prefixCls + "-affix-wrapper-borderless", !bordered), _defineProperty(_classNames2, "" + className, !hasAddon(this.props) && className), _classNames2), hashId);
       return /*#__PURE__*/React.createElement("span", {
         className: affixWrapperCls,
         style: style,