@rc-component/trigger 1.12.1 → 1.13.0

package/README.md

@@ -9,22 +9,20 @@ React Trigger Component
 [![bundle size][bundlephobia-image]][bundlephobia-url]
 [![dumi][dumi-image]][dumi-url]
 
-[npm-image]: http://img.shields.io/npm/v/@rc-component/trigger.svg?style=flat-square
-[npm-url]: http://npmjs.org/package/@rc-component/trigger
-[github-actions-image]: https://github.com/react-component/trigger/workflows/CI/badge.svg
-[github-actions-url]: https://github.com/react-component/trigger/actions
-[circleci-image]: https://img.shields.io/circleci/react-component/trigger/master?style=flat-square
-[circleci-url]: https://circleci.com/gh/react-component/trigger
-[codecov-image]: https://img.shields.io/codecov/c/github/react-component/trigger/master.svg?style=flat-square
-[codecov-url]: https://app.codecov.io/gh/react-component/trigger
-[david-url]: https://david-dm.org/react-component/trigger
-[david-image]: https://david-dm.org/react-component/trigger/status.svg?style=flat-square
-[david-dev-url]: https://david-dm.org/react-component/trigger?type=dev
-[david-dev-image]: https://david-dm.org/react-component/trigger/dev-status.svg?style=flat-square
-[download-image]: https://img.shields.io/npm/dm/@rc-component/trigger.svg?style=flat-square
-[download-url]: https://npmjs.org/package/@rc-component/trigger
-[bundlephobia-url]: https://bundlephobia.com/result?p=@rc-component/trigger
-[bundlephobia-image]: https://badgen.net/bundlephobia/minzip/@rc-component/trigger
+[npm-image]: http://img.shields.io/npm/v/rc-checkbox.svg?style=flat-square
+[npm-url]: http://npmjs.org/package/rc-checkbox
+[github-actions-image]: https://github.com/react-component/checkbox/workflows/CI/badge.svg
+[github-actions-url]: https://github.com/react-component/checkbox/actions
+[codecov-image]: https://img.shields.io/codecov/c/github/react-component/checkbox/master.svg?style=flat-square
+[codecov-url]: https://codecov.io/gh/react-component/checkbox/branch/master
+[david-url]: https://david-dm.org/react-component/checkbox
+[david-image]: https://david-dm.org/react-component/checkbox/status.svg?style=flat-square
+[david-dev-url]: https://david-dm.org/react-component/checkbox?type=dev
+[david-dev-image]: https://david-dm.org/react-component/checkbox/dev-status.svg?style=flat-square
+[download-image]: https://img.shields.io/npm/dm/rc-checkbox.svg?style=flat-square
+[download-url]: https://npmjs.org/package/rc-checkbox
+[bundlephobia-url]: https://bundlephobia.com/result?p=rc-checkbox
+[bundlephobia-image]: https://badgen.net/bundlephobia/minzip/rc-checkbox
 [dumi-image]: https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square
 [dumi-url]: https://github.com/umijs/dumi
 

package/es/hooks/useAlign.js

@@ -152,20 +152,32 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
       var targetWidth = targetRect.width;
 
       // Get bounding of visible area
