• Type: Icon: Task Task
    • Resolution: Unresolved
    • Priority: Icon: Major - P3 Major - P3
    • None
    • Affects Version/s: None
    • Component/s: Tech debt, UI / UX
    • None

      Use the LG combobox to replace our copied version of it. The recent version of the LG combobox support creating a new value from the combobox options and includes a description prop.

      The ticket can be started when the following issues are resolved:

      • The width of combobox menu is fixed so the options with a description are well readable LG-3311
      • portalClassName prop is fixed and can be set to a component. We use popoverClassName to for testing to access the popover for a stage. The LG combobox does not have this prop (anymore?) and looks like we could use portalClassName for this LG-3312
      • A lot of the confusion comes from the misuse of the word 'value' of ComboboxOption. In reality, a more accurate term would be 'key' (but that's already a prop in React). Internally, the LG team uses 'setInputValue()' to keep track of which option 'key' is set, and then renders the 'displayName' in both the menu and input box. So when you set displayName: "Field: xyz" in the options, that is what will appear in both places. But there is a different behavior for onChange and onSelect/onCloseMenu events. The onChange event selects and shows in the input value, and onSelect/onCloseMenu select and show in the input displayName. We would expect similar behavior for all events LG-3283

        1. Screen Recording 2023-06-09 at 12.58.04.mov
          2.51 MB
          Alena Khineika
        2. Screenshot 2023-06-07 at 18.55.12.png
          65 kB
          Alena Khineika
        3. Screenshot 2023-06-07 at 19.13.02.png
          147 kB
          Alena Khineika

            Assignee:
            Unassigned Unassigned
            Reporter:
            alena.khineika@mongodb.com Alena Khineika
            Votes:
            0 Vote for this issue
            Watchers:
            2 Start watching this issue

              Created:
              Updated: