Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(admin-ui): IconPicker component #4519

Merged
merged 26 commits into from
Feb 7, 2025

Conversation

leopuleo
Copy link
Contributor

@leopuleo leopuleo commented Feb 3, 2025

Changes

With this PR, we are upgrading the IconPicker component to ensure it complies with the new design system UI.

You'll find 2 IconPicker components:

webiny/admin-ui

CleanShot 2025-02-05 at 14 46 33@2x
This component was previously integrated into the @webiny/app-headless-cms and @webiny/app-page-builder packages. Both of these components now utilize the generic version exported by @webiny/admin-ui.

This component only renders icons from @fortawesome/react-fontawesome package.

webiny/app-admin

CleanShot 2025-02-05 at 14 46 13@2x
This component is utilised by @webiny/app-page-builder and is more flexible regarding which icons can be handled.

Other changes:

<DelayedOnChange />

This component has been transferred from @webiny/ui to the fresh @webiny/admin-ui.

Add forwardEventOnChange prop to <Input /> and <Textarea />

We introduce the forwardEventOnChange?: boolean prop; if set to true, the full event will be forwarded to the provided onChange callback. This prop was previously named rawOnChange.

<Popover />

We set the collisionPadding prop to prevent the component from colliding with the edge of the viewport.

How Has This Been Tested?

Manually

@leopuleo leopuleo changed the title feat(admin-ui): IconPicker feat(admin-ui): IconPicker and DelayedOnChange components Feb 5, 2025
@leopuleo leopuleo changed the title feat(admin-ui): IconPicker and DelayedOnChange components feat(admin-ui): IconPicker component Feb 5, 2025
@leopuleo leopuleo requested a review from adrians5j February 5, 2025 13:55
@leopuleo leopuleo self-assigned this Feb 5, 2025
@leopuleo leopuleo marked this pull request as ready for review February 5, 2025 14:02
Copy link
Member

@adrians5j adrians5j left a comment

Choose a reason for hiding this comment

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

Initial review done. Overall, looks good ofc!

Extra questions below. Note: nr2 is probably good.

  1. Should these be a bit darker?
image
  1. This input is more gray in Figma.
image
  1. Ah I guess it's because in Figma it's not focused. Still, found this placeholder to be a bit darker in Figma:
image

Maybe I just don't see it right. Can you dbl check?

  1. Can you dbl check these paddings?
image
  1. Should we ask Kreso to provide this? At least note it down somewhere for him?
image
  1. Do we have an example where a component does not already have a value assigned to it? Like this?

@leopuleo leopuleo merged commit 96e2abf into feat/new-admin-ui Feb 7, 2025
17 checks passed
@leopuleo leopuleo deleted the leo/feat/ui-icon-picker branch March 5, 2025 08:22
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants