@atlaskit/tooltip 20.9.0 → 20.10.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 (11) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/dist/cjs/tooltip-shortcut.compiled.css +1 -0
  3. package/dist/cjs/tooltip-shortcut.js +4 -2
  4. package/dist/cjs/tooltip.js +1 -1
  5. package/dist/es2019/tooltip-shortcut.compiled.css +1 -0
  6. package/dist/es2019/tooltip-shortcut.js +4 -2
  7. package/dist/es2019/tooltip.js +1 -1
  8. package/dist/esm/tooltip-shortcut.compiled.css +1 -0
  9. package/dist/esm/tooltip-shortcut.js +4 -2
  10. package/dist/esm/tooltip.js +1 -1
  11. package/package.json +5 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,16 @@
1
1
  # @atlaskit/tooltip
2
2
 
3
+ ## 20.10.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`e273fa0610764`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e273fa0610764) -
8
+ The keyboard shortcut `font` has been updated to use regular fonts instead of monospace fonts, for
9
+ improved readability and distinction between characters such as the letter O and number 0. It will
10
+ now use the `font.body.small` font token.
11
+
12
+ This change is behind the feature gate `platform-tooltip-shortcuts-regular-font`.
13
+
3
14
  ## 20.9.0
4
15
 
5
16
  ### Minor Changes
package/dist/cjs/tooltip-shortcut.compiled.css CHANGED
@@ -1,3 +1,4 @@
1
+ ._11c81o8v{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
1
2
  ._11c81u0j{font:var(--ds-font-code,normal 400 .875em/1 ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}
2
3
  ._2rkolb4i{border-radius:var(--ds-radius-xsmall,2px)}
3
4
  ._zulpv77o{gap:var(--ds-space-025,2px)}
package/dist/cjs/tooltip-shortcut.js CHANGED
@@ -9,10 +9,12 @@ exports.TooltipShortcut = void 0;
9
9
  require("./tooltip-shortcut.compiled.css");
10
10
  var React = _interopRequireWildcard(require("react"));
11
11
  var _runtime = require("@compiled/react/runtime");
12
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
12
13
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
13
14
  var styles = {
14
15
  shortcutSegmentsContainer: "_zulpv77o _1e0c1txw _1q511b66 _85i5v77o",
15
- shortcutSegment: "_11c81u0j _2rkolb4i _1dqonqa1 _189ee4h9 _1h6d1ihb _1e0c1txw _4cvr1h6o _4t3i1k92 _vchhusvi _1q51v77o _85i5v77o _bozg12x7 _y4ti12x7 _16qsn7od _1254n7od _cgnln7od _syazn7od _ahbqn7od _12l2n7od _1pfhn7od _6rthn7od _1ul9n7od _w19jn7od _bfhk261p"
16
+ shortcutSegment: "_11c81u0j _2rkolb4i _1dqonqa1 _189ee4h9 _1h6d1ihb _1e0c1txw _4cvr1h6o _4t3i1k92 _vchhusvi _1q51v77o _85i5v77o _bozg12x7 _y4ti12x7 _16qsn7od _1254n7od _cgnln7od _syazn7od _ahbqn7od _12l2n7od _1pfhn7od _6rthn7od _1ul9n7od _w19jn7od _bfhk261p",
17
+ regularFont: "_11c81o8v"
16
18
  };
17
19
  /**
18
20
  * __Tooltip shortcut__
@@ -27,7 +29,7 @@ var TooltipShortcut = exports.TooltipShortcut = function TooltipShortcut(_ref) {
27
29
  }, shortcut.map(function (segment, index) {
28
30
  return /*#__PURE__*/React.createElement("kbd", {
29
31
  key: "".concat(segment, "-").concat(index),
30
- className: (0, _runtime.ax)([styles.shortcutSegment])
32
+ className: (0, _runtime.ax)([styles.shortcutSegment, (0, _platformFeatureFlags.fg)('platform-tooltip-shortcuts-regular-font') && styles.regularFont])
31
33
  }, segment);
32
34
  }));
33
35
  };
package/dist/cjs/tooltip.js CHANGED
@@ -32,7 +32,7 @@ var tooltipZIndex = _constants.layers.tooltip();
32
32
  var analyticsAttributes = {
33
33
  componentName: 'tooltip',
34
34
  packageName: "@atlaskit/tooltip",
35
- packageVersion: "20.8.2"
35
+ packageVersion: "20.9.0"
36
36
  };
37
37
 
38
38
  // Inverts motion direction
