Skip to content

feat(ui): support disabled on dropdown and multiselect#9600

Merged
kirangadhave merged 2 commits into
mainfrom
kg/dropdown-disabled
May 19, 2026
Merged

feat(ui): support disabled on dropdown and multiselect#9600
kirangadhave merged 2 commits into
mainfrom
kg/dropdown-disabled

Conversation

@kirangadhave

@kirangadhave kirangadhave commented May 19, 2026

Copy link
Copy Markdown
Member

Summary

  • Adds a disabled kwarg to mo.ui.dropdown and mo.ui.multiselect, matching the pattern already used by other inputs (text, slider, checkbox, radio, button, etc.).
  • Native <select> path uses the native disabled attribute.
  • Searchable dropdown and multiselect (Combobox) block popover toggling and chip removal via aria-disabled and pointer-events styling; the trigger remains a <div> to avoid changing focus/keyboard semantics for existing combobox usages.

Closes #9579

Screen.Recording.2026-05-18.at.8.58.46.PM.mov

Test plan

  • make check
  • Python: new test_dropdown_disabled, test_multiselect_disabled
  • Frontend: new tests for disabled native select and disabled searchable combobox; existing tests updated
  • Manual: smoke notebook with enabled + disabled variants of dropdown, searchable dropdown, and multiselect
@vercel

vercel Bot commented May 19, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
marimo-docs Ready Ready Preview, Comment May 19, 2026 7:43am

Request Review

@kirangadhave kirangadhave requested a review from Light2Dark May 19, 2026 03:59
@kirangadhave kirangadhave marked this pull request as ready for review May 19, 2026 03:59
@kirangadhave kirangadhave added the enhancement New feature or request label May 19, 2026

@cubic-dev-ai cubic-dev-ai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

1 issue found across 8 files

Architecture diagram
sequenceDiagram
    participant User as User (Browser)
    participant UI as UI Component (dropdown/multiselect)
    participant Combobox as Combobox (Searchable, Multiselect)
    participant Plugin as Frontend Plugin
    participant Backend as Python Backend

    Note over User,Backend: Dropdown / Multiselect disabled state flow

    User->>UI: Interact with dropdown/multiselect
    alt Native select path (searchable=false)
        UI->>UI: CHECK: disabled attribute on <select>
        alt Disabled
            UI-->>User: Native browser disabled styling and behavior
        end
    else Combobox path (searchable=true or multiselect)
        User->>Combobox: Click trigger / close chip
        Combobox->>Combobox: CHECK: disabled prop
        alt Disabled
            Combobox->>Combobox: Block popover open via onOpenChange guard
            Combobox->>Combobox: Block chip removal via onClick guard
            Combobox-->>User: aria-disabled="true" + pointer-events-none + opacity-50
        end
    end

    Note over Plugin,Backend: Data flow from Python to frontend

    Backend->>Plugin: Render request with component args (disabled=bool)
    Plugin->>Plugin: Destructure disabled from data props
    Plugin->>UI: Pass disabled={disabled}
    UI->>Combobox: Pass disabled={disabled} (if searchable/multiselect)

    Note over UI: Disabled value defaults to false
Loading

Reply with feedback, questions, or to request a fix.

Re-trigger cubic

Comment thread frontend/src/components/ui/combobox.tsx Outdated
mscolnick
mscolnick previously approved these changes May 19, 2026
Comment thread frontend/src/components/ui/combobox.tsx
Comment thread frontend/src/components/ui/combobox.tsx

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds disabled-state support for dropdown and multiselect UI elements across Python component args and frontend rendering.

Changes:

  • Adds disabled kwargs to mo.ui.dropdown and mo.ui.multiselect.
  • Plumbs disabled state through dropdown, searchable select, multiselect, and shared combobox UI.
  • Adds Python and dropdown frontend tests for disabled behavior.

Reviewed changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
marimo/_plugins/ui/_impl/input.py Adds disabled component args and docs for dropdown/multiselect.
tests/_plugins/ui/_impl/test_input.py Verifies disabled defaults and explicit true values.
frontend/src/plugins/impl/DropdownPlugin.tsx Adds disabled schema support and native select propagation.
frontend/src/plugins/impl/SearchableSelect.tsx Passes disabled state into shared combobox.
frontend/src/plugins/impl/MultiselectPlugin.tsx Adds disabled schema support and combobox propagation.
frontend/src/components/ui/combobox.tsx Adds disabled styling and interaction blocking for combobox.
frontend/src/plugins/impl/__tests__/DropdownPlugin.test.tsx Adds frontend disabled dropdown coverage.
frontend/src/components/data-table/charts/components/form-fields.tsx Updates internal multiselect usage for required disabled prop.
Comment thread frontend/src/components/ui/combobox.tsx
Adds a disabled kwarg to mo.ui.dropdown and mo.ui.multiselect, matching the pattern used by other inputs. The Combobox-based searchable dropdown and multiselect block popover toggling and chip removal via aria-disabled and pointer styling; the native select uses the native disabled attribute.
@kirangadhave kirangadhave merged commit 078ee36 into main May 19, 2026
43 of 44 checks passed
@kirangadhave kirangadhave deleted the kg/dropdown-disabled branch May 19, 2026 07:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

4 participants