-      var visibleArea = placementInfo.htmlRegion === 'scroll' ?
-      // Scroll region should take scrollLeft & scrollTop into account
-      {
-        left: -scrollLeft,
-        top: -scrollTop,
-        right: scrollWidth - scrollLeft,
-        bottom: scrollHeight - scrollTop
-      } : {
+      var visibleRegion = {
         left: 0,
         top: 0,
         right: clientWidth,
         bottom: clientHeight
       };
-      visibleArea = getVisibleArea(visibleArea, scrollerList);
+      var scrollRegion = {
+        left: -scrollLeft,
+        top: -scrollTop,
+        right: scrollWidth - scrollLeft,
+        bottom: scrollHeight - scrollTop
+      };
+      var htmlRegion = placementInfo.htmlRegion;
+      var VISIBLE = 'visible';
+      var VISIBLE_FIRST = 'visibleFirst';
+      if (htmlRegion !== 'scroll' && htmlRegion !== VISIBLE_FIRST) {
+        htmlRegion = VISIBLE;
+      }
+      var isVisibleFirst = htmlRegion === VISIBLE_FIRST;
+      var scrollRegionArea = getVisibleArea(scrollRegion, scrollerList);
+      var visibleRegionArea = getVisibleArea(visibleRegion, scrollerList);
+      var visibleArea = htmlRegion === VISIBLE ? visibleRegionArea : scrollRegionArea;
+
+      // When set to `visibleFirst`,
+      // the check `adjust` logic will use `visibleRegion` for check first.
+      var adjustCheckVisibleArea = isVisibleFirst ? visibleRegionArea : visibleArea;
 
       // Reset back
       popupElement.style.left = originLeft;
@@ -214,18 +226,22 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
       // ============== Intersection ===============
       // Get area by position. Used for check if flip area is better
       function getIntersectionVisibleArea(offsetX, offsetY) {
+        var area = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : visibleArea;
         var l = popupRect.x + offsetX;
         var t = popupRect.y + offsetY;
         var r = l + popupWidth;
         var b = t + popupHeight;
-        var visibleL = Math.max(l, visibleArea.left);
-        var visibleT = Math.max(t, visibleArea.top);
-        var visibleR = Math.min(r, visibleArea.right);
-        var visibleB = Math.min(b, visibleArea.bottom);
+        var visibleL = Math.max(l, area.left);
+        var visibleT = Math.max(t, area.top);
+        var visibleR = Math.min(r, area.right);
+        var visibleB = Math.min(b, area.bottom);
         return Math.max(0, (visibleR - visibleL) * (visibleB - visibleT));
       }
       var originIntersectionVisibleArea = getIntersectionVisibleArea(nextOffsetX, nextOffsetY);
 
+      // As `visibleFirst`, we prepare this for check
+      var originIntersectionRecommendArea = getIntersectionVisibleArea(nextOffsetX, nextOffsetY, visibleRegionArea);
+
       // ========================== Overflow ===========================
       var targetAlignPointTL = getAlignPoint(targetRect, ['t', 'l']);
       var popupAlignPointTL = getAlignPoint(popupRect, ['t', 'l']);
@@ -261,14 +277,20 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
       var sameTB = popupPoints[0] === targetPoints[0];
 
       // Bottom to Top
-      if (needAdjustY && popupPoints[0] === 't' && (nextPopupBottom > visibleArea.bottom || prevFlipRef.current.bt)) {
+      if (needAdjustY && popupPoints[0] === 't' && (nextPopupBottom > adjustCheckVisibleArea.bottom || prevFlipRef.current.bt)) {
         var tmpNextOffsetY = nextOffsetY;
         if (sameTB) {
           tmpNextOffsetY -= popupHeight - targetHeight;
         } else {
           tmpNextOffsetY = targetAlignPointTL.y - popupAlignPointBR.y - popupOffsetY;
         }
-        if (getIntersectionVisibleArea(nextOffsetX, tmpNextOffsetY) >= originIntersectionVisibleArea) {
+        var newVisibleArea = getIntersectionVisibleArea(nextOffsetX, tmpNextOffsetY);
+        var newVisibleRecommendArea = getIntersectionVisibleArea(nextOffsetX, tmpNextOffsetY, visibleRegionArea);
+        if (
+        // Of course use larger one
+        newVisibleArea > originIntersectionVisibleArea || newVisibleArea === originIntersectionVisibleArea && (!isVisibleFirst ||
+        // Choose recommend one
+        newVisibleRecommendArea >= originIntersectionRecommendArea)) {
           prevFlipRef.current.bt = true;
           nextOffsetY = tmpNextOffsetY;
           nextAlignInfo.points = [reversePoints(popupPoints, 0), reversePoints(targetPoints, 0)];
@@ -278,14 +300,20 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
       }
 
       // Top to Bottom
-      if (needAdjustY && popupPoints[0] === 'b' && (nextPopupY < visibleArea.top || prevFlipRef.current.tb)) {
+      if (needAdjustY && popupPoints[0] === 'b' && (nextPopupY < adjustCheckVisibleArea.top || prevFlipRef.current.tb)) {
         var _tmpNextOffsetY = nextOffsetY;
         if (sameTB) {
           _tmpNextOffsetY += popupHeight - targetHeight;
         } else {
           _tmpNextOffsetY = targetAlignPointBR.y - popupAlignPointTL.y - popupOffsetY;
         }
-        if (getIntersectionVisibleArea(nextOffsetX, _tmpNextOffsetY) >= originIntersectionVisibleArea) {
+        var _newVisibleArea = getIntersectionVisibleArea(nextOffsetX, _tmpNextOffsetY);
+        var _newVisibleRecommendArea = getIntersectionVisibleArea(nextOffsetX, _tmpNextOffsetY, visibleRegionArea);
+        if (
+        // Of course use larger one
+        _newVisibleArea > originIntersectionVisibleArea || _newVisibleArea === originIntersectionVisibleArea && (!isVisibleFirst ||
+        // Choose recommend one
+        _newVisibleRecommendArea >= originIntersectionRecommendArea)) {
           prevFlipRef.current.tb = true;
           nextOffsetY = _tmpNextOffsetY;
           nextAlignInfo.points = [reversePoints(popupPoints, 0), reversePoints(targetPoints, 0)];
@@ -301,14 +329,20 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
       var sameLR = popupPoints[1] === targetPoints[1];
 
       // Right to Left
-      if (needAdjustX && popupPoints[1] === 'l' && (nextPopupRight > visibleArea.right || prevFlipRef.current.rl)) {
+      if (needAdjustX && popupPoints[1] === 'l' && (nextPopupRight > adjustCheckVisibleArea.right || prevFlipRef.current.rl)) {
         var tmpNextOffsetX = nextOffsetX;
         if (sameLR) {
           tmpNextOffsetX -= popupWidth - targetWidth;
         } else {
           tmpNextOffsetX = targetAlignPointTL.x - popupAlignPointBR.x - popupOffsetX;
         }
-        if (getIntersectionVisibleArea(tmpNextOffsetX, nextOffsetY) >= originIntersectionVisibleArea) {
+        var _newVisibleArea2 = getIntersectionVisibleArea(tmpNextOffsetX, nextOffsetY);
+        var _newVisibleRecommendArea2 = getIntersectionVisibleArea(tmpNextOffsetX, nextOffsetY, visibleRegionArea);
+        if (
+        // Of course use larger one
+        _newVisibleArea2 > originIntersectionVisibleArea || _newVisibleArea2 === originIntersectionVisibleArea && (!isVisibleFirst ||
+        // Choose recommend one
+        _newVisibleRecommendArea2 >= originIntersectionRecommendArea)) {
           prevFlipRef.current.rl = true;
           nextOffsetX = tmpNextOffsetX;
           nextAlignInfo.points = [reversePoints(popupPoints, 1), reversePoints(targetPoints, 1)];
@@ -318,14 +352,20 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
       }
 
       // Left to Right
-      if (needAdjustX && popupPoints[1] === 'r' && (nextPopupX < visibleArea.left || prevFlipRef.current.lr)) {
+      if (needAdjustX && popupPoints[1] === 'r' && (nextPopupX < adjustCheckVisibleArea.left || prevFlipRef.current.lr)) {
         var _tmpNextOffsetX = nextOffsetX;
         if (sameLR) {
           _tmpNextOffsetX += popupWidth - targetWidth;
         } else {
           _tmpNextOffsetX = targetAlignPointBR.x - popupAlignPointTL.x - popupOffsetX;
         }
-        if (getIntersectionVisibleArea(_tmpNextOffsetX, nextOffsetY) >= originIntersectionVisibleArea) {
+        var _newVisibleArea3 = getIntersectionVisibleArea(_tmpNextOffsetX, nextOffsetY);
+        var _newVisibleRecommendArea3 = getIntersectionVisibleArea(_tmpNextOffsetX, nextOffsetY, visibleRegionArea);
+        if (
+        // Of course use larger one
+        _newVisibleArea3 > originIntersectionVisibleArea || _newVisibleArea3 === originIntersectionVisibleArea && (!isVisibleFirst ||
+        // Choose recommend one
+        _newVisibleRecommendArea3 >= originIntersectionRecommendArea)) {
           prevFlipRef.current.lr = true;
           nextOffsetX = _tmpNextOffsetX;
           nextAlignInfo.points = [reversePoints(popupPoints, 1), reversePoints(targetPoints, 1)];

package/es/index.js

@@ -223,7 +223,7 @@ export function generateTrigger() {
     useWatch(mergedOpen, targetEle, popupEle, triggerAlign);
     useLayoutEffect(function () {
       triggerAlign();
-    }, [mousePos]);
+    }, [mousePos, popupPlacement]);
 
     // When no builtinPlacements and popupAlign changed
     useLayoutEffect(function () {

package/es/interface.d.ts

@@ -36,10 +36,17 @@ export interface AlignType {
     autoArrow?: boolean;
     /**
      * Config visible region check of html node. Default `visible`:
-     *  - `visible`: The visible region of user browser window. Use `clientHeight` for check.
-     *  - `scroll`: The whole region of the html scroll area. Use `scrollHeight` for check.
+     *  - `visible`:
+     *    The visible region of user browser window.
+     *    Use `clientHeight` for check.
+     *    If `visible` region not satisfy, fallback to `scroll`.
+     *  - `scroll`:
+     *    The whole region of the html scroll area.
+     *    Use `scrollHeight` for check.
+     *  - `visibleFirst`:
+     *    Similar to `visible`, but if `visible` region not satisfy, fallback to `scroll`.
      */
-    htmlRegion?: 'visible' | 'scroll';
+    htmlRegion?: 'visible' | 'scroll' | 'visibleFirst';
     /**
      * Whether use css right instead of left to position
      */

package/lib/hooks/useAlign.js

@@ -160,20 +160,32 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
       var targetWidth = targetRect.width;
 
       // Get bounding of visible area
-      var visibleArea = placementInfo.htmlRegion === 'scroll' ?
-      // Scroll region should take scrollLeft & scrollTop into account
-      {
-        left: -scrollLeft,
-        top: -scrollTop,
-        right: scrollWidth - scrollLeft,
-        bottom: scrollHeight - scrollTop
-      } : {
+      var visibleRegion = {
         left: 0,
         top: 0,
         right: clientWidth,
         bottom: clientHeight
       };
-      visibleArea = (0, _util.getVisibleArea)(visibleArea, scrollerList);
+      var scrollRegion = {
+        left: -scrollLeft,
+        top: -scrollTop,
+        right: scrollWidth - scrollLeft,
+        bottom: scrollHeight - scrollTop
+      };
+      var htmlRegion = placementInfo.htmlRegion;
+      var VISIBLE = 'visible';
+      var VISIBLE_FIRST = 'visibleFirst';
+      if (htmlRegion !== 'scroll' && htmlRegion !== VISIBLE_FIRST) {
+        htmlRegion = VISIBLE;
+      }
+      var isVisibleFirst = htmlRegion === VISIBLE_FIRST;
+      var scrollRegionArea = (0, _util.getVisibleArea)(scrollRegion, scrollerList);
+      var visibleRegionArea = (0, _util.getVisibleArea)(visibleRegion, scrollerList);
+      var visibleArea = htmlRegion === VISIBLE ? visibleRegionArea : scrollRegionArea;
+
+      // When set to `visibleFirst`,
+      // the check `adjust` logic will use `visibleRegion` for check first.
+      var adjustCheckVisibleArea = isVisibleFirst ? visibleRegionArea : visibleArea;
 
       // Reset back
       popupElement.style.left = originLeft;
@@ -222,18 +234,22 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
       // ============== Intersection ===============
       // Get area by position. Used for check if flip area is better
       function getIntersectionVisibleArea(offsetX, offsetY) {
+        var area = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : visibleArea;
         var l = popupRect.x + offsetX;
         var t = popupRect.y + offsetY;
         var r = l + popupWidth;
         var b = t + popupHeight;
-        var visibleL = Math.max(l, visibleArea.left);
-        var visibleT = Math.max(t, visibleArea.top);
-        var visibleR = Math.min(r, visibleArea.right);
-        var visibleB = Math.min(b, visibleArea.bottom);
+        var visibleL = Math.max(l, area.left);
+        var visibleT = Math.max(t, area.top);
+        var visibleR = Math.min(r, area.right);
+        var visibleB = Math.min(b, area.bottom);
         return Math.max(0, (visibleR - visibleL) * (visibleB - visibleT));
       }
       var originIntersectionVisibleArea = getIntersectionVisibleArea(nextOffsetX, nextOffsetY);
 
+      // As `visibleFirst`, we prepare this for check
+      var originIntersectionRecommendArea = getIntersectionVisibleArea(nextOffsetX, nextOffsetY, visibleRegionArea);
+
       // ========================== Overflow ===========================
       var targetAlignPointTL = getAlignPoint(targetRect, ['t', 'l']);
       var popupAlignPointTL = getAlignPoint(popupRect, ['t', 'l']);
@@ -269,14 +285,20 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
       var sameTB = popupPoints[0] === targetPoints[0];
 
       // Bottom to Top
-      if (needAdjustY && popupPoints[0] === 't' && (nextPopupBottom > visibleArea.bottom || prevFlipRef.current.bt)) {
+      if (needAdjustY && popupPoints[0] === 't' && (nextPopupBottom > adjustCheckVisibleArea.bottom || prevFlipRef.current.bt)) {
         var tmpNextOffsetY = nextOffsetY;
         if (sameTB) {
           tmpNextOffsetY -= popupHeight - targetHeight;
         } else {
           tmpNextOffsetY = targetAlignPointTL.y - popupAlignPointBR.y - popupOffsetY;
         }
-        if (getIntersectionVisibleArea(nextOffsetX, tmpNextOffsetY) >= originIntersectionVisibleArea) {
+        var newVisibleArea = getIntersectionVisibleArea(nextOffsetX, tmpNextOffsetY);
+        var newVisibleRecommendArea = getIntersectionVisibleArea(nextOffsetX, tmpNextOffsetY, visibleRegionArea);
+        if (
+        // Of course use larger one
+        newVisibleArea > originIntersectionVisibleArea || newVisibleArea === originIntersectionVisibleArea && (!isVisibleFirst ||
+        // Choose recommend one
+        newVisibleRecommendArea >= originIntersectionRecommendArea)) {
           prevFlipRef.current.bt = true;
           nextOffsetY = tmpNextOffsetY;
           nextAlignInfo.points = [reversePoints(popupPoints, 0), reversePoints(targetPoints, 0)];
@@ -286,14 +308,20 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
       }
 
       // Top to Bottom
-      if (needAdjustY && popupPoints[0] === 'b' && (nextPopupY < visibleArea.top || prevFlipRef.current.tb)) {
+      if (needAdjustY && popupPoints[0] === 'b' && (nextPopupY < adjustCheckVisibleArea.top || prevFlipRef.current.tb)) {
         var _tmpNextOffsetY = nextOffsetY;
         if (sameTB) {
           _tmpNextOffsetY += popupHeight - targetHeight;
         } else {
           _tmpNextOffsetY = targetAlignPointBR.y - popupAlignPointTL.y - popupOffsetY;
         }
-        if (getIntersectionVisibleArea(nextOffsetX, _tmpNextOffsetY) >= originIntersectionVisibleArea) {
+        var _newVisibleArea = getIntersectionVisibleArea(nextOffsetX, _tmpNextOffsetY);
+        var _newVisibleRecommendArea = getIntersectionVisibleArea(nextOffsetX, _tmpNextOffsetY, visibleRegionArea);
+        if (
+        // Of course use larger one
+        _newVisibleArea > originIntersectionVisibleArea || _newVisibleArea === originIntersectionVisibleArea && (!isVisibleFirst ||
+        // Choose recommend one
+        _newVisibleRecommendArea >= originIntersectionRecommendArea)) {
           prevFlipRef.current.tb = true;
           nextOffsetY = _tmpNextOffsetY;
           nextAlignInfo.points = [reversePoints(popupPoints, 0), reversePoints(targetPoints, 0)];
@@ -309,14 +337,20 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
       var sameLR = popupPoints[1] === targetPoints[1];
 
       // Right to Left
-      if (needAdjustX && popupPoints[1] === 'l' && (nextPopupRight > visibleArea.right || prevFlipRef.current.rl)) {
+      if (needAdjustX && popupPoints[1] === 'l' && (nextPopupRight > adjustCheckVisibleArea.right || prevFlipRef.current.rl)) {
         var tmpNextOffsetX = nextOffsetX;
         if (sameLR) {
           tmpNextOffsetX -= popupWidth - targetWidth;
         } else {
           tmpNextOffsetX = targetAlignPointTL.x - popupAlignPointBR.x - popupOffsetX;
         }
-        if (getIntersectionVisibleArea(tmpNextOffsetX, nextOffsetY) >= originIntersectionVisibleArea) {
+        var _newVisibleArea2 = getIntersectionVisibleArea(tmpNextOffsetX, nextOffsetY);
+        var _newVisibleRecommendArea2 = getIntersectionVisibleArea(tmpNextOffsetX, nextOffsetY, visibleRegionArea);
+        if (
+        // Of course use larger one
+        _newVisibleArea2 > originIntersectionVisibleArea || _newVisibleArea2 === originIntersectionVisibleArea && (!isVisibleFirst ||
+        // Choose recommend one
+        _newVisibleRecommendArea2 >= originIntersectionRecommendArea)) {
           prevFlipRef.current.rl = true;
           nextOffsetX = tmpNextOffsetX;
           nextAlignInfo.points = [reversePoints(popupPoints, 1), reversePoints(targetPoints, 1)];
@@ -326,14 +360,20 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
       }
 
       // Left to Right
-      if (needAdjustX && popupPoints[1] === 'r' && (nextPopupX < visibleArea.left || prevFlipRef.current.lr)) {
+      if (needAdjustX && popupPoints[1] === 'r' && (nextPopupX < adjustCheckVisibleArea.left || prevFlipRef.current.lr)) {
         var _tmpNextOffsetX = nextOffsetX;
         if (sameLR) {
           _tmpNextOffsetX += popupWidth - targetWidth;
         } else {
           _tmpNextOffsetX = targetAlignPointBR.x - popupAlignPointTL.x - popupOffsetX;
         }
-        if (getIntersectionVisibleArea(_tmpNextOffsetX, nextOffsetY) >= originIntersectionVisibleArea) {
+        var _newVisibleArea3 = getIntersectionVisibleArea(_tmpNextOffsetX, nextOffsetY);
+        var _newVisibleRecommendArea3 = getIntersectionVisibleArea(_tmpNextOffsetX, nextOffsetY, visibleRegionArea);
+        if (
+        // Of course use larger one
+        _newVisibleArea3 > originIntersectionVisibleArea || _newVisibleArea3 === originIntersectionVisibleArea && (!isVisibleFirst ||
+        // Choose recommend one
+        _newVisibleRecommendArea3 >= originIntersectionRecommendArea)) {
           prevFlipRef.current.lr = true;
           nextOffsetX = _tmpNextOffsetX;
           nextAlignInfo.points = [reversePoints(popupPoints, 1), reversePoints(targetPoints, 1)];

package/lib/index.js

@@ -232,7 +232,7 @@ function generateTrigger() {
     (0, _useWatch.default)(mergedOpen, targetEle, popupEle, triggerAlign);
     (0, _useLayoutEffect.default)(function () {
       triggerAlign();
-    }, [mousePos]);
+    }, [mousePos, popupPlacement]);
 
     // When no builtinPlacements and popupAlign changed
     (0, _useLayoutEffect.default)(function () {

package/lib/interface.d.ts

@@ -36,10 +36,17 @@ export interface AlignType {
     autoArrow?: boolean;
     /**
      * Config visible region check of html node. Default `visible`:
-     *  - `visible`: The visible region of user browser window. Use `clientHeight` for check.
-     *  - `scroll`: The whole region of the html scroll area. Use `scrollHeight` for check.
+     *  - `visible`:
+     *    The visible region of user browser window.
+     *    Use `clientHeight` for check.
+     *    If `visible` region not satisfy, fallback to `scroll`.
+     *  - `scroll`:
+     *    The whole region of the html scroll area.
+     *    Use `scrollHeight` for check.
+     *  - `visibleFirst`:
+     *    Similar to `visible`, but if `visible` region not satisfy, fallback to `scroll`.
      */
-    htmlRegion?: 'visible' | 'scroll';
+    htmlRegion?: 'visible' | 'scroll' | 'visibleFirst';
     /**
      * Whether use css right instead of left to position
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rc-component/trigger",
-  "version": "1.12.1",
+  "version": "1.13.0",
   "description": "base abstract trigger component for react",
   "engines": {
     "node": ">=8.x"