@facter/ds-core 1.33.2 → 1.33.4
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.js +13 -5
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +13 -5
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -3492,6 +3492,7 @@ function CardSelect({
|
|
|
3492
3492
|
const listRef = React10.useRef(null);
|
|
3493
3493
|
const searchRef = React10.useRef(null);
|
|
3494
3494
|
const [dropdownPos, setDropdownPos] = React10.useState({});
|
|
3495
|
+
const [listMaxHeight, setListMaxHeight] = React10.useState(300);
|
|
3495
3496
|
const filteredOptions = React10.useMemo(() => {
|
|
3496
3497
|
if (!searchable || onSearch || !search) return options;
|
|
3497
3498
|
const q = search.toLowerCase();
|
|
@@ -3510,9 +3511,14 @@ function CardSelect({
|
|
|
3510
3511
|
if (!open || !containerRef.current) return;
|
|
3511
3512
|
const updatePosition = () => {
|
|
3512
3513
|
const rect = containerRef.current.getBoundingClientRect();
|
|
3513
|
-
const
|
|
3514
|
-
const
|
|
3515
|
-
const
|
|
3514
|
+
const margin = 8;
|
|
3515
|
+
const searchBarHeight = searchable ? 41 : 0;
|
|
3516
|
+
const spaceBelow = window.innerHeight - rect.bottom - margin;
|
|
3517
|
+
const spaceAbove = rect.top - margin;
|
|
3518
|
+
const showAbove = spaceBelow < 150 && spaceAbove > spaceBelow;
|
|
3519
|
+
const availableSpace = showAbove ? spaceAbove : spaceBelow;
|
|
3520
|
+
const maxList = Math.max(Math.min(availableSpace - searchBarHeight - margin, 300), 100);
|
|
3521
|
+
setListMaxHeight(maxList);
|
|
3516
3522
|
setDropdownPos({
|
|
3517
3523
|
position: "fixed",
|
|
3518
3524
|
left: rect.left,
|
|
@@ -3528,7 +3534,7 @@ function CardSelect({
|
|
|
3528
3534
|
window.removeEventListener("scroll", updatePosition, true);
|
|
3529
3535
|
window.removeEventListener("resize", updatePosition);
|
|
3530
3536
|
};
|
|
3531
|
-
}, [open]);
|
|
3537
|
+
}, [open, searchable]);
|
|
3532
3538
|
React10.useEffect(() => {
|
|
3533
3539
|
if (!open) return;
|
|
3534
3540
|
const handleClickOutside = (e) => {
|
|
@@ -3648,8 +3654,10 @@ function CardSelect({
|
|
|
3648
3654
|
"div",
|
|
3649
3655
|
{
|
|
3650
3656
|
ref: listRef,
|
|
3651
|
-
className: "overflow-y-auto overscroll-contain
|
|
3657
|
+
className: "overflow-y-auto overscroll-contain",
|
|
3658
|
+
style: { maxHeight: listMaxHeight },
|
|
3652
3659
|
onScroll: handleScroll,
|
|
3660
|
+
"data-scroll-lock-scrollable": true,
|
|
3653
3661
|
children: /* @__PURE__ */ jsxs("div", { className: "divide-y divide-border/50 p-2", children: [
|
|
3654
3662
|
filteredOptions.length === 0 && !loading ? /* @__PURE__ */ jsx("p", { className: "py-4 text-center text-sm text-muted-foreground", children: emptyText }) : filteredOptions.map((option) => {
|
|
3655
3663
|
const isSelected = value === option.value;
|