feat(core/dropdown): submenu and quickactions

[goncalosard]

Pull request checklist

Please check if your PR fulfills the following requirements:

• Tests for the changes have been added (for bug fixes / features)
• Docs have been reviewed and added / updated if needed (for bug fixes / features)
• Build (yarn build) was run locally and any changes were pushed
• Unit tests (yarn test) were run locally and passed
• Visual Regression Tests (yarn visual-regression) were run locally and passed
• Linting (npm lint) was run locally and passed

Pull request type

Please check the type of change your PR introduces:

• Bug fix
• Feature
• Refactoring (no functional changes, no API changes)
• Build related changes
• Documentation content changes
• Other (please describe):

What is the current behavior?

GitHub Issue Number: #144

What is the new behavior?

Now is possible to have a quick-actions and submenu on the dropdown component.

New prop (triggerEvent) implemented on the dropdown component, so now the user can choose to open with hover, but its not working 100%, needs to be cheked.

New components implemented: ix-divider & ix-dropdown-quick-actions

Example for quick-actions & submenu are done. (only missing Angular on the documentations, examples are done in Angular but the angular package is broken for me and it doesnt let me build the Angular package so i cannot run the examples on the docs).

Visual regression test is created for the quick-actions component.
Visual regression tetsts need to be checked and snapshots submitted.

Does this introduce a breaking change?

• Yes
• No

Testing

Other information

[nuke-ellington]

See three comments please :)

[danielleroux]

Documentation

• Divider documentation is missing

Tests

• Visual regression test for divider is missing
• quick-actions visual regression test is no divider visible

[goncalosard]

@danielleroux Fixed everything asked above. Please review.

About "quick-actions visual regression test is no divider visible", the snapshot is outdated, because the variable for the color on Figma had no match yet in the code so it was pointing to nothing. But it has now so it is just needed to run the tests again to get the new snapshots.

[danielleroux]

@goncalosard have you merged main?

[danielleroux]

hover effect cause some weird behavior.

@nuke-ellington should that behavior be intended?

        <ix-button id="test">test</ix-button>
        <ix-dropdown trigger={'test'} triggerEvent={'mouseover'}>
          <ix-dropdown-item>Test</ix-dropdown-item>
          <ix-dropdown-item>Test</ix-dropdown-item>
          <ix-dropdown-item>Test</ix-dropdown-item>
        </ix-dropdown>

Result:

Screen.Recording.2023-02-08.at.16.56.41.mov

[nuke-ellington]

lgtm