package/dist/es2019/tooltip-shortcut.compiled.css CHANGED
@@ -1,3 +1,4 @@
1
+ ._11c81o8v{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
1
2
  ._11c81u0j{font:var(--ds-font-code,normal 400 .875em/1 ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}
2
3
  ._2rkolb4i{border-radius:var(--ds-radius-xsmall,2px)}
3
4
  ._zulpv77o{gap:var(--ds-space-025,2px)}
package/dist/es2019/tooltip-shortcut.js CHANGED
@@ -2,9 +2,11 @@
2
2
  import "./tooltip-shortcut.compiled.css";
3
3
  import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
+ import { fg } from '@atlaskit/platform-feature-flags';
5
6
  const styles = {
6
7
  shortcutSegmentsContainer: "_zulpv77o _1e0c1txw _1q511b66 _85i5v77o",
7
- shortcutSegment: "_11c81u0j _2rkolb4i _1dqonqa1 _189ee4h9 _1h6d1ihb _1e0c1txw _4cvr1h6o _4t3i1k92 _vchhusvi _1q51v77o _85i5v77o _bozg12x7 _y4ti12x7 _16qsn7od _1254n7od _cgnln7od _syazn7od _ahbqn7od _12l2n7od _1pfhn7od _6rthn7od _1ul9n7od _w19jn7od _bfhk261p"
8
+ shortcutSegment: "_11c81u0j _2rkolb4i _1dqonqa1 _189ee4h9 _1h6d1ihb _1e0c1txw _4cvr1h6o _4t3i1k92 _vchhusvi _1q51v77o _85i5v77o _bozg12x7 _y4ti12x7 _16qsn7od _1254n7od _cgnln7od _syazn7od _ahbqn7od _12l2n7od _1pfhn7od _6rthn7od _1ul9n7od _w19jn7od _bfhk261p",
9
+ regularFont: "_11c81o8v"
8
10
  };
9
11
  /**
10
12
  * __Tooltip shortcut__
@@ -19,6 +21,6 @@ export const TooltipShortcut = ({
19
21
  className: ax([styles.shortcutSegmentsContainer])
20
22
  }, shortcut.map((segment, index) => /*#__PURE__*/React.createElement("kbd", {
21
23
  key: `${segment}-${index}`,
22
- className: ax([styles.shortcutSegment])
24
+ className: ax([styles.shortcutSegment, fg('platform-tooltip-shortcuts-regular-font') && styles.regularFont])
23
25
  }, segment)));
24
26
  };
package/dist/es2019/tooltip.js CHANGED
@@ -19,7 +19,7 @@ const tooltipZIndex = layers.tooltip();
19
19
  const analyticsAttributes = {
20
20
  componentName: 'tooltip',
21
21
  packageName: "@atlaskit/tooltip",
22
- packageVersion: "20.8.2"
22
+ packageVersion: "20.9.0"
23
23
  };
24
24
 
25
25
  // Inverts motion direction
package/dist/esm/tooltip-shortcut.compiled.css CHANGED
@@ -1,3 +1,4 @@
1
+ ._11c81o8v{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
1
2
  ._11c81u0j{font:var(--ds-font-code,normal 400 .875em/1 ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}
2
3
  ._2rkolb4i{border-radius:var(--ds-radius-xsmall,2px)}
3
4
  ._zulpv77o{gap:var(--ds-space-025,2px)}
package/dist/esm/tooltip-shortcut.js CHANGED
@@ -2,9 +2,11 @@
2
2
  import "./tooltip-shortcut.compiled.css";
3
3
  import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
+ import { fg } from '@atlaskit/platform-feature-flags';
5
6
  var styles = {
6
7
  shortcutSegmentsContainer: "_zulpv77o _1e0c1txw _1q511b66 _85i5v77o",
7
- shortcutSegment: "_11c81u0j _2rkolb4i _1dqonqa1 _189ee4h9 _1h6d1ihb _1e0c1txw _4cvr1h6o _4t3i1k92 _vchhusvi _1q51v77o _85i5v77o _bozg12x7 _y4ti12x7 _16qsn7od _1254n7od _cgnln7od _syazn7od _ahbqn7od _12l2n7od _1pfhn7od _6rthn7od _1ul9n7od _w19jn7od _bfhk261p"
8
+ shortcutSegment: "_11c81u0j _2rkolb4i _1dqonqa1 _189ee4h9 _1h6d1ihb _1e0c1txw _4cvr1h6o _4t3i1k92 _vchhusvi _1q51v77o _85i5v77o _bozg12x7 _y4ti12x7 _16qsn7od _1254n7od _cgnln7od _syazn7od _ahbqn7od _12l2n7od _1pfhn7od _6rthn7od _1ul9n7od _w19jn7od _bfhk261p",
9
+ regularFont: "_11c81o8v"
8
10
  };
9
11
  /**
10
12
  * __Tooltip shortcut__
@@ -19,7 +21,7 @@ export var TooltipShortcut = function TooltipShortcut(_ref) {
19
21
  }, shortcut.map(function (segment, index) {
20
22
  return /*#__PURE__*/React.createElement("kbd", {
21
23
  key: "".concat(segment, "-").concat(index),
22
- className: ax([styles.shortcutSegment])
24
+ className: ax([styles.shortcutSegment, fg('platform-tooltip-shortcuts-regular-font') && styles.regularFont])
23
25
  }, segment);
24
26
  }));
25
27
  };
package/dist/esm/tooltip.js CHANGED
@@ -23,7 +23,7 @@ var tooltipZIndex = layers.tooltip();
23
23
  var analyticsAttributes = {
24
24
  componentName: 'tooltip',
25
25
  packageName: "@atlaskit/tooltip",
26
- packageVersion: "20.8.2"
26
+ packageVersion: "20.9.0"
27
27
  };
28
28
 
29
29
  // Inverts motion direction
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/tooltip",
3
- "version": "20.9.0",
3
+ "version": "20.10.0",
4
4
  "description": "A tooltip describes an interactive element on mouse hover or keyboard focus.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -34,7 +34,7 @@
34
34
  "dependencies": {
35
35
  "@atlaskit/analytics-next": "^11.1.0",
36
36
  "@atlaskit/ds-lib": "^5.2.0",
37
- "@atlaskit/layering": "^3.3.0",
37
+ "@atlaskit/layering": "^3.4.0",
38
38
  "@atlaskit/motion": "^5.3.0",
39
39
  "@atlaskit/platform-feature-flags": "^1.1.0",
40
40
  "@atlaskit/popper": "^7.1.0",
@@ -99,6 +99,9 @@
99
99
  },
100
100
  "should-render-to-parent-should-be-true-design-syst": {
101
101
  "type": "boolean"
102
+ },
103
+ "platform-tooltip-shortcuts-regular-font": {
104
+ "type": "boolean"
102
105
  }
103
106
  }
104
107
  }