@entur/tooltip 2.4.24 → 2.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,24 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [2.5.0](https://bitbucket.org/enturas/design-system/compare/@entur/tooltip@2.4.27...@entur/tooltip@2.5.0) (2021-12-10)
|
|
7
|
+
|
|
8
|
+
### Features
|
|
9
|
+
|
|
10
|
+
- **tooltip:** add 'top-left' and 'top-right' option to placement prop ([6d62bf2](https://bitbucket.org/enturas/design-system/commits/6d62bf2152418c380a4a0a12db1744c0ca65ed95))
|
|
11
|
+
|
|
12
|
+
## [2.4.27](https://bitbucket.org/enturas/design-system/compare/@entur/tooltip@2.4.26...@entur/tooltip@2.4.27) (2021-11-17)
|
|
13
|
+
|
|
14
|
+
**Note:** Version bump only for package @entur/tooltip
|
|
15
|
+
|
|
16
|
+
## [2.4.26](https://bitbucket.org/enturas/design-system/compare/@entur/tooltip@2.4.25...@entur/tooltip@2.4.26) (2021-09-23)
|
|
17
|
+
|
|
18
|
+
**Note:** Version bump only for package @entur/tooltip
|
|
19
|
+
|
|
20
|
+
## [2.4.25](https://bitbucket.org/enturas/design-system/compare/@entur/tooltip@2.4.24...@entur/tooltip@2.4.25) (2021-09-13)
|
|
21
|
+
|
|
22
|
+
**Note:** Version bump only for package @entur/tooltip
|
|
23
|
+
|
|
6
24
|
## [2.4.24](https://bitbucket.org/enturas/design-system/compare/@entur/tooltip@2.4.23...@entur/tooltip@2.4.24) (2021-09-07)
|
|
7
25
|
|
|
8
26
|
### Bug Fixes
|
package/dist/Tooltip.d.ts
CHANGED
|
@@ -11,7 +11,7 @@ declare type Modifier = {
|
|
|
11
11
|
};
|
|
12
12
|
export declare type TooltipProps = {
|
|
13
13
|
/** Plassering av tooltip-en */
|
|
14
|
-
placement: 'top' | 'left' | 'right' | 'bottom-left' | 'bottom' | 'bottom-right';
|
|
14
|
+
placement: 'top' | 'top-left' | 'top-right' | 'left' | 'right' | 'bottom-left' | 'bottom' | 'bottom-right';
|
|
15
15
|
/** Innholdet i tooltip-boksen */
|
|
16
16
|
content: React.ReactNode;
|
|
17
17
|
/** Elementet som skal ha tooltip-funksjonalitet */
|
package/dist/styles.css
CHANGED
|
@@ -2,25 +2,6 @@
|
|
|
2
2
|
--eds-tooltip: 1;
|
|
3
3
|
}/* DO NOT CHANGE!*/
|
|
4
4
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
5
|
-
.eds-popover {
|
|
6
|
-
background: #181c56;
|
|
7
|
-
box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
|
|
8
|
-
border-radius: 0.0625rem;
|
|
9
|
-
border: 0.0625rem solid #d1d3d3;
|
|
10
|
-
font-family: inherit;
|
|
11
|
-
z-index: 20;
|
|
12
|
-
}
|
|
13
|
-
.eds-contrast .eds-popover {
|
|
14
|
-
background: #292b6a;
|
|
15
|
-
box-shadow: 0 0.0625rem 0.1875rem #393d79;
|
|
16
|
-
}
|
|
17
|
-
.eds-popover--hidden {
|
|
18
|
-
display: none;
|
|
19
|
-
}
|
|
20
|
-
.eds-popover:focus {
|
|
21
|
-
outline: 5px solid red;
|
|
22
|
-
}/* DO NOT CHANGE!*/
|
|
23
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
24
5
|
.eds-tooltip-wrapper {
|
|
25
6
|
display: inline-block;
|
|
26
7
|
position: relative;
|
|
@@ -107,6 +88,13 @@
|
|
|
107
88
|
bottom: -0.2rem;
|
|
108
89
|
left: calc(50% - 0.3125rem);
|
|
109
90
|
}
|
|
91
|
+
.eds-tooltip--top-start::after {
|
|
92
|
+
bottom: -0.2rem;
|
|
93
|
+
}
|
|
94
|
+
.eds-tooltip--top-end::after {
|
|
95
|
+
bottom: -0.2rem;
|
|
96
|
+
right: 0.35rem;
|
|
97
|
+
}
|
|
110
98
|
.eds-tooltip--left::after {
|
|
111
99
|
bottom: calc(50% - 0.3125rem);
|
|
112
100
|
left: calc(100% - 0.25rem);
|
|
@@ -129,4 +117,23 @@
|
|
|
129
117
|
.eds-tooltip--bottom-end::after {
|
|
130
118
|
bottom: calc(100% - 0.25rem);
|
|
131
119
|
left: calc(100% - 1rem);
|
|
120
|
+
}/* DO NOT CHANGE!*/
|
|
121
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
122
|
+
.eds-popover {
|
|
123
|
+
background: #181c56;
|
|
124
|
+
box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
|
|
125
|
+
border-radius: 0.0625rem;
|
|
126
|
+
border: 0.0625rem solid #d1d3d3;
|
|
127
|
+
font-family: inherit;
|
|
128
|
+
z-index: 20;
|
|
129
|
+
}
|
|
130
|
+
.eds-contrast .eds-popover {
|
|
131
|
+
background: #292b6a;
|
|
132
|
+
box-shadow: 0 0.0625rem 0.1875rem #393d79;
|
|
133
|
+
}
|
|
134
|
+
.eds-popover--hidden {
|
|
135
|
+
display: none;
|
|
136
|
+
}
|
|
137
|
+
.eds-popover:focus {
|
|
138
|
+
outline: 5px solid red;
|
|
132
139
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.cjs.development.js","sources":["../src/Tooltip.tsx","../src/Popover.tsx","../src/index.tsx"],"sourcesContent":["import React, { cloneElement, useState } from 'react';\nimport { Manager, Reference, Popper } from 'react-popper';\nimport classNames from 'classnames';\nimport { useRandomId } from '@entur/utils';\nimport { Placement as PopperPlacementProps } from '@popperjs/core';\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport './Tooltip.scss';\n\ntype Modifier = {\n name: string;\n enabled?: boolean;\n requires?: Array<string>;\n requiresIfExists?: Array<string>;\n options?: Record<string, unknown>;\n data?: Record<string, unknown>;\n [key: string]: any;\n};\n\nexport type TooltipProps = {\n /** Plassering av tooltip-en */\n placement:\n | 'top'\n | 'left'\n | 'right'\n | 'bottom-left' // bottom-start\n | 'bottom'\n | 'bottom-right'; // bottom-end\n /** Innholdet i tooltip-boksen */\n content: React.ReactNode;\n /** Elementet som skal ha tooltip-funksjonalitet */\n children: React.ReactElement;\n /** Om tooltipen skal vises */\n isOpen?: boolean;\n /** Ekstra klassenavn for tooltip */\n className?: string;\n /** Åpner ikke tooltip ved hover-events\n * @default false\n */\n disableHoverListener?: boolean;\n /** Åpner ikke tooltip ved focus-events\n * @default false\n */\n disableFocusListener?: boolean;\n /** Viser en lukkeknapp om man kontrollerer åpningen av Tooltip vha `isOpen`\n * @default true\n */\n showCloseButton?: boolean;\n /** Valideringsvariant for Tooltip */\n variant?: 'error';\n /** En array av modifiers som sendes til Popper, rammeverket som brukes til plassering av Tooltip\n * @default [{ name: 'offset', options: { offset: [0, 10]} }]\n */\n popperModifiers?: Modifier[];\n [key: string]: any;\n};\n\nexport const Tooltip: React.FC<TooltipProps> = ({\n placement,\n content,\n children,\n className,\n isOpen = false,\n disableHoverListener = false,\n disableFocusListener = false,\n showCloseButton = true,\n variant,\n popperModifiers = [\n {\n name: 'offset',\n options: { offset: [0, 10] },\n },\n ],\n ...rest\n}) => {\n const [showTooltip, setShowTooltip] = useState(isOpen || false);\n let hoverTimer: NodeJS.Timeout;\n\n const handleOpen: (event: React.MouseEvent) => void = event => {\n event.persist();\n hoverTimer = setTimeout(() => {\n setShowTooltip(true);\n }, 150);\n };\n const onMouseExit: () => void = () => {\n setShowTooltip(false);\n clearTimeout(hoverTimer);\n };\n React.useEffect(() => {\n return () => {\n clearTimeout(hoverTimer);\n };\n });\n\n const tooltipId = useRandomId('eds-tooltip');\n React.useEffect(() => {\n setShowTooltip(isOpen);\n }, [isOpen]);\n\n React.useEffect(() => {\n if (!content) {\n setShowTooltip(false);\n }\n }, [content]);\n\n let popperPlacement = placement as PopperPlacementProps;\n if (placement.includes('-')) {\n if (placement.includes('right')) {\n popperPlacement = placement.replace(\n 'right',\n 'end',\n ) as PopperPlacementProps;\n }\n if (placement.includes('left')) {\n popperPlacement = placement.replace(\n 'left',\n 'start',\n ) as PopperPlacementProps;\n }\n }\n\n const childProps: {\n 'aria-describedby'?: string;\n onFocus?: () => void;\n onBlur?: () => void;\n onMouseEnter?: (e: React.MouseEvent) => void;\n onMouseLeave?: () => void;\n } = {};\n childProps['aria-describedby'] = tooltipId;\n if (!disableFocusListener) {\n childProps.onFocus = () => setShowTooltip(true);\n childProps.onBlur = () => setShowTooltip(false);\n }\n if (!disableHoverListener) {\n childProps.onMouseEnter = e => handleOpen(e);\n childProps.onMouseLeave = () => onMouseExit();\n }\n\n return (\n <Manager>\n <Reference>\n {({ ref }) =>\n cloneElement(children, {\n ref: ref,\n ...childProps,\n })\n }\n </Reference>\n {showTooltip && (\n <Popper\n modifiers={[{ name: 'arrow', enabled: false }, ...popperModifiers]}\n placement={popperPlacement}\n >\n {({ ref, style, placement: popperPlacement }) => (\n <div\n className={classNames(\n 'eds-tooltip',\n className,\n `eds-tooltip--${popperPlacement}`,\n { 'eds-tooltip--error': variant === 'error' },\n )}\n ref={ref}\n style={style}\n role=\"tooltip\"\n id={tooltipId}\n data-placement={popperPlacement}\n {...rest}\n >\n {content}\n {isOpen && showCloseButton && (\n <IconButton\n className=\"eds-tooltip__close-button\"\n onClick={() => setShowTooltip(false)}\n >\n <CloseIcon />\n </IconButton>\n )}\n </div>\n )}\n </Popper>\n )}\n </Manager>\n );\n};\n","import React, { cloneElement, createContext, useContext } from 'react';\nimport { usePopper } from 'react-popper';\nimport { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\nimport { Contrast } from '@entur/layout';\nimport './Popover.scss';\n\ntype PopoverContentCallbackProps = {\n ref: React.Ref<HTMLDivElement>;\n};\n\ntype PopoverContextProps = {\n showPopover: boolean;\n triggerElement?: React.RefObject<HTMLButtonElement>;\n contentElement: React.RefObject<HTMLDivElement>;\n styles: { [key: string]: React.CSSProperties };\n attributes: { [key: string]: { [key: string]: string } | undefined };\n closeButtonProps: Record<string, unknown>;\n popoverContentProps: (\n e: PopoverContentCallbackProps,\n ) => Record<string, unknown>;\n triggerProps: () => Record<string, unknown>;\n [key: string]: any;\n};\n\nconst PopoverContext = createContext<PopoverContextProps | undefined>(\n undefined,\n);\nconst usePopoverContext = () => {\n const context = useContext(PopoverContext);\n if (context == null) {\n throw Error('usePopoverContext must be used within <Popover/>');\n }\n return context;\n};\n\nexport type PopoverProps = {\n /** Innholdet i Popover */\n children: React.ReactNode;\n /** Plasseringen av Popover\n * @default \"bottom-start\"\n */\n placement?: Placement;\n};\n\nexport const Popover: React.FC<PopoverProps> = ({\n children,\n placement = 'bottom-start',\n}) => {\n const [showPopover, setShowPopover] = React.useState(false);\n const triggerElement = React.useRef(null);\n const contentElement = React.useRef(null);\n\n const { styles, attributes, forceUpdate } = usePopper(\n triggerElement.current,\n contentElement.current,\n {\n modifiers: [\n { name: 'arrow', enabled: false },\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n ],\n placement: placement,\n },\n );\n\n React.useEffect(() => {\n if (forceUpdate) {\n forceUpdate();\n }\n }, [showPopover, forceUpdate]);\n\n const triggerProps = React.useCallback(() => {\n const buttonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(prev => !prev);\n },\n 'aria-haspopup': 'dialog',\n 'aria-expanded': showPopover,\n ref: triggerElement,\n };\n return buttonProps;\n }, [triggerElement, showPopover]);\n\n useOnClickOutside(contentElement, triggerElement, () =>\n setShowPopover(false),\n );\n const closeButtonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(false);\n },\n };\n const popoverContentProps = React.useCallback(() => {\n const contentProps = {\n role: 'dialog',\n 'aria-modal': 'false',\n ref: contentElement,\n onKeyDown: (event: React.KeyboardEvent) => {\n if (event.key === 'Escape') {\n showPopover && setShowPopover(false);\n }\n },\n };\n return contentProps;\n }, [contentElement, showPopover]);\n const contextValue: PopoverContextProps = {\n showPopover,\n triggerElement,\n contentElement,\n styles,\n attributes,\n popoverContentProps,\n closeButtonProps,\n triggerProps,\n };\n return (\n <PopoverContext.Provider value={contextValue}>\n {children}\n </PopoverContext.Provider>\n );\n};\n\nexport type PopoverTriggerProps = {\n /** Knapp som skal brukes for å åpne Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ children }) => {\n const { triggerProps } = usePopoverContext();\n const child = React.Children.only(children) as React.ReactElement<any>;\n return cloneElement(child, triggerProps());\n};\n\nexport type PopoverCloseButtonProps = {\n /** En valgfri knapp som kan legges inn for å lukke Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverCloseButton: React.FC<PopoverCloseButtonProps> = ({\n children,\n ...rest\n}) => {\n const { closeButtonProps } = usePopoverContext();\n return cloneElement(children, { ...closeButtonProps, ...rest });\n};\n\nexport type PopoverContentProps = {\n /**Innholdet til Popover */\n children: React.ReactNode;\n};\n\nexport const PopoverContent = React.forwardRef<\n HTMLDivElement,\n PopoverContentProps\n>(({ children }, ref: React.Ref<HTMLDivElement>) => {\n const { showPopover, attributes, styles, popoverContentProps } =\n usePopoverContext();\n const props = popoverContentProps({ ref });\n return (\n <Contrast\n className={classNames(\n 'eds-popover',\n {\n 'eds-popover--hidden': !showPopover,\n },\n 'eds-contrast',\n )}\n style={styles.popper}\n aria-hidden={!showPopover}\n {...attributes.styles}\n {...props}\n >\n {children}\n </Contrast>\n );\n});\n\nfunction elementContainsEventTarget(element: HTMLElement | null, event: Event) {\n if (!element) {\n return false;\n }\n\n if (element.contains(event.target as Node)) {\n return true;\n }\n\n // For elements inside a Shadow DOM we need to check the composedPath\n if (event.composed && event.composedPath) {\n const contains = event.composedPath().find(target => {\n if (target === window) {\n return false;\n }\n return element.contains(target as Node);\n });\n return contains ? true : false;\n }\n\n return false;\n}\n\nfunction useOnClickOutside(\n ref: React.RefObject<HTMLDivElement>,\n buttonRef: React.RefObject<HTMLButtonElement>,\n handler: () => void,\n) {\n React.useEffect(() => {\n const listener = (event: Event) => {\n if (\n elementContainsEventTarget(ref.current, event) ||\n elementContainsEventTarget(buttonRef.current, event)\n ) {\n return;\n }\n\n handler();\n };\n\n document.addEventListener('mousedown', listener);\n document.addEventListener('touchstart', listener);\n\n return () => {\n document.removeEventListener('mousedown', listener);\n document.removeEventListener('touchstart', listener);\n };\n }, [ref, buttonRef, handler]);\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('tooltip');\n\nexport * from './Tooltip';\nexport * from './Popover';\n"],"names":["Tooltip","placement","content","children","className","isOpen","disableHoverListener","disableFocusListener","showCloseButton","variant","popperModifiers","name","options","offset","rest","useState","showTooltip","setShowTooltip","hoverTimer","handleOpen","event","persist","setTimeout","onMouseExit","clearTimeout","React","useEffect","tooltipId","useRandomId","popperPlacement","includes","replace","childProps","onFocus","onBlur","onMouseEnter","e","onMouseLeave","Manager","Reference","ref","cloneElement","Popper","modifiers","enabled","style","classNames","role","id","IconButton","onClick","CloseIcon","PopoverContext","createContext","undefined","usePopoverContext","context","useContext","Error","Popover","showPopover","setShowPopover","triggerElement","useRef","contentElement","usePopper","current","styles","attributes","forceUpdate","triggerProps","useCallback","buttonProps","preventDefault","prev","useOnClickOutside","closeButtonProps","popoverContentProps","contentProps","onKeyDown","key","contextValue","Provider","value","PopoverTrigger","child","Children","only","PopoverCloseButton","PopoverContent","forwardRef","props","Contrast","popper","elementContainsEventTarget","element","contains","target","composed","composedPath","find","window","buttonRef","handler","listener","document","addEventListener","removeEventListener","warnAboutMissingStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tooltip.cjs.development.js","sources":["../src/Tooltip.tsx","../src/Popover.tsx","../src/index.tsx"],"sourcesContent":["import React, { cloneElement, useState } from 'react';\nimport { Manager, Reference, Popper } from 'react-popper';\nimport classNames from 'classnames';\nimport { useRandomId } from '@entur/utils';\nimport { Placement as PopperPlacementProps } from '@popperjs/core';\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport './Tooltip.scss';\n\ntype Modifier = {\n name: string;\n enabled?: boolean;\n requires?: Array<string>;\n requiresIfExists?: Array<string>;\n options?: Record<string, unknown>;\n data?: Record<string, unknown>;\n [key: string]: any;\n};\n\nexport type TooltipProps = {\n /** Plassering av tooltip-en */\n placement:\n | 'top'\n | 'top-left'\n | 'top-right'\n | 'left'\n | 'right'\n | 'bottom-left' // bottom-start\n | 'bottom'\n | 'bottom-right'; // bottom-end\n /** Innholdet i tooltip-boksen */\n content: React.ReactNode;\n /** Elementet som skal ha tooltip-funksjonalitet */\n children: React.ReactElement;\n /** Om tooltipen skal vises */\n isOpen?: boolean;\n /** Ekstra klassenavn for tooltip */\n className?: string;\n /** Åpner ikke tooltip ved hover-events\n * @default false\n */\n disableHoverListener?: boolean;\n /** Åpner ikke tooltip ved focus-events\n * @default false\n */\n disableFocusListener?: boolean;\n /** Viser en lukkeknapp om man kontrollerer åpningen av Tooltip vha `isOpen`\n * @default true\n */\n showCloseButton?: boolean;\n /** Valideringsvariant for Tooltip */\n variant?: 'error';\n /** En array av modifiers som sendes til Popper, rammeverket som brukes til plassering av Tooltip\n * @default [{ name: 'offset', options: { offset: [0, 10]} }]\n */\n popperModifiers?: Modifier[];\n [key: string]: any;\n};\n\nexport const Tooltip: React.FC<TooltipProps> = ({\n placement,\n content,\n children,\n className,\n isOpen = false,\n disableHoverListener = false,\n disableFocusListener = false,\n showCloseButton = true,\n variant,\n popperModifiers = [\n {\n name: 'offset',\n options: { offset: [0, 10] },\n },\n ],\n ...rest\n}) => {\n const [showTooltip, setShowTooltip] = useState(isOpen || false);\n let hoverTimer: NodeJS.Timeout;\n\n const handleOpen: (event: React.MouseEvent) => void = event => {\n event.persist();\n hoverTimer = setTimeout(() => {\n setShowTooltip(true);\n }, 150);\n };\n const onMouseExit: () => void = () => {\n setShowTooltip(false);\n clearTimeout(hoverTimer);\n };\n React.useEffect(() => {\n return () => {\n clearTimeout(hoverTimer);\n };\n });\n\n const tooltipId = useRandomId('eds-tooltip');\n React.useEffect(() => {\n setShowTooltip(isOpen);\n }, [isOpen]);\n\n React.useEffect(() => {\n if (!content) {\n setShowTooltip(false);\n }\n }, [content]);\n\n let popperPlacement = placement as PopperPlacementProps;\n if (placement.includes('-')) {\n if (placement.includes('right')) {\n popperPlacement = placement.replace(\n 'right',\n 'end',\n ) as PopperPlacementProps;\n }\n if (placement.includes('left')) {\n popperPlacement = placement.replace(\n 'left',\n 'start',\n ) as PopperPlacementProps;\n }\n }\n\n const childProps: {\n 'aria-describedby'?: string;\n onFocus?: () => void;\n onBlur?: () => void;\n onMouseEnter?: (e: React.MouseEvent) => void;\n onMouseLeave?: () => void;\n } = {};\n childProps['aria-describedby'] = tooltipId;\n if (!disableFocusListener) {\n childProps.onFocus = () => setShowTooltip(true);\n childProps.onBlur = () => setShowTooltip(false);\n }\n if (!disableHoverListener) {\n childProps.onMouseEnter = e => handleOpen(e);\n childProps.onMouseLeave = () => onMouseExit();\n }\n\n return (\n <Manager>\n <Reference>\n {({ ref }) =>\n cloneElement(children, {\n ref: ref,\n ...childProps,\n })\n }\n </Reference>\n {showTooltip && (\n <Popper\n modifiers={[{ name: 'arrow', enabled: false }, ...popperModifiers]}\n placement={popperPlacement}\n >\n {({ ref, style, placement: popperPlacement }) => (\n <div\n className={classNames(\n 'eds-tooltip',\n className,\n `eds-tooltip--${popperPlacement}`,\n { 'eds-tooltip--error': variant === 'error' },\n )}\n ref={ref}\n style={style}\n role=\"tooltip\"\n id={tooltipId}\n data-placement={popperPlacement}\n {...rest}\n >\n {content}\n {isOpen && showCloseButton && (\n <IconButton\n className=\"eds-tooltip__close-button\"\n onClick={() => setShowTooltip(false)}\n >\n <CloseIcon />\n </IconButton>\n )}\n </div>\n )}\n </Popper>\n )}\n </Manager>\n );\n};\n","import React, { cloneElement, createContext, useContext } from 'react';\nimport { usePopper } from 'react-popper';\nimport { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\nimport { Contrast } from '@entur/layout';\nimport './Popover.scss';\n\ntype PopoverContentCallbackProps = {\n ref: React.Ref<HTMLDivElement>;\n};\n\ntype PopoverContextProps = {\n showPopover: boolean;\n triggerElement?: React.RefObject<HTMLButtonElement>;\n contentElement: React.RefObject<HTMLDivElement>;\n styles: { [key: string]: React.CSSProperties };\n attributes: { [key: string]: { [key: string]: string } | undefined };\n closeButtonProps: Record<string, unknown>;\n popoverContentProps: (\n e: PopoverContentCallbackProps,\n ) => Record<string, unknown>;\n triggerProps: () => Record<string, unknown>;\n [key: string]: any;\n};\n\nconst PopoverContext = createContext<PopoverContextProps | undefined>(\n undefined,\n);\nconst usePopoverContext = () => {\n const context = useContext(PopoverContext);\n if (context == null) {\n throw Error('usePopoverContext must be used within <Popover/>');\n }\n return context;\n};\n\nexport type PopoverProps = {\n /** Innholdet i Popover */\n children: React.ReactNode;\n /** Plasseringen av Popover\n * @default \"bottom-start\"\n */\n placement?: Placement;\n};\n\nexport const Popover: React.FC<PopoverProps> = ({\n children,\n placement = 'bottom-start',\n}) => {\n const [showPopover, setShowPopover] = React.useState(false);\n const triggerElement = React.useRef(null);\n const contentElement = React.useRef(null);\n\n const { styles, attributes, forceUpdate } = usePopper(\n triggerElement.current,\n contentElement.current,\n {\n modifiers: [\n { name: 'arrow', enabled: false },\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n ],\n placement: placement,\n },\n );\n\n React.useEffect(() => {\n if (forceUpdate) {\n forceUpdate();\n }\n }, [showPopover, forceUpdate]);\n\n const triggerProps = React.useCallback(() => {\n const buttonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(prev => !prev);\n },\n 'aria-haspopup': 'dialog',\n 'aria-expanded': showPopover,\n ref: triggerElement,\n };\n return buttonProps;\n }, [triggerElement, showPopover]);\n\n useOnClickOutside(contentElement, triggerElement, () =>\n setShowPopover(false),\n );\n const closeButtonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(false);\n },\n };\n const popoverContentProps = React.useCallback(() => {\n const contentProps = {\n role: 'dialog',\n 'aria-modal': 'false',\n ref: contentElement,\n onKeyDown: (event: React.KeyboardEvent) => {\n if (event.key === 'Escape') {\n showPopover && setShowPopover(false);\n }\n },\n };\n return contentProps;\n }, [contentElement, showPopover]);\n const contextValue: PopoverContextProps = {\n showPopover,\n triggerElement,\n contentElement,\n styles,\n attributes,\n popoverContentProps,\n closeButtonProps,\n triggerProps,\n };\n return (\n <PopoverContext.Provider value={contextValue}>\n {children}\n </PopoverContext.Provider>\n );\n};\n\nexport type PopoverTriggerProps = {\n /** Knapp som skal brukes for å åpne Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ children }) => {\n const { triggerProps } = usePopoverContext();\n const child = React.Children.only(children) as React.ReactElement<any>;\n return cloneElement(child, triggerProps());\n};\n\nexport type PopoverCloseButtonProps = {\n /** En valgfri knapp som kan legges inn for å lukke Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverCloseButton: React.FC<PopoverCloseButtonProps> = ({\n children,\n ...rest\n}) => {\n const { closeButtonProps } = usePopoverContext();\n return cloneElement(children, { ...closeButtonProps, ...rest });\n};\n\nexport type PopoverContentProps = {\n /**Innholdet til Popover */\n children: React.ReactNode;\n};\n\nexport const PopoverContent = React.forwardRef<\n HTMLDivElement,\n PopoverContentProps\n>(({ children }, ref: React.Ref<HTMLDivElement>) => {\n const { showPopover, attributes, styles, popoverContentProps } =\n usePopoverContext();\n const props = popoverContentProps({ ref });\n return (\n <Contrast\n className={classNames(\n 'eds-popover',\n {\n 'eds-popover--hidden': !showPopover,\n },\n 'eds-contrast',\n )}\n style={styles.popper}\n aria-hidden={!showPopover}\n {...attributes.styles}\n {...props}\n >\n {children}\n </Contrast>\n );\n});\n\nfunction elementContainsEventTarget(element: HTMLElement | null, event: Event) {\n if (!element) {\n return false;\n }\n\n if (element.contains(event.target as Node)) {\n return true;\n }\n\n // For elements inside a Shadow DOM we need to check the composedPath\n if (event.composed && event.composedPath) {\n const contains = event.composedPath().find(target => {\n if (target === window) {\n return false;\n }\n return element.contains(target as Node);\n });\n return contains ? true : false;\n }\n\n return false;\n}\n\nfunction useOnClickOutside(\n ref: React.RefObject<HTMLDivElement>,\n buttonRef: React.RefObject<HTMLButtonElement>,\n handler: () => void,\n) {\n React.useEffect(() => {\n const listener = (event: Event) => {\n if (\n elementContainsEventTarget(ref.current, event) ||\n elementContainsEventTarget(buttonRef.current, event)\n ) {\n return;\n }\n\n handler();\n };\n\n document.addEventListener('mousedown', listener);\n document.addEventListener('touchstart', listener);\n\n return () => {\n document.removeEventListener('mousedown', listener);\n document.removeEventListener('touchstart', listener);\n };\n }, [ref, buttonRef, handler]);\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('tooltip');\n\nexport * from './Tooltip';\nexport * from './Popover';\n"],"names":["Tooltip","placement","content","children","className","isOpen","disableHoverListener","disableFocusListener","showCloseButton","variant","popperModifiers","name","options","offset","rest","useState","showTooltip","setShowTooltip","hoverTimer","handleOpen","event","persist","setTimeout","onMouseExit","clearTimeout","React","useEffect","tooltipId","useRandomId","popperPlacement","includes","replace","childProps","onFocus","onBlur","onMouseEnter","e","onMouseLeave","Manager","Reference","ref","cloneElement","Popper","modifiers","enabled","style","classNames","role","id","IconButton","onClick","CloseIcon","PopoverContext","createContext","undefined","usePopoverContext","context","useContext","Error","Popover","showPopover","setShowPopover","triggerElement","useRef","contentElement","usePopper","current","styles","attributes","forceUpdate","triggerProps","useCallback","buttonProps","preventDefault","prev","useOnClickOutside","closeButtonProps","popoverContentProps","contentProps","onKeyDown","key","contextValue","Provider","value","PopoverTrigger","child","Children","only","PopoverCloseButton","PopoverContent","forwardRef","props","Contrast","popper","elementContainsEventTarget","element","contains","target","composed","composedPath","find","window","buttonRef","handler","listener","document","addEventListener","removeEventListener","warnAboutMissingStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA2DaA,OAAO,GAA2B,SAAlCA,OAAkC;MAC7CC,iBAAAA;MACAC,eAAAA;MACAC,gBAAAA;MACAC,iBAAAA;yBACAC;MAAAA,kCAAS;mCACTC;MAAAA,0DAAuB;mCACvBC;MAAAA,0DAAuB;kCACvBC;MAAAA,oDAAkB;MAClBC,eAAAA;kCACAC;MAAAA,oDAAkB,CAChB;AACEC,IAAAA,IAAI,EAAE,QADR;AAEEC,IAAAA,OAAO,EAAE;AAAEC,MAAAA,MAAM,EAAE,CAAC,CAAD,EAAI,EAAJ;AAAV;AAFX,GADgB;MAMfC;;kBAEmCC,cAAQ,CAACV,MAAM,IAAI,KAAX;MAAvCW;MAAaC;;AACpB,MAAIC,UAAJ;;AAEA,MAAMC,UAAU,GAAsC,SAAhDA,UAAgD,CAAAC,KAAK;AACzDA,IAAAA,KAAK,CAACC,OAAN;AACAH,IAAAA,UAAU,GAAGI,UAAU,CAAC;AACtBL,MAAAA,cAAc,CAAC,IAAD,CAAd;AACD,KAFsB,EAEpB,GAFoB,CAAvB;AAGD,GALD;;AAMA,MAAMM,WAAW,GAAe,SAA1BA,WAA0B;AAC9BN,IAAAA,cAAc,CAAC,KAAD,CAAd;AACAO,IAAAA,YAAY,CAACN,UAAD,CAAZ;AACD,GAHD;;AAIAO,EAAAA,cAAK,CAACC,SAAN,CAAgB;AACd,WAAO;AACLF,MAAAA,YAAY,CAACN,UAAD,CAAZ;AACD,KAFD;AAGD,GAJD;AAMA,MAAMS,SAAS,GAAGC,iBAAW,CAAC,aAAD,CAA7B;AACAH,EAAAA,cAAK,CAACC,SAAN,CAAgB;AACdT,IAAAA,cAAc,CAACZ,MAAD,CAAd;AACD,GAFD,EAEG,CAACA,MAAD,CAFH;AAIAoB,EAAAA,cAAK,CAACC,SAAN,CAAgB;AACd,QAAI,CAACxB,OAAL,EAAc;AACZe,MAAAA,cAAc,CAAC,KAAD,CAAd;AACD;AACF,GAJD,EAIG,CAACf,OAAD,CAJH;AAMA,MAAI2B,eAAe,GAAG5B,SAAtB;;AACA,MAAIA,SAAS,CAAC6B,QAAV,CAAmB,GAAnB,CAAJ,EAA6B;AAC3B,QAAI7B,SAAS,CAAC6B,QAAV,CAAmB,OAAnB,CAAJ,EAAiC;AAC/BD,MAAAA,eAAe,GAAG5B,SAAS,CAAC8B,OAAV,CAChB,OADgB,EAEhB,KAFgB,CAAlB;AAID;;AACD,QAAI9B,SAAS,CAAC6B,QAAV,CAAmB,MAAnB,CAAJ,EAAgC;AAC9BD,MAAAA,eAAe,GAAG5B,SAAS,CAAC8B,OAAV,CAChB,MADgB,EAEhB,OAFgB,CAAlB;AAID;AACF;;AAED,MAAMC,UAAU,GAMZ,EANJ;AAOAA,EAAAA,UAAU,CAAC,kBAAD,CAAV,GAAiCL,SAAjC;;AACA,MAAI,CAACpB,oBAAL,EAA2B;AACzByB,IAAAA,UAAU,CAACC,OAAX,GAAqB;AAAA,aAAMhB,cAAc,CAAC,IAAD,CAApB;AAAA,KAArB;;AACAe,IAAAA,UAAU,CAACE,MAAX,GAAoB;AAAA,aAAMjB,cAAc,CAAC,KAAD,CAApB;AAAA,KAApB;AACD;;AACD,MAAI,CAACX,oBAAL,EAA2B;AACzB0B,IAAAA,UAAU,CAACG,YAAX,GAA0B,UAAAC,CAAC;AAAA,aAAIjB,UAAU,CAACiB,CAAD,CAAd;AAAA,KAA3B;;AACAJ,IAAAA,UAAU,CAACK,YAAX,GAA0B;AAAA,aAAMd,WAAW,EAAjB;AAAA,KAA1B;AACD;;AAED,SACEE,4BAAA,CAACa,mBAAD,MAAA,EACEb,4BAAA,CAACc,qBAAD,MAAA,EACG;AAAA,QAAGC,GAAH,SAAGA,GAAH;AAAA,WACCC,kBAAY,CAACtC,QAAD;AACVqC,MAAAA,GAAG,EAAEA;AADK,OAEPR,UAFO,EADb;AAAA,GADH,CADF,EASGhB,WAAW,IACVS,4BAAA,CAACiB,kBAAD;AACEC,IAAAA,SAAS,GAAG;AAAEhC,MAAAA,IAAI,EAAE,OAAR;AAAiBiC,MAAAA,OAAO,EAAE;AAA1B,KAAH,SAAyClC,eAAzC;AACTT,IAAAA,SAAS,EAAE4B;GAFb,EAIG;AAAA,QAAGW,GAAH,SAAGA,GAAH;AAAA,QAAQK,KAAR,SAAQA,KAAR;AAAA,QAA0BhB,eAA1B,SAAe5B,SAAf;AAAA,WACCwB,4BAAA,MAAA;AACErB,MAAAA,SAAS,EAAE0C,UAAU,CACnB,aADmB,EAEnB1C,SAFmB,oBAGHyB,eAHG,EAInB;AAAE,8BAAsBpB,OAAO,KAAK;AAApC,OAJmB;AAMrB+B,MAAAA,GAAG,EAAEA;AACLK,MAAAA,KAAK,EAAEA;AACPE,MAAAA,IAAI,EAAC;AACLC,MAAAA,EAAE,EAAErB;wBACYE;OACZf,KAZN,EAcGZ,OAdH,EAeGG,MAAM,IAAIG,eAAV,IACCiB,4BAAA,CAACwB,iBAAD;AACE7C,MAAAA,SAAS,EAAC;AACV8C,MAAAA,OAAO,EAAE;AAAA,eAAMjC,cAAc,CAAC,KAAD,CAApB;AAAA;KAFX,EAIEQ,4BAAA,CAAC0B,eAAD,MAAA,CAJF,CAhBJ,CADD;AAAA,GAJH,CAVJ,CADF;AA6CD;;AChKD,IAAMC,cAAc,gBAAGC,mBAAa,CAClCC,SADkC,CAApC;;AAGA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB;AACxB,MAAMC,OAAO,GAAGC,gBAAU,CAACL,cAAD,CAA1B;;AACA,MAAII,OAAO,IAAI,IAAf,EAAqB;AACnB,UAAME,KAAK,CAAC,kDAAD,CAAX;AACD;;AACD,SAAOF,OAAP;AACD,CAND;;AAiBA,IAAaG,OAAO,GAA2B,SAAlCA,OAAkC;MAC7CxD,gBAAAA;4BACAF;MAAAA,wCAAY;;wBAE0BwB,cAAK,CAACV,QAAN,CAAe,KAAf;MAA/B6C;MAAaC;;AACpB,MAAMC,cAAc,GAAGrC,cAAK,CAACsC,MAAN,CAAa,IAAb,CAAvB;AACA,MAAMC,cAAc,GAAGvC,cAAK,CAACsC,MAAN,CAAa,IAAb,CAAvB;;mBAE4CE,qBAAS,CACnDH,cAAc,CAACI,OADoC,EAEnDF,cAAc,CAACE,OAFoC,EAGnD;AACEvB,IAAAA,SAAS,EAAE,CACT;AAAEhC,MAAAA,IAAI,EAAE,OAAR;AAAiBiC,MAAAA,OAAO,EAAE;AAA1B,KADS,EAET;AACEjC,MAAAA,IAAI,EAAE,QADR;AAEEC,MAAAA,OAAO,EAAE;AACPC,QAAAA,MAAM,EAAE,CAAC,CAAD,EAAI,CAAJ;AADD;AAFX,KAFS,CADb;AAUEZ,IAAAA,SAAS,EAAEA;AAVb,GAHmD;MAA7CkE,oBAAAA;MAAQC,wBAAAA;MAAYC,yBAAAA;;AAiB5B5C,EAAAA,cAAK,CAACC,SAAN,CAAgB;AACd,QAAI2C,WAAJ,EAAiB;AACfA,MAAAA,WAAW;AACZ;AACF,GAJD,EAIG,CAACT,WAAD,EAAcS,WAAd,CAJH;AAMA,MAAMC,YAAY,GAAG7C,cAAK,CAAC8C,WAAN,CAAkB;AACrC,QAAMC,WAAW,GAAG;AAClBtB,MAAAA,OAAO,EAAE,iBAACd,CAAD;AACPA,QAAAA,CAAC,CAACqC,cAAF;AACAZ,QAAAA,cAAc,CAAC,UAAAa,IAAI;AAAA,iBAAI,CAACA,IAAL;AAAA,SAAL,CAAd;AACD,OAJiB;AAKlB,uBAAiB,QALC;AAMlB,uBAAiBd,WANC;AAOlBpB,MAAAA,GAAG,EAAEsB;AAPa,KAApB;AASA,WAAOU,WAAP;AACD,GAXoB,EAWlB,CAACV,cAAD,EAAiBF,WAAjB,CAXkB,CAArB;AAaAe,EAAAA,iBAAiB,CAACX,cAAD,EAAiBF,cAAjB,EAAiC;AAAA,WAChDD,cAAc,CAAC,KAAD,CADkC;AAAA,GAAjC,CAAjB;AAGA,MAAMe,gBAAgB,GAAG;AACvB1B,IAAAA,OAAO,EAAE,iBAACd,CAAD;AACPA,MAAAA,CAAC,CAACqC,cAAF;AACAZ,MAAAA,cAAc,CAAC,KAAD,CAAd;AACD;AAJsB,GAAzB;AAMA,MAAMgB,mBAAmB,GAAGpD,cAAK,CAAC8C,WAAN,CAAkB;AAC5C,QAAMO,YAAY,GAAG;AACnB/B,MAAAA,IAAI,EAAE,QADa;AAEnB,oBAAc,OAFK;AAGnBP,MAAAA,GAAG,EAAEwB,cAHc;AAInBe,MAAAA,SAAS,EAAE,mBAAC3D,KAAD;AACT,YAAIA,KAAK,CAAC4D,GAAN,KAAc,QAAlB,EAA4B;AAC1BpB,UAAAA,WAAW,IAAIC,cAAc,CAAC,KAAD,CAA7B;AACD;AACF;AARkB,KAArB;AAUA,WAAOiB,YAAP;AACD,GAZ2B,EAYzB,CAACd,cAAD,EAAiBJ,WAAjB,CAZyB,CAA5B;AAaA,MAAMqB,YAAY,GAAwB;AACxCrB,IAAAA,WAAW,EAAXA,WADwC;AAExCE,IAAAA,cAAc,EAAdA,cAFwC;AAGxCE,IAAAA,cAAc,EAAdA,cAHwC;AAIxCG,IAAAA,MAAM,EAANA,MAJwC;AAKxCC,IAAAA,UAAU,EAAVA,UALwC;AAMxCS,IAAAA,mBAAmB,EAAnBA,mBANwC;AAOxCD,IAAAA,gBAAgB,EAAhBA,gBAPwC;AAQxCN,IAAAA,YAAY,EAAZA;AARwC,GAA1C;AAUA,SACE7C,4BAAA,CAAC2B,cAAc,CAAC8B,QAAhB;AAAyBC,IAAAA,KAAK,EAAEF;GAAhC,EACG9E,QADH,CADF;AAKD,CAjFM;AAwFP,IAAaiF,cAAc,GAAkC,SAAhDA,cAAgD;MAAGjF,iBAAAA;;2BACrCoD,iBAAiB;MAAlCe,kCAAAA;;AACR,MAAMe,KAAK,GAAG5D,cAAK,CAAC6D,QAAN,CAAeC,IAAf,CAAoBpF,QAApB,CAAd;AACA,SAAOsC,kBAAY,CAAC4C,KAAD,EAAQf,YAAY,EAApB,CAAnB;AACD,CAJM;AAWP,IAAakB,kBAAkB,GAAsC,SAAxDA,kBAAwD;MACnErF,iBAAAA;MACGW;;4BAE0ByC,iBAAiB;MAAtCqB,uCAAAA;;AACR,SAAOnC,kBAAY,CAACtC,QAAD,eAAgByE,gBAAhB,EAAqC9D,IAArC,EAAnB;AACD,CANM;AAaP,IAAa2E,cAAc,gBAAGhE,cAAK,CAACiE,UAAN,CAG5B,iBAAelD,GAAf;MAAGrC,iBAAAA;;4BAEDoD,iBAAiB;MADXK,kCAAAA;MAAaQ,iCAAAA;MAAYD,6BAAAA;MAAQU,0CAAAA;;AAEzC,MAAMc,KAAK,GAAGd,mBAAmB,CAAC;AAAErC,IAAAA,GAAG,EAAHA;AAAF,GAAD,CAAjC;AACA,SACEf,4BAAA,CAACmE,eAAD;AACExF,IAAAA,SAAS,EAAE0C,UAAU,CACnB,aADmB,EAEnB;AACE,6BAAuB,CAACc;AAD1B,KAFmB,EAKnB,cALmB;AAOrBf,IAAAA,KAAK,EAAEsB,MAAM,CAAC0B;mBACD,CAACjC;KACVQ,UAAU,CAACD,QACXwB,MAXN,EAaGxF,QAbH,CADF;AAiBD,CAxB6B,CAAvB;;AA0BP,SAAS2F,0BAAT,CAAoCC,OAApC,EAAiE3E,KAAjE;AACE,MAAI,CAAC2E,OAAL,EAAc;AACZ,WAAO,KAAP;AACD;;AAED,MAAIA,OAAO,CAACC,QAAR,CAAiB5E,KAAK,CAAC6E,MAAvB,CAAJ,EAA4C;AAC1C,WAAO,IAAP;AACD;;;AAGD,MAAI7E,KAAK,CAAC8E,QAAN,IAAkB9E,KAAK,CAAC+E,YAA5B,EAA0C;AACxC,QAAMH,QAAQ,GAAG5E,KAAK,CAAC+E,YAAN,GAAqBC,IAArB,CAA0B,UAAAH,MAAM;AAC/C,UAAIA,MAAM,KAAKI,MAAf,EAAuB;AACrB,eAAO,KAAP;AACD;;AACD,aAAON,OAAO,CAACC,QAAR,CAAiBC,MAAjB,CAAP;AACD,KALgB,CAAjB;AAMA,WAAOD,QAAQ,GAAG,IAAH,GAAU,KAAzB;AACD;;AAED,SAAO,KAAP;AACD;;AAED,SAASrB,iBAAT,CACEnC,GADF,EAEE8D,SAFF,EAGEC,OAHF;AAKE9E,EAAAA,cAAK,CAACC,SAAN,CAAgB;AACd,QAAM8E,QAAQ,GAAG,SAAXA,QAAW,CAACpF,KAAD;AACf,UACE0E,0BAA0B,CAACtD,GAAG,CAAC0B,OAAL,EAAc9C,KAAd,CAA1B,IACA0E,0BAA0B,CAACQ,SAAS,CAACpC,OAAX,EAAoB9C,KAApB,CAF5B,EAGE;AACA;AACD;;AAEDmF,MAAAA,OAAO;AACR,KATD;;AAWAE,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,WAA1B,EAAuCF,QAAvC;AACAC,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,YAA1B,EAAwCF,QAAxC;AAEA,WAAO;AACLC,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,WAA7B,EAA0CH,QAA1C;AACAC,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,YAA7B,EAA2CH,QAA3C;AACD,KAHD;AAID,GAnBD,EAmBG,CAAChE,GAAD,EAAM8D,SAAN,EAAiBC,OAAjB,CAnBH;AAoBD;;ACpODK,4BAAsB,CAAC,SAAD,CAAtB;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.cjs.production.min.js","sources":["../src/Popover.tsx","../src/index.tsx","../src/Tooltip.tsx"],"sourcesContent":["import React, { cloneElement, createContext, useContext } from 'react';\nimport { usePopper } from 'react-popper';\nimport { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\nimport { Contrast } from '@entur/layout';\nimport './Popover.scss';\n\ntype PopoverContentCallbackProps = {\n ref: React.Ref<HTMLDivElement>;\n};\n\ntype PopoverContextProps = {\n showPopover: boolean;\n triggerElement?: React.RefObject<HTMLButtonElement>;\n contentElement: React.RefObject<HTMLDivElement>;\n styles: { [key: string]: React.CSSProperties };\n attributes: { [key: string]: { [key: string]: string } | undefined };\n closeButtonProps: Record<string, unknown>;\n popoverContentProps: (\n e: PopoverContentCallbackProps,\n ) => Record<string, unknown>;\n triggerProps: () => Record<string, unknown>;\n [key: string]: any;\n};\n\nconst PopoverContext = createContext<PopoverContextProps | undefined>(\n undefined,\n);\nconst usePopoverContext = () => {\n const context = useContext(PopoverContext);\n if (context == null) {\n throw Error('usePopoverContext must be used within <Popover/>');\n }\n return context;\n};\n\nexport type PopoverProps = {\n /** Innholdet i Popover */\n children: React.ReactNode;\n /** Plasseringen av Popover\n * @default \"bottom-start\"\n */\n placement?: Placement;\n};\n\nexport const Popover: React.FC<PopoverProps> = ({\n children,\n placement = 'bottom-start',\n}) => {\n const [showPopover, setShowPopover] = React.useState(false);\n const triggerElement = React.useRef(null);\n const contentElement = React.useRef(null);\n\n const { styles, attributes, forceUpdate } = usePopper(\n triggerElement.current,\n contentElement.current,\n {\n modifiers: [\n { name: 'arrow', enabled: false },\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n ],\n placement: placement,\n },\n );\n\n React.useEffect(() => {\n if (forceUpdate) {\n forceUpdate();\n }\n }, [showPopover, forceUpdate]);\n\n const triggerProps = React.useCallback(() => {\n const buttonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(prev => !prev);\n },\n 'aria-haspopup': 'dialog',\n 'aria-expanded': showPopover,\n ref: triggerElement,\n };\n return buttonProps;\n }, [triggerElement, showPopover]);\n\n useOnClickOutside(contentElement, triggerElement, () =>\n setShowPopover(false),\n );\n const closeButtonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(false);\n },\n };\n const popoverContentProps = React.useCallback(() => {\n const contentProps = {\n role: 'dialog',\n 'aria-modal': 'false',\n ref: contentElement,\n onKeyDown: (event: React.KeyboardEvent) => {\n if (event.key === 'Escape') {\n showPopover && setShowPopover(false);\n }\n },\n };\n return contentProps;\n }, [contentElement, showPopover]);\n const contextValue: PopoverContextProps = {\n showPopover,\n triggerElement,\n contentElement,\n styles,\n attributes,\n popoverContentProps,\n closeButtonProps,\n triggerProps,\n };\n return (\n <PopoverContext.Provider value={contextValue}>\n {children}\n </PopoverContext.Provider>\n );\n};\n\nexport type PopoverTriggerProps = {\n /** Knapp som skal brukes for å åpne Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ children }) => {\n const { triggerProps } = usePopoverContext();\n const child = React.Children.only(children) as React.ReactElement<any>;\n return cloneElement(child, triggerProps());\n};\n\nexport type PopoverCloseButtonProps = {\n /** En valgfri knapp som kan legges inn for å lukke Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverCloseButton: React.FC<PopoverCloseButtonProps> = ({\n children,\n ...rest\n}) => {\n const { closeButtonProps } = usePopoverContext();\n return cloneElement(children, { ...closeButtonProps, ...rest });\n};\n\nexport type PopoverContentProps = {\n /**Innholdet til Popover */\n children: React.ReactNode;\n};\n\nexport const PopoverContent = React.forwardRef<\n HTMLDivElement,\n PopoverContentProps\n>(({ children }, ref: React.Ref<HTMLDivElement>) => {\n const { showPopover, attributes, styles, popoverContentProps } =\n usePopoverContext();\n const props = popoverContentProps({ ref });\n return (\n <Contrast\n className={classNames(\n 'eds-popover',\n {\n 'eds-popover--hidden': !showPopover,\n },\n 'eds-contrast',\n )}\n style={styles.popper}\n aria-hidden={!showPopover}\n {...attributes.styles}\n {...props}\n >\n {children}\n </Contrast>\n );\n});\n\nfunction elementContainsEventTarget(element: HTMLElement | null, event: Event) {\n if (!element) {\n return false;\n }\n\n if (element.contains(event.target as Node)) {\n return true;\n }\n\n // For elements inside a Shadow DOM we need to check the composedPath\n if (event.composed && event.composedPath) {\n const contains = event.composedPath().find(target => {\n if (target === window) {\n return false;\n }\n return element.contains(target as Node);\n });\n return contains ? true : false;\n }\n\n return false;\n}\n\nfunction useOnClickOutside(\n ref: React.RefObject<HTMLDivElement>,\n buttonRef: React.RefObject<HTMLButtonElement>,\n handler: () => void,\n) {\n React.useEffect(() => {\n const listener = (event: Event) => {\n if (\n elementContainsEventTarget(ref.current, event) ||\n elementContainsEventTarget(buttonRef.current, event)\n ) {\n return;\n }\n\n handler();\n };\n\n document.addEventListener('mousedown', listener);\n document.addEventListener('touchstart', listener);\n\n return () => {\n document.removeEventListener('mousedown', listener);\n document.removeEventListener('touchstart', listener);\n };\n }, [ref, buttonRef, handler]);\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('tooltip');\n\nexport * from './Tooltip';\nexport * from './Popover';\n","import React, { cloneElement, useState } from 'react';\nimport { Manager, Reference, Popper } from 'react-popper';\nimport classNames from 'classnames';\nimport { useRandomId } from '@entur/utils';\nimport { Placement as PopperPlacementProps } from '@popperjs/core';\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport './Tooltip.scss';\n\ntype Modifier = {\n name: string;\n enabled?: boolean;\n requires?: Array<string>;\n requiresIfExists?: Array<string>;\n options?: Record<string, unknown>;\n data?: Record<string, unknown>;\n [key: string]: any;\n};\n\nexport type TooltipProps = {\n /** Plassering av tooltip-en */\n placement:\n | 'top'\n | 'left'\n | 'right'\n | 'bottom-left' // bottom-start\n | 'bottom'\n | 'bottom-right'; // bottom-end\n /** Innholdet i tooltip-boksen */\n content: React.ReactNode;\n /** Elementet som skal ha tooltip-funksjonalitet */\n children: React.ReactElement;\n /** Om tooltipen skal vises */\n isOpen?: boolean;\n /** Ekstra klassenavn for tooltip */\n className?: string;\n /** Åpner ikke tooltip ved hover-events\n * @default false\n */\n disableHoverListener?: boolean;\n /** Åpner ikke tooltip ved focus-events\n * @default false\n */\n disableFocusListener?: boolean;\n /** Viser en lukkeknapp om man kontrollerer åpningen av Tooltip vha `isOpen`\n * @default true\n */\n showCloseButton?: boolean;\n /** Valideringsvariant for Tooltip */\n variant?: 'error';\n /** En array av modifiers som sendes til Popper, rammeverket som brukes til plassering av Tooltip\n * @default [{ name: 'offset', options: { offset: [0, 10]} }]\n */\n popperModifiers?: Modifier[];\n [key: string]: any;\n};\n\nexport const Tooltip: React.FC<TooltipProps> = ({\n placement,\n content,\n children,\n className,\n isOpen = false,\n disableHoverListener = false,\n disableFocusListener = false,\n showCloseButton = true,\n variant,\n popperModifiers = [\n {\n name: 'offset',\n options: { offset: [0, 10] },\n },\n ],\n ...rest\n}) => {\n const [showTooltip, setShowTooltip] = useState(isOpen || false);\n let hoverTimer: NodeJS.Timeout;\n\n const handleOpen: (event: React.MouseEvent) => void = event => {\n event.persist();\n hoverTimer = setTimeout(() => {\n setShowTooltip(true);\n }, 150);\n };\n const onMouseExit: () => void = () => {\n setShowTooltip(false);\n clearTimeout(hoverTimer);\n };\n React.useEffect(() => {\n return () => {\n clearTimeout(hoverTimer);\n };\n });\n\n const tooltipId = useRandomId('eds-tooltip');\n React.useEffect(() => {\n setShowTooltip(isOpen);\n }, [isOpen]);\n\n React.useEffect(() => {\n if (!content) {\n setShowTooltip(false);\n }\n }, [content]);\n\n let popperPlacement = placement as PopperPlacementProps;\n if (placement.includes('-')) {\n if (placement.includes('right')) {\n popperPlacement = placement.replace(\n 'right',\n 'end',\n ) as PopperPlacementProps;\n }\n if (placement.includes('left')) {\n popperPlacement = placement.replace(\n 'left',\n 'start',\n ) as PopperPlacementProps;\n }\n }\n\n const childProps: {\n 'aria-describedby'?: string;\n onFocus?: () => void;\n onBlur?: () => void;\n onMouseEnter?: (e: React.MouseEvent) => void;\n onMouseLeave?: () => void;\n } = {};\n childProps['aria-describedby'] = tooltipId;\n if (!disableFocusListener) {\n childProps.onFocus = () => setShowTooltip(true);\n childProps.onBlur = () => setShowTooltip(false);\n }\n if (!disableHoverListener) {\n childProps.onMouseEnter = e => handleOpen(e);\n childProps.onMouseLeave = () => onMouseExit();\n }\n\n return (\n <Manager>\n <Reference>\n {({ ref }) =>\n cloneElement(children, {\n ref: ref,\n ...childProps,\n })\n }\n </Reference>\n {showTooltip && (\n <Popper\n modifiers={[{ name: 'arrow', enabled: false }, ...popperModifiers]}\n placement={popperPlacement}\n >\n {({ ref, style, placement: popperPlacement }) => (\n <div\n className={classNames(\n 'eds-tooltip',\n className,\n `eds-tooltip--${popperPlacement}`,\n { 'eds-tooltip--error': variant === 'error' },\n )}\n ref={ref}\n style={style}\n role=\"tooltip\"\n id={tooltipId}\n data-placement={popperPlacement}\n {...rest}\n >\n {content}\n {isOpen && showCloseButton && (\n <IconButton\n className=\"eds-tooltip__close-button\"\n onClick={() => setShowTooltip(false)}\n >\n <CloseIcon />\n </IconButton>\n )}\n </div>\n )}\n </Popper>\n )}\n </Manager>\n );\n};\n"],"names":["PopoverContext","createContext","undefined","usePopoverContext","context","useContext","Error","PopoverContent","React","forwardRef","ref","children","showPopover","attributes","styles","props","popoverContentProps","Contrast","className","classNames","style","popper","elementContainsEventTarget","element","event","contains","target","composed","composedPath","find","window","warnAboutMissingStyles","placement","useState","setShowPopover","triggerElement","useRef","contentElement","usePopper","current","modifiers","name","enabled","options","offset","forceUpdate","useEffect","buttonRef","handler","triggerProps","useCallback","onClick","e","preventDefault","prev","listener","document","addEventListener","removeEventListener","closeButtonProps","role","onKeyDown","key","Provider","value","rest","cloneElement","child","Children","only","hoverTimer","content","isOpen","disableHoverListener","disableFocusListener","showCloseButton","variant","popperModifiers","showTooltip","setShowTooltip","clearTimeout","tooltipId","useRandomId","popperPlacement","includes","replace","childProps","onFocus","onBlur","onMouseEnter","persist","setTimeout","onMouseLeave","Manager","Reference","Popper","id","IconButton","CloseIcon"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tooltip.cjs.production.min.js","sources":["../src/Popover.tsx","../src/index.tsx","../src/Tooltip.tsx"],"sourcesContent":["import React, { cloneElement, createContext, useContext } from 'react';\nimport { usePopper } from 'react-popper';\nimport { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\nimport { Contrast } from '@entur/layout';\nimport './Popover.scss';\n\ntype PopoverContentCallbackProps = {\n ref: React.Ref<HTMLDivElement>;\n};\n\ntype PopoverContextProps = {\n showPopover: boolean;\n triggerElement?: React.RefObject<HTMLButtonElement>;\n contentElement: React.RefObject<HTMLDivElement>;\n styles: { [key: string]: React.CSSProperties };\n attributes: { [key: string]: { [key: string]: string } | undefined };\n closeButtonProps: Record<string, unknown>;\n popoverContentProps: (\n e: PopoverContentCallbackProps,\n ) => Record<string, unknown>;\n triggerProps: () => Record<string, unknown>;\n [key: string]: any;\n};\n\nconst PopoverContext = createContext<PopoverContextProps | undefined>(\n undefined,\n);\nconst usePopoverContext = () => {\n const context = useContext(PopoverContext);\n if (context == null) {\n throw Error('usePopoverContext must be used within <Popover/>');\n }\n return context;\n};\n\nexport type PopoverProps = {\n /** Innholdet i Popover */\n children: React.ReactNode;\n /** Plasseringen av Popover\n * @default \"bottom-start\"\n */\n placement?: Placement;\n};\n\nexport const Popover: React.FC<PopoverProps> = ({\n children,\n placement = 'bottom-start',\n}) => {\n const [showPopover, setShowPopover] = React.useState(false);\n const triggerElement = React.useRef(null);\n const contentElement = React.useRef(null);\n\n const { styles, attributes, forceUpdate } = usePopper(\n triggerElement.current,\n contentElement.current,\n {\n modifiers: [\n { name: 'arrow', enabled: false },\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n ],\n placement: placement,\n },\n );\n\n React.useEffect(() => {\n if (forceUpdate) {\n forceUpdate();\n }\n }, [showPopover, forceUpdate]);\n\n const triggerProps = React.useCallback(() => {\n const buttonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(prev => !prev);\n },\n 'aria-haspopup': 'dialog',\n 'aria-expanded': showPopover,\n ref: triggerElement,\n };\n return buttonProps;\n }, [triggerElement, showPopover]);\n\n useOnClickOutside(contentElement, triggerElement, () =>\n setShowPopover(false),\n );\n const closeButtonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(false);\n },\n };\n const popoverContentProps = React.useCallback(() => {\n const contentProps = {\n role: 'dialog',\n 'aria-modal': 'false',\n ref: contentElement,\n onKeyDown: (event: React.KeyboardEvent) => {\n if (event.key === 'Escape') {\n showPopover && setShowPopover(false);\n }\n },\n };\n return contentProps;\n }, [contentElement, showPopover]);\n const contextValue: PopoverContextProps = {\n showPopover,\n triggerElement,\n contentElement,\n styles,\n attributes,\n popoverContentProps,\n closeButtonProps,\n triggerProps,\n };\n return (\n <PopoverContext.Provider value={contextValue}>\n {children}\n </PopoverContext.Provider>\n );\n};\n\nexport type PopoverTriggerProps = {\n /** Knapp som skal brukes for å åpne Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ children }) => {\n const { triggerProps } = usePopoverContext();\n const child = React.Children.only(children) as React.ReactElement<any>;\n return cloneElement(child, triggerProps());\n};\n\nexport type PopoverCloseButtonProps = {\n /** En valgfri knapp som kan legges inn for å lukke Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverCloseButton: React.FC<PopoverCloseButtonProps> = ({\n children,\n ...rest\n}) => {\n const { closeButtonProps } = usePopoverContext();\n return cloneElement(children, { ...closeButtonProps, ...rest });\n};\n\nexport type PopoverContentProps = {\n /**Innholdet til Popover */\n children: React.ReactNode;\n};\n\nexport const PopoverContent = React.forwardRef<\n HTMLDivElement,\n PopoverContentProps\n>(({ children }, ref: React.Ref<HTMLDivElement>) => {\n const { showPopover, attributes, styles, popoverContentProps } =\n usePopoverContext();\n const props = popoverContentProps({ ref });\n return (\n <Contrast\n className={classNames(\n 'eds-popover',\n {\n 'eds-popover--hidden': !showPopover,\n },\n 'eds-contrast',\n )}\n style={styles.popper}\n aria-hidden={!showPopover}\n {...attributes.styles}\n {...props}\n >\n {children}\n </Contrast>\n );\n});\n\nfunction elementContainsEventTarget(element: HTMLElement | null, event: Event) {\n if (!element) {\n return false;\n }\n\n if (element.contains(event.target as Node)) {\n return true;\n }\n\n // For elements inside a Shadow DOM we need to check the composedPath\n if (event.composed && event.composedPath) {\n const contains = event.composedPath().find(target => {\n if (target === window) {\n return false;\n }\n return element.contains(target as Node);\n });\n return contains ? true : false;\n }\n\n return false;\n}\n\nfunction useOnClickOutside(\n ref: React.RefObject<HTMLDivElement>,\n buttonRef: React.RefObject<HTMLButtonElement>,\n handler: () => void,\n) {\n React.useEffect(() => {\n const listener = (event: Event) => {\n if (\n elementContainsEventTarget(ref.current, event) ||\n elementContainsEventTarget(buttonRef.current, event)\n ) {\n return;\n }\n\n handler();\n };\n\n document.addEventListener('mousedown', listener);\n document.addEventListener('touchstart', listener);\n\n return () => {\n document.removeEventListener('mousedown', listener);\n document.removeEventListener('touchstart', listener);\n };\n }, [ref, buttonRef, handler]);\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('tooltip');\n\nexport * from './Tooltip';\nexport * from './Popover';\n","import React, { cloneElement, useState } from 'react';\nimport { Manager, Reference, Popper } from 'react-popper';\nimport classNames from 'classnames';\nimport { useRandomId } from '@entur/utils';\nimport { Placement as PopperPlacementProps } from '@popperjs/core';\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport './Tooltip.scss';\n\ntype Modifier = {\n name: string;\n enabled?: boolean;\n requires?: Array<string>;\n requiresIfExists?: Array<string>;\n options?: Record<string, unknown>;\n data?: Record<string, unknown>;\n [key: string]: any;\n};\n\nexport type TooltipProps = {\n /** Plassering av tooltip-en */\n placement:\n | 'top'\n | 'top-left'\n | 'top-right'\n | 'left'\n | 'right'\n | 'bottom-left' // bottom-start\n | 'bottom'\n | 'bottom-right'; // bottom-end\n /** Innholdet i tooltip-boksen */\n content: React.ReactNode;\n /** Elementet som skal ha tooltip-funksjonalitet */\n children: React.ReactElement;\n /** Om tooltipen skal vises */\n isOpen?: boolean;\n /** Ekstra klassenavn for tooltip */\n className?: string;\n /** Åpner ikke tooltip ved hover-events\n * @default false\n */\n disableHoverListener?: boolean;\n /** Åpner ikke tooltip ved focus-events\n * @default false\n */\n disableFocusListener?: boolean;\n /** Viser en lukkeknapp om man kontrollerer åpningen av Tooltip vha `isOpen`\n * @default true\n */\n showCloseButton?: boolean;\n /** Valideringsvariant for Tooltip */\n variant?: 'error';\n /** En array av modifiers som sendes til Popper, rammeverket som brukes til plassering av Tooltip\n * @default [{ name: 'offset', options: { offset: [0, 10]} }]\n */\n popperModifiers?: Modifier[];\n [key: string]: any;\n};\n\nexport const Tooltip: React.FC<TooltipProps> = ({\n placement,\n content,\n children,\n className,\n isOpen = false,\n disableHoverListener = false,\n disableFocusListener = false,\n showCloseButton = true,\n variant,\n popperModifiers = [\n {\n name: 'offset',\n options: { offset: [0, 10] },\n },\n ],\n ...rest\n}) => {\n const [showTooltip, setShowTooltip] = useState(isOpen || false);\n let hoverTimer: NodeJS.Timeout;\n\n const handleOpen: (event: React.MouseEvent) => void = event => {\n event.persist();\n hoverTimer = setTimeout(() => {\n setShowTooltip(true);\n }, 150);\n };\n const onMouseExit: () => void = () => {\n setShowTooltip(false);\n clearTimeout(hoverTimer);\n };\n React.useEffect(() => {\n return () => {\n clearTimeout(hoverTimer);\n };\n });\n\n const tooltipId = useRandomId('eds-tooltip');\n React.useEffect(() => {\n setShowTooltip(isOpen);\n }, [isOpen]);\n\n React.useEffect(() => {\n if (!content) {\n setShowTooltip(false);\n }\n }, [content]);\n\n let popperPlacement = placement as PopperPlacementProps;\n if (placement.includes('-')) {\n if (placement.includes('right')) {\n popperPlacement = placement.replace(\n 'right',\n 'end',\n ) as PopperPlacementProps;\n }\n if (placement.includes('left')) {\n popperPlacement = placement.replace(\n 'left',\n 'start',\n ) as PopperPlacementProps;\n }\n }\n\n const childProps: {\n 'aria-describedby'?: string;\n onFocus?: () => void;\n onBlur?: () => void;\n onMouseEnter?: (e: React.MouseEvent) => void;\n onMouseLeave?: () => void;\n } = {};\n childProps['aria-describedby'] = tooltipId;\n if (!disableFocusListener) {\n childProps.onFocus = () => setShowTooltip(true);\n childProps.onBlur = () => setShowTooltip(false);\n }\n if (!disableHoverListener) {\n childProps.onMouseEnter = e => handleOpen(e);\n childProps.onMouseLeave = () => onMouseExit();\n }\n\n return (\n <Manager>\n <Reference>\n {({ ref }) =>\n cloneElement(children, {\n ref: ref,\n ...childProps,\n })\n }\n </Reference>\n {showTooltip && (\n <Popper\n modifiers={[{ name: 'arrow', enabled: false }, ...popperModifiers]}\n placement={popperPlacement}\n >\n {({ ref, style, placement: popperPlacement }) => (\n <div\n className={classNames(\n 'eds-tooltip',\n className,\n `eds-tooltip--${popperPlacement}`,\n { 'eds-tooltip--error': variant === 'error' },\n )}\n ref={ref}\n style={style}\n role=\"tooltip\"\n id={tooltipId}\n data-placement={popperPlacement}\n {...rest}\n >\n {content}\n {isOpen && showCloseButton && (\n <IconButton\n className=\"eds-tooltip__close-button\"\n onClick={() => setShowTooltip(false)}\n >\n <CloseIcon />\n </IconButton>\n )}\n </div>\n )}\n </Popper>\n )}\n </Manager>\n );\n};\n"],"names":["PopoverContext","createContext","undefined","usePopoverContext","context","useContext","Error","PopoverContent","React","forwardRef","ref","children","showPopover","attributes","styles","props","popoverContentProps","Contrast","className","classNames","style","popper","elementContainsEventTarget","element","event","contains","target","composed","composedPath","find","window","warnAboutMissingStyles","placement","useState","setShowPopover","triggerElement","useRef","contentElement","usePopper","current","modifiers","name","enabled","options","offset","forceUpdate","useEffect","buttonRef","handler","triggerProps","useCallback","onClick","e","preventDefault","prev","listener","document","addEventListener","removeEventListener","closeButtonProps","role","onKeyDown","key","Provider","value","rest","cloneElement","child","Children","only","hoverTimer","content","isOpen","disableHoverListener","disableFocusListener","showCloseButton","variant","popperModifiers","showTooltip","setShowTooltip","clearTimeout","tooltipId","useRandomId","popperPlacement","includes","replace","childProps","onFocus","onBlur","onMouseEnter","persist","setTimeout","onMouseLeave","Manager","Reference","Popper","id","IconButton","CloseIcon"],"mappings":"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"}
|
package/dist/tooltip.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.esm.js","sources":["../src/Tooltip.tsx","../src/Popover.tsx","../src/index.tsx"],"sourcesContent":["import React, { cloneElement, useState } from 'react';\nimport { Manager, Reference, Popper } from 'react-popper';\nimport classNames from 'classnames';\nimport { useRandomId } from '@entur/utils';\nimport { Placement as PopperPlacementProps } from '@popperjs/core';\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport './Tooltip.scss';\n\ntype Modifier = {\n name: string;\n enabled?: boolean;\n requires?: Array<string>;\n requiresIfExists?: Array<string>;\n options?: Record<string, unknown>;\n data?: Record<string, unknown>;\n [key: string]: any;\n};\n\nexport type TooltipProps = {\n /** Plassering av tooltip-en */\n placement:\n | 'top'\n | 'left'\n | 'right'\n | 'bottom-left' // bottom-start\n | 'bottom'\n | 'bottom-right'; // bottom-end\n /** Innholdet i tooltip-boksen */\n content: React.ReactNode;\n /** Elementet som skal ha tooltip-funksjonalitet */\n children: React.ReactElement;\n /** Om tooltipen skal vises */\n isOpen?: boolean;\n /** Ekstra klassenavn for tooltip */\n className?: string;\n /** Åpner ikke tooltip ved hover-events\n * @default false\n */\n disableHoverListener?: boolean;\n /** Åpner ikke tooltip ved focus-events\n * @default false\n */\n disableFocusListener?: boolean;\n /** Viser en lukkeknapp om man kontrollerer åpningen av Tooltip vha `isOpen`\n * @default true\n */\n showCloseButton?: boolean;\n /** Valideringsvariant for Tooltip */\n variant?: 'error';\n /** En array av modifiers som sendes til Popper, rammeverket som brukes til plassering av Tooltip\n * @default [{ name: 'offset', options: { offset: [0, 10]} }]\n */\n popperModifiers?: Modifier[];\n [key: string]: any;\n};\n\nexport const Tooltip: React.FC<TooltipProps> = ({\n placement,\n content,\n children,\n className,\n isOpen = false,\n disableHoverListener = false,\n disableFocusListener = false,\n showCloseButton = true,\n variant,\n popperModifiers = [\n {\n name: 'offset',\n options: { offset: [0, 10] },\n },\n ],\n ...rest\n}) => {\n const [showTooltip, setShowTooltip] = useState(isOpen || false);\n let hoverTimer: NodeJS.Timeout;\n\n const handleOpen: (event: React.MouseEvent) => void = event => {\n event.persist();\n hoverTimer = setTimeout(() => {\n setShowTooltip(true);\n }, 150);\n };\n const onMouseExit: () => void = () => {\n setShowTooltip(false);\n clearTimeout(hoverTimer);\n };\n React.useEffect(() => {\n return () => {\n clearTimeout(hoverTimer);\n };\n });\n\n const tooltipId = useRandomId('eds-tooltip');\n React.useEffect(() => {\n setShowTooltip(isOpen);\n }, [isOpen]);\n\n React.useEffect(() => {\n if (!content) {\n setShowTooltip(false);\n }\n }, [content]);\n\n let popperPlacement = placement as PopperPlacementProps;\n if (placement.includes('-')) {\n if (placement.includes('right')) {\n popperPlacement = placement.replace(\n 'right',\n 'end',\n ) as PopperPlacementProps;\n }\n if (placement.includes('left')) {\n popperPlacement = placement.replace(\n 'left',\n 'start',\n ) as PopperPlacementProps;\n }\n }\n\n const childProps: {\n 'aria-describedby'?: string;\n onFocus?: () => void;\n onBlur?: () => void;\n onMouseEnter?: (e: React.MouseEvent) => void;\n onMouseLeave?: () => void;\n } = {};\n childProps['aria-describedby'] = tooltipId;\n if (!disableFocusListener) {\n childProps.onFocus = () => setShowTooltip(true);\n childProps.onBlur = () => setShowTooltip(false);\n }\n if (!disableHoverListener) {\n childProps.onMouseEnter = e => handleOpen(e);\n childProps.onMouseLeave = () => onMouseExit();\n }\n\n return (\n <Manager>\n <Reference>\n {({ ref }) =>\n cloneElement(children, {\n ref: ref,\n ...childProps,\n })\n }\n </Reference>\n {showTooltip && (\n <Popper\n modifiers={[{ name: 'arrow', enabled: false }, ...popperModifiers]}\n placement={popperPlacement}\n >\n {({ ref, style, placement: popperPlacement }) => (\n <div\n className={classNames(\n 'eds-tooltip',\n className,\n `eds-tooltip--${popperPlacement}`,\n { 'eds-tooltip--error': variant === 'error' },\n )}\n ref={ref}\n style={style}\n role=\"tooltip\"\n id={tooltipId}\n data-placement={popperPlacement}\n {...rest}\n >\n {content}\n {isOpen && showCloseButton && (\n <IconButton\n className=\"eds-tooltip__close-button\"\n onClick={() => setShowTooltip(false)}\n >\n <CloseIcon />\n </IconButton>\n )}\n </div>\n )}\n </Popper>\n )}\n </Manager>\n );\n};\n","import React, { cloneElement, createContext, useContext } from 'react';\nimport { usePopper } from 'react-popper';\nimport { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\nimport { Contrast } from '@entur/layout';\nimport './Popover.scss';\n\ntype PopoverContentCallbackProps = {\n ref: React.Ref<HTMLDivElement>;\n};\n\ntype PopoverContextProps = {\n showPopover: boolean;\n triggerElement?: React.RefObject<HTMLButtonElement>;\n contentElement: React.RefObject<HTMLDivElement>;\n styles: { [key: string]: React.CSSProperties };\n attributes: { [key: string]: { [key: string]: string } | undefined };\n closeButtonProps: Record<string, unknown>;\n popoverContentProps: (\n e: PopoverContentCallbackProps,\n ) => Record<string, unknown>;\n triggerProps: () => Record<string, unknown>;\n [key: string]: any;\n};\n\nconst PopoverContext = createContext<PopoverContextProps | undefined>(\n undefined,\n);\nconst usePopoverContext = () => {\n const context = useContext(PopoverContext);\n if (context == null) {\n throw Error('usePopoverContext must be used within <Popover/>');\n }\n return context;\n};\n\nexport type PopoverProps = {\n /** Innholdet i Popover */\n children: React.ReactNode;\n /** Plasseringen av Popover\n * @default \"bottom-start\"\n */\n placement?: Placement;\n};\n\nexport const Popover: React.FC<PopoverProps> = ({\n children,\n placement = 'bottom-start',\n}) => {\n const [showPopover, setShowPopover] = React.useState(false);\n const triggerElement = React.useRef(null);\n const contentElement = React.useRef(null);\n\n const { styles, attributes, forceUpdate } = usePopper(\n triggerElement.current,\n contentElement.current,\n {\n modifiers: [\n { name: 'arrow', enabled: false },\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n ],\n placement: placement,\n },\n );\n\n React.useEffect(() => {\n if (forceUpdate) {\n forceUpdate();\n }\n }, [showPopover, forceUpdate]);\n\n const triggerProps = React.useCallback(() => {\n const buttonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(prev => !prev);\n },\n 'aria-haspopup': 'dialog',\n 'aria-expanded': showPopover,\n ref: triggerElement,\n };\n return buttonProps;\n }, [triggerElement, showPopover]);\n\n useOnClickOutside(contentElement, triggerElement, () =>\n setShowPopover(false),\n );\n const closeButtonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(false);\n },\n };\n const popoverContentProps = React.useCallback(() => {\n const contentProps = {\n role: 'dialog',\n 'aria-modal': 'false',\n ref: contentElement,\n onKeyDown: (event: React.KeyboardEvent) => {\n if (event.key === 'Escape') {\n showPopover && setShowPopover(false);\n }\n },\n };\n return contentProps;\n }, [contentElement, showPopover]);\n const contextValue: PopoverContextProps = {\n showPopover,\n triggerElement,\n contentElement,\n styles,\n attributes,\n popoverContentProps,\n closeButtonProps,\n triggerProps,\n };\n return (\n <PopoverContext.Provider value={contextValue}>\n {children}\n </PopoverContext.Provider>\n );\n};\n\nexport type PopoverTriggerProps = {\n /** Knapp som skal brukes for å åpne Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ children }) => {\n const { triggerProps } = usePopoverContext();\n const child = React.Children.only(children) as React.ReactElement<any>;\n return cloneElement(child, triggerProps());\n};\n\nexport type PopoverCloseButtonProps = {\n /** En valgfri knapp som kan legges inn for å lukke Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverCloseButton: React.FC<PopoverCloseButtonProps> = ({\n children,\n ...rest\n}) => {\n const { closeButtonProps } = usePopoverContext();\n return cloneElement(children, { ...closeButtonProps, ...rest });\n};\n\nexport type PopoverContentProps = {\n /**Innholdet til Popover */\n children: React.ReactNode;\n};\n\nexport const PopoverContent = React.forwardRef<\n HTMLDivElement,\n PopoverContentProps\n>(({ children }, ref: React.Ref<HTMLDivElement>) => {\n const { showPopover, attributes, styles, popoverContentProps } =\n usePopoverContext();\n const props = popoverContentProps({ ref });\n return (\n <Contrast\n className={classNames(\n 'eds-popover',\n {\n 'eds-popover--hidden': !showPopover,\n },\n 'eds-contrast',\n )}\n style={styles.popper}\n aria-hidden={!showPopover}\n {...attributes.styles}\n {...props}\n >\n {children}\n </Contrast>\n );\n});\n\nfunction elementContainsEventTarget(element: HTMLElement | null, event: Event) {\n if (!element) {\n return false;\n }\n\n if (element.contains(event.target as Node)) {\n return true;\n }\n\n // For elements inside a Shadow DOM we need to check the composedPath\n if (event.composed && event.composedPath) {\n const contains = event.composedPath().find(target => {\n if (target === window) {\n return false;\n }\n return element.contains(target as Node);\n });\n return contains ? true : false;\n }\n\n return false;\n}\n\nfunction useOnClickOutside(\n ref: React.RefObject<HTMLDivElement>,\n buttonRef: React.RefObject<HTMLButtonElement>,\n handler: () => void,\n) {\n React.useEffect(() => {\n const listener = (event: Event) => {\n if (\n elementContainsEventTarget(ref.current, event) ||\n elementContainsEventTarget(buttonRef.current, event)\n ) {\n return;\n }\n\n handler();\n };\n\n document.addEventListener('mousedown', listener);\n document.addEventListener('touchstart', listener);\n\n return () => {\n document.removeEventListener('mousedown', listener);\n document.removeEventListener('touchstart', listener);\n };\n }, [ref, buttonRef, handler]);\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('tooltip');\n\nexport * from './Tooltip';\nexport * from './Popover';\n"],"names":["Tooltip","placement","content","children","className","isOpen","disableHoverListener","disableFocusListener","showCloseButton","variant","popperModifiers","name","options","offset","rest","useState","showTooltip","setShowTooltip","hoverTimer","handleOpen","event","persist","setTimeout","onMouseExit","clearTimeout","React","useEffect","tooltipId","useRandomId","popperPlacement","includes","replace","childProps","onFocus","onBlur","onMouseEnter","e","onMouseLeave","Manager","Reference","ref","cloneElement","Popper","modifiers","enabled","style","classNames","role","id","IconButton","onClick","CloseIcon","PopoverContext","createContext","undefined","usePopoverContext","context","useContext","Error","Popover","showPopover","setShowPopover","triggerElement","useRef","contentElement","usePopper","current","styles","attributes","forceUpdate","triggerProps","useCallback","buttonProps","preventDefault","prev","useOnClickOutside","closeButtonProps","popoverContentProps","contentProps","onKeyDown","key","contextValue","Provider","value","PopoverTrigger","child","Children","only","PopoverCloseButton","PopoverContent","forwardRef","props","Contrast","popper","elementContainsEventTarget","element","contains","target","composed","composedPath","find","window","buttonRef","handler","listener","document","addEventListener","removeEventListener","warnAboutMissingStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tooltip.esm.js","sources":["../src/Tooltip.tsx","../src/Popover.tsx","../src/index.tsx"],"sourcesContent":["import React, { cloneElement, useState } from 'react';\nimport { Manager, Reference, Popper } from 'react-popper';\nimport classNames from 'classnames';\nimport { useRandomId } from '@entur/utils';\nimport { Placement as PopperPlacementProps } from '@popperjs/core';\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport './Tooltip.scss';\n\ntype Modifier = {\n name: string;\n enabled?: boolean;\n requires?: Array<string>;\n requiresIfExists?: Array<string>;\n options?: Record<string, unknown>;\n data?: Record<string, unknown>;\n [key: string]: any;\n};\n\nexport type TooltipProps = {\n /** Plassering av tooltip-en */\n placement:\n | 'top'\n | 'top-left'\n | 'top-right'\n | 'left'\n | 'right'\n | 'bottom-left' // bottom-start\n | 'bottom'\n | 'bottom-right'; // bottom-end\n /** Innholdet i tooltip-boksen */\n content: React.ReactNode;\n /** Elementet som skal ha tooltip-funksjonalitet */\n children: React.ReactElement;\n /** Om tooltipen skal vises */\n isOpen?: boolean;\n /** Ekstra klassenavn for tooltip */\n className?: string;\n /** Åpner ikke tooltip ved hover-events\n * @default false\n */\n disableHoverListener?: boolean;\n /** Åpner ikke tooltip ved focus-events\n * @default false\n */\n disableFocusListener?: boolean;\n /** Viser en lukkeknapp om man kontrollerer åpningen av Tooltip vha `isOpen`\n * @default true\n */\n showCloseButton?: boolean;\n /** Valideringsvariant for Tooltip */\n variant?: 'error';\n /** En array av modifiers som sendes til Popper, rammeverket som brukes til plassering av Tooltip\n * @default [{ name: 'offset', options: { offset: [0, 10]} }]\n */\n popperModifiers?: Modifier[];\n [key: string]: any;\n};\n\nexport const Tooltip: React.FC<TooltipProps> = ({\n placement,\n content,\n children,\n className,\n isOpen = false,\n disableHoverListener = false,\n disableFocusListener = false,\n showCloseButton = true,\n variant,\n popperModifiers = [\n {\n name: 'offset',\n options: { offset: [0, 10] },\n },\n ],\n ...rest\n}) => {\n const [showTooltip, setShowTooltip] = useState(isOpen || false);\n let hoverTimer: NodeJS.Timeout;\n\n const handleOpen: (event: React.MouseEvent) => void = event => {\n event.persist();\n hoverTimer = setTimeout(() => {\n setShowTooltip(true);\n }, 150);\n };\n const onMouseExit: () => void = () => {\n setShowTooltip(false);\n clearTimeout(hoverTimer);\n };\n React.useEffect(() => {\n return () => {\n clearTimeout(hoverTimer);\n };\n });\n\n const tooltipId = useRandomId('eds-tooltip');\n React.useEffect(() => {\n setShowTooltip(isOpen);\n }, [isOpen]);\n\n React.useEffect(() => {\n if (!content) {\n setShowTooltip(false);\n }\n }, [content]);\n\n let popperPlacement = placement as PopperPlacementProps;\n if (placement.includes('-')) {\n if (placement.includes('right')) {\n popperPlacement = placement.replace(\n 'right',\n 'end',\n ) as PopperPlacementProps;\n }\n if (placement.includes('left')) {\n popperPlacement = placement.replace(\n 'left',\n 'start',\n ) as PopperPlacementProps;\n }\n }\n\n const childProps: {\n 'aria-describedby'?: string;\n onFocus?: () => void;\n onBlur?: () => void;\n onMouseEnter?: (e: React.MouseEvent) => void;\n onMouseLeave?: () => void;\n } = {};\n childProps['aria-describedby'] = tooltipId;\n if (!disableFocusListener) {\n childProps.onFocus = () => setShowTooltip(true);\n childProps.onBlur = () => setShowTooltip(false);\n }\n if (!disableHoverListener) {\n childProps.onMouseEnter = e => handleOpen(e);\n childProps.onMouseLeave = () => onMouseExit();\n }\n\n return (\n <Manager>\n <Reference>\n {({ ref }) =>\n cloneElement(children, {\n ref: ref,\n ...childProps,\n })\n }\n </Reference>\n {showTooltip && (\n <Popper\n modifiers={[{ name: 'arrow', enabled: false }, ...popperModifiers]}\n placement={popperPlacement}\n >\n {({ ref, style, placement: popperPlacement }) => (\n <div\n className={classNames(\n 'eds-tooltip',\n className,\n `eds-tooltip--${popperPlacement}`,\n { 'eds-tooltip--error': variant === 'error' },\n )}\n ref={ref}\n style={style}\n role=\"tooltip\"\n id={tooltipId}\n data-placement={popperPlacement}\n {...rest}\n >\n {content}\n {isOpen && showCloseButton && (\n <IconButton\n className=\"eds-tooltip__close-button\"\n onClick={() => setShowTooltip(false)}\n >\n <CloseIcon />\n </IconButton>\n )}\n </div>\n )}\n </Popper>\n )}\n </Manager>\n );\n};\n","import React, { cloneElement, createContext, useContext } from 'react';\nimport { usePopper } from 'react-popper';\nimport { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\nimport { Contrast } from '@entur/layout';\nimport './Popover.scss';\n\ntype PopoverContentCallbackProps = {\n ref: React.Ref<HTMLDivElement>;\n};\n\ntype PopoverContextProps = {\n showPopover: boolean;\n triggerElement?: React.RefObject<HTMLButtonElement>;\n contentElement: React.RefObject<HTMLDivElement>;\n styles: { [key: string]: React.CSSProperties };\n attributes: { [key: string]: { [key: string]: string } | undefined };\n closeButtonProps: Record<string, unknown>;\n popoverContentProps: (\n e: PopoverContentCallbackProps,\n ) => Record<string, unknown>;\n triggerProps: () => Record<string, unknown>;\n [key: string]: any;\n};\n\nconst PopoverContext = createContext<PopoverContextProps | undefined>(\n undefined,\n);\nconst usePopoverContext = () => {\n const context = useContext(PopoverContext);\n if (context == null) {\n throw Error('usePopoverContext must be used within <Popover/>');\n }\n return context;\n};\n\nexport type PopoverProps = {\n /** Innholdet i Popover */\n children: React.ReactNode;\n /** Plasseringen av Popover\n * @default \"bottom-start\"\n */\n placement?: Placement;\n};\n\nexport const Popover: React.FC<PopoverProps> = ({\n children,\n placement = 'bottom-start',\n}) => {\n const [showPopover, setShowPopover] = React.useState(false);\n const triggerElement = React.useRef(null);\n const contentElement = React.useRef(null);\n\n const { styles, attributes, forceUpdate } = usePopper(\n triggerElement.current,\n contentElement.current,\n {\n modifiers: [\n { name: 'arrow', enabled: false },\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n ],\n placement: placement,\n },\n );\n\n React.useEffect(() => {\n if (forceUpdate) {\n forceUpdate();\n }\n }, [showPopover, forceUpdate]);\n\n const triggerProps = React.useCallback(() => {\n const buttonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(prev => !prev);\n },\n 'aria-haspopup': 'dialog',\n 'aria-expanded': showPopover,\n ref: triggerElement,\n };\n return buttonProps;\n }, [triggerElement, showPopover]);\n\n useOnClickOutside(contentElement, triggerElement, () =>\n setShowPopover(false),\n );\n const closeButtonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(false);\n },\n };\n const popoverContentProps = React.useCallback(() => {\n const contentProps = {\n role: 'dialog',\n 'aria-modal': 'false',\n ref: contentElement,\n onKeyDown: (event: React.KeyboardEvent) => {\n if (event.key === 'Escape') {\n showPopover && setShowPopover(false);\n }\n },\n };\n return contentProps;\n }, [contentElement, showPopover]);\n const contextValue: PopoverContextProps = {\n showPopover,\n triggerElement,\n contentElement,\n styles,\n attributes,\n popoverContentProps,\n closeButtonProps,\n triggerProps,\n };\n return (\n <PopoverContext.Provider value={contextValue}>\n {children}\n </PopoverContext.Provider>\n );\n};\n\nexport type PopoverTriggerProps = {\n /** Knapp som skal brukes for å åpne Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ children }) => {\n const { triggerProps } = usePopoverContext();\n const child = React.Children.only(children) as React.ReactElement<any>;\n return cloneElement(child, triggerProps());\n};\n\nexport type PopoverCloseButtonProps = {\n /** En valgfri knapp som kan legges inn for å lukke Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverCloseButton: React.FC<PopoverCloseButtonProps> = ({\n children,\n ...rest\n}) => {\n const { closeButtonProps } = usePopoverContext();\n return cloneElement(children, { ...closeButtonProps, ...rest });\n};\n\nexport type PopoverContentProps = {\n /**Innholdet til Popover */\n children: React.ReactNode;\n};\n\nexport const PopoverContent = React.forwardRef<\n HTMLDivElement,\n PopoverContentProps\n>(({ children }, ref: React.Ref<HTMLDivElement>) => {\n const { showPopover, attributes, styles, popoverContentProps } =\n usePopoverContext();\n const props = popoverContentProps({ ref });\n return (\n <Contrast\n className={classNames(\n 'eds-popover',\n {\n 'eds-popover--hidden': !showPopover,\n },\n 'eds-contrast',\n )}\n style={styles.popper}\n aria-hidden={!showPopover}\n {...attributes.styles}\n {...props}\n >\n {children}\n </Contrast>\n );\n});\n\nfunction elementContainsEventTarget(element: HTMLElement | null, event: Event) {\n if (!element) {\n return false;\n }\n\n if (element.contains(event.target as Node)) {\n return true;\n }\n\n // For elements inside a Shadow DOM we need to check the composedPath\n if (event.composed && event.composedPath) {\n const contains = event.composedPath().find(target => {\n if (target === window) {\n return false;\n }\n return element.contains(target as Node);\n });\n return contains ? true : false;\n }\n\n return false;\n}\n\nfunction useOnClickOutside(\n ref: React.RefObject<HTMLDivElement>,\n buttonRef: React.RefObject<HTMLButtonElement>,\n handler: () => void,\n) {\n React.useEffect(() => {\n const listener = (event: Event) => {\n if (\n elementContainsEventTarget(ref.current, event) ||\n elementContainsEventTarget(buttonRef.current, event)\n ) {\n return;\n }\n\n handler();\n };\n\n document.addEventListener('mousedown', listener);\n document.addEventListener('touchstart', listener);\n\n return () => {\n document.removeEventListener('mousedown', listener);\n document.removeEventListener('touchstart', listener);\n };\n }, [ref, buttonRef, handler]);\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('tooltip');\n\nexport * from './Tooltip';\nexport * from './Popover';\n"],"names":["Tooltip","placement","content","children","className","isOpen","disableHoverListener","disableFocusListener","showCloseButton","variant","popperModifiers","name","options","offset","rest","useState","showTooltip","setShowTooltip","hoverTimer","handleOpen","event","persist","setTimeout","onMouseExit","clearTimeout","React","useEffect","tooltipId","useRandomId","popperPlacement","includes","replace","childProps","onFocus","onBlur","onMouseEnter","e","onMouseLeave","Manager","Reference","ref","cloneElement","Popper","modifiers","enabled","style","classNames","role","id","IconButton","onClick","CloseIcon","PopoverContext","createContext","undefined","usePopoverContext","context","useContext","Error","Popover","showPopover","setShowPopover","triggerElement","useRef","contentElement","usePopper","current","styles","attributes","forceUpdate","triggerProps","useCallback","buttonProps","preventDefault","prev","useOnClickOutside","closeButtonProps","popoverContentProps","contentProps","onKeyDown","key","contextValue","Provider","value","PopoverTrigger","child","Children","only","PopoverCloseButton","PopoverContent","forwardRef","props","Contrast","popper","elementContainsEventTarget","element","contains","target","composed","composedPath","find","window","buttonRef","handler","listener","document","addEventListener","removeEventListener","warnAboutMissingStyles"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/tooltip",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.5.0",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/tooltip.esm.js",
|
|
@@ -27,15 +27,15 @@
|
|
|
27
27
|
"react-dom": ">=16.8.0"
|
|
28
28
|
},
|
|
29
29
|
"devDependencies": {
|
|
30
|
-
"@entur/tokens": "^3.
|
|
30
|
+
"@entur/tokens": "^3.3.0"
|
|
31
31
|
},
|
|
32
32
|
"dependencies": {
|
|
33
|
-
"@entur/button": "^2.7.
|
|
34
|
-
"@entur/icons": "^3.
|
|
35
|
-
"@entur/layout": "^2.1.
|
|
33
|
+
"@entur/button": "^2.7.4",
|
|
34
|
+
"@entur/icons": "^3.4.0",
|
|
35
|
+
"@entur/layout": "^2.1.3",
|
|
36
36
|
"@entur/utils": "^0.4.2",
|
|
37
37
|
"@popperjs/core": "^2.10.1",
|
|
38
38
|
"react-popper": "^2.2.5"
|
|
39
39
|
},
|
|
40
|
-
"gitHead": "
|
|
40
|
+
"gitHead": "4344fc544585636bf5e7f20a1783cb1807082081"
|
|
41
41
|
}
|