Skip to content

How to add tabs under Proprty Pane? #9801

Closed

Description

@bhoomesh-spe

What type of issue is this?

Question

What SharePoint development model, framework, SDK or API is this about?

💥 SharePoint Framework

Target SharePoint environment

SharePoint Online

What browser(s) / client(s) have you tested

  • 💥 Internet Explorer
  • 💥 Microsoft Edge
  • 💥 Google Chrome
  • 💥 FireFox
  • 💥 Safari
  • mobile (iOS/iPadOS)
  • mobile (Android)
  • not applicable
  • other (enter in the "Additional environment details" area below)

Additional environment details

  • SPFx version - 1.17.1
  • Node.js version - 16.20.0

Issue description

Hello Everyone,

I have created an SPFx project with React.

I have created a property pane under my SPFx web part. Below is the screenshot for the same.

edit-panel

I need to add tabs under that property pane and add controls under tabs.

Can anyone help me with the same?

Activity

  1. JoelBool commented on Jul 12, 2024

    @JoelBool

    I'm not sure of tabs but you can have sections that are minimized/maximized as you see fit.

    in getPropertyPaneConfiguration make use of 'displayGroupsAsAccordion' and then 'isCollapsed'

    return {
    pages: [
            {
              header: {
                description: ""
              },
              displayGroupsAsAccordion: true,
              groups: [
                {
                  groupName: "Group one"
                  isCollapsed: false,
                  groupFields: [
                        <Property pane controls for the group>
                  ]
               },
                {
                  groupName: "Group two"
                  isCollapsed: true,
                  groupFields: [
                        <Property pane controls for the group>
                  ]
               }
            ]
          }
       ]
    }
    

    If you instead of the above return more 'pages' in the pages array you might get something similar to tabs. But I think it's using pagination at the bottom of the property pane panel instead (not sure)

  2. Ashlesha-MSFT commented on May 21, 2025

    @Ashlesha-MSFT
    Contributor

    Hello bhoomesh-spe,
    Thank you for bringing this issue to our attention. We will look into it and get back to you shortly.

  3. Ashlesha-MSFT commented on May 21, 2025

    @Ashlesha-MSFT
    Contributor

    bhoomesh-spe,
    Thanks for sharing your use case.
    From what you've described, this looks more like a feature request rather than a current limitation or bug in SPFx.
    Submit your feature request here : https://feedbackportal.microsoft.com/feedback/forum/06735c62-321c-ec11-b6e7-0022481f8472

  4. VesaJuvonen commented on Nov 3, 2026

    @VesaJuvonen
    Contributor

    This issue is more than 12 months old and has not had recent activity. We are cleaning up the backlog so we can manage incoming reports more efficiently. If the issue is still relevant, please submit a new issue with updated details and current reproduction steps. We apologize for any inconvenience caused by this updated process, and thank you for being part of the SharePoint developer ecosystem.

  5. github-actions commented on Nov 3, 2026

    @github-actions

    Thank you for taking the time to file an issue. We periodically archive older or inactive issues as part of our issue management process, which automatically closes them once they are archived.

    If you’d like to understand more about why and how we handle archived (closed) issues, please see Our approach to closed issues.

    We appreciate your contribution and if this is still an active issue with the latest SPFx versions, please do resubmit the details. We needed to perform a cleanup, so that we can start with a clean table with a new process. We apologize for the inconvenience this might cause.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions