@instructure/ui-tooltip 8.13.1-snapshot.9 → 8.14.1-snapshot.15

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.
Files changed (17) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/es/Tooltip/TooltipLocator.js +4 -2
  3. package/es/Tooltip/index.js +33 -36
  4. package/es/Tooltip/props.js +0 -69
  5. package/lib/Tooltip/TooltipLocator.js +3 -1
  6. package/lib/Tooltip/index.js +33 -36
  7. package/lib/Tooltip/props.js +0 -69
  8. package/package.json +16 -16
  9. package/src/Tooltip/index.tsx +21 -20
  10. package/src/Tooltip/props.ts +103 -52
  11. package/tsconfig.build.json +20 -2
  12. package/tsconfig.build.tsbuildinfo +1 -0
  13. package/types/Tooltip/TooltipLocator.d.ts +52 -52
  14. package/types/Tooltip/index.d.ts +24 -25
  15. package/types/Tooltip/index.d.ts.map +1 -1
  16. package/types/Tooltip/props.d.ts +72 -9
  17. package/types/Tooltip/props.d.ts.map +1 -1
package/types/Tooltip/TooltipLocator.d.ts CHANGED
@@ -29,25 +29,15 @@ export declare const TooltipLocator: {
29
29
  toString: (maxLength?: number | undefined, options?: {
30
30
  highlight: boolean;
31
31
  } | undefined) => string;
32
- contains: (elementOrSelector?: string | Element | undefined) => boolean | Element;
33
- children: (selector: string) => Element[];
34
- title: () => string | null | undefined;
35
- id: () => string;
36
- tagName: () => string;
37
- getAttribute: (qualifiedName: string) => string | null;
38
- getBoundingClientRect: () => DOMRect;
39
- matches: (selector: string | undefined) => boolean;
40
32
  visible: () => boolean;
41
- value: () => string | null;
42
- disabled: () => string | null;
43
- role: () => string | null;
44
- label: () => string | null | undefined;
45
33
  getId: () => string;
46
34
  getOwnerWindow: () => (Window & typeof globalThis) | null;
47
35
  getOwnerDocument: () => Document;
48
36
  getComputedStyle: () => CSSStyleDeclaration;
49
37
  getTagName: () => string;
38
+ tagName: () => string;
50
39
  typeIn: (text: string) => Promise<void>;
40
+ getAttribute: (qualifiedName: string) => string | null;
51
41
  getDOMNode: () => Element;
52
42
  node: () => Element;
53
43
  debug: (maxLength?: number | undefined, options?: {
@@ -57,6 +47,7 @@ export declare const TooltipLocator: {
57
47
  getTextContent: () => string | null;
58
48
  getParentNode: () => ParentNode | null;
59
49
  parent: () => ParentNode | null;
50
+ getBoundingClientRect: () => DOMRect;
60
51
  rect: () => DOMRect;
61
52
  hasClass: (classname: string) => boolean;
62
53
  containsFocus: () => boolean;
@@ -68,17 +59,25 @@ export declare const TooltipLocator: {
68
59
  exists: () => boolean;
69
60
  text: () => string | null;
70
61
  empty: () => boolean;
62
+ contains: (elementOrSelector?: string | Element | undefined) => boolean | Element;
71
63
  descendants: (selector: string) => Element[];
72
64
  ancestors: (selector: string) => ParentNode[];
73
65
  attribute: (qualifiedName: string) => string | null;
74
66
  style: (property: string) => string;
75
67
  classNames: () => string[];
68
+ id: () => string;
69
+ matches: (selector: string | undefined) => boolean;
76
70
  checked: () => any;
77
71
  selected: () => any;
72
+ disabled: () => string | null;
78
73
  readonly: () => any;
74
+ role: () => string | null;
75
+ value: () => string | null;
76
+ label: () => string | null | undefined;
77
+ title: () => string | null | undefined;
78
+ children: (selector: string) => Element[];
79
79
  parents: (selector: string) => ParentNode[];
80
80
  } & {
81
- scroll: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
82
81
  copy: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
83
82
  cut: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
84
83
  paste: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
@@ -116,6 +115,7 @@ export declare const TooltipLocator: {
116
115
  touchEnd: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
117
116
  touchMove: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
118
117
  touchStart: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
118
+ scroll: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
119
119
  wheel: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
120
120
  abort: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
121
121
  canPlay: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
@@ -171,25 +171,15 @@ export declare const TooltipLocator: {
171
171
  toString: (maxLength?: number | undefined, options?: {
172
172
  highlight: boolean;
173
173
  } | undefined) => string;
174
- contains: (elementOrSelector?: string | Element | undefined) => boolean | Element;
175
- children: (selector: string) => Element[];
176
- title: () => string | null | undefined;
177
- id: () => string;
178
- tagName: () => string;
179
- getAttribute: (qualifiedName: string) => string | null;
180
- getBoundingClientRect: () => DOMRect;
181
- matches: (selector: string | undefined) => boolean;
182
174
  visible: () => boolean;
183
- value: () => string | null;
184
- disabled: () => string | null;
185
- role: () => string | null;
186
- label: () => string | null | undefined;
187
175
  getId: () => string;
188
176
  getOwnerWindow: () => (Window & typeof globalThis) | null;
189
177
  getOwnerDocument: () => Document;
190
178
  getComputedStyle: () => CSSStyleDeclaration;
191
179
  getTagName: () => string;
180
+ tagName: () => string;
192
181
  typeIn: (text: string) => Promise<void>;
182
+ getAttribute: (qualifiedName: string) => string | null;
193
183
  getDOMNode: () => Element;
194
184
  node: () => Element;
195
185
  debug: (maxLength?: number | undefined, options?: {
@@ -199,6 +189,7 @@ export declare const TooltipLocator: {
199
189
  getTextContent: () => string | null;
200
190
  getParentNode: () => ParentNode | null;
201
191
  parent: () => ParentNode | null;
192
+ getBoundingClientRect: () => DOMRect;
202
193
  rect: () => DOMRect;
203
194
  hasClass: (classname: string) => boolean;
204
195
  containsFocus: () => boolean;
@@ -210,17 +201,25 @@ export declare const TooltipLocator: {
210
201
  exists: () => boolean;
211
202
  text: () => string | null;
212
203
  empty: () => boolean;
204
+ contains: (elementOrSelector?: string | Element | undefined) => boolean | Element;
213
205
  descendants: (selector: string) => Element[];
214
206
  ancestors: (selector: string) => ParentNode[];
215
207
  attribute: (qualifiedName: string) => string | null;
216
208
  style: (property: string) => string;
217
209
  classNames: () => string[];
210
+ id: () => string;
211
+ matches: (selector: string | undefined) => boolean;
218
212
  checked: () => any;
219
213
  selected: () => any;
214
+ disabled: () => string | null;
220
215
  readonly: () => any;
216
+ role: () => string | null;
217
+ value: () => string | null;
218
+ label: () => string | null | undefined;
219
+ title: () => string | null | undefined;
220
+ children: (selector: string) => Element[];
221
221
  parents: (selector: string) => ParentNode[];
222
222
  } & {
223
- scroll: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
224
223
  copy: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
225
224
  cut: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
226
225
  paste: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
@@ -258,6 +257,7 @@ export declare const TooltipLocator: {
258
257
  touchEnd: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
259
258
  touchMove: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
260
259
  touchStart: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
260
+ scroll: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
261
261
  wheel: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
262
262
  abort: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
263
263
  canPlay: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
@@ -313,25 +313,15 @@ export declare const TooltipLocator: {
313
313
  toString: (maxLength?: number | undefined, options?: {
314
314
  highlight: boolean;
315
315
  } | undefined) => string;
316
- contains: (elementOrSelector?: string | Element | undefined) => boolean | Element;
317
- children: (selector: string) => Element[];
318
- title: () => string | null | undefined;
319
- id: () => string;
320
- tagName: () => string;
321
- getAttribute: (qualifiedName: string) => string | null;
322
- getBoundingClientRect: () => DOMRect;
323
- matches: (selector: string | undefined) => boolean;
324
316
  visible: () => boolean;
325
- value: () => string | null;
326
- disabled: () => string | null;
327
- role: () => string | null;
328
- label: () => string | null | undefined;
329
317
  getId: () => string;
330
318
  getOwnerWindow: () => (Window & typeof globalThis) | null;
331
319
  getOwnerDocument: () => Document;
332
320
  getComputedStyle: () => CSSStyleDeclaration;
333
321
  getTagName: () => string;
322
+ tagName: () => string;
334
323
  typeIn: (text: string) => Promise<void>;
324
+ getAttribute: (qualifiedName: string) => string | null;
335
325
  getDOMNode: () => Element;
336
326
  node: () => Element;
337
327
  debug: (maxLength?: number | undefined, options?: {
@@ -341,6 +331,7 @@ export declare const TooltipLocator: {
341
331
  getTextContent: () => string | null;
342
332
  getParentNode: () => ParentNode | null;
343
333
  parent: () => ParentNode | null;
334
+ getBoundingClientRect: () => DOMRect;
344
335
  rect: () => DOMRect;
345
336
  hasClass: (classname: string) => boolean;
346
337
  containsFocus: () => boolean;
@@ -352,17 +343,25 @@ export declare const TooltipLocator: {
352
343
  exists: () => boolean;
353
344
  text: () => string | null;
354
345
  empty: () => boolean;
346
+ contains: (elementOrSelector?: string | Element | undefined) => boolean | Element;
355
347
  descendants: (selector: string) => Element[];
356
348
  ancestors: (selector: string) => ParentNode[];
357
349
  attribute: (qualifiedName: string) => string | null;
358
350
  style: (property: string) => string;
359
351
  classNames: () => string[];
352
+ id: () => string;
353
+ matches: (selector: string | undefined) => boolean;
360
354
  checked: () => any;
361
355
  selected: () => any;
356
+ disabled: () => string | null;
362
357
  readonly: () => any;
358
+ role: () => string | null;
359
+ value: () => string | null;
360
+ label: () => string | null | undefined;
361
+ title: () => string | null | undefined;
362
+ children: (selector: string) => Element[];
363
363
  parents: (selector: string) => ParentNode[];
364
364
  } & {
365
- scroll: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
366
365
  copy: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
367
366
  cut: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
368
367
  paste: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
@@ -400,6 +399,7 @@ export declare const TooltipLocator: {
400
399
  touchEnd: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
401
400
  touchMove: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
402
401
  touchStart: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
402
+ scroll: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
403
403
  wheel: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
404
404
  abort: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
405
405
  canPlay: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
@@ -455,25 +455,15 @@ export declare const TooltipLocator: {
455
455
  toString: (maxLength?: number | undefined, options?: {
456
456
  highlight: boolean;
457
457
  } | undefined) => string;
458
- contains: (elementOrSelector?: string | Element | undefined) => boolean | Element;
459
- children: (selector: string) => Element[];
460
- title: () => string | null | undefined;
461
- id: () => string;
462
- tagName: () => string;
463
- getAttribute: (qualifiedName: string) => string | null;
464
- getBoundingClientRect: () => DOMRect;
465
- matches: (selector: string | undefined) => boolean;
466
458
  visible: () => boolean;
467
- value: () => string | null;
468
- disabled: () => string | null;
469
- role: () => string | null;
470
- label: () => string | null | undefined;
471
459
  getId: () => string;
472
460
  getOwnerWindow: () => (Window & typeof globalThis) | null;
473
461
  getOwnerDocument: () => Document;
474
462
  getComputedStyle: () => CSSStyleDeclaration;
475
463
  getTagName: () => string;
464
+ tagName: () => string;
476
465
  typeIn: (text: string) => Promise<void>;
466
+ getAttribute: (qualifiedName: string) => string | null;
477
467
  getDOMNode: () => Element;
478
468
  node: () => Element;
479
469
  debug: (maxLength?: number | undefined, options?: {
@@ -483,6 +473,7 @@ export declare const TooltipLocator: {
483
473
  getTextContent: () => string | null;
484
474
  getParentNode: () => ParentNode | null;
485
475
  parent: () => ParentNode | null;
476
+ getBoundingClientRect: () => DOMRect;
486
477
  rect: () => DOMRect;
487
478
  hasClass: (classname: string) => boolean;
488
479
  containsFocus: () => boolean;
@@ -494,17 +485,25 @@ export declare const TooltipLocator: {
494
485
  exists: () => boolean;
495
486
  text: () => string | null;
496
487
  empty: () => boolean;
488
+ contains: (elementOrSelector?: string | Element | undefined) => boolean | Element;
497
489
  descendants: (selector: string) => Element[];
498
490
  ancestors: (selector: string) => ParentNode[];
499
491
  attribute: (qualifiedName: string) => string | null;
500
492
  style: (property: string) => string;
501
493
  classNames: () => string[];
494
+ id: () => string;
495
+ matches: (selector: string | undefined) => boolean;
502
496
  checked: () => any;
503
497
  selected: () => any;
498
+ disabled: () => string | null;
504
499
  readonly: () => any;
500
+ role: () => string | null;
501
+ value: () => string | null;
502
+ label: () => string | null | undefined;
503
+ title: () => string | null | undefined;
504
+ children: (selector: string) => Element[];
505
505
  parents: (selector: string) => ParentNode[];
506
506
  } & {
507
- scroll: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
508
507
  copy: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
509
508
  cut: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
510
509
  paste: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
@@ -542,6 +541,7 @@ export declare const TooltipLocator: {
542
541
  touchEnd: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
543
542
  touchMove: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
544
543
  touchStart: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
544
+ scroll: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
545
545
  wheel: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
546
546
  abort: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
547
547
  canPlay: (init?: import("@instructure/ui-test-queries/src/utils/events").FireEventInit | undefined, options?: Record<string, unknown> | undefined) => Promise<Event>;
package/types/Tooltip/index.d.ts CHANGED
@@ -1,17 +1,19 @@
1
1
  /** @jsx jsx */
2
2
  import { Component } from 'react';
3
+ import type { PopoverProps } from '@instructure/ui-popover';
3
4
  import { jsx } from '@instructure/emotion';
4
- import type { TooltipProps, TooltipRenderChildren } from './props';
5
+ import type { TooltipProps, TooltipState } from './props';
5
6
  /**
6
7
  ---
7
8
  category: components
8
9
  ---
10
+ @tsProps
9
11
  **/
10
- declare class Tooltip extends Component<TooltipProps> {
12
+ declare class Tooltip extends Component<TooltipProps, TooltipState> {
11
13
  static readonly componentId = "Tooltip";
12
14
  static allowedProps: readonly (keyof {
13
- renderTip: import("react").ReactNode | ((...args: any[]) => any);
14
- children: import("react").ReactNode | TooltipRenderChildren;
15
+ children: import("react").ReactNode | import("./props").TooltipRenderChildren;
16
+ renderTip: import("react").ReactNode | (() => import("react").ReactNode);
15
17
  isShowingContent?: boolean | undefined;
16
18
  defaultIsShowingContent?: boolean | undefined;
17
19
  as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
@@ -20,15 +22,17 @@ declare class Tooltip extends Component<TooltipProps> {
20
22
  placement?: import("@instructure/ui-position").PlacementPropValues | undefined;
21
23
  mountNode?: import("@instructure/ui-position").PositionMountNode | undefined;
22
24
  constrain?: import("@instructure/ui-position").PositionConstraint | undefined;
23
- positionTarget?: import("@instructure/ui-position").PositionMountNode | undefined;
24
25
  offsetX?: string | number | undefined;
25
26
  offsetY?: string | number | undefined;
26
- onShowContent?: ((...args: any[]) => any) | undefined;
27
- onHideContent?: ((...args: any[]) => any) | undefined;
27
+ positionTarget?: import("@instructure/ui-position").PositionMountNode | undefined;
28
+ onShowContent?: ((event: import("react").UIEvent<Element, UIEvent> | import("react").FocusEvent<Element, Element>) => void) | undefined;
29
+ onHideContent?: ((event: import("react").UIEvent<Element, UIEvent> | import("react").FocusEvent<Element, Element>, args: {
30
+ documentClick: boolean;
31
+ }) => void) | undefined;
28
32
  })[];
29
33
  static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
30
- renderTip: import("react").ReactNode | ((...args: any[]) => any);
31
- children: import("react").ReactNode | TooltipRenderChildren;
34
+ children: import("react").ReactNode | import("./props").TooltipRenderChildren;
35
+ renderTip: import("react").ReactNode | (() => import("react").ReactNode);
32
36
  isShowingContent?: boolean | undefined;
33
37
  defaultIsShowingContent?: boolean | undefined;
34
38
  as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
@@ -37,36 +41,31 @@ declare class Tooltip extends Component<TooltipProps> {
37
41
  placement?: import("@instructure/ui-position").PlacementPropValues | undefined;
38
42
  mountNode?: import("@instructure/ui-position").PositionMountNode | undefined;
39
43
  constrain?: import("@instructure/ui-position").PositionConstraint | undefined;
40
- positionTarget?: import("@instructure/ui-position").PositionMountNode | undefined;
41
44
  offsetX?: string | number | undefined;
42
45
  offsetY?: string | number | undefined;
43
- onShowContent?: ((...args: any[]) => any) | undefined;
44
- onHideContent?: ((...args: any[]) => any) | undefined;
46
+ positionTarget?: import("@instructure/ui-position").PositionMountNode | undefined;
47
+ onShowContent?: ((event: import("react").UIEvent<Element, UIEvent> | import("react").FocusEvent<Element, Element>) => void) | undefined;
48
+ onHideContent?: ((event: import("react").UIEvent<Element, UIEvent> | import("react").FocusEvent<Element, Element>, args: {
49
+ documentClick: boolean;
50
+ }) => void) | undefined;
45
51
  }>;
46
52
  static defaultProps: {
47
53
  readonly defaultIsShowingContent: false;
48
54
  readonly color: "primary";
49
55
  readonly placement: "top";
50
- readonly mountNode: null;
51
56
  readonly constrain: "window";
52
57
  readonly offsetX: 0;
53
58
  readonly offsetY: 0;
54
- readonly onShowContent: (event: any) => void;
55
- readonly onHideContent: (event: any, { documentClick }: {
56
- documentClick: any;
57
- }) => void;
58
- };
59
- _id: string;
60
- state: {
61
- hasFocus: boolean;
62
59
  };
60
+ private readonly _id;
63
61
  ref: Element | null;
64
62
  handleRef: (el: Element | null) => void;
63
+ constructor(props: TooltipProps);
65
64
  componentDidMount(): void;
66
- componentDidUpdate(prevProps: any, prevState: any, snapshot: any): void;
67
- handleFocus: (event: any) => void;
68
- handleBlur: (event: any) => void;
69
- renderTrigger(): import("react").ReactNode;
65
+ componentDidUpdate(): void;
66
+ handleFocus: PopoverProps['onFocus'];
67
+ handleBlur: PopoverProps['onBlur'];
68
+ renderTrigger(): any;
70
69
  render(): jsx.JSX.Element;
71
70
  }
72
71
  export default Tooltip;
package/types/Tooltip/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Tooltip/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAYjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAKrD,OAAO,KAAK,EAAE,YAAY,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAGlE;;;;GAIG;AACH,cAEM,OAAQ,SAAQ,SAAS,CAAC,YAAY,CAAC;IAC3C,MAAM,CAAC,QAAQ,CAAC,WAAW,aAAY;IAEvC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;OAAY;IAE5B,MAAM,CAAC,YAAY;;;;;;;;;;;;MAYT;IAEV,GAAG,SAAiB;IACpB,KAAK;;MAAsB;IAE3B,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAE9B;IAED,iBAAiB;IAKjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,WAAW,uBAEV;IAGD,UAAU,uBAET;IAED,aAAa;IA6Bb,MAAM;CAiDP;AAED,eAAe,OAAO,CAAA;AACtB,OAAO,EAAE,OAAO,EAAE,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Tooltip/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAYjC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAA;AAC3D,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAKrD,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAGzD;;;;;GAKG;AACH,cAEM,OAAQ,SAAQ,SAAS,CAAC,YAAY,EAAE,YAAY,CAAC;IACzD,MAAM,CAAC,QAAQ,CAAC,WAAW,aAAY;IAEvC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;OAAY;IAE5B,MAAM,CAAC,YAAY;;;;;;;MAOT;IAEV,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAQ;IAE5B,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAE9B;gBAEW,KAAK,EAAE,YAAY;IAQ/B,iBAAiB;IAIjB,kBAAkB;IAIlB,WAAW,EAAE,YAAY,CAAC,SAAS,CAAC,CAEnC;IAED,UAAU,EAAE,YAAY,CAAC,QAAQ,CAAC,CAEjC;IAED,aAAa;IA6Bb,MAAM;CAiDP;AAED,eAAe,OAAO,CAAA;AACtB,OAAO,EAAE,OAAO,EAAE,CAAA"}
package/types/Tooltip/props.d.ts CHANGED
@@ -1,37 +1,100 @@
1
1
  import React from 'react';
2
- import type { PropValidators, AsElementType, TooltipTheme } from '@instructure/shared-types';
2
+ import type { PropValidators, AsElementType, TooltipTheme, OtherHTMLAttributes } from '@instructure/shared-types';
3
3
  import type { PlacementPropValues, PositionConstraint, PositionMountNode } from '@instructure/ui-position';
4
4
  import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
5
+ import type { PopoverOwnProps } from '@instructure/ui-popover';
5
6
  declare type TooltipRenderChildrenArgs = {
6
7
  focused: boolean;
7
- getTriggerProps: <P extends Record<string, any>>(props: P) => {
8
+ getTriggerProps: <TriggerProps extends Record<string, any>>(props: TriggerProps) => {
8
9
  'aria-describedby': string;
9
- } & P;
10
+ } & TriggerProps;
10
11
  };
11
12
  declare type TooltipRenderChildren = (args: TooltipRenderChildrenArgs) => React.ReactNode;
12
13
  declare type TooltipOwnProps = {
13
- renderTip: React.ReactNode | ((...args: any[]) => any);
14
+ /**
15
+ * A ReactNode or a function that returns a ReactNode with the following params:
16
+ *
17
+ * @param {Boolean} focused - Is the Tooltip trigger focused?
18
+ * @param {Function} getTriggerProps - Props to be spread onto the trigger element
19
+ */
14
20
  children: React.ReactNode | TooltipRenderChildren;
21
+ /**
22
+ * The content to render in the tooltip
23
+ */
24
+ renderTip: React.ReactNode | (() => React.ReactNode);
25
+ /**
26
+ * Whether or not the tooltip content is shown, when controlled
27
+ */
15
28
  isShowingContent?: boolean;
29
+ /**
30
+ * Whether or not to show the content by default, when uncontrolled
31
+ */
16
32
  defaultIsShowingContent?: boolean;
33
+ /**
34
+ * the element type to render as (assumes a single child if 'as' is undefined)
35
+ */
17
36
  as?: AsElementType;
37
+ /**
38
+ * The action that causes the Content to display (`click`, `hover`, `focus`)
39
+ */
18
40
  on?: ('click' | 'hover' | 'focus') | ('click' | 'hover' | 'focus')[];
41
+ /**
42
+ * The color of the tooltip content
43
+ */
19
44
  color?: 'primary' | 'primary-inverse';
45
+ /**
46
+ * Specifies where the Tooltip will be placed in relation to the target element.
47
+ * Ex. placement="bottom" will render the Tooltip below the triggering element
48
+ * (Note: if there is not room, it will position opposite. Ex. "top" will
49
+ * automatically switch to "bottom")
50
+ */
20
51
  placement?: PlacementPropValues;
52
+ /**
53
+ * An element or a function returning an element to use as the mount node
54
+ * for the `<Tooltip />` (defaults to `document.body`)
55
+ */
21
56
  mountNode?: PositionMountNode;
57
+ /**
58
+ * The parent in which to constrain the tooltip.
59
+ * One of: 'window', 'scroll-parent', 'parent', 'none', an element,
60
+ * or a function returning an element
61
+ */
22
62
  constrain?: PositionConstraint;
23
- positionTarget?: PositionMountNode;
63
+ /**
64
+ * The horizontal offset for the positioned content
65
+ */
24
66
  offsetX?: string | number;
67
+ /**
68
+ * The vertical offset for the positioned content
69
+ */
25
70
  offsetY?: string | number;
26
- onShowContent?: (...args: any[]) => any;
27
- onHideContent?: (...args: any[]) => any;
71
+ /**
72
+ * Target element for positioning the Tooltip (if it differs from children/trigger)
73
+ */
74
+ positionTarget?: PositionMountNode;
75
+ /**
76
+ * Callback fired when content is shown. When controlled, this callback is
77
+ * fired when the tooltip expects to be shown
78
+ */
79
+ onShowContent?: (event: React.UIEvent | React.FocusEvent) => void;
80
+ /**
81
+ * Callback fired when content is hidden. When controlled, this callback is
82
+ * fired when the tooltip expects to be hidden
83
+ */
84
+ onHideContent?: (event: React.UIEvent | React.FocusEvent, args: {
85
+ documentClick: boolean;
86
+ }) => void;
28
87
  };
29
88
  declare type PropKeys = keyof TooltipOwnProps;
30
89
  declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
31
- declare type TooltipProps = TooltipOwnProps & WithStyleProps<TooltipTheme, TooltipStyle>;
90
+ declare type PropsPassableToPopover = Omit<PopoverOwnProps, 'isShowingContent' | 'defaultIsShowingContent' | 'on' | 'shouldRenderOffscreen' | 'shouldReturnFocus' | 'placement' | 'color' | 'mountNode' | 'constrain' | 'shadow' | 'offsetX' | 'offsetY' | 'positionTarget' | 'renderTrigger' | 'onShowContent' | 'onHideContent' | 'onFocus' | 'onBlur' | 'elementRef'>;
91
+ declare type TooltipProps = PropsPassableToPopover & TooltipOwnProps & WithStyleProps<TooltipTheme, TooltipStyle> & OtherHTMLAttributes<TooltipOwnProps>;
32
92
  declare type TooltipStyle = ComponentStyle<'tooltip'>;
93
+ declare type TooltipState = {
94
+ hasFocus: boolean;
95
+ };
33
96
  declare const propTypes: PropValidators<PropKeys>;
34
97
  declare const allowedProps: AllowedPropKeys;
35
- export type { TooltipProps, TooltipStyle, TooltipRenderChildren, TooltipRenderChildrenArgs };
98
+ export type { TooltipProps, TooltipState, TooltipStyle, TooltipRenderChildren, TooltipRenderChildrenArgs };
36
99
  export { propTypes, allowedProps };
37
100
  //# sourceMappingURL=props.d.ts.map
package/types/Tooltip/props.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Tooltip/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EACV,cAAc,EACd,aAAa,EACb,YAAY,EACb,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EACV,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EAClB,MAAM,0BAA0B,CAAA;AACjC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAE1E,aAAK,yBAAyB,GAAG;IAC/B,OAAO,EAAE,OAAO,CAAA;IAChB,eAAe,EAAE,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC7C,KAAK,EAAE,CAAC,KACL;QAAE,kBAAkB,EAAE,MAAM,CAAA;KAAE,GAAG,CAAC,CAAA;CACxC,CAAA;AAED,aAAK,qBAAqB,GAAG,CAC3B,IAAI,EAAE,yBAAyB,KAC5B,KAAK,CAAC,SAAS,CAAA;AAEpB,aAAK,eAAe,GAAG;IACrB,SAAS,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;IACtD,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,qBAAqB,CAAA;IACjD,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,EAAE,CAAC,EAAE,CAAC,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC,EAAE,CAAA;IACpE,KAAK,CAAC,EAAE,SAAS,GAAG,iBAAiB,CAAA;IACrC,SAAS,CAAC,EAAE,mBAAmB,CAAA;IAC/B,SAAS,CAAC,EAAE,iBAAiB,CAAA;IAC7B,SAAS,CAAC,EAAE,kBAAkB,CAAA;IAC9B,cAAc,CAAC,EAAE,iBAAiB,CAAA;IAClC,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACzB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACzB,aAAa,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACvC,aAAa,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;CACxC,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,eAAe,CAAA;AAErC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAIhD,aAAK,YAAY,GAAG,eAAe,GAAG,cAAc,CAAC,YAAY,EAAE,YAAY,CAAC,CAAA;AAEhF,aAAK,YAAY,GAAG,cAAc,CAAC,SAAS,CAAC,CAAA;AAE7C,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA0EvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAgBnB,CAAA;AAED,YAAY,EACV,YAAY,EACZ,YAAY,EACZ,qBAAqB,EACrB,yBAAyB,EAC1B,CAAA;AACD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
1
+ {"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Tooltip/props.ts"],"names":[],"mappings":"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"}