@atlaskit/smart-card 23.12.1 → 23.12.3

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 +16 -0
  2. package/dist/cjs/version.json +1 -1
  3. package/dist/cjs/view/BlockCard/views/flexible/FlexibleResolvedView.js +18 -3
  4. package/dist/cjs/view/EmbedModal/components/link-info/styled.js +1 -1
  5. package/dist/cjs/view/FlexibleCard/components/actions/action/index.js +1 -1
  6. package/dist/es2019/version.json +1 -1
  7. package/dist/es2019/view/BlockCard/views/flexible/FlexibleResolvedView.js +18 -3
  8. package/dist/es2019/view/EmbedModal/components/link-info/styled.js +1 -0
  9. package/dist/es2019/view/FlexibleCard/components/actions/action/index.js +1 -1
  10. package/dist/esm/version.json +1 -1
  11. package/dist/esm/view/BlockCard/views/flexible/FlexibleResolvedView.js +18 -3
  12. package/dist/esm/view/EmbedModal/components/link-info/styled.js +1 -1
  13. package/dist/esm/view/FlexibleCard/components/actions/action/index.js +1 -1
  14. package/package.json +2 -2
  15. package/report.api.md +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,21 @@
1
1
  # @atlaskit/smart-card
2
2
 
3
+ ## 23.12.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [`27b8d8e0b4b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/27b8d8e0b4b) - [ux] This adds tooltip messages to custom Flexible UI actions.
8
+ Now, when hovering over custom actions, the "content" prop will be displayed in the tooltip.
9
+ This also affects hover preview actions, which now show the tooltip message when hovering over actions inside of the hover preview card.
10
+
11
+ Additionally, some changes have been made to Flexible UI block card actions so that the analytics fired have the same attribute action type as hover preview's.
12
+
13
+ ## 23.12.2
14
+
15
+ ### Patch Changes
16
+
17
+ - [`2c80995745e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/2c80995745e) - Embed Preview Modal: Fix title alignment causing by global override (margin-bottom)
18
+
3
19
  ## 23.12.1
4
20
 
5
21
  ### Patch Changes
package/dist/cjs/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "23.12.1",
3
+ "version": "23.12.3",
4
4
  "sideEffects": false
5
5
  }
package/dist/cjs/view/BlockCard/views/flexible/FlexibleResolvedView.js CHANGED
@@ -111,9 +111,14 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
111
111
  name: _constants.ActionName.PreviewAction,
112
112
  hideIcon: true,
113
113
  onClick: function onClick() {
114
+ analytics.ui.actionClickedEvent({
115
+ id: analyticsId,
116
+ actionType: 'PreviewAction',
117
+ display: _constants.CardDisplay.Block
118
+ });
114
119
  analytics.operational.invokeSucceededEvent({
115
120
  id: analyticsId,
116
- actionType: 'preview',
121
+ actionType: 'PreviewAction',
117
122
  display: _constants.CardDisplay.Block
118
123
  });
119
124
  }
@@ -121,9 +126,14 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
121
126
  name: _constants.ActionName.ViewAction,
122
127
  hideIcon: true,
123
128
  onClick: function onClick() {
129
+ analytics.ui.actionClickedEvent({
130
+ id: analyticsId,
131
+ actionType: 'ViewAction',
132
+ display: _constants.CardDisplay.Block
133
+ });
124
134
  analytics.operational.invokeSucceededEvent({
125
135
  id: analyticsId,
126
- actionType: 'view',
136
+ actionType: 'ViewAction',
127
137
  display: _constants.CardDisplay.Block
128
138
  });
129
139
  }
@@ -131,9 +141,14 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
131
141
  name: _constants.ActionName.DownloadAction,
132
142
  hideIcon: true,
133
143
  onClick: function onClick() {
144
+ analytics.ui.actionClickedEvent({
145
+ id: analyticsId,
146
+ actionType: 'DownloadAction',
147
+ display: _constants.CardDisplay.Block
148
+ });
134
149
  analytics.operational.invokeSucceededEvent({
135
150
  id: analyticsId,
136
- actionType: 'download',
151
+ actionType: 'DownloadAction',
137
152
  display: _constants.CardDisplay.Block
138
153
  });
139
154
  }
package/dist/cjs/view/EmbedModal/components/link-info/styled.js CHANGED
@@ -19,7 +19,7 @@ var iconSize = '24px';
19
19
  var iconCss = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n img,\n span,\n svg {\n height: ", ";\n min-height: ", ";\n max-height: ", ";\n width: ", ";\n min-width: ", ";\n max-width: ", ";\n }\n"])), iconSize, iconSize, iconSize, iconSize, iconSize, iconSize);
20
20
  exports.iconCss = iconCss;
21
21
  var height = '20px';
22
- var titleCss = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n flex: 1 1 auto;\n\n h3 {\n flex: 1 1 auto;\n font-size: 16px;\n font-weight: 400;\n line-height: ", ";\n\n display: -webkit-box;\n overflow: hidden;\n text-overflow: ellipsis;\n word-break: break-word;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n // Fallback options\n @supports not (-webkit-line-clamp: 1) {\n max-height: ", ";\n }\n }\n"])), height, height);
22
+ var titleCss = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n flex: 1 1 auto;\n\n h3 {\n flex: 1 1 auto;\n font-size: 16px;\n font-weight: 400;\n line-height: ", ";\n\n display: -webkit-box;\n margin-bottom: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n word-break: break-word;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n // Fallback options\n @supports not (-webkit-line-clamp: 1) {\n max-height: ", ";\n }\n }\n"])), height, height);
23
23
  exports.titleCss = titleCss;
24
24
  var actionCss = (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex: 0 0 auto;\n gap: 4px;\n line-height: ", ";\n span {\n line-height: ", ";\n }\n\n @media only screen and (max-width: 980px) {\n // Hide resize button if the screen is smaller than the min width\n // or too small to have enough impact to matter.\n .smart-link-resize-button {\n display: none;\n }\n }\n"])), height, height);
25
25
  exports.actionCss = actionCss;
package/dist/cjs/view/FlexibleCard/components/actions/action/index.js CHANGED
@@ -75,7 +75,7 @@ var Action = function Action(_ref) {
75
75
  overrideCss: overrideCss,
76
76
  size: size,
77
77
  testId: testId,
78
- tooltipMessage: tooltipMessage
78
+ tooltipMessage: tooltipMessage || content
79
79
  });
80
80
  }
81
81
  };
package/dist/es2019/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "23.12.1",
3
+ "version": "23.12.3",
4
4
  "sideEffects": false
5
5
  }
package/dist/es2019/view/BlockCard/views/flexible/FlexibleResolvedView.js CHANGED
@@ -78,9 +78,14 @@ const FlexibleResolvedView = ({
78
78
  name: ActionName.PreviewAction,
79
79
  hideIcon: true,
80
80
  onClick: () => {
81
+ analytics.ui.actionClickedEvent({
82
+ id: analyticsId,
83
+ actionType: 'PreviewAction',
84
+ display: CardDisplay.Block
85
+ });
81
86
  analytics.operational.invokeSucceededEvent({
82
87
  id: analyticsId,
83
- actionType: 'preview',
88
+ actionType: 'PreviewAction',
84
89
  display: CardDisplay.Block
85
90
  });
86
91
  }
@@ -88,9 +93,14 @@ const FlexibleResolvedView = ({
88
93
  name: ActionName.ViewAction,
89
94
  hideIcon: true,
90
95
  onClick: () => {
96
+ analytics.ui.actionClickedEvent({
97
+ id: analyticsId,
98
+ actionType: 'ViewAction',
99
+ display: CardDisplay.Block
100
+ });
91
101
  analytics.operational.invokeSucceededEvent({
92
102
  id: analyticsId,
93
- actionType: 'view',
103
+ actionType: 'ViewAction',
94
104
  display: CardDisplay.Block
95
105
  });
96
106
  }
@@ -98,9 +108,14 @@ const FlexibleResolvedView = ({
98
108
  name: ActionName.DownloadAction,
99
109
  hideIcon: true,
100
110
  onClick: () => {
111
+ analytics.ui.actionClickedEvent({
112
+ id: analyticsId,
113
+ actionType: 'DownloadAction',
114
+ display: CardDisplay.Block
115
+ });
101
116
  analytics.operational.invokeSucceededEvent({
102
117
  id: analyticsId,
103
- actionType: 'download',
118
+ actionType: 'DownloadAction',
104
119
  display: CardDisplay.Block
105
120
  });
106
121
  }
package/dist/es2019/view/EmbedModal/components/link-info/styled.js CHANGED
@@ -33,6 +33,7 @@ export const titleCss = css`
33
33
  line-height: ${height};
34
34
 
35
35
  display: -webkit-box;
36
+ margin-bottom: 0;
36
37
  overflow: hidden;
37
38
  text-overflow: ellipsis;
38
39
  word-break: break-word;
package/dist/es2019/view/FlexibleCard/components/actions/action/index.js CHANGED
@@ -56,7 +56,7 @@ const Action = ({
56
56
  overrideCss: overrideCss,
57
57
  size: size,
58
58
  testId: testId,
59
- tooltipMessage: tooltipMessage
59
+ tooltipMessage: tooltipMessage || content
60
60
  });
61
61
  }
