Skip to content

Can't make ListBoxSection stickyΒ #8117

Open
@sfc-gh-alisowski

Description

@sfc-gh-alisowski

Provide a general summary of the issue here

I have a virtualized listbox that I want to have sticky sections in. I wrote this custom layout

class StickyListBoxLayout<T, O extends ListLayoutOptions> extends ListLayout<T, O> {
  shouldInvalidate() {
    return true;
  }

  getVisibleLayoutInfos(rect: Rect): LayoutInfo[] {
    const info = super.getVisibleLayoutInfos(rect);
    const stickyItems: Node<T>[] = [];

    // Find the sticky items
    for (const item of this.collection) {
      if (this.collection.getItem(item.key)?.props["data-sticky"]) {
        stickyItems.push(item);
      }
    }

    // Add the sticky items to the layout info if needed
    for (const item of stickyItems) {
      const currentLayoutInfo = info.find((i) => i.key === item.key);

      if (!currentLayoutInfo) {
        const layoutInfo = this.getLayoutInfo(item.key);

        if (layoutInfo) {
          layoutInfo.isSticky = true;

          info.push(layoutInfo);
        }
      } else {
        currentLayoutInfo.isSticky = true;
      }
    }

    return info;
  }

  // Provide a LayoutInfo for a specific item.
  getLayoutInfo(key: Key): LayoutInfo | null {
    return super.getLayoutInfo(key);
  }
}

it find sticky items and makes sure they are still in the layout. this works for items but not sectiosn

πŸ€” Expected Behavior?

It works for sections too

😯 Current Behavior

it doens't

πŸ’ Possible Solution

No response

πŸ”¦ Context

No response

πŸ–₯️ Steps to Reproduce

Use the provided list

Version

1.8.0

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

Mac

🧒 Your Company/Team

No response

πŸ•· Tracking Issue

No response

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions