@thecb/components 7.7.8-beta.2 → 7.7.8-beta.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js
CHANGED
|
@@ -24458,24 +24458,30 @@ var useOutsideClickHook = function useOutsideClickHook(handler) {
|
|
|
24458
24458
|
Hook that determines whether every element in an array of DOM selectors is fully present
|
|
24459
24459
|
within the user's current viewport.
|
|
24460
24460
|
|
|
24461
|
-
(elements: Array<String
|
|
24461
|
+
(elements: Array<String>, Function) => undefined;
|
|
24462
24462
|
|
|
24463
24463
|
Takes an array of strings that correspond to DOM selectors. Examples:
|
|
24464
24464
|
"#submit-button", ".module-small", "h2.alert-title"
|
|
24465
24465
|
|
|
24466
|
+
Also takes a handler function (such as a useState updater) to receive the Boolean
|
|
24467
|
+
that the hook generates
|
|
24468
|
+
|
|
24466
24469
|
The document query function will return the *first* element in the document that matches
|
|
24467
24470
|
the string given.
|
|
24468
24471
|
|
|
24469
|
-
A combination string of multiple selectors can also be provided, e.g.:
|
|
24472
|
+
A combination string of multiple selectors can also be provided as an item in the array, e.g.:
|
|
24470
24473
|
".alert-info, .alert-warning, .alert-error"
|
|
24471
24474
|
|
|
24472
24475
|
This will return the first element that matches *any* of the provided selectors
|
|
24473
24476
|
|
|
24474
24477
|
If every element in the array is fully within the viewport, function returns true
|
|
24478
|
+
|
|
24479
|
+
Calls the provided handler function with the Boolean result
|
|
24475
24480
|
*/
|
|
24476
24481
|
|
|
24477
24482
|
var useCheckElementsInViewport = function useCheckElementsInViewport() {
|
|
24478
24483
|
var elements = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
24484
|
+
var handler = arguments.length > 1 ? arguments[1] : undefined;
|
|
24479
24485
|
|
|
24480
24486
|
var _useState = useState(false),
|
|
24481
24487
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -24494,7 +24500,7 @@ var useCheckElementsInViewport = function useCheckElementsInViewport() {
|
|
|
24494
24500
|
}
|
|
24495
24501
|
});
|
|
24496
24502
|
}, [elements]);
|
|
24497
|
-
|
|
24503
|
+
handler(elementsVisible);
|
|
24498
24504
|
};
|
|
24499
24505
|
|
|
24500
24506
|
|