62
62
  };
package/dist/esm/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "23.12.1",
3
+ "version": "23.12.3",
4
4
  "sideEffects": false
5
5
  }
package/dist/esm/view/BlockCard/views/flexible/FlexibleResolvedView.js CHANGED
@@ -90,9 +90,14 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
90
90
  name: ActionName.PreviewAction,
91
91
  hideIcon: true,
92
92
  onClick: function onClick() {
93
+ analytics.ui.actionClickedEvent({
94
+ id: analyticsId,
95
+ actionType: 'PreviewAction',
96
+ display: CardDisplay.Block
97
+ });
93
98
  analytics.operational.invokeSucceededEvent({
94
99
  id: analyticsId,
95
- actionType: 'preview',
100
+ actionType: 'PreviewAction',
96
101
  display: CardDisplay.Block
97
102
  });
98
103
  }
@@ -100,9 +105,14 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
100
105
  name: ActionName.ViewAction,
101
106
  hideIcon: true,
102
107
  onClick: function onClick() {
108
+ analytics.ui.actionClickedEvent({
109
+ id: analyticsId,
110
+ actionType: 'ViewAction',
111
+ display: CardDisplay.Block
112
+ });
103
113
  analytics.operational.invokeSucceededEvent({
104
114
  id: analyticsId,
105
- actionType: 'view',
115
+ actionType: 'ViewAction',
106
116
  display: CardDisplay.Block
107
117
  });
108
118
  }
@@ -110,9 +120,14 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
110
120
  name: ActionName.DownloadAction,
111
121
  hideIcon: true,
112
122
  onClick: function onClick() {
123
+ analytics.ui.actionClickedEvent({
124
+ id: analyticsId,
125
+ actionType: 'DownloadAction',
126
+ display: CardDisplay.Block
127
+ });
113
128
  analytics.operational.invokeSucceededEvent({
114
129
  id: analyticsId,
115
- actionType: 'download',
130
+ actionType: 'DownloadAction',
116
131
  display: CardDisplay.Block
117
132
  });
118
133
  }
package/dist/esm/view/EmbedModal/components/link-info/styled.js CHANGED
@@ -7,5 +7,5 @@ export var containerStyles = css(_templateObject || (_templateObject = _taggedTe
7
7
  var iconSize = '24px';
8
8
  export var iconCss = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n img,\n span,\n svg {\n height: ", ";\n min-height: ", ";\n max-height: ", ";\n width: ", ";\n min-width: ", ";\n max-width: ", ";\n }\n"])), iconSize, iconSize, iconSize, iconSize, iconSize, iconSize);
9
9
  var height = '20px';
10
- export var titleCss = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n flex: 1 1 auto;\n\n h3 {\n flex: 1 1 auto;\n font-size: 16px;\n font-weight: 400;\n line-height: ", ";\n\n display: -webkit-box;\n overflow: hidden;\n text-overflow: ellipsis;\n word-break: break-word;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n // Fallback options\n @supports not (-webkit-line-clamp: 1) {\n max-height: ", ";\n }\n }\n"])), height, height);
10
+ export var titleCss = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n flex: 1 1 auto;\n\n h3 {\n flex: 1 1 auto;\n font-size: 16px;\n font-weight: 400;\n line-height: ", ";\n\n display: -webkit-box;\n margin-bottom: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n word-break: break-word;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n // Fallback options\n @supports not (-webkit-line-clamp: 1) {\n max-height: ", ";\n }\n }\n"])), height, height);
11
11
  export var actionCss = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: flex;\n flex: 0 0 auto;\n gap: 4px;\n line-height: ", ";\n span {\n line-height: ", ";\n }\n\n @media only screen and (max-width: 980px) {\n // Hide resize button if the screen is smaller than the min width\n // or too small to have enough impact to matter.\n .smart-link-resize-button {\n display: none;\n }\n }\n"])), height, height);
package/dist/esm/view/FlexibleCard/components/actions/action/index.js CHANGED
@@ -60,7 +60,7 @@ var Action = function Action(_ref) {
60
60
  overrideCss: overrideCss,
61
61
  size: size,
62
62
  testId: testId,
63
- tooltipMessage: tooltipMessage
63
+ tooltipMessage: tooltipMessage || content
64
64
  });
65
65
  }
66
66
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "23.12.1",
3
+ "version": "23.12.3",
4
4
  "description": "Smart card component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -58,7 +58,7 @@
58
58
  "uuid": "^3.1.0"
59
59
  },
60
60
  "peerDependencies": {
61
- "@atlaskit/link-provider": "^1.3.6",
61
+ "@atlaskit/link-provider": "^1.3.8",
62
62
  "react": "^16.8.0",
63
63
  "react-dom": "^16.8.0",
64
64
  "react-intl-next": "npm:react-intl@^5.18.1"
package/report.api.md CHANGED
@@ -1213,7 +1213,7 @@ type VoteCount = {
1213
1213
 
1214
1214
  ```json
1215
1215
  {
1216
- "@atlaskit/link-provider": "^1.3.6",
1216
+ "@atlaskit/link-provider": "^1.3.8",
1217
1217
  "react": "^16.8.0",
1218
1218
  "react-dom": "^16.8.0",
1219
1219
  "react-intl-next": "npm:react-intl@^5.18.1"