shineout 3.10.1-beta.4 → 3.10.1-beta.6

package/cjs/index.js

@@ -545,5 +545,5 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 // 此文件由脚本自动生成，请勿直接修改。
 // This file was generated automatically by a script. Please do not modify it directly.
 var _default = exports.default = {
-  version: '3.10.1-beta.4'
+  version: '3.10.1-beta.6'
 };

package/dist/shineout.js

@@ -8674,7 +8674,8 @@ var defaultConfig = {
   input: {},
   avatar: {},
   direction: 'ltr',
-  popupContainer: null
+  popupContainer: null,
+  popupEsc: true
 };
 var state = createWithHooks(defaultConfig);
 var config_config = snapshot(state.mutate);
@@ -8712,7 +8713,7 @@ var setConfig = function setConfig(option) {
 
 
 
-var _excluded = ["jssStyle", "type", "className", "children", "icon", "iconClassName", "title", "titleStyle", "iconSize", "closable", "hideClose", "bordered", "closeItem", "onClose", "classNames", "styles"];
+var _excluded = ["jssStyle", "type", "className", "children", "icon", "iconClassName", "title", "titleClassName", "titleStyle", "iconSize", "closable", "hideClose", "bordered", "closeItem", "onClose", "classNames", "styles"];
 
 
 
@@ -8736,6 +8737,7 @@ var Alert = function Alert(props) {
     icon = props.icon,
     iconClassName = props.iconClassName,
     title = props.title,
+    titleClassName = props.titleClassName,
     titleStyle = props.titleStyle,
     iconSize = props.iconSize,
     closable = props.closable,
@@ -8815,7 +8817,7 @@ var Alert = function Alert(props) {
   };
   var renderTitle = function renderTitle() {
     return /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
-      className: classnames_default()(alertStyle.title, props.titleClassName, semClass('title')),
+      className: classnames_default()(alertStyle.title, titleClassName, semClass('title')),
       style: objectSpread2_default()(objectSpread2_default()({}, titleStyle), semStyle('title')),
       children: title
     });
@@ -13686,7 +13688,7 @@ var handleStyle = function handleStyle(style) {
 };
 /* harmony default export */ var jss_style_handleStyle = (handleStyle);
 ;// CONCATENATED MODULE: ../shineout-style/src/version.ts
-/* harmony default export */ var version = ('3.10.1-beta.4');
+/* harmony default export */ var version = ('3.10.1-beta.6');
 ;// CONCATENATED MODULE: ../shineout-style/src/jss-style/index.tsx
 
 
@@ -16294,7 +16296,57 @@ var tabsTokens = {
   tabsExtraFillHoverBackgroundColor: 'Neutral-fill-3',
   tabsArrowFontColor: 'Neutral-text-4',
   tabsArrowFontSize: 'Font-14',
-  tabsBadgeMargin: 'Spacing-0'
+  tabsBadgeMargin: 'Spacing-0',
+  tabsSmallTabPaddingX: 'Spacing-10',
+  tabsSmallTabPaddingY: 'Spacing-5',
+  tabsSmallTabFontSize: 'Font-12',
+  tabsSmallLinePaddingX: 'Spacing-4',
+  tabsSmallLinePaddingTop: 'Spacing-4',
+  tabsSmallLinePaddingBottom: 'Spacing-4',
+  tabsSmallLineInnerPaddingX: 'Spacing-6',
+  tabsSmallLineInnerPaddingY: 'Spacing-2',
+  tabsSmallLineFontSize: 'Font-12',
+  tabsSmallLineCheckedFontSize: 'Font-12',
+  tabsSmallLineHoverFontSize: 'Font-12',
+  tabsSmallFillPaddingX: 'Spacing-2',
+  tabsSmallFillPaddingY: 'Spacing-2',
+  tabsSmallFillInnerPaddingX: 'Spacing-12',
+  tabsSmallFillInnerPaddingY: 'Spacing-3',
+  tabsSmallFillFontSize: 'Font-12',
+  tabsSmallFillActiveFontSize: 'Font-12',
+  tabsSmallFillCheckedFontSize: 'Font-12',
+  tabsSmallCardPaddingX: 'Spacing-10',
+  tabsSmallCardPaddingY: 'Spacing-5',
+  tabsSmallCardFontSize: 'Font-12',
+  tabsSmallCardActiveFontSize: 'Font-12',
+  tabsSmallCardCheckedFontSize: 'Font-12',
+  tabsSmallDashFontSize: 'Font-12',
+  tabsSmallDashActiveFontSize: 'Font-12',
+  tabsLargeTabPaddingX: 'Spacing-20',
+  tabsLargeTabPaddingY: 'Spacing-12',
+  tabsLargeTabFontSize: 'Font-16',
+  tabsLargeLinePaddingX: 'Spacing-12',
+  tabsLargeLinePaddingTop: 'Spacing-8',
+  tabsLargeLinePaddingBottom: 'Spacing-8',
+  tabsLargeLineInnerPaddingX: 'Spacing-12',
+  tabsLargeLineInnerPaddingY: 'Spacing-6',
+  tabsLargeLineFontSize: 'Font-16',
+  tabsLargeLineCheckedFontSize: 'Font-16',
+  tabsLargeLineHoverFontSize: 'Font-16',
+  tabsLargeFillPaddingX: 'Spacing-6',
+  tabsLargeFillPaddingY: 'Spacing-6',
+  tabsLargeFillInnerPaddingX: 'Spacing-20',
+  tabsLargeFillInnerPaddingY: 'Spacing-7',
+  tabsLargeFillFontSize: 'Font-16',
+  tabsLargeFillActiveFontSize: 'Font-16',
+  tabsLargeFillCheckedFontSize: 'Font-16',
+  tabsLargeCardPaddingX: 'Spacing-20',
+  tabsLargeCardPaddingY: 'Spacing-12',
+  tabsLargeCardFontSize: 'Font-16',
+  tabsLargeCardActiveFontSize: 'Font-16',
+  tabsLargeCardCheckedFontSize: 'Font-16',
+  tabsLargeDashFontSize: 'Font-16',
+  tabsLargeDashActiveFontSize: 'Font-16'
 };
 /* harmony default export */ var tabs = (tabsTokens);
 ;// CONCATENATED MODULE: ../theme/src/tabs/index.ts
@@ -29716,7 +29768,99 @@ var tabsStyle = {
       }
     }
   },
-  sticky: {}
+  sticky: {},
+  small: {
+    '& $tab': {
+      fontSize: src.tabsSmallTabFontSize
+    },
+    // card
+    '& $headerWrapper[data-soui-shape="card"] $header $tab': {
+      padding: "".concat(src.tabsSmallCardPaddingY, " ").concat(src.tabsSmallCardPaddingX),
+      fontSize: src.tabsSmallCardFontSize,
+      '&[data-soui-state="active"]': {
+        fontSize: src.tabsSmallCardCheckedFontSize
+      }
+    },
+    // line
+    '& $headerWrapper[data-soui-shape="line"] $header $tab': {
+      padding: "".concat(src.tabsSmallLinePaddingTop, " ").concat(src.tabsSmallLinePaddingX, " ").concat(src.tabsSmallLinePaddingBottom),
+      fontSize: src.tabsSmallLineFontSize,
+      '&[data-soui-state="active"]': {
+        fontSize: src.tabsSmallLineCheckedFontSize
+      }
+    },
+    '& $lineInner': {
+      padding: "".concat(src.tabsSmallLineInnerPaddingY, " ").concat(src.tabsSmallLineInnerPaddingX)
+    },
+    // dash
+    '& $headerWrapper[data-soui-shape="dash"] $header $tab': {
+      padding: "".concat(src.tabsSmallLinePaddingTop, " ").concat(src.tabsSmallLinePaddingX, " ").concat(src.tabsSmallLinePaddingBottom),
+      fontSize: src.tabsSmallDashFontSize,
+      '&[data-soui-state="active"]': {
+        fontSize: src.tabsSmallDashActiveFontSize
+      }
+    },
+    // fill
+    '& $headerWrapper[data-soui-shape="fill"] $header $tab': {
+      fontSize: src.tabsSmallFillFontSize,
+      padding: "".concat(src.tabsSmallFillPaddingY, " 0"),
+      '&:first-child': {
+        paddingLeft: src.tabsSmallFillPaddingX
+      },
+      '&:last-child': {
+        paddingRight: src.tabsSmallFillPaddingX
+      }
+    },
+    '& $fillInner': {
+      padding: "".concat(src.tabsSmallFillInnerPaddingY, " ").concat(src.tabsSmallFillInnerPaddingX)
+    }
+  },
+  large: {
+    '& $tab': {
+      fontSize: src.tabsLargeTabFontSize
+    },
+    // card
+    '& $headerWrapper[data-soui-shape="card"] $header $tab': {
+      padding: "".concat(src.tabsLargeCardPaddingY, " ").concat(src.tabsLargeCardPaddingX),
+      fontSize: src.tabsLargeCardFontSize,
+      '&[data-soui-state="active"]': {
+        fontSize: src.tabsLargeCardCheckedFontSize
+      }
+    },
+    // line
+    '& $headerWrapper[data-soui-shape="line"] $header $tab': {
+      padding: "".concat(src.tabsLargeLinePaddingTop, " ").concat(src.tabsLargeLinePaddingX, " ").concat(src.tabsLargeLinePaddingBottom),
+      fontSize: src.tabsLargeLineFontSize,
+      '&[data-soui-state="active"]': {
+        fontSize: src.tabsLargeLineCheckedFontSize
+      }
+    },
+    '& $lineInner': {
+      padding: "".concat(src.tabsLargeLineInnerPaddingY, " ").concat(src.tabsLargeLineInnerPaddingX)
+    },
+    // dash
+    '& $headerWrapper[data-soui-shape="dash"] $header $tab': {
+      padding: "".concat(src.tabsLargeLinePaddingTop, " ").concat(src.tabsLargeLinePaddingX, " ").concat(src.tabsLargeLinePaddingBottom),
+      fontSize: src.tabsLargeDashFontSize,
+      '&[data-soui-state="active"]': {
+        fontSize: src.tabsLargeDashActiveFontSize
+      }
+    },
+    // fill
+    '& $headerWrapper[data-soui-shape="fill"] $header $tab': {
+      fontSize: src.tabsLargeFillFontSize,
+      padding: "".concat(src.tabsLargeFillPaddingY, " 0"),
+      '&:first-child': {
+        paddingLeft: src.tabsLargeFillPaddingX
+      },
+      '&:last-child': {
+        paddingRight: src.tabsLargeFillPaddingX
+      }
+    },
+    '& $fillInner': {
+      padding: "".concat(src.tabsLargeFillInnerPaddingY, " ").concat(src.tabsLargeFillInnerPaddingX)
+    }
+  }
 };
 /* harmony default export */ var tabs_tabs = (tabsStyle);
 ;// CONCATENATED MODULE: ../shineout-style/src/tabs/index.ts
