Skip to content

Releases: mongodb/leafygreen-ui

@leafygreen-ui/[email protected]

04 Dec 21:44
@github-actions github-actions
@leafygreen-ui/[email protected]
20539a4
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
@leafygreen-ui/[email protected]

Major Changes

  • 04bb887: LG-4121: Replaces usePortal prop with renderMode prop. renderMode="inline" and renderMode="portal" are deprecated, and all popover elements should migrate to using the top layer. The old default was usePortal=true, and the new default is renderMode="top-layer".

    See @leafygreen-ui/popover package 12.0.0 changelog for more info.

    Migration guide

    Use popover-v12 codemod for migration assistance.

    Old
    <Select popoverZIndex={9999} usePortal={false} />
<Select portalClassName="portal-class" usePortal />
    New
    <Select popoverZIndex={9999} renderMode="inline" />
<Select portalClassName="portal-class" renderMode="portal" />

Patch Changes

Assets 2
Loading

@leafygreen-ui/[email protected]

04 Dec 21:44
@github-actions github-actions
@leafygreen-ui/[email protected]
20539a4
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
@leafygreen-ui/[email protected]

Major Changes

  • 04bb887: LG-4121: SearchInput renders results menu in the top layer using popover API. As a result, the following props are removed:

    • portalClassName
    • portalContainer
    • portalRef
    • scrollContainer
    • usePortal

    Migration guide

    Use popover-v12 codemod for migration assistance.

    Old
    <SearchInput popoverZIndex={9999} usePortal={false} />
<SearchInput portalClassName="portal-class" usePortal />
    New
    <SearchInput />
<SearchInput />

Patch Changes

Assets 2
Loading

@leafygreen-ui/[email protected]

04 Dec 21:44
@github-actions github-actions
@leafygreen-ui/[email protected]
20539a4
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
@leafygreen-ui/[email protected]

Major Changes

  • 04bb887: LG-4445: Replaces usePortal prop with renderMode prop with values of 'inline', 'portal', and 'top-layer'. renderMode="inline" and renderMode="portal" are deprecated, and all popover elements should migrate to using the top layer. The old default was usePortal=true, and the new default is renderMode="top-layer".

    • When renderMode="top-layer" or renderMode is undefined, the popover element will render in the top layer using the popover API
      • Adds dismissMode prop to control dismissal behavior of the popover element. Read more about the popover attribute
      • Adds onToggle prop to run a callback function when the visibility of a popover element rendered in the top layer is toggled
    • When renderMode="inline", the popover element will render inline in the DOM where it's written
    • When renderMode="portal", the popover element will portal into a new div appended to the body. Alternatively, it can be portaled into a provided portalContainer element

    LG-4446: The PopoverPropsProvider from the @leafygreen-ui/leafygreen-provider package can be used to pass props to a deeply nested popover element. It will read PopoverPropsContext values if an explicit prop is not defined in the popover component instance. This applies for the following props:

    • dismissMode
    • onEnter
    • onEntering
    • onEntered
    • onExit
    • onExiting
    • onExited
    • onToggle
    • popoverZIndex
    • portalClassName
    • portalContainer
    • portalRef
    • renderMode
    • scrollContainer
    • spacing

    Additional changes include:

    • Adds and exports getPopoverRenderModeProps util to pick popover props based on given renderMode value
    • Deprecates and removes justify="fit". Instead, use justify="middle"
    • Removes unused contentClassName prop
    • Updates default value of spacing prop from 10px to 4px
    • Replaces internal position utils with @floating-ui/react

    Migration guide

    Use popover-v12 codemod for migration assistance.

    Old
    <Popover popoverZIndex={9999} usePortal={false} />
<Popover portalClassName="portal-class" usePortal />
<Popover />
    New
    <Popover popoverZIndex={9999} renderMode="inline" />
<Popover portalClassName="portal-class" renderMode="portal" />
<Popover renderMode="portal" />
    Globally render popover elements in top layer

    After running the codemod and addressing manual updates, the new forceUseTopLayer prop in the LeafyGreenProvider can be used to test interactions with all LG popover elements forcibly set to renderMode="top-layer". This can help pressure test for any regressions to more confidently and safely migrate.

    import { Combobox } from '@leafygreen-ui/combobox';
import LeafyGreenProvider from '@leafygreen-ui/leafygreen-provider';
import Popover from '@leafygreen-ui/popover';
import { Select } from '@leafygreen-ui/select';

{
  /* all LG popover elements will render in top layer */
}
<LeafyGreenProvider forceUseTopLayer={true}>
  <Popover renderMode="inline" />
  <Combobox renderMode="portal" />
  <Select renderMode="inline" />
