@commercetools-uikit/tooltip
Advanced tools
@commercetools-uikit/tooltip - npm Package Compare versions
Comparing version 0.0.0-canary-20240805095513 to 0.0.0-canary-20240807084212
| import { Modifiers } from 'popper.js'; | ||
| import { ComponentType, FocusEvent, ChangeEvent, CSSProperties, ReactElement } from 'react'; | ||
| export type TComponents = { | ||
| /** | ||
| * The component rendered as the tooltip body. | ||
| */ | ||
| BodyComponent?: ComponentType; | ||
| /** | ||
| * Where the tooltip should be rendered. This can be useful to render the tooltip into another part of the document, using React portal. | ||
| */ | ||
| TooltipWrapperComponent?: ComponentType; | ||
| /** | ||
| * A custom component wrapper for the tooltip. | ||
| */ | ||
| WrapperComponent?: ComponentType; | ||
@@ -10,14 +19,50 @@ }; | ||
| children: ReactElement; | ||
| /** | ||
| * Delay (in milliseconds) between the start of the user interaction, and showing the tooltip. | ||
| */ | ||
| showAfter?: number; | ||
| /** | ||
| * Delay (in milliseconds) between the end of the user interaction, and the closing of the tooltip. | ||
| */ | ||
| closeAfter?: number; | ||
| /** | ||
| * Custom css-in-js object styles for the tooltip body. | ||
| */ | ||
| styles?: Record<string, CSSProperties>; | ||
| /** | ||
| * Determines if the tooltip should not appear. | ||
| */ | ||
| off: boolean; | ||
| /** | ||
| * An identifier for the tooltip, used for `aria-describedby`. | ||
| */ | ||
| id?: string; | ||
| /** | ||
| * A callback function, called when the tooltip is closing. | ||
| */ | ||
| onClose?: (e?: ChangeEvent | FocusEvent) => void; | ||
| /** | ||
| * A callback function, called when the tooltip is opening. | ||
| */ | ||
| onOpen?: (e?: ChangeEvent | FocusEvent) => void; | ||
| isOpen?: boolean; | ||
| /** | ||
| * How the tooltip is positioned relative to the child element. | ||
| */ | ||
| placement?: 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end'; | ||
| /** | ||
| * The message to show in the tooltip. | ||
| */ | ||
| title: string; | ||
| /** | ||
| * Provides a way to fine-tune an appearance of underlying Popper tooltip element. For more information, please check [Popper.js documentation](https://popper.js.org/popper-documentation.html#modifiers). | ||
| */ | ||
| modifiers?: Modifiers; | ||
| /** | ||
| * Customize the appearance of certain elements of the tooltip. | ||
| */ | ||
| components?: TComponents; | ||
| /** | ||
| * Horizontal size limit of the tooltip. | ||
| */ | ||
| horizontalConstraint?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 'scale' | 'auto'; | ||
@@ -29,4 +74,4 @@ }; | ||
| displayName: string; | ||
| defaultProps: Pick<TTooltipProps, "horizontalConstraint" | "off" | "showAfter" | "closeAfter" | "placement">; | ||
| defaultProps: Pick<TTooltipProps, "off" | "horizontalConstraint" | "showAfter" | "closeAfter" | "placement">; | ||
| }; | ||
| export default Tooltip; |
| { | ||
| "name": "@commercetools-uikit/tooltip", | ||
| "description": "Tooltips display informative text when users hover over or focus on an element.", | ||
| "version": "0.0.0-canary-20240805095513", | ||
| "version": "0.0.0-canary-20240807084212", | ||
| "bugs": "https://github.com/commercetools/ui-kit/issues", | ||
@@ -32,6 +32,6 @@ "repository": { | ||
| "@babel/runtime-corejs3": "^7.20.13", | ||
| "@commercetools-uikit/constraints": "0.0.0-canary-20240805095513", | ||
| "@commercetools-uikit/design-system": "0.0.0-canary-20240805095513", | ||
| "@commercetools-uikit/hooks": "0.0.0-canary-20240805095513", | ||
| "@commercetools-uikit/utils": "0.0.0-canary-20240805095513", | ||
| "@commercetools-uikit/constraints": "0.0.0-canary-20240807084212", | ||
| "@commercetools-uikit/design-system": "0.0.0-canary-20240807084212", | ||
| "@commercetools-uikit/hooks": "0.0.0-canary-20240807084212", | ||
| "@commercetools-uikit/utils": "0.0.0-canary-20240807084212", | ||
| "@emotion/react": "^11.10.5", | ||
@@ -38,0 +38,0 @@ "@emotion/styled": "^11.10.5", |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by1.05%
136754
- Lines of code
- increased by3.65%
1277
Dependency changes
+ Added@commercetools-uikit/constraints@0.0.0-canary-20240807084212(transitive)
+ Added@commercetools-uikit/design-system@0.0.0-canary-20240807084212(transitive)
+ Added@commercetools-uikit/hooks@0.0.0-canary-20240807084212(transitive)
+ Added@commercetools-uikit/utils@0.0.0-canary-20240807084212(transitive)
- Removed@commercetools-uikit/constraints@0.0.0-canary-20240805095513(transitive)
- Removed@commercetools-uikit/design-system@0.0.0-canary-20240805095513(transitive)
- Removed@commercetools-uikit/hooks@0.0.0-canary-20240805095513(transitive)
- Removed@commercetools-uikit/utils@0.0.0-canary-20240805095513(transitive)
Updated@commercetools-uikit/constraints@0.0.0-canary-20240807084212
Updated@commercetools-uikit/design-system@0.0.0-canary-20240807084212
Updated@commercetools-uikit/hooks@0.0.0-canary-20240807084212
Updated@commercetools-uikit/utils@0.0.0-canary-20240807084212