@sheinx/hooks 3.4.3-beta.4 → 3.4.3-beta.6
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/common/use-position-style/index.d.ts.map +1 -1
- package/cjs/common/use-position-style/index.js +4 -1
- package/cjs/components/use-popup/use-popup.d.ts.map +1 -1
- package/cjs/components/use-popup/use-popup.js +2 -4
- package/cjs/components/use-select/use-select.d.ts.map +1 -1
- package/cjs/components/use-select/use-select.js +1 -0
- package/cjs/components/use-select/use-select.type.d.ts +1 -1
- package/cjs/components/use-select/use-select.type.d.ts.map +1 -1
- package/cjs/utils/dom/element.d.ts +1 -0
- package/cjs/utils/dom/element.d.ts.map +1 -1
- package/cjs/utils/dom/element.js +31 -0
- package/cjs/utils/position.d.ts +1 -1
- package/esm/common/use-position-style/index.d.ts.map +1 -1
- package/esm/common/use-position-style/index.js +4 -1
- package/esm/components/use-popup/use-popup.d.ts.map +1 -1
- package/esm/components/use-popup/use-popup.js +2 -4
- package/esm/components/use-select/use-select.d.ts.map +1 -1
- package/esm/components/use-select/use-select.js +1 -0
- package/esm/components/use-select/use-select.type.d.ts +1 -1
- package/esm/components/use-select/use-select.type.d.ts.map +1 -1
- package/esm/utils/dom/element.d.ts +1 -0
- package/esm/utils/dom/element.d.ts.map +1 -1
- package/esm/utils/dom/element.js +30 -0
- package/esm/utils/position.d.ts +1 -1
- package/package.json +1 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAOnD,MAAM,MAAM,kBAAkB,GAC1B,aAAa,GACb,UAAU,GACV,cAAc,GACd,WAAW,GACX,MAAM,GACN,OAAO,CAAC;AACZ,MAAM,MAAM,gBAAgB,GACxB,aAAa,GACb,cAAc,GACd,UAAU,GACV,WAAW,GACX,KAAK,GACL,QAAQ,CAAC;AAYb,KAAK,YAAY,GAAG,kBAAkB,GAAG,gBAAgB,GAAG,OAAO,CAAC;AACpE,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,YAAY,GAAG,SAAS,CAAC;IACnC,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,OAAO,CAAC;IAEd,WAAW,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAE1C,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAEzC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC3C,YAAY,EAAE,MAAM,WAAW,GAAG,IAAI,GAAG,SAAS,CAAC;IACnD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAQD,eAAO,MAAM,gBAAgB,WAAY,mBAAmB;;;CAsS3D,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
@@ -11,6 +11,7 @@ var _getPositionStyle = require("./get-position-style");
|
|
11
11
|
var _shallowEqual = _interopRequireDefault(require("../../utils/shallow-equal"));
|
12
12
|
var _usePersistFn = _interopRequireDefault(require("../use-persist-fn"));
|
13
13
|
var _utils = require("../../utils");
|
14
|
+
var _element = require("../../utils/dom/element");
|
14
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
15
16
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
16
17
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
@@ -138,6 +139,7 @@ var usePositionStyle = exports.usePositionStyle = function usePositionStyle(conf
|
|
138
139
|
}
|
139
140
|
var targetPosition = position;
|
140
141
|
var rootContainer = getContainer() || document.body;
|
142
|
+
var closestScrollContainer = (0, _element.getClosestScrollContainer)(parentElRef.current);
|
141
143
|
var containerRect = rootContainer.getBoundingClientRect();
|
142
144
|
var bodyRect = (document.documentElement || document.body).getBoundingClientRect();
|
143
145
|
var containerScrollBarWidth = rootContainer.offsetWidth - rootContainer.clientWidth;
|
@@ -156,7 +158,7 @@ var usePositionStyle = exports.usePositionStyle = function usePositionStyle(conf
|
|
156
158
|
var overRight = 0;
|
157
159
|
var overLeft = 0;
|
158
160
|
if (h === 'left') {
|
159
|
-
style.left = rect.left - containerRect.left + containerScroll.left;
|
161
|
+
style.left = rect.left - containerRect.left + containerScroll.left + ((closestScrollContainer === null || closestScrollContainer === void 0 ? void 0 : closestScrollContainer.scrollLeft) || 0);
|
160
162
|
style.transform = '';
|
161
163
|
arrayStyle.left = "8px";
|
162
164
|
if (adjust) {
|
@@ -341,6 +343,7 @@ var usePositionStyle = exports.usePositionStyle = function usePositionStyle(conf
|
|
341
343
|
newStyle = _getStyle.newStyle,
|
342
344
|
newArrayStyle = _getStyle.newArrayStyle;
|
343
345
|
if (newStyle && !(0, _shallowEqual.default)(style, newStyle)) {
|
346
|
+
console.log('show, position, absolute, updateKey, fixedWidth: >>', show, position, absolute, updateKey, fixedWidth);
|
344
347
|
setStyle(newStyle);
|
345
348
|
setArrayStyle(newArrayStyle || {});
|
346
349
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"use-popup.d.ts","sourceRoot":"","sources":["use-popup.ts"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;
|
1
|
+
{"version":3,"file":"use-popup.d.ts","sourceRoot":"","sources":["use-popup.ts"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAOhE,QAAA,MAAM,QAAQ,UAAW,cAAc;;;;;;;0BAyHK;YAAE,MAAM,EAAE,WAAW,GAAG,IAAI,CAAA;SAAE;0BAM9B;YAAE,MAAM,EAAE,WAAW,GAAG,IAAI,CAAA;SAAE;;;;;qBA5B7B;YAAE,MAAM,EAAE,WAAW,GAAG,IAAI,CAAA;SAAE;;;;;;;;;;;;;;;;;;;;;;;;;2BA6ElD,MAAM,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC;6BAGxC,MAAM,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC;;CAsBpE,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
@@ -71,10 +71,8 @@ var usePopup = function usePopup(props) {
|
|
71
71
|
var updatePosition = (0, _usePersistFn.default)(function () {
|
72
72
|
// if (isPositionControl) return;
|
73
73
|
// if (props.position === 'auto' || !props.position) {
|
74
|
-
|
75
|
-
|
76
|
-
if (newPosition !== position) setPositionState(newPosition);
|
77
|
-
}, 10);
|
74
|
+
var newPosition = (0, _position.getPosition)(targetRef.current, props.priorityDirection, autoMode, popupRef.current || undefined);
|
75
|
+
if (newPosition !== position) setPositionState(newPosition);
|
78
76
|
});
|
79
77
|
(0, _react.useEffect)(function () {
|
80
78
|
if (props.open) {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"use-select.d.ts","sourceRoot":"","sources":["use-select.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
1
|
+
{"version":3,"file":"use-select.d.ts","sourceRoot":"","sources":["use-select.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6Cd,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
@@ -50,7 +50,7 @@ export interface BaseSelectProps<DataItem, Value> {
|
|
50
50
|
* @en Change callback
|
51
51
|
* @cn 值改变回调
|
52
52
|
*/
|
53
|
-
onChange?: (value: Value, data?: DataItem
|
53
|
+
onChange?: (value: Value, data?: DataItem, checked?: boolean) => void;
|
54
54
|
/**
|
55
55
|
* @en Group by
|
56
56
|
* @cn 分组
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"use-select.type.d.ts","sourceRoot":"","sources":["use-select.type.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAE9C,MAAM,WAAW,eAAe,CAAC,QAAQ,EAAE,KAAK;IAC9C,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,CAAC,EAAE,QAAQ,EAAE,CAAC;IAClB,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;IACtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;OAGG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,QAAQ,CAAC;IAE7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC;IAEnD;;;;OAIG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,SAAS,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,CAAC,GAAG,KAAK,EAAE,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC;IAEvF;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,QAAQ,KAAK,KAAK,SAAS,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC;IAE3F;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,GAAG,CAAC;IAErC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,QAAQ,
|
1
|
+
{"version":3,"file":"use-select.type.d.ts","sourceRoot":"","sources":["use-select.type.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAE9C,MAAM,WAAW,eAAe,CAAC,QAAQ,EAAE,KAAK;IAC9C,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,CAAC,EAAE,QAAQ,EAAE,CAAC;IAClB,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;IACtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;OAGG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,QAAQ,CAAC;IAE7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC;IAEnD;;;;OAIG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,SAAS,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,CAAC,GAAG,KAAK,EAAE,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC;IAEvF;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,QAAQ,KAAK,KAAK,SAAS,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC;IAE3F;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,GAAG,CAAC;IAErC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,QAAQ,EAAE,OAAO,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAEtE;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,QAAQ,EAAE,KAAK,MAAM,CAAC;IACxE,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B"}
|
@@ -12,6 +12,7 @@ export declare const addResizeObserver: (el: HTMLElement, handler: any, options?
|
|
12
12
|
timer?: number | undefined;
|
13
13
|
}) => () => void;
|
14
14
|
export declare function getParent(el: HTMLElement | null | Element, target?: string | HTMLElement): Element | null;
|
15
|
+
export declare function getClosestScrollContainer(element: HTMLElement | null): Element | null;
|
15
16
|
export declare function cssSupport(attr: keyof CSSStyleDeclaration, value: string): boolean;
|
16
17
|
export declare const parsePxToNumber: (str: string) => number;
|
17
18
|
//# sourceMappingURL=element.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"element.d.ts","sourceRoot":"","sources":["element.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B;;;;;;GAMG;AACH,wBAAgB,QAAQ,CACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,EACzB,WAAW,UAAQ,EACnB,SAAS,CAAC,EAAE,MAAM,GACjB,KAAK,CAAC,SAAS,CASjB;AAGD,eAAO,MAAM,iBAAiB,OACxB,WAAW,WACN,GAAG;;;gBA4Cb,CAAC;AAEF,wBAAgB,SAAS,CAAC,EAAE,EAAE,WAAW,GAAG,IAAI,GAAG,OAAO,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,kBAmBxF;AAED,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,mBAAmB,EAAE,KAAK,EAAE,MAAM,WAYxE;AAED,eAAO,MAAM,eAAe,QAAS,MAAM,WAAwC,CAAC"}
|
1
|
+
{"version":3,"file":"element.d.ts","sourceRoot":"","sources":["element.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B;;;;;;GAMG;AACH,wBAAgB,QAAQ,CACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,EACzB,WAAW,UAAQ,EACnB,SAAS,CAAC,EAAE,MAAM,GACjB,KAAK,CAAC,SAAS,CASjB;AAGD,eAAO,MAAM,iBAAiB,OACxB,WAAW,WACN,GAAG;;;gBA4Cb,CAAC;AAEF,wBAAgB,SAAS,CAAC,EAAE,EAAE,WAAW,GAAG,IAAI,GAAG,OAAO,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,kBAmBxF;AAED,wBAAgB,yBAAyB,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,kBA+BpE;AAED,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,mBAAmB,EAAE,KAAK,EAAE,MAAM,WAYxE;AAED,eAAO,MAAM,eAAe,QAAS,MAAM,WAAwC,CAAC"}
|
package/cjs/utils/dom/element.js
CHANGED
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.addResizeObserver = void 0;
|
7
7
|
exports.cssSupport = cssSupport;
|
8
|
+
exports.getClosestScrollContainer = getClosestScrollContainer;
|
8
9
|
exports.getParent = getParent;
|
9
10
|
exports.parsePxToNumber = void 0;
|
10
11
|
exports.wrapSpan = wrapSpan;
|
@@ -125,6 +126,36 @@ function getParent(el, target) {
|
|
125
126
|
}
|
126
127
|
return null;
|
127
128
|
}
|
129
|
+
function getClosestScrollContainer(element) {
|
130
|
+
if (!element) {
|
131
|
+
return null;
|
132
|
+
}
|
133
|
+
|
134
|
+
// 检查元素是否可滚动
|
135
|
+
var isScrollable = function isScrollable(el) {
|
136
|
+
var style = window.getComputedStyle(el);
|
137
|
+
var overflowX = style.overflowX;
|
138
|
+
var overflowY = style.overflowY;
|
139
|
+
return (overflowX === 'auto' || overflowX === 'scroll' || overflowY === 'auto' || overflowY === 'scroll') && (el.scrollHeight > el.clientHeight || el.scrollWidth > el.clientWidth);
|
140
|
+
};
|
141
|
+
|
142
|
+
// 如果元素本身是可滚动的,直接返回
|
143
|
+
if (isScrollable(element)) {
|
144
|
+
return element;
|
145
|
+
}
|
146
|
+
|
147
|
+
// 遍历父元素
|
148
|
+
var parent = element.parentElement;
|
149
|
+
while (parent) {
|
150
|
+
if (isScrollable(parent)) {
|
151
|
+
return parent;
|
152
|
+
}
|
153
|
+
parent = parent.parentElement;
|
154
|
+
}
|
155
|
+
|
156
|
+
// 如果没有找到可滚动的祖先,返回 body 或 documentElement
|
157
|
+
return document.scrollingElement || document.documentElement;
|
158
|
+
}
|
128
159
|
function cssSupport(attr, value) {
|
129
160
|
if ((0, _is.isBrowser)()) {
|
130
161
|
var element = document.createElement('div');
|
package/cjs/utils/position.d.ts
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
export declare const getPosition: (target: HTMLElement | null, priorityDirection: "
|
1
|
+
export declare const getPosition: (target: HTMLElement | null, priorityDirection: "auto" | "vertical" | "horizontal" | undefined, mode: 'popover' | 'menu' | 'list', popup?: HTMLElement) => "bottom" | "left" | "right" | "top" | "top-left" | "top-right" | "bottom-left" | "bottom-right" | "left-top" | "left-bottom" | "right-top" | "right-bottom";
|
2
2
|
//# sourceMappingURL=position.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAOnD,MAAM,MAAM,kBAAkB,GAC1B,aAAa,GACb,UAAU,GACV,cAAc,GACd,WAAW,GACX,MAAM,GACN,OAAO,CAAC;AACZ,MAAM,MAAM,gBAAgB,GACxB,aAAa,GACb,cAAc,GACd,UAAU,GACV,WAAW,GACX,KAAK,GACL,QAAQ,CAAC;AAYb,KAAK,YAAY,GAAG,kBAAkB,GAAG,gBAAgB,GAAG,OAAO,CAAC;AACpE,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,YAAY,GAAG,SAAS,CAAC;IACnC,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,OAAO,CAAC;IAEd,WAAW,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAE1C,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAEzC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC3C,YAAY,EAAE,MAAM,WAAW,GAAG,IAAI,GAAG,SAAS,CAAC;IACnD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAQD,eAAO,MAAM,gBAAgB,WAAY,mBAAmB;;;CAsS3D,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
@@ -10,6 +10,7 @@ import { getPositionStyle } from "./get-position-style";
|
|
10
10
|
import shallowEqual from "../../utils/shallow-equal";
|
11
11
|
import usePersistFn from "../use-persist-fn";
|
12
12
|
import { docSize, isChromeLowerThan } from "../../utils";
|
13
|
+
import { getClosestScrollContainer } from "../../utils/dom/element";
|
13
14
|
var horizontalPosition = ['left-bottom', 'left-top', 'right-bottom', 'right-top', 'left', 'right'];
|
14
15
|
var verticalPosition = ['bottom-left', 'bottom-right', 'top-left', 'top-right', 'bottom', 'top'];
|
15
16
|
var hideStyle = {
|
@@ -128,6 +129,7 @@ export var usePositionStyle = function usePositionStyle(config) {
|
|
128
129
|
}
|
129
130
|
var targetPosition = position;
|
130
131
|
var rootContainer = getContainer() || document.body;
|
132
|
+
var closestScrollContainer = getClosestScrollContainer(parentElRef.current);
|
131
133
|
var containerRect = rootContainer.getBoundingClientRect();
|
132
134
|
var bodyRect = (document.documentElement || document.body).getBoundingClientRect();
|
133
135
|
var containerScrollBarWidth = rootContainer.offsetWidth - rootContainer.clientWidth;
|
@@ -146,7 +148,7 @@ export var usePositionStyle = function usePositionStyle(config) {
|
|
146
148
|
var overRight = 0;
|
147
149
|
var overLeft = 0;
|
148
150
|
if (h === 'left') {
|
149
|
-
style.left = rect.left - containerRect.left + containerScroll.left;
|
151
|
+
style.left = rect.left - containerRect.left + containerScroll.left + ((closestScrollContainer === null || closestScrollContainer === void 0 ? void 0 : closestScrollContainer.scrollLeft) || 0);
|
150
152
|
style.transform = '';
|
151
153
|
arrayStyle.left = "8px";
|
152
154
|
if (adjust) {
|
@@ -331,6 +333,7 @@ export var usePositionStyle = function usePositionStyle(config) {
|
|
331
333
|
newStyle = _getStyle.newStyle,
|
332
334
|
newArrayStyle = _getStyle.newArrayStyle;
|
333
335
|
if (newStyle && !shallowEqual(style, newStyle)) {
|
336
|
+
console.log('show, position, absolute, updateKey, fixedWidth: >>', show, position, absolute, updateKey, fixedWidth);
|
334
337
|
setStyle(newStyle);
|
335
338
|
setArrayStyle(newArrayStyle || {});
|
336
339
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"use-popup.d.ts","sourceRoot":"","sources":["use-popup.ts"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;
|
1
|
+
{"version":3,"file":"use-popup.d.ts","sourceRoot":"","sources":["use-popup.ts"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAOhE,QAAA,MAAM,QAAQ,UAAW,cAAc;;;;;;;0BAyHK;YAAE,MAAM,EAAE,WAAW,GAAG,IAAI,CAAA;SAAE;0BAM9B;YAAE,MAAM,EAAE,WAAW,GAAG,IAAI,CAAA;SAAE;;;;;qBA5B7B;YAAE,MAAM,EAAE,WAAW,GAAG,IAAI,CAAA;SAAE;;;;;;;;;;;;;;;;;;;;;;;;;2BA6ElD,MAAM,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC;6BAGxC,MAAM,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC;;CAsBpE,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
@@ -64,10 +64,8 @@ var usePopup = function usePopup(props) {
|
|
64
64
|
var updatePosition = usePersistFn(function () {
|
65
65
|
// if (isPositionControl) return;
|
66
66
|
// if (props.position === 'auto' || !props.position) {
|
67
|
-
|
68
|
-
|
69
|
-
if (newPosition !== position) setPositionState(newPosition);
|
70
|
-
}, 10);
|
67
|
+
var newPosition = getPosition(targetRef.current, props.priorityDirection, autoMode, popupRef.current || undefined);
|
68
|
+
if (newPosition !== position) setPositionState(newPosition);
|
71
69
|
});
|
72
70
|
useEffect(function () {
|
73
71
|
if (props.open) {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"use-select.d.ts","sourceRoot":"","sources":["use-select.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
1
|
+
{"version":3,"file":"use-select.d.ts","sourceRoot":"","sources":["use-select.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6Cd,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
@@ -50,7 +50,7 @@ export interface BaseSelectProps<DataItem, Value> {
|
|
50
50
|
* @en Change callback
|
51
51
|
* @cn 值改变回调
|
52
52
|
*/
|
53
|
-
onChange?: (value: Value, data?: DataItem
|
53
|
+
onChange?: (value: Value, data?: DataItem, checked?: boolean) => void;
|
54
54
|
/**
|
55
55
|
* @en Group by
|
56
56
|
* @cn 分组
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"use-select.type.d.ts","sourceRoot":"","sources":["use-select.type.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAE9C,MAAM,WAAW,eAAe,CAAC,QAAQ,EAAE,KAAK;IAC9C,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,CAAC,EAAE,QAAQ,EAAE,CAAC;IAClB,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;IACtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;OAGG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,QAAQ,CAAC;IAE7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC;IAEnD;;;;OAIG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,SAAS,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,CAAC,GAAG,KAAK,EAAE,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC;IAEvF;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,QAAQ,KAAK,KAAK,SAAS,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC;IAE3F;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,GAAG,CAAC;IAErC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,QAAQ,
|
1
|
+
{"version":3,"file":"use-select.type.d.ts","sourceRoot":"","sources":["use-select.type.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAE9C,MAAM,WAAW,eAAe,CAAC,QAAQ,EAAE,KAAK;IAC9C,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,CAAC,EAAE,QAAQ,EAAE,CAAC;IAClB,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;IACtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;OAGG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,QAAQ,CAAC;IAE7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC;IAEnD;;;;OAIG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,SAAS,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,CAAC,GAAG,KAAK,EAAE,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC;IAEvF;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,QAAQ,KAAK,KAAK,SAAS,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC;IAE3F;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,GAAG,CAAC;IAErC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,QAAQ,EAAE,OAAO,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAEtE;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,QAAQ,EAAE,KAAK,MAAM,CAAC;IACxE,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B"}
|
@@ -12,6 +12,7 @@ export declare const addResizeObserver: (el: HTMLElement, handler: any, options?
|
|
12
12
|
timer?: number | undefined;
|
13
13
|
}) => () => void;
|
14
14
|
export declare function getParent(el: HTMLElement | null | Element, target?: string | HTMLElement): Element | null;
|
15
|
+
export declare function getClosestScrollContainer(element: HTMLElement | null): Element | null;
|
15
16
|
export declare function cssSupport(attr: keyof CSSStyleDeclaration, value: string): boolean;
|
16
17
|
export declare const parsePxToNumber: (str: string) => number;
|
17
18
|
//# sourceMappingURL=element.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"element.d.ts","sourceRoot":"","sources":["element.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B;;;;;;GAMG;AACH,wBAAgB,QAAQ,CACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,EACzB,WAAW,UAAQ,EACnB,SAAS,CAAC,EAAE,MAAM,GACjB,KAAK,CAAC,SAAS,CASjB;AAGD,eAAO,MAAM,iBAAiB,OACxB,WAAW,WACN,GAAG;;;gBA4Cb,CAAC;AAEF,wBAAgB,SAAS,CAAC,EAAE,EAAE,WAAW,GAAG,IAAI,GAAG,OAAO,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,kBAmBxF;AAED,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,mBAAmB,EAAE,KAAK,EAAE,MAAM,WAYxE;AAED,eAAO,MAAM,eAAe,QAAS,MAAM,WAAwC,CAAC"}
|
1
|
+
{"version":3,"file":"element.d.ts","sourceRoot":"","sources":["element.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B;;;;;;GAMG;AACH,wBAAgB,QAAQ,CACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,EACzB,WAAW,UAAQ,EACnB,SAAS,CAAC,EAAE,MAAM,GACjB,KAAK,CAAC,SAAS,CASjB;AAGD,eAAO,MAAM,iBAAiB,OACxB,WAAW,WACN,GAAG;;;gBA4Cb,CAAC;AAEF,wBAAgB,SAAS,CAAC,EAAE,EAAE,WAAW,GAAG,IAAI,GAAG,OAAO,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,kBAmBxF;AAED,wBAAgB,yBAAyB,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,kBA+BpE;AAED,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,mBAAmB,EAAE,KAAK,EAAE,MAAM,WAYxE;AAED,eAAO,MAAM,eAAe,QAAS,MAAM,WAAwC,CAAC"}
|
package/esm/utils/dom/element.js
CHANGED
@@ -115,6 +115,36 @@ export function getParent(el, target) {
|
|
115
115
|
}
|
116
116
|
return null;
|
117
117
|
}
|
118
|
+
export function getClosestScrollContainer(element) {
|
119
|
+
if (!element) {
|
120
|
+
return null;
|
121
|
+
}
|
122
|
+
|
123
|
+
// 检查元素是否可滚动
|
124
|
+
var isScrollable = function isScrollable(el) {
|
125
|
+
var style = window.getComputedStyle(el);
|
126
|
+
var overflowX = style.overflowX;
|
127
|
+
var overflowY = style.overflowY;
|
128
|
+
return (overflowX === 'auto' || overflowX === 'scroll' || overflowY === 'auto' || overflowY === 'scroll') && (el.scrollHeight > el.clientHeight || el.scrollWidth > el.clientWidth);
|
129
|
+
};
|
130
|
+
|
131
|
+
// 如果元素本身是可滚动的,直接返回
|
132
|
+
if (isScrollable(element)) {
|
133
|
+
return element;
|
134
|
+
}
|
135
|
+
|
136
|
+
// 遍历父元素
|
137
|
+
var parent = element.parentElement;
|
138
|
+
while (parent) {
|
139
|
+
if (isScrollable(parent)) {
|
140
|
+
return parent;
|
141
|
+
}
|
142
|
+
parent = parent.parentElement;
|
143
|
+
}
|
144
|
+
|
145
|
+
// 如果没有找到可滚动的祖先,返回 body 或 documentElement
|
146
|
+
return document.scrollingElement || document.documentElement;
|
147
|
+
}
|
118
148
|
export function cssSupport(attr, value) {
|
119
149
|
if (isBrowser()) {
|
120
150
|
var element = document.createElement('div');
|
package/esm/utils/position.d.ts
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
export declare const getPosition: (target: HTMLElement | null, priorityDirection: "
|
1
|
+
export declare const getPosition: (target: HTMLElement | null, priorityDirection: "auto" | "vertical" | "horizontal" | undefined, mode: 'popover' | 'menu' | 'list', popup?: HTMLElement) => "bottom" | "left" | "right" | "top" | "top-left" | "top-right" | "bottom-left" | "bottom-right" | "left-top" | "left-bottom" | "right-top" | "right-bottom";
|
2
2
|
//# sourceMappingURL=position.d.ts.map
|