@atlaskit/link-picker 1.9.0 → 1.9.2

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 (15) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/cjs/ui/link-picker/list-item/index.js +7 -1
  3. package/dist/cjs/ui/link-picker/list-item/styled.js +9 -5
  4. package/dist/cjs/ui/link-picker/text-input/index.js +7 -5
  5. package/dist/cjs/version.json +1 -1
  6. package/dist/es2019/ui/link-picker/list-item/index.js +8 -2
  7. package/dist/es2019/ui/link-picker/list-item/styled.js +8 -0
  8. package/dist/es2019/ui/link-picker/text-input/index.js +7 -5
  9. package/dist/es2019/version.json +1 -1
  10. package/dist/esm/ui/link-picker/list-item/index.js +8 -2
  11. package/dist/esm/ui/link-picker/list-item/styled.js +6 -4
  12. package/dist/esm/ui/link-picker/text-input/index.js +7 -5
  13. package/dist/esm/version.json +1 -1
  14. package/dist/types/ui/link-picker/list-item/styled.d.ts +2 -0
  15. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @atlaskit/link-picker
2
2
 
3
+ ## 1.9.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [`c37f08a275a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c37f08a275a) - Fix onClick event bubbling on text field clear button activation.
8
+
9
+ ## 1.9.1
10
+
11
+ ### Patch Changes
12
+
13
+ - [`548071512ad`](https://bitbucket.org/atlassian/atlassian-frontend/commits/548071512ad) - [ux] Add truncating logic to metadata to be constrained to one line
14
+
3
15
  ## 1.9.0
4
16
 
5
17
  ### Minor Changes
package/dist/cjs/ui/link-picker/list-item/index.js CHANGED
@@ -63,7 +63,13 @@ var LinkSearchListItem = function LinkSearchListItem(_ref) {
63
63
  }, item.name), (0, _react2.jsx)("div", {
64
64
  "data-testid": "".concat(_.testIds.searchResultItem, "-subtitle"),
65
65
  css: _styled.listItemContextStyles
66
- }, container, container && date && (0, _react2.jsx)(_react.Fragment, null, "\xA0 \u2022\xA0 "), date && (0, _react2.jsx)(_react.Fragment, null, formatDate(date)))));
66
+ }, container && (0, _react2.jsx)("div", {
67
+ css: _styled.listItemContainerStyles
68
+ }, (0, _react2.jsx)("span", {
69
+ css: _styled.listItemContainerInnerStyles
70
+ }, container)), date && (0, _react2.jsx)("div", {
71
+ css: _styled.listItemContainerInnerStyles
72
+ }, container && (0, _react2.jsx)(_react.Fragment, null, "\xA0 \u2022\xA0 "), (0, _react2.jsx)(_react.Fragment, null, formatDate(date))))));
67
73
  };
68
74
 
69
75
  var _default = (0, _reactIntlNext.injectIntl)(LinkSearchListItem);
package/dist/cjs/ui/link-picker/list-item/styled.js CHANGED
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.relativeFontSizeToBase16 = exports.listItemNameStyles = exports.listItemContextStyles = exports.itemNameStyles = exports.itemIconStyles = exports.imgStyles = exports.composeListItemStyles = void 0;
8
+ exports.relativeFontSizeToBase16 = exports.listItemNameStyles = exports.listItemContextStyles = exports.listItemContainerStyles = exports.listItemContainerInnerStyles = exports.itemNameStyles = exports.itemIconStyles = exports.imgStyles = exports.composeListItemStyles = void 0;
9
9
 
10
10
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
11
 
@@ -19,7 +19,7 @@ var _constants = require("@atlaskit/theme/constants");
19
19
 
20
20
  var _theme = require("@atlaskit/theme");
21
21
 
22
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
22
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
23
23
 