</LeafyGreenProvider>;

Patch Changes

Assets 2
Loading

@leafygreen-ui/[email protected]

04 Dec 21:44
@github-actions github-actions
@leafygreen-ui/[email protected]
20539a4
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
@leafygreen-ui/[email protected]

Major Changes

  • 04bb887: LG-4121: Pipeline renders tooltip in the top layer using popover API

    Additionally, the tooltip opens immediately on hover instead of default 500ms delay

Patch Changes

Assets 2
Loading

@leafygreen-ui/[email protected]

04 Dec 21:44
@github-actions github-actions
@leafygreen-ui/[email protected]
20539a4
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
@leafygreen-ui/[email protected]

Major Changes

  • 04bb887: LG-4121: Pagination renders page selectors in the top layer using popover API

Patch Changes

Assets 2
Loading

@leafygreen-ui/[email protected]

04 Dec 21:44
@github-actions github-actions
@leafygreen-ui/[email protected]
20539a4
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
@leafygreen-ui/[email protected]

Major Changes

  • 04bb887: LG-4121: NumberInput renders unit selector and tooltip in the top layer using popover API. As a result, the following props are removed:

    • popoverZIndex
    • portalClassName
    • portalContainer
    • portalRef
    • scrollContainer
    • usePortal

    Additional changes include:

    • Opens tooltip immediately on hover instead of default 500ms delay

    Migration guide

    Use popover-v12 codemod for migration assistance.

    Old
    <NumberInput popoverZIndex={9999} usePortal={false} />
<NumberInput portalClassName="portal-class" usePortal />
    New
    <NumberInput />
<NumberInput />

Patch Changes

Assets 2
Loading

@leafygreen-ui/[email protected]

04 Dec 21:44
@github-actions github-actions
@leafygreen-ui/[email protected]
20539a4
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
@leafygreen-ui/[email protected]

Major Changes

  • 04bb887: LG-4121: Replaces usePortal prop with renderMode prop. renderMode="inline" and renderMode="portal" are deprecated, and all popover elements should migrate to using the top layer. The old default was usePortal=true, and the new default is renderMode="top-layer".

    See @leafygreen-ui/popover package 12.0.0 changelog for more info.

    Additional changes include:

    • Deprecates and removes justify="fit". Instead, use justify="middle"

    Migration guide

    Use popover-v12 codemod for migration assistance.

    Old
    <Menu popoverZIndex={9999} usePortal={false} />
<Menu portalClassName="portal-class" usePortal />
    New
    <Menu popoverZIndex={9999} renderMode="inline" />
<Menu portalClassName="portal-class" renderMode="portal" />

Patch Changes

Assets 2
Loading

@leafygreen-ui/[email protected]

04 Dec 21:44
@github-actions github-actions
@leafygreen-ui/[email protected]
20539a4
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
@leafygreen-ui/[email protected]

Patch Changes

  • 117a463: Exports Deep* types from package root
Assets 2
Loading

@leafygreen-ui/[email protected]

04 Dec 21:44
@github-actions github-actions
@leafygreen-ui/[email protected]
20539a4
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
@leafygreen-ui/[email protected]

Minor Changes

  • 04bb887: LG-4446: Adds PopoverPropsContext to pass props to a deeply nested popover element

    Additionally exposes a forceUseTopLayer prop in the LeafyGreenProvider which can be used to test interactions with all LG popover elements forcibly set to renderMode="top-layer". This can help pressure test for any regressions to more confidently and safely migrate. However, this should only be used when all LG dependencies are relying on v12+ of @leafygreen-ui/popover.

Patch Changes

Assets 2
Loading

@leafygreen-ui/[email protected]

04 Dec 21:44
@github-actions github-actions
@leafygreen-ui/[email protected]
20539a4
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
@leafygreen-ui/[email protected]

Major Changes

  • 04bb887: LG-4121: InlineDefinition renders tooltip in the top layer using popover API. As a result, the following props are removed:

    • popoverZIndex
    • portalClassName
    • portalContainer
    • portalRef
    • scrollContainer
    • usePortal

    Additional changes include:

    • Deprecates and removes justify="fit". Instead, use justify="middle"
    • Opens tooltip immediately on hover instead of default 500ms delay
    • Reorganizes file structure

    Migration guide

    Use popover-v12 codemod for migration assistance.

    Old
    <InlineDefinition popoverZIndex={9999} usePortal={false} />
<InlineDefinition portalClassName="portal-class" usePortal />
    New
    <InlineDefinition />
<InlineDefinition />

Patch Changes

Assets 2
Loading