@@ -32402,7 +32546,8 @@ var usePopup = function usePopup(props) {
     mouseLeaveDelay = props.mouseLeaveDelay,
     targetEvents = props.targetEvents,
     _props$defaultOpen = props.defaultOpen,
-    defaultOpen = _props$defaultOpen === void 0 ? false : _props$defaultOpen;
+    defaultOpen = _props$defaultOpen === void 0 ? false : _props$defaultOpen,
+    esc = props.esc;
   var _useState = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(defaultOpen),
     _useState2 = slicedToArray_default()(_useState, 2),
     openState = _useState2[0],
@@ -32563,6 +32708,24 @@ var usePopup = function usePopup(props) {
     effect: (trigger === 'click' || trigger === 'hover') && open,
     event: 'mousedown'
   });
+
+  // ESC 关闭弹出层（仅 click 触发）
+  // 使用 capturing 阶段确保优先于 Modal 的 bubbling 阶段 handler
+  // hover/focus 触发的弹出层不参与 ESC 处理，避免拦截 Modal 等上层组件的 ESC 事件
+  var enableEsc = (esc !== null && esc !== void 0 ? esc : true) && trigger === 'click';
+  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
+    if (!open || !enableEsc) return;
+    var handleEsc = function handleEsc(e) {
+      if (e.key === 'Escape' || e.keyCode === 27) {
+        e.stopPropagation();
+        handleBlur();
+      }
+    };
+    document.addEventListener('keydown', handleEsc, true);
+    return function () {
+      document.removeEventListener('keydown', handleEsc, true);
+    };
+  }, [open, enableEsc]);
   var providerValue = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useMemo)(function () {
     return {
       addParent: handleAddParent,
@@ -34006,7 +34169,8 @@ var Popover = function Popover(props) {
       autoMode: 'popover',
       priorityDirection: priorityDirection,
       mouseEnterDelay: props.mouseEnterDelay,
-      mouseLeaveDelay: props.mouseLeaveDelay
+      mouseLeaveDelay: props.mouseLeaveDelay,
+      esc: config.popupEsc
     }),
     open = _usePopup.open,
     position = _usePopup.position,
@@ -36447,7 +36611,7 @@ var spin_Spin = function Spin() {
 
 
 
-var button_excluded = ["jssStyle", "className", "style", "children", "loading", "href", "text", "outline", "shape", "size", "type", "space", "target", "mode", "htmlType", "renderLoading"],
+var button_excluded = ["jssStyle", "className", "classNames", "styles", "style", "children", "loading", "href", "text", "outline", "shape", "size", "type", "space", "target", "mode", "htmlType", "renderLoading"],
   button_excluded2 = ["htmlType", "onRef"];
 
 
@@ -36464,6 +36628,8 @@ var Button = function Button(props) {
   var _jssStyle$button, _React$Children$map;
   var jssStyle = props.jssStyle,
     className = props.className,
+    classNamesProp = props.classNames,
+    stylesProp = props.styles,
     style = props.style,
     children = props.children,
     loading = props.loading,
@@ -36507,7 +36673,7 @@ var Button = function Button(props) {
     disabled: !!disabled,
     loading: !!loading
   };
-  var _useSemantic = useSemantic(props.classNames, props.styles, globalSemanticConfig, semInfo),
+  var _useSemantic = useSemantic(classNamesProp, stylesProp, globalSemanticConfig, semInfo),
     _useSemantic2 = slicedToArray_default()(_useSemantic, 2),
     semClass = _useSemantic2[0],
     semStyle = _useSemantic2[1];
@@ -44666,7 +44832,8 @@ var Cascader = function Cascader(props0) {
       onCollapse: onCollapse,
       disabled: false,
       trigger: 'click',
-      position: getRTLPosition(positionProp, direction === 'rtl')
+      position: getRTLPosition(positionProp, direction === 'rtl'),
+      esc: config.popupEsc
     }),
     open = _usePopup.open,
     position = _usePopup.position,
@@ -50859,7 +51026,8 @@ var DatePicker = function DatePicker(props0) {
       onCollapse: onCollapse,
       disabled: disabledStatus === 'all',
       trigger: 'click',
-      position: getRTLPosition(listPosition, direction === 'rtl')
+      position: getRTLPosition(listPosition, direction === 'rtl'),
+      esc: config.popupEsc
     }),
     open = _usePopup.open,
     position = _usePopup.position,
@@ -52625,7 +52793,8 @@ var Dropdown = function Dropdown(props) {
       position: getRTLPosition(props.position || dfp, isRtl),
       autoMode: 'menu',
       priorityDirection: 'vertical',
-      mouseLeaveDelay: 200
+      mouseLeaveDelay: 200,
+      esc: config.popupEsc
     }),
     open = _usePopup.open,
     position = _usePopup.position,
@@ -60594,7 +60763,8 @@ function Select(props0) {
       onCollapse: onCollapse,
       disabled: false,
       trigger: trigger,
-      position: getRTLPosition(positionProp, direction === 'rtl')
+      position: getRTLPosition(positionProp, direction === 'rtl'),
+      esc: config.popupEsc
     }),
     open = _usePopup.open,
     position = _usePopup.position,
@@ -71593,6 +71763,7 @@ var TabsHeader = function TabsHeader(props) {
     splitColor = props.splitColor,
     tabBarStyle = props.tabBarStyle,
     getPosition = props.getPosition,
+    size = props.size,
     semClass = props.semClass,
     semStyle = props.semStyle;
   var headerRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
@@ -71740,7 +71911,7 @@ var TabsHeader = function TabsHeader(props) {
         });
       }, 0);
     }
-  }, [active, tabs]);
+  }, [active, tabs, size]);
   var renderHeaderScrollBar = function renderHeaderScrollBar() {
     if (shape !== 'line' && shape !== 'dash') return;
     if (!currentTabSize.width || !currentTabSize.height) return;
@@ -71878,7 +72049,7 @@ var TabsHeader = function TabsHeader(props) {
 
 
 
-var tabs_excluded = ["jssStyle", "align", "children", "shape", "position", "lazy", "autoFill", "hideSplit", "collapsible", "defaultCollapsed", "onChange", "extra", "border", "splitColor", "tabBarExtraContent", "background", "activeBackground", "inactiveBackground", "defaultActive", "tabBarStyle", "color", "sticky", "allowNonPanel", "renderTabsHeader", "className", "classNames", "styles", "style"];
+var tabs_excluded = ["jssStyle", "align", "children", "shape", "position", "size", "lazy", "autoFill", "hideSplit", "collapsible", "defaultCollapsed", "onChange", "extra", "border", "splitColor", "tabBarExtraContent", "background", "activeBackground", "inactiveBackground", "defaultActive", "tabBarStyle", "color", "sticky", "allowNonPanel", "renderTabsHeader", "className", "classNames", "styles", "style"];
 
 
 
@@ -71916,6 +72087,7 @@ var Tabs = function Tabs(props) {
     children = props.children,
     shapeProps = props.shape,
     position = props.position,
+    size = props.size,
     _props$lazy = props.lazy,
     lazy = _props$lazy === void 0 ? true : _props$lazy,
     autoFill = props.autoFill,
@@ -71972,7 +72144,7 @@ var Tabs = function Tabs(props) {
     _useSemantic2 = slicedToArray_default()(_useSemantic, 2),
     semClass = _useSemantic2[0],
     semStyle = _useSemantic2[1];
-  var rootClass = classnames_default()(tabsStyle.rootClass, tabsStyle.tabs, tabsClassName, defineProperty_default()(defineProperty_default()({}, tabsStyle.autoFill, isVertical || autoFill), tabsStyle.collapsed, collapse), semClass('root'));
+  var rootClass = classnames_default()(tabsStyle.rootClass, tabsStyle.tabs, tabsClassName, defineProperty_default()(defineProperty_default()(defineProperty_default()(defineProperty_default()({}, tabsStyle.autoFill, isVertical || autoFill), tabsStyle.collapsed, collapse), tabsStyle.small, size === 'small'), tabsStyle.large, size === 'large'), semClass('root'));
   var getRootProps = function getRootProps() {
     return rest;
   };
@@ -72012,7 +72184,8 @@ var Tabs = function Tabs(props) {
   var getDataProps = function getDataProps() {
     return getDataAttribute({
       position: getPosition(),
-      shape: shape
+      shape: shape,
+      size: size || 'default'
     });
   };
   var handleCollapsible = function handleCollapsible() {
@@ -72086,6 +72259,7 @@ var Tabs = function Tabs(props) {
       align: align,
       jssStyle: jssStyle,
       position: position,
+      size: size,
       hideSplit: hideSplit,
       extra: getExtra(),
       splitColor: border,
@@ -73501,7 +73675,8 @@ var TreeSelect = function TreeSelect(props0) {
       onCollapse: onCollapse,
       disabled: false,
       trigger: 'click',
-      position: getRTLPosition(positionProp, direction === 'rtl')
+      position: getRTLPosition(positionProp, direction === 'rtl'),
+      esc: config.popupEsc
     }),
     open = _usePopup.open,
     position = _usePopup.position,
@@ -79792,7 +79967,7 @@ var watermark_interface = __webpack_require__(6640);
 
 
 /* harmony default export */ var src_0 = ({
-  version: '3.10.1-beta.4'
+  version: '3.10.1-beta.6'
 });
 }();
 /******/ 	return __webpack_exports__;