24
24
  var relativeFontSizeToBase16 = function relativeFontSizeToBase16(px) {
25
25
  if (typeof px === 'string') {
@@ -51,9 +51,13 @@ var itemNameStyles = (0, _react.css)(_templateObject6 || (_templateObject6 = (0,
51
51
  exports.itemNameStyles = itemNameStyles;
52
52
  var listItemNameStyles = (0, _react.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n color: ", ";\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n line-height: 20px;\n"])), (0, _tokens.token)('color.text', _colors.N800));
53
53
  exports.listItemNameStyles = listItemNameStyles;
54
- var listItemContextStyles = (0, _react.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n color: ", ";\n font-size: ", ";\n line-height: ", "px;\n"])), (0, _tokens.token)('color.text', _colors.N300), relativeFontSizeToBase16((0, _theme.fontSizeSmall)()), (0, _theme.fontSize)());
54
+ var listItemContextStyles = (0, _react.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n color: ", ";\n font-size: ", ";\n line-height: ", "px;\n display: flex;\n"])), (0, _tokens.token)('color.text', _colors.N300), relativeFontSizeToBase16((0, _theme.fontSizeSmall)()), (0, _theme.fontSize)());
55
55
  exports.listItemContextStyles = listItemContextStyles;
56
- var itemIconStyles = (0, _react.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n min-width: ", "px;\n margin-top: 3px;\n margin-right: 12px;\n"])), (0, _constants.gridSize)() * 2);
56
+ var listItemContainerStyles = (0, _react.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n overflow: hidden;\n text-overflow: ellipsis;\n"])));
57
+ exports.listItemContainerStyles = listItemContainerStyles;
58
+ var listItemContainerInnerStyles = (0, _react.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n white-space: nowrap;\n"])));
59
+ exports.listItemContainerInnerStyles = listItemContainerInnerStyles;
60
+ var itemIconStyles = (0, _react.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n min-width: ", "px;\n margin-top: 3px;\n margin-right: 12px;\n"])), (0, _constants.gridSize)() * 2);
57
61
  exports.itemIconStyles = itemIconStyles;
58
- var imgStyles = (0, _react.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n max-width: ", "px;\n"])), (0, _constants.gridSize)() * 2);
62
+ var imgStyles = (0, _react.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n max-width: ", "px;\n"])), (0, _constants.gridSize)() * 2);
59
63
  exports.imgStyles = imgStyles;
package/dist/cjs/ui/link-picker/text-input/index.js CHANGED
@@ -72,11 +72,13 @@ var PanelTextInput = function PanelTextInput(props) {
72
72
  onKeyDown(e);
73
73
  }
74
74
  }, [onUndo, onRedo, onKeyDown]);
75
- var handleClear = (0, _react.useCallback)(function () {
76
- if (inputRef.current && onClear) {
77
- inputRef.current.focus();
78
- onClear(name);
79
- }
75
+ var handleClear = (0, _react.useCallback)(function (e) {
76
+ var _inputRef$current;
77
+
78
+ e.preventDefault();
79
+ e.stopPropagation();
80
+ onClear === null || onClear === void 0 ? void 0 : onClear(name);
81
+ (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
80
82
  }, [name, onClear]);
81
83
  var clearText = restProps.value !== '' && (0, _react2.jsx)(_tooltip.default, {
82
84
  content: clearLabel
package/dist/cjs/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/link-picker",
3
- "version": "1.9.0",
3
+ "version": "1.9.2",
4
4
  "sideEffects": false
5
5
  }
package/dist/es2019/ui/link-picker/list-item/index.js CHANGED
@@ -3,7 +3,7 @@ import { Fragment } from 'react';
3
3
  import { jsx } from '@emotion/react';
4
4
  import { injectIntl } from 'react-intl-next';
5
5
  import { transformTimeStamp } from '../transformTimeStamp';
6
- import { itemNameStyles, itemIconStyles, listItemContextStyles, listItemNameStyles, composeListItemStyles, imgStyles } from './styled';
6
+ import { itemNameStyles, itemIconStyles, listItemContextStyles, listItemNameStyles, composeListItemStyles, imgStyles, listItemContainerStyles, listItemContainerInnerStyles } from './styled';
7
7
  import { testIds } from '../';
8
8
 
9
9
  const LinkSearchListItem = ({
@@ -45,7 +45,13 @@ const LinkSearchListItem = ({
45
45
  }, item.name), jsx("div", {
46
46
  "data-testid": `${testIds.searchResultItem}-subtitle`,
47
47
  css: listItemContextStyles
48
- }, container, container && date && jsx(Fragment, null, "\xA0 \u2022\xA0 "), date && jsx(Fragment, null, formatDate(date)))));
48
+ }, container && jsx("div", {
49
+ css: listItemContainerStyles
50
+ }, jsx("span", {
51
+ css: listItemContainerInnerStyles
52
+ }, container)), date && jsx("div", {
53
+ css: listItemContainerInnerStyles
54
+ }, container && jsx(Fragment, null, "\xA0 \u2022\xA0 "), jsx(Fragment, null, formatDate(date))))));
49
55
  };
50
56
 
51
57
  export default injectIntl(LinkSearchListItem);
package/dist/es2019/ui/link-picker/list-item/styled.js CHANGED
@@ -54,6 +54,14 @@ export const listItemContextStyles = css`
54
54
  color: ${token('color.text', N300)};
55
55
  font-size: ${relativeFontSizeToBase16(fontSizeSmall())};
56
56
  line-height: ${fontSize()}px;
57
+ display: flex;
58
+ `;
59
+ export const listItemContainerStyles = css`
60
+ overflow: hidden;
61
+ text-overflow: ellipsis;
62
+ `;
63
+ export const listItemContainerInnerStyles = css`
64
+ white-space: nowrap;
57
65
  `;
58
66
  export const itemIconStyles = css`
59
67
  min-width: ${gridSize() * 2}px;
package/dist/es2019/ui/link-picker/text-input/index.js CHANGED
@@ -54,11 +54,13 @@ const PanelTextInput = props => {
54
54
  onKeyDown(e);
55
55
  }
56
56
  }, [onUndo, onRedo, onKeyDown]);
57
- const handleClear = useCallback(() => {
58
- if (inputRef.current && onClear) {
59
- inputRef.current.focus();
60
- onClear(name);
61
- }
57
+ const handleClear = useCallback(e => {
58
+ var _inputRef$current;
59
+
60
+ e.preventDefault();
61
+ e.stopPropagation();
62
+ onClear === null || onClear === void 0 ? void 0 : onClear(name);
63
+ (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
62
64
  }, [name, onClear]);
63
65
  const clearText = restProps.value !== '' && jsx(Tooltip, {
64
66
  content: clearLabel
package/dist/es2019/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/link-picker",
3
- "version": "1.9.0",
3
+ "version": "1.9.2",
4
4
  "sideEffects": false
5
5
  }
package/dist/esm/ui/link-picker/list-item/index.js CHANGED
@@ -3,7 +3,7 @@ import { Fragment } from 'react';
3
3
  import { jsx } from '@emotion/react';
4
4
  import { injectIntl } from 'react-intl-next';
5
5
  import { transformTimeStamp } from '../transformTimeStamp';
6
- import { itemNameStyles, itemIconStyles, listItemContextStyles, listItemNameStyles, composeListItemStyles, imgStyles } from './styled';
6
+ import { itemNameStyles, itemIconStyles, listItemContextStyles, listItemNameStyles, composeListItemStyles, imgStyles, listItemContainerStyles, listItemContainerInnerStyles } from './styled';
7
7
  import { testIds } from '../';
8
8
 
9
9
  var LinkSearchListItem = function LinkSearchListItem(_ref) {
@@ -51,7 +51,13 @@ var LinkSearchListItem = function LinkSearchListItem(_ref) {
51
51
  }, item.name), jsx("div", {
52
52
  "data-testid": "".concat(testIds.searchResultItem, "-subtitle"),
53
53
  css: listItemContextStyles
54
- }, container, container && date && jsx(Fragment, null, "\xA0 \u2022\xA0 "), date && jsx(Fragment, null, formatDate(date)))));
54
+ }, container && jsx("div", {
55
+ css: listItemContainerStyles
56
+ }, jsx("span", {
57
+ css: listItemContainerInnerStyles
58
+ }, container)), date && jsx("div", {
59
+ css: listItemContainerInnerStyles
60
+ }, container && jsx(Fragment, null, "\xA0 \u2022\xA0 "), jsx(Fragment, null, formatDate(date))))));
55
61
  };
56
62
 
57
63
  export default injectIntl(LinkSearchListItem);
package/dist/esm/ui/link-picker/list-item/styled.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
2
2
 
3
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
3
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
4
4
 
5
5
  import { token } from '@atlaskit/tokens';
6
6
  import { css } from '@emotion/react';
@@ -32,6 +32,8 @@ export var composeListItemStyles = function composeListItemStyles() {
32
32
  };
33
33
  export var itemNameStyles = css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n overflow: hidden;\n"])));
34
34
  export var listItemNameStyles = css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n color: ", ";\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n line-height: 20px;\n"])), token('color.text', N800));
35
- export var listItemContextStyles = css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n color: ", ";\n font-size: ", ";\n line-height: ", "px;\n"])), token('color.text', N300), relativeFontSizeToBase16(fontSizeSmall()), fontSize());
36
- export var itemIconStyles = css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n min-width: ", "px;\n margin-top: 3px;\n margin-right: 12px;\n"])), gridSize() * 2);
37
- export var imgStyles = css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n max-width: ", "px;\n"])), gridSize() * 2);
35
+ export var listItemContextStyles = css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n color: ", ";\n font-size: ", ";\n line-height: ", "px;\n display: flex;\n"])), token('color.text', N300), relativeFontSizeToBase16(fontSizeSmall()), fontSize());
36
+ export var listItemContainerStyles = css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n overflow: hidden;\n text-overflow: ellipsis;\n"])));
37
+ export var listItemContainerInnerStyles = css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n white-space: nowrap;\n"])));
38
+ export var itemIconStyles = css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n min-width: ", "px;\n margin-top: 3px;\n margin-right: 12px;\n"])), gridSize() * 2);
39
+ export var imgStyles = css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n max-width: ", "px;\n"])), gridSize() * 2);
package/dist/esm/ui/link-picker/text-input/index.js CHANGED
@@ -55,11 +55,13 @@ var PanelTextInput = function PanelTextInput(props) {
55
55
  onKeyDown(e);
56
56
  }
57
57
  }, [onUndo, onRedo, onKeyDown]);
58
- var handleClear = useCallback(function () {
59
- if (inputRef.current && onClear) {
60
- inputRef.current.focus();
61
- onClear(name);
62
- }
58
+ var handleClear = useCallback(function (e) {
59
+ var _inputRef$current;
60
+
61
+ e.preventDefault();
62
+ e.stopPropagation();
63
+ onClear === null || onClear === void 0 ? void 0 : onClear(name);
64
+ (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
63
65
  }, [name, onClear]);
64
66
  var clearText = restProps.value !== '' && jsx(Tooltip, {
65
67
  content: clearLabel
package/dist/esm/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/link-picker",
3
- "version": "1.9.0",
3
+ "version": "1.9.2",
4
4
  "sideEffects": false
5
5
  }
package/dist/types/ui/link-picker/list-item/styled.d.ts CHANGED
@@ -3,5 +3,7 @@ export declare const composeListItemStyles: (active?: boolean, selected?: boolea
3
3
  export declare const itemNameStyles: import("@emotion/react").SerializedStyles;
4
4
  export declare const listItemNameStyles: import("@emotion/react").SerializedStyles;
5
5
  export declare const listItemContextStyles: import("@emotion/react").SerializedStyles;
6
+ export declare const listItemContainerStyles: import("@emotion/react").SerializedStyles;
7
+ export declare const listItemContainerInnerStyles: import("@emotion/react").SerializedStyles;
6
8
  export declare const itemIconStyles: import("@emotion/react").SerializedStyles;
7
9
  export declare const imgStyles: import("@emotion/react").SerializedStyles;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/link-picker",
3
- "version": "1.9.0",
3
+ "version": "1.9.2",
4
4
  "description": "Standalone link picker",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "publishConfig": {
@@ -56,7 +56,7 @@
56
56
  "@af/codegen": "*",
57
57
  "@atlaskit/activity-provider": "^2.3.2",
58
58
  "@atlaskit/docs": "*",
59
- "@atlaskit/link-analytics": "^1.0.0",
59
+ "@atlaskit/link-analytics": "^1.1.0",
60
60
  "@atlaskit/link-test-helpers": "^1.4.0",
61
61
  "@atlaskit/popup": "^1.4.0",
62
62
  "@atlaskit/ssr": "*",