@entur/tooltip 5.2.13-beta.3 → 5.2.13-beta.4
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/dist/Popover.d.ts +33 -0
- package/dist/Tooltip.d.ts +62 -0
- package/dist/index.d.ts +4 -108
- package/dist/index.js +8 -0
- package/dist/styles.css +672 -606
- package/dist/tooltip.cjs.development.js +347 -0
- package/dist/tooltip.cjs.development.js.map +1 -0
- package/dist/tooltip.cjs.production.min.js +2 -0
- package/dist/tooltip.cjs.production.min.js.map +1 -0
- package/dist/tooltip.esm.js +278 -248
- package/dist/tooltip.esm.js.map +1 -1
- package/dist/utils.d.ts +3 -0
- package/package.json +16 -26
- package/dist/tooltip.cjs.js +0 -308
- package/dist/tooltip.cjs.js.map +0 -1
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Placement } from './utils';
|
|
3
|
+
import './Popover.scss';
|
|
4
|
+
export type PopoverProps = {
|
|
5
|
+
/** Innholdet i Popover */
|
|
6
|
+
children: React.ReactNode;
|
|
7
|
+
/** Plasseringen av Popover
|
|
8
|
+
* @default "bottom-start"
|
|
9
|
+
*/
|
|
10
|
+
placement?: Placement;
|
|
11
|
+
/** Hvis du ønsker å styre state selv kan du sende inn state her */
|
|
12
|
+
showPopover?: boolean;
|
|
13
|
+
/** Hvis du ønsker å styre state selv kan du sende inn setState her */
|
|
14
|
+
setShowPopover?: React.Dispatch<React.SetStateAction<boolean>>;
|
|
15
|
+
};
|
|
16
|
+
export declare const Popover: React.FC<PopoverProps>;
|
|
17
|
+
export type PopoverTriggerProps = {
|
|
18
|
+
/** Knapp som skal brukes for å åpne Popover */
|
|
19
|
+
children: React.ReactElement;
|
|
20
|
+
};
|
|
21
|
+
export declare const PopoverTrigger: React.FC<PopoverTriggerProps>;
|
|
22
|
+
export type PopoverCloseButtonProps = {
|
|
23
|
+
/** En valgfri knapp som kan legges inn for å lukke Popover */
|
|
24
|
+
children: React.ReactElement;
|
|
25
|
+
};
|
|
26
|
+
export declare const PopoverCloseButton: React.FC<PopoverCloseButtonProps>;
|
|
27
|
+
export type PopoverContentProps = {
|
|
28
|
+
/**Innholdet til Popover */
|
|
29
|
+
children: React.ReactNode;
|
|
30
|
+
className?: string;
|
|
31
|
+
style?: React.CSSProperties;
|
|
32
|
+
};
|
|
33
|
+
export declare const PopoverContent: React.ForwardRefExoticComponent<PopoverContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Placement } from './utils';
|
|
3
|
+
import './Tooltip.scss';
|
|
4
|
+
type Modifier = {
|
|
5
|
+
name: string;
|
|
6
|
+
enabled?: boolean;
|
|
7
|
+
requires?: Array<string>;
|
|
8
|
+
requiresIfExists?: Array<string>;
|
|
9
|
+
options?: Record<string, unknown>;
|
|
10
|
+
data?: Record<string, unknown>;
|
|
11
|
+
[key: string]: any;
|
|
12
|
+
};
|
|
13
|
+
/** @deprecated use variant="negative" instead */
|
|
14
|
+
declare const error = "error";
|
|
15
|
+
export type TooltipProps = {
|
|
16
|
+
/** Plassering av tooltip-en */
|
|
17
|
+
placement: Placement;
|
|
18
|
+
/** Innholdet i tooltip-boksen */
|
|
19
|
+
content: React.ReactNode;
|
|
20
|
+
/** Elementet som skal ha tooltip-funksjonalitet */
|
|
21
|
+
children: React.ReactElement;
|
|
22
|
+
/** Om tooltip-en skal vises */
|
|
23
|
+
isOpen?: boolean;
|
|
24
|
+
/** Callback-funksjon for når brukeren trykker på lukk-tooltip-knappen
|
|
25
|
+
* @default () => undefined;
|
|
26
|
+
*/
|
|
27
|
+
onClickCloseButton?: () => void;
|
|
28
|
+
/** Ekstra klassenavn for tooltip */
|
|
29
|
+
className?: string;
|
|
30
|
+
/** Åpner ikke tooltip ved hover-events
|
|
31
|
+
* @default false
|
|
32
|
+
*/
|
|
33
|
+
disableHoverListener?: boolean;
|
|
34
|
+
/** Åpner ikke tooltip ved focus-events
|
|
35
|
+
* @default false
|
|
36
|
+
*/
|
|
37
|
+
disableFocusListener?: boolean;
|
|
38
|
+
disableKeyboardListener?: boolean;
|
|
39
|
+
disableClickListner?: boolean;
|
|
40
|
+
/** Viser en lukkeknapp om man kontrollerer åpningen av Tooltip vha `isOpen`
|
|
41
|
+
* @default true
|
|
42
|
+
*/
|
|
43
|
+
showCloseButton?: boolean;
|
|
44
|
+
/** Valideringsvariant for Tooltip */
|
|
45
|
+
variant?: 'negative' | typeof error;
|
|
46
|
+
/** For å kontrollere tiden i millisekunder det tar før tooltip-en
|
|
47
|
+
* vises etter hover, og hvor lang tid det tar før den lukkes etter
|
|
48
|
+
* hover-slutt.
|
|
49
|
+
* @default { enter: 150, leave: 300 }
|
|
50
|
+
*/
|
|
51
|
+
hoverDelay?: {
|
|
52
|
+
enter?: number;
|
|
53
|
+
leave?: number;
|
|
54
|
+
};
|
|
55
|
+
/** @deprecated Ikke lenger støttet. Meld fra på #talk-designsystem hvis du trenger støtte for
|
|
56
|
+
* overskrivinger av plasseringen til Tooltip!
|
|
57
|
+
*/
|
|
58
|
+
popperModifiers?: Modifier[];
|
|
59
|
+
[key: string]: any;
|
|
60
|
+
};
|
|
61
|
+
export declare const Tooltip: React.FC<TooltipProps>;
|
|
62
|
+
export {};
|
package/dist/index.d.ts
CHANGED
|
@@ -1,108 +1,4 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
declare const error = "error";
|
|
6
|
-
|
|
7
|
-
declare type Modifier = {
|
|
8
|
-
name: string;
|
|
9
|
-
enabled?: boolean;
|
|
10
|
-
requires?: Array<string>;
|
|
11
|
-
requiresIfExists?: Array<string>;
|
|
12
|
-
options?: Record<string, unknown>;
|
|
13
|
-
data?: Record<string, unknown>;
|
|
14
|
-
[key: string]: any;
|
|
15
|
-
};
|
|
16
|
-
|
|
17
|
-
export declare type Placement = 'top' | 'top-left' | 'top-start' | 'top-right' | 'top-end' | 'left' | 'right' | 'bottom-left' | 'bottom-start' | 'bottom' | 'bottom-right' | 'bottom-end';
|
|
18
|
-
|
|
19
|
-
export declare const Popover: default_2.FC<PopoverProps>;
|
|
20
|
-
|
|
21
|
-
export declare const PopoverCloseButton: default_2.FC<PopoverCloseButtonProps>;
|
|
22
|
-
|
|
23
|
-
export declare type PopoverCloseButtonProps = {
|
|
24
|
-
/** En valgfri knapp som kan legges inn for å lukke Popover */
|
|
25
|
-
children: default_2.ReactElement;
|
|
26
|
-
};
|
|
27
|
-
|
|
28
|
-
export declare const PopoverContent: default_2.ForwardRefExoticComponent<PopoverContentProps & default_2.RefAttributes<HTMLDivElement>>;
|
|
29
|
-
|
|
30
|
-
export declare type PopoverContentProps = {
|
|
31
|
-
/**Innholdet til Popover */
|
|
32
|
-
children: default_2.ReactNode;
|
|
33
|
-
className?: string;
|
|
34
|
-
style?: default_2.CSSProperties;
|
|
35
|
-
};
|
|
36
|
-
|
|
37
|
-
export declare type PopoverProps = {
|
|
38
|
-
/** Innholdet i Popover */
|
|
39
|
-
children: default_2.ReactNode;
|
|
40
|
-
/** Plasseringen av Popover
|
|
41
|
-
* @default "bottom-start"
|
|
42
|
-
*/
|
|
43
|
-
placement?: Placement;
|
|
44
|
-
/** Hvis du ønsker å styre state selv kan du sende inn state her */
|
|
45
|
-
showPopover?: boolean;
|
|
46
|
-
/** Hvis du ønsker å styre state selv kan du sende inn setState her */
|
|
47
|
-
setShowPopover?: default_2.Dispatch<default_2.SetStateAction<boolean>>;
|
|
48
|
-
};
|
|
49
|
-
|
|
50
|
-
export declare const PopoverTrigger: default_2.FC<PopoverTriggerProps>;
|
|
51
|
-
|
|
52
|
-
export declare type PopoverTriggerProps = {
|
|
53
|
-
/** Knapp som skal brukes for å åpne Popover */
|
|
54
|
-
children: default_2.ReactElement;
|
|
55
|
-
};
|
|
56
|
-
|
|
57
|
-
export declare function standardisePlacement(placement: string): Placement_2;
|
|
58
|
-
|
|
59
|
-
export declare const Tooltip: default_2.FC<TooltipProps>;
|
|
60
|
-
|
|
61
|
-
export declare type TooltipProps = {
|
|
62
|
-
/** Plassering av tooltip-en */
|
|
63
|
-
placement: Placement;
|
|
64
|
-
/** Innholdet i tooltip-boksen */
|
|
65
|
-
content: default_2.ReactNode;
|
|
66
|
-
/** Elementet som skal ha tooltip-funksjonalitet */
|
|
67
|
-
children: default_2.ReactElement;
|
|
68
|
-
/** Om tooltip-en skal vises */
|
|
69
|
-
isOpen?: boolean;
|
|
70
|
-
/** Callback-funksjon for når brukeren trykker på lukk-tooltip-knappen
|
|
71
|
-
* @default () => undefined;
|
|
72
|
-
*/
|
|
73
|
-
onClickCloseButton?: () => void;
|
|
74
|
-
/** Ekstra klassenavn for tooltip */
|
|
75
|
-
className?: string;
|
|
76
|
-
/** Åpner ikke tooltip ved hover-events
|
|
77
|
-
* @default false
|
|
78
|
-
*/
|
|
79
|
-
disableHoverListener?: boolean;
|
|
80
|
-
/** Åpner ikke tooltip ved focus-events
|
|
81
|
-
* @default false
|
|
82
|
-
*/
|
|
83
|
-
disableFocusListener?: boolean;
|
|
84
|
-
disableKeyboardListener?: boolean;
|
|
85
|
-
disableClickListner?: boolean;
|
|
86
|
-
/** Viser en lukkeknapp om man kontrollerer åpningen av Tooltip vha `isOpen`
|
|
87
|
-
* @default true
|
|
88
|
-
*/
|
|
89
|
-
showCloseButton?: boolean;
|
|
90
|
-
/** Valideringsvariant for Tooltip */
|
|
91
|
-
variant?: 'negative' | typeof error;
|
|
92
|
-
/** For å kontrollere tiden i millisekunder det tar før tooltip-en
|
|
93
|
-
* vises etter hover, og hvor lang tid det tar før den lukkes etter
|
|
94
|
-
* hover-slutt.
|
|
95
|
-
* @default { enter: 150, leave: 300 }
|
|
96
|
-
*/
|
|
97
|
-
hoverDelay?: {
|
|
98
|
-
enter?: number;
|
|
99
|
-
leave?: number;
|
|
100
|
-
};
|
|
101
|
-
/** @deprecated Ikke lenger støttet. Meld fra på #talk-designsystem hvis du trenger støtte for
|
|
102
|
-
* overskrivinger av plasseringen til Tooltip!
|
|
103
|
-
*/
|
|
104
|
-
popperModifiers?: Modifier[];
|
|
105
|
-
[key: string]: any;
|
|
106
|
-
};
|
|
107
|
-
|
|
108
|
-
export { }
|
|
1
|
+
import './index.scss';
|
|
2
|
+
export * from './Tooltip';
|
|
3
|
+
export * from './Popover';
|
|
4
|
+
export { Placement, standardisePlacement } from './utils';
|