@rescui/tooltip 0.6.0 → 0.7.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.
Files changed (5) hide show
  1. package/lib/index.css +23 -23
  2. package/lib/index.p.module.css.js +6 -6
  3. package/lib/tooltip.d.ts +8 -1
  4. package/lib/tooltip.js +8 -0
  5. package/package.json +3 -3
package/lib/index.css CHANGED
@@ -1,10 +1,10 @@
1
- ._tooltip_1qwmbuc_4{
1
+ ._tooltip_174jhqx_4{
2
2
  position:relative;
3
3
  }
4
- ._closing_1qwmbuc_8{
4
+ ._closing_174jhqx_8{
5
5
  pointer-events:none;
6
6
  }
7
- ._content_1qwmbuc_12{
7
+ ._content_174jhqx_12{
8
8
  letter-spacing:0.0045em;
9
9
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
10
10
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
@@ -15,10 +15,10 @@
15
15
  line-height:20px;
16
16
  line-height:var(--rs-text-3-line-height, 20px);
17
17
  }
18
- ._rs-reset-letter-spacing_1qwmbuc_1 ._content_1qwmbuc_12{
18
+ ._rs-reset-letter-spacing_174jhqx_1 ._content_174jhqx_12{
19
19
  letter-spacing:normal;
20
20
  }
21
- ._content_1qwmbuc_12 {
21
+ ._content_174jhqx_12 {
22
22
 
23
23
  max-width:283px;
24
24
 
@@ -39,52 +39,52 @@
39
39
  -webkit-transform:translate(0, 0);
40
40
  transform:translate(0, 0);
41
41
  }
42
- [data-real-placement='top-end'] ._content_1qwmbuc_12,
43
- [data-real-placement='bottom-end'] ._content_1qwmbuc_12{
42
+ [data-real-placement='top-end'] ._content_174jhqx_12,
43
+ [data-real-placement='bottom-end'] ._content_174jhqx_12{
44
44
  margin-right:0;
45
45
  }
46
- [data-real-placement='top-start'] ._content_1qwmbuc_12,
47
- [data-real-placement='bottom-start'] ._content_1qwmbuc_12{
46
+ [data-real-placement='top-start'] ._content_174jhqx_12,
47
+ [data-real-placement='bottom-start'] ._content_174jhqx_12{
48
48
  margin-left:0;
49
49
  }
50
- [data-real-placement='left-end'] ._content_1qwmbuc_12,
51
- [data-real-placement='right-end'] ._content_1qwmbuc_12{
50
+ [data-real-placement='left-end'] ._content_174jhqx_12,
51
+ [data-real-placement='right-end'] ._content_174jhqx_12{
52
52
  margin-bottom:0;
53
53
  }
54
- [data-real-placement='left-start'] ._content_1qwmbuc_12,
55
- [data-real-placement='right-start'] ._content_1qwmbuc_12{
54
+ [data-real-placement='left-start'] ._content_174jhqx_12,
55
+ [data-real-placement='right-start'] ._content_174jhqx_12{
56
56
  margin-top:0;
57
57
  }
58
- ._initial_1qwmbuc_47 ._content_1qwmbuc_12{
58
+ ._initial_174jhqx_47 ._content_174jhqx_12{
59
59
  -webkit-transition:none;
60
60
  transition:none;
61
61
  }
62
- ._closing_1qwmbuc_8 ._content_1qwmbuc_12{
62
+ ._closing_174jhqx_8 ._content_174jhqx_12{
63
63
  -webkit-transition-duration:200ms, 200ms;
64
64
  transition-duration:200ms, 200ms;
65
65
  }
66
- ._initial_1qwmbuc_47 ._content_1qwmbuc_12,
67
- ._closing_1qwmbuc_8 ._content_1qwmbuc_12{
66
+ ._initial_174jhqx_47 ._content_174jhqx_12,
67
+ ._closing_174jhqx_8 ._content_174jhqx_12{
68
68
  opacity:0;
69
69
  }
70
- ._initial_1qwmbuc_47[data-real-placement^='top'] ._content_1qwmbuc_12, ._closing_1qwmbuc_8[data-real-placement^='top'] ._content_1qwmbuc_12{
70
+ ._initial_174jhqx_47[data-real-placement^='top'] ._content_174jhqx_12, ._closing_174jhqx_8[data-real-placement^='top'] ._content_174jhqx_12{
71
71
  -webkit-transform:translate(0, 10px);
72
72
  transform:translate(0, 10px);
73
73
  }
74
- ._initial_1qwmbuc_47[data-real-placement^='right'] ._content_1qwmbuc_12, ._closing_1qwmbuc_8[data-real-placement^='right'] ._content_1qwmbuc_12{
74
+ ._initial_174jhqx_47[data-real-placement^='right'] ._content_174jhqx_12, ._closing_174jhqx_8[data-real-placement^='right'] ._content_174jhqx_12{
75
75
  -webkit-transform:translate(-10px, 0);
76
76
  transform:translate(-10px, 0);
77
77
  }
78
- ._initial_1qwmbuc_47[data-real-placement^='bottom'] ._content_1qwmbuc_12, ._closing_1qwmbuc_8[data-real-placement^='bottom'] ._content_1qwmbuc_12{
78
+ ._initial_174jhqx_47[data-real-placement^='bottom'] ._content_174jhqx_12, ._closing_174jhqx_8[data-real-placement^='bottom'] ._content_174jhqx_12{
79
79
  -webkit-transform:translate(0, -10px);
80
80
  transform:translate(0, -10px);
81
81
  }
82
- ._initial_1qwmbuc_47[data-real-placement^='left'] ._content_1qwmbuc_12, ._closing_1qwmbuc_8[data-real-placement^='left'] ._content_1qwmbuc_12{
82
+ ._initial_174jhqx_47[data-real-placement^='left'] ._content_174jhqx_12, ._closing_174jhqx_8[data-real-placement^='left'] ._content_174jhqx_12{
83
83
  -webkit-transform:translate(10px, 0);
84
84
  transform:translate(10px, 0);
85
85
  }
86
- ._trigger_1qwmbuc_81:focus-visible,
87
- ._trigger_1qwmbuc_81:focus[data-focus-method='key']{
86
+ ._trigger_174jhqx_81:focus-visible,
87
+ ._trigger_174jhqx_81:focus[data-focus-method='key']{
88
88
  outline:none;
89
89
  -webkit-box-shadow:rgba(107, 87, 255, 0.8) 0 0 0 4px;
90
90
  -webkit-box-shadow:var(--rs-color-primary-t-dim-light-theme, rgba(107, 87, 255, 0.8)) 0 0 0 4px;
package/lib/index.p.module.css.js CHANGED
@@ -1,9 +1,9 @@
1
1
  var styles = {
2
- "tooltip": "_tooltip_1qwmbuc_4",
3
- "closing": "_closing_1qwmbuc_8",
4
- "content": "_content_1qwmbuc_12",
5
- "rs-reset-letter-spacing": "_rs-reset-letter-spacing_1qwmbuc_1",
6
- "initial": "_initial_1qwmbuc_47",
7
- "trigger": "_trigger_1qwmbuc_81"
2
+ "tooltip": "_tooltip_174jhqx_4",
3
+ "closing": "_closing_174jhqx_8",
4
+ "content": "_content_174jhqx_12",
5
+ "rs-reset-letter-spacing": "_rs-reset-letter-spacing_174jhqx_1",
6
+ "initial": "_initial_174jhqx_47",
7
+ "trigger": "_trigger_174jhqx_81"
8
8
  };
9
9
  export { styles as default };
package/lib/tooltip.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
2
  import { StrictModifiers } from '@popperjs/core/lib/types';
3
+ import type { Placement } from '@popperjs/core/lib/enums';
3
4
  interface TriggerTargetRequiredProps {
4
5
  ref: React.Ref<HTMLElement>;
5
6
  }
@@ -40,9 +41,15 @@ export interface TooltipProps {
40
41
  */
41
42
  modifiers?: StrictModifiers[];
42
43
  /**
43
- * Please use only `top-end`, `right`, `left`, `right-start` or `left-start` to be compliant with styleguide
44
+ * Please use only `auto`, `top-end`, `right`, `left`, `right-start` or `left-start` to be compliant with styleguide
44
45
  */
45
46
  placement?: TooltipPlacement;
47
+ /**
48
+ * When no space is available on the preferred placement, the tooltip will test
49
+ * the ones provided in the list, and use the first useful one.
50
+ * See [docs](https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements).
51
+ */
52
+ fallbackPlacements?: Placement[];
46
53
  /**
47
54
  * Disable timeout before hide tooltip after mouse left target,
48
55
  * use with cation, it can make impossible to click on links inside tooltip
package/lib/tooltip.js CHANGED
@@ -71,6 +71,8 @@ var Tooltip = function Tooltip(_ref2) {
71
71
  placement = _ref2$placement === void 0 ? 'auto' : _ref2$placement,
72
72
  _ref2$sparse = _ref2.sparse,
73
73
  sparse = _ref2$sparse === void 0 ? true : _ref2$sparse,
74
+ _ref2$fallbackPlaceme = _ref2.fallbackPlacements,
75
+ fallbackPlacements = _ref2$fallbackPlaceme === void 0 ? ['top', 'bottom'] : _ref2$fallbackPlaceme,
74
76
  disableHideDelay = _ref2.disableHideDelay;
75
77
  var isControlled = typeof isVisibleFromProps !== 'undefined';
76
78
 
@@ -180,6 +182,11 @@ var Tooltip = function Tooltip(_ref2) {
180
182
  phase: 'afterWrite',
181
183
  fn: disableInitialFlag,
182
184
  requires: []
185
+ }, {
186
+ name: 'flip',
187
+ options: {
188
+ fallbackPlacements: fallbackPlacements
189
+ }
183
190
  }, {
184
191
  name: 'offset',
185
192
  options: {
@@ -231,6 +238,7 @@ Tooltip.propTypes = {
231
238
  isVisible: PropTypes.bool,
232
239
  modifiers: PropTypes.array,
233
240
  placement: PropTypes.oneOf(['auto-start', 'auto', 'auto-end', 'top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start']),
241
+ fallbackPlacements: PropTypes.arrayOf(PropTypes.oneOf(['auto-start', 'auto', 'auto-end', 'top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start'])),
234
242
  sparse: PropTypes.bool,
235
243
  disableHideDelay: PropTypes.bool
236
244
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/tooltip",
3
- "version": "0.6.0",
3
+ "version": "0.7.0",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -30,11 +30,11 @@
30
30
  "devDependencies": {
31
31
  "@rescui/colors": "^0.1.9",
32
32
  "@rescui/scripts": "^0.2.2",
33
- "@rescui/typography": "^0.11.0",
33
+ "@rescui/typography": "^0.12.0",
34
34
  "@types/react-is": "^17.0.3"
35
35
  },
36
36
  "scripts": {
37
37
  "build": "rescui-scripts build"
38
38
  },
39
- "gitHead": "2a57f292fde136628c5ed31a9da9149fd41d404f"
39
+ "gitHead": "7f3b7e443321b1c68190c7498dd0176f175a7d47"
40
40
  }