All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.
useTooltip supports new disabled option
(a934ae9)DEFAULT_HOVER_MODE_STICKY_EXIT_TIME has been renamed to
DEFAULT_HOVER_MODE_EXIT_TIME.exitVisibilityDelay always defaults to DEFAULT_HOVER_MODE_EXIT_TIME.useHoverMode hook no longer accepts an HTMLElement generic and instead
the event handlers will automatically infer the HTMLElement based on usage.useHoverMode hook no longer returns stickyHandlers and instead returns
hoverHandlers that only include onMouseEnter and onMouseLeave. The
handlers that are returned now include onClick, onMouseEnter, and
onMouseLeave. This was kind of what the stickyHandlers was before. In
addition, clicking an element no longer disabled the hover mode behavior.HoverModeOnlyOptions,
HoverModeOnlyReturnValueimport type when possible
(ba96bb6)eslint
(8111cd3)prop-types package.yarn format to include new files
(48d3d7f)Tooltipped component
(6dca9b1)TooltipHoverModeConfig componentTooltipped componentNote: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
typedoc
(cf54c35)Note: Version bump only for package @react-md/tooltip
useTooltip code
(0a6aed9)Tooltip to use new Hover Mode
(386f47b)Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
Note: Version bump only for package @react-md/tooltip
sideEffects field to package.json
(31820b9)sideEffects formatting
(78a7b6b)No changes.
Tooltips were completely re-written for the v2 release to help fix the missing
accessibility issues from v1. One of the most "exciting" things that was added
during the re-write is that tooltips will now automatically determine the "best"
location to render itself within the viewport instead of manually needing to
change the position yourself! Woo hoo!
Starting from v2, you'll probably just want to use the Tooltipped component as
it'll handle all the functionality of a tooltip for you and ensuring that
correct props are added to the element being tooltipped.
position: relative containerid to help with accessibility concerns and the
tooltipped element gains a aria-describedby pointing to the tooltip's id.lineWrap prop
instead of having to write all the custom CSS yourself.dense
prop is enabled or the $rmd-utils-auto-dense variable is enabled.border-radiusinjectTooltip higher order component was removedTooltipContainer component was removed$rmd-toolip-line-height: 1.5rem !default - The line height to use for the
tooltip text.$rmd-tooltip-line-wrap-vertical-padding: 0.5625rem !default - The amount of
padding to apply to the top and bottom of the tooltip when line wrapping is
enabled.$rmd-tooltip-border-radius: 0.25rem !default - The new border radius applied
to tooltips$rmd-tooltip-transition-distance: 0.5rem !default - The distance that the
tooltip should animate while appearing and hiding.$rmd-tooltip-color - The text color to use for tooltips that will
automatically be adjusted to be contrast compliant relative to the
$rmd-tooltip-background-color. Can be overridden manually.$rmd-tooltip-max-width: 15rem !default - The max width to use for tooltips.
This is mostly to help with the new line wrapping functionality.$rmd-tooltip-enter-duration: $rmd-transition-standard-time !default - The
tooltip's enter transition duration.$rmd-tooltip-exit-duration: $rmd-transition-standard-time !default - The
tooltip's exit transition duration.$rmd-tooltip-z-index: 100 !default - The z-index to apply to tooltips@function rmd-tooltip-theme - gets one of the theme values and validates
that the theme name is valid@function rmd-tooltip-theme-var - gets one of the theme values as a css
variable with a fallback value and validates that the theme name is valid@mixin rmd-tooltip-theme - applies one of the theme values to a css property
as a css variable@mixin rmd-tooltip-theme-update-var - updates one of the theme values as a
css variable@mixin rmd-tooltip-dense-theme - updates all the tooltip theme styles via
CSS variables to use the dense theme (automatically handled from
@react-md/utils if the $rmd-utils-auto-dense variable has been enabled).$md-tooltip-mobile-font-size was renamed to $rmd-tooltip-font-size and
changed the default value from 14px to 1rem$md-tooltip-mobile-tile-height was renamed to $rmd-tooltip-min-height and
changed the default value from 32px to 2rem$md-tooltip-mobile-lr-padding was renamed to
$rmd-tooltip-horizontal-padding and changed the default value from 16px to
1rem$md-tooltip-mobile-top-margin was renamed to $md-tooltip-spacing and
changed the default value from 24px to 1.5rem$md-tooltip-desktop-font-size was renamed to $rmd-tooltip-dense-font-size
and changed the default value from 10px to 0.625rem$md-tooltip-desktop-tile-height was renamed to
$rmd-tooltip-dense-min-height and changed the default value from 22px to
1.375rem$md-tooltip-desktop-lr-padding was renamed to
$rmd-tooltip-dense-horizontal-padding and changed the default value from
8px to 0.5rem$md-tooltip-desktop-top-margin was renamed to $md-tooltip-dense-spacing
and changed the default value from 14px to 0.875rem$md-tooltip-mobile-tb-padding was removed since there is new line wrap
functionality and variables$md-tooltip-desktop-tb-padding was removed since there is new line wrap
functionality and variables