@atlaskit/editor-plugin-card 6.3.3 → 6.4.1

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 (6) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/compass.yml +8 -1
  3. package/dist/cjs/ui/OpenButtonOverlay/index.js +43 -14
  4. package/dist/es2019/ui/OpenButtonOverlay/index.js +43 -14
  5. package/dist/esm/ui/OpenButtonOverlay/index.js +43 -14
  6. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,26 @@
1
1
  # @atlaskit/editor-plugin-card
2
2
 
3
+ ## 6.4.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#161870](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/161870)
8
+ [`f2008aed97498`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f2008aed97498) -
9
+ Set default value of open text to null
10
+ - Updated dependencies
11
+
12
+ ## 6.4.0
13
+
14
+ ### Minor Changes
15
+
16
+ - [#161266](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/161266)
17
+ [`3eb1f4c974f21`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3eb1f4c974f21) -
18
+ Improved load performance by moving recalculate logic on interaction
19
+
20
+ ### Patch Changes
21
+
22
+ - Updated dependencies
23
+
3
24
  ## 6.3.3
4
25
 
5
26
  ### Patch Changes
package/compass.yml CHANGED
@@ -26,4 +26,11 @@ links:
26
26
  type: REPOSITORY
27
27
  url: 'https://bitbucket.org/atlassian/atlassian-frontend-monorepo/src/master/platform/packages/editor/editor-plugin-card'
28
28
  customFields: []
29
- relationships: {}
29
+ relationships:
30
+ DEPENDS_ON:
31
+ - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/27e8ffab-42db-4c16-9afb-9eefd72d02ec' # link-analytics
32
+ - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/37dc08cd-d81c-4bbb-9b26-5d6d8a417ea3' # link-client-extension
33
+ - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/2833bb40-a2e4-4b79-b74b-147d0d23fdb1' # link-datasource
34
+ - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/18157dad-b7fb-4cde-8b74-e905b5757611' # link-provider
35
+ - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/3d229125-4f9d-4091-a303-84ae4eb643fb' # linking-common
36
+ - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/c9898540-33b1-4cd4-9399-16e575bcedae' # smart-card
package/dist/cjs/ui/OpenButtonOverlay/index.js CHANGED
@@ -15,6 +15,7 @@ var _messages = require("@atlaskit/editor-common/messages");
15
15
  var _linkExternal = _interopRequireDefault(require("@atlaskit/icon/core/link-external"));
16
16
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
17
17
  var _primitives = require("@atlaskit/primitives");
18
+ var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
18
19
  var _toolbar = require("../toolbar");
19
20
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
20
21
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -96,21 +97,26 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
96
97
  _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
97
98
  isHovered = _useState4[0],
98
99
  setHovered = _useState4[1];
99
- var openTextWidthRef = (0, _react.useRef)(DEFAULT_OPEN_TEXT_WIDTH);
100
+ var openTextWidthRef = (0, _react.useRef)(null);
100
101
  (0, _react.useLayoutEffect)(function () {
101
- var hiddenText = hiddenTextRef.current;
102
- if (!hiddenText) {
103
- return;
104
- }
105
- // Measure the width of the hidden text
106
- // Temporarily make the element visible to measure its width
107
- hiddenText.style.visibility = 'hidden';
108
- hiddenText.style.display = 'inline';
109
- openTextWidthRef.current = hiddenText.offsetWidth;
102
+ if ((0, _experiments.editorExperiment)('platform_editor_smart_card_open_overlay_perf', false, {
103
+ exposure: true
104
+ })) {
105
+ var hiddenText = hiddenTextRef.current;
106
+ if (!hiddenText) {
107
+ openTextWidthRef.current = DEFAULT_OPEN_TEXT_WIDTH;
108
+ return;
109
+ }
110
+ // Measure the width of the hidden text
111
+ // Temporarily make the element visible to measure its width
112
+ hiddenText.style.visibility = 'hidden';
113
+ hiddenText.style.display = 'inline';
114
+ openTextWidthRef.current = hiddenText.offsetWidth;
110
115
 
111
- // Reset the hiddenText's display property
112
- hiddenText.style.display = 'none';
113
- hiddenText.style.visibility = 'inherit';
116
+ // Reset the hiddenText's display property
117
+ hiddenText.style.display = 'none';
118
+ hiddenText.style.visibility = 'inherit';
119
+ }
114
120
  }, []);
115
121
  (0, _react.useLayoutEffect)(function () {
116
122
  var _containerRef$current, _openButtonRef$curren;
@@ -119,12 +125,35 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
119
125
  }
120
126
  var cardWidth = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.offsetWidth;
121
127
  var openButtonWidth = (_openButtonRef$curren = openButtonRef.current) === null || _openButtonRef$curren === void 0 ? void 0 : _openButtonRef$curren.offsetWidth;
128
+
129
+ // Get the hidden text width
130
+ if ((0, _experiments.editorExperiment)('platform_editor_smart_card_open_overlay_perf', true, {
131
+ exposure: true
132
+ })) {
133
+ if (!openTextWidthRef.current) {
134
+ var hiddenText = hiddenTextRef.current;
135
+ if (hiddenText) {
136
+ // Measure the width of the hidden text
137
+ // Temporarily make the element visible to measure its width
138
+ hiddenText.style.visibility = 'hidden';
139
+ hiddenText.style.display = 'inline';
140
+ openTextWidthRef.current = hiddenText.offsetWidth;
141
+
142
+ // Reset the hiddenText's display property
143
+ hiddenText.style.display = 'none';
144
+ hiddenText.style.visibility = 'inherit';
145
+ } else {
146
+ openTextWidthRef.current = DEFAULT_OPEN_TEXT_WIDTH;
147
+ }
148
+ }
149
+ }
122
150
  if (!cardWidth || !openButtonWidth) {
123
151
  return;
124
152
  }
153
+ var openTextWidth = openTextWidthRef.current || DEFAULT_OPEN_TEXT_WIDTH;
125
154
  var canShowLabel = true;
126
155
  if ((0, _platformFeatureFlags.fg)('platform_editor_controls_patch_2')) {
127
- canShowLabel = cardWidth - openTextWidthRef.current > MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY + ICON_WIDTH;
156
+ canShowLabel = cardWidth - openTextWidth > MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY + ICON_WIDTH;
128
157
  } else {
129
158
  canShowLabel = cardWidth - openButtonWidth > MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY;
130
159
  }
package/dist/es2019/ui/OpenButtonOverlay/index.js CHANGED
@@ -13,6 +13,7 @@ import { cardMessages } from '@atlaskit/editor-common/messages';
13
13
  import LinkExternalIcon from '@atlaskit/icon/core/link-external';
14
14
  import { fg } from '@atlaskit/platform-feature-flags';
15
15
  import { Anchor, Box, Text, xcss } from '@atlaskit/primitives';
16
+ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
16
17
  import { visitCardLinkAnalyticsOnly } from '../toolbar';
17
18
  const containerStyles = css({
18
19
  position: 'relative'
@@ -76,21 +77,26 @@ const OpenButtonOverlay = ({
76
77
  const hiddenTextRef = useRef(null);
77
78
  const [showLabel, setShowLabel] = useState(true);
78
79
  const [isHovered, setHovered] = useState(false);
79
- const openTextWidthRef = useRef(DEFAULT_OPEN_TEXT_WIDTH);
80
+ const openTextWidthRef = useRef(null);
80
81
  useLayoutEffect(() => {
81
- const hiddenText = hiddenTextRef.current;
82
- if (!hiddenText) {
83
- return;
84
- }
85
- // Measure the width of the hidden text
86
- // Temporarily make the element visible to measure its width
87
- hiddenText.style.visibility = 'hidden';
88
- hiddenText.style.display = 'inline';
89
- openTextWidthRef.current = hiddenText.offsetWidth;
82
+ if (editorExperiment('platform_editor_smart_card_open_overlay_perf', false, {
83
+ exposure: true
84
+ })) {
85
+ const hiddenText = hiddenTextRef.current;
86
+ if (!hiddenText) {
87
+ openTextWidthRef.current = DEFAULT_OPEN_TEXT_WIDTH;
88
+ return;
89
+ }
90
+ // Measure the width of the hidden text
91
+ // Temporarily make the element visible to measure its width
92
+ hiddenText.style.visibility = 'hidden';
93
+ hiddenText.style.display = 'inline';
94
+ openTextWidthRef.current = hiddenText.offsetWidth;
90
95
 
91
- // Reset the hiddenText's display property
92
- hiddenText.style.display = 'none';
93
- hiddenText.style.visibility = 'inherit';
96
+ // Reset the hiddenText's display property
97
+ hiddenText.style.display = 'none';
98
+ hiddenText.style.visibility = 'inherit';
99
+ }
94
100
  }, []);
95
101
  useLayoutEffect(() => {
96
102
  var _containerRef$current, _openButtonRef$curren;
@@ -99,12 +105,35 @@ const OpenButtonOverlay = ({
99
105
  }
100
106
  const cardWidth = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.offsetWidth;
101
107
  const openButtonWidth = (_openButtonRef$curren = openButtonRef.current) === null || _openButtonRef$curren === void 0 ? void 0 : _openButtonRef$curren.offsetWidth;
108
+
109
+ // Get the hidden text width
110
+ if (editorExperiment('platform_editor_smart_card_open_overlay_perf', true, {
111
+ exposure: true
112
+ })) {
113
+ if (!openTextWidthRef.current) {
114
+ const hiddenText = hiddenTextRef.current;
115
+ if (hiddenText) {
116
+ // Measure the width of the hidden text
117
+ // Temporarily make the element visible to measure its width
118
+ hiddenText.style.visibility = 'hidden';
119
+ hiddenText.style.display = 'inline';
120
+ openTextWidthRef.current = hiddenText.offsetWidth;
121
+
122
+ // Reset the hiddenText's display property
123
+ hiddenText.style.display = 'none';
124
+ hiddenText.style.visibility = 'inherit';
125
+ } else {
126
+ openTextWidthRef.current = DEFAULT_OPEN_TEXT_WIDTH;
127
+ }
128
+ }
129
+ }
102
130
  if (!cardWidth || !openButtonWidth) {
103
131
  return;
104
132
  }
133
+ const openTextWidth = openTextWidthRef.current || DEFAULT_OPEN_TEXT_WIDTH;
105
134
  let canShowLabel = true;
106
135
  if (fg('platform_editor_controls_patch_2')) {
107
- canShowLabel = cardWidth - openTextWidthRef.current > MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY + ICON_WIDTH;
136
+ canShowLabel = cardWidth - openTextWidth > MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY + ICON_WIDTH;
108
137
  } else {
109
138
  canShowLabel = cardWidth - openButtonWidth > MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY;
110
139
  }
package/dist/esm/ui/OpenButtonOverlay/index.js CHANGED
@@ -14,6 +14,7 @@ import { cardMessages } from '@atlaskit/editor-common/messages';
14
14
  import LinkExternalIcon from '@atlaskit/icon/core/link-external';
15
15
  import { fg } from '@atlaskit/platform-feature-flags';
16
16
  import { Anchor, Box, Text, xcss } from '@atlaskit/primitives';
17
+ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
17
18
  import { visitCardLinkAnalyticsOnly } from '../toolbar';
18
19
  var containerStyles = css({
19
20
  position: 'relative'
@@ -82,21 +83,26 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
82
83
  _useState4 = _slicedToArray(_useState3, 2),
83
84
  isHovered = _useState4[0],
84
85
  setHovered = _useState4[1];
85
- var openTextWidthRef = useRef(DEFAULT_OPEN_TEXT_WIDTH);
86
+ var openTextWidthRef = useRef(null);
86
87
  useLayoutEffect(function () {
87
- var hiddenText = hiddenTextRef.current;
88
- if (!hiddenText) {
89
- return;
90
- }
91
- // Measure the width of the hidden text
92
- // Temporarily make the element visible to measure its width
93
- hiddenText.style.visibility = 'hidden';
94
- hiddenText.style.display = 'inline';
95
- openTextWidthRef.current = hiddenText.offsetWidth;
88
+ if (editorExperiment('platform_editor_smart_card_open_overlay_perf', false, {
89
+ exposure: true
90
+ })) {
91
+ var hiddenText = hiddenTextRef.current;
92
+ if (!hiddenText) {
93
+ openTextWidthRef.current = DEFAULT_OPEN_TEXT_WIDTH;
94
+ return;
95
+ }
96
+ // Measure the width of the hidden text
97
+ // Temporarily make the element visible to measure its width
98
+ hiddenText.style.visibility = 'hidden';
99
+ hiddenText.style.display = 'inline';
100
+ openTextWidthRef.current = hiddenText.offsetWidth;
96
101
 
97
- // Reset the hiddenText's display property
98
- hiddenText.style.display = 'none';
99
- hiddenText.style.visibility = 'inherit';
102
+ // Reset the hiddenText's display property
103
+ hiddenText.style.display = 'none';
104
+ hiddenText.style.visibility = 'inherit';
105
+ }
100
106
  }, []);
101
107
  useLayoutEffect(function () {
102
108
  var _containerRef$current, _openButtonRef$curren;
@@ -105,12 +111,35 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
105
111
  }
106
112
  var cardWidth = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.offsetWidth;
107
113
  var openButtonWidth = (_openButtonRef$curren = openButtonRef.current) === null || _openButtonRef$curren === void 0 ? void 0 : _openButtonRef$curren.offsetWidth;
114
+
115
+ // Get the hidden text width
116
+ if (editorExperiment('platform_editor_smart_card_open_overlay_perf', true, {
117
+ exposure: true
118
+ })) {
119
+ if (!openTextWidthRef.current) {
120
+ var hiddenText = hiddenTextRef.current;
121
+ if (hiddenText) {
122
+ // Measure the width of the hidden text
123
+ // Temporarily make the element visible to measure its width
124
+ hiddenText.style.visibility = 'hidden';
125
+ hiddenText.style.display = 'inline';
126
+ openTextWidthRef.current = hiddenText.offsetWidth;
127
+
128
+ // Reset the hiddenText's display property
129
+ hiddenText.style.display = 'none';
130
+ hiddenText.style.visibility = 'inherit';
131
+ } else {
132
+ openTextWidthRef.current = DEFAULT_OPEN_TEXT_WIDTH;
133
+ }
134
+ }
135
+ }
108
136
  if (!cardWidth || !openButtonWidth) {
109
137
  return;
110
138
  }
139
+ var openTextWidth = openTextWidthRef.current || DEFAULT_OPEN_TEXT_WIDTH;
111
140
  var canShowLabel = true;
112
141
  if (fg('platform_editor_controls_patch_2')) {
113
- canShowLabel = cardWidth - openTextWidthRef.current > MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY + ICON_WIDTH;
142
+ canShowLabel = cardWidth - openTextWidth > MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY + ICON_WIDTH;
114
143
  } else {
115
144
  canShowLabel = cardWidth - openButtonWidth > MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY;
116
145
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-card",
3
- "version": "6.3.3",
3
+ "version": "6.4.1",
4
4
  "description": "Card plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -37,7 +37,7 @@
37
37
  "@atlaskit/analytics-next": "^11.0.0",
38
38
  "@atlaskit/button": "^23.2.0",
39
39
  "@atlaskit/custom-steps": "^0.11.0",
40
- "@atlaskit/editor-common": "^105.10.0",
40
+ "@atlaskit/editor-common": "^106.0.0",
41
41
  "@atlaskit/editor-plugin-analytics": "^2.3.0",
42
42
  "@atlaskit/editor-plugin-base": "^3.0.0",
43
43
  "@atlaskit/editor-plugin-connectivity": "^2.0.0",
@@ -51,7 +51,7 @@
51
51
  "@atlaskit/editor-prosemirror": "7.0.0",
52
52
  "@atlaskit/editor-shared-styles": "^3.4.0",
53
53
  "@atlaskit/frontend-utilities": "^3.0.0",
54
- "@atlaskit/icon": "^26.3.0",
54
+ "@atlaskit/icon": "^26.4.0",
55
55
  "@atlaskit/link": "^3.2.0",
56
56
  "@atlaskit/link-analytics": "^10.0.0",
57
57
  "@atlaskit/link-client-extension": "^5.0.0",
@@ -63,7 +63,7 @@
63
63
  "@atlaskit/primitives": "^14.8.0",
64
64
  "@atlaskit/smart-card": "^38.5.0",
65
65
  "@atlaskit/theme": "^18.0.0",
66
- "@atlaskit/tmp-editor-statsig": "^5.0.0",
66
+ "@atlaskit/tmp-editor-statsig": "^5.2.0",
67
67
  "@atlaskit/tokens": "^4.9.0",
68
68
  "@babel/runtime": "^7.0.0",
69
69
  "@emotion/react": "^11.7.1",
@@ -174,5 +174,5 @@
174
174
  "checkDevDependencies": true
175
175
  }
176
176
  },
177
- "compassUnitTestMetricSourceId": "ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:metric-source/c5751cc6-3513-4070-9deb-af31e86aed34/44b8f355-366d-4e0c-a22a-1ba5a6106330"
177
+ "compassUnitTestMetricSourceId": "ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:metric-source/c5751cc6-3513-4070-9deb-af31e86aed34/e6f3220b-0ca2-445a-a4c5-78cff6ca2a34"
178
178
  }