@atlaskit/editor-plugin-loom 4.0.12 → 4.0.14

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/CHANGELOG.md +16 -0
  2. package/dist/cjs/ui/ToolbarButtonComponent.js +7 -2
  3. package/dist/es2019/ui/ToolbarButtonComponent.js +8 -3
  4. package/dist/esm/ui/ToolbarButtonComponent.js +8 -3
  5. package/package.json +9 -9
package/CHANGELOG.md CHANGED
@@ -1,5 +1,21 @@
1
1
  # @atlaskit/editor-plugin-loom
2
2
 
3
+ ## 4.0.14
4
+
5
+ ### Patch Changes
6
+
7
+ - [#142932](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/142932)
8
+ [`15a1a0f2b9ee0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/15a1a0f2b9ee0) -
9
+ NO-ISSUE: Add min-width to Loom and AI icons so that they don't bleed out when there isn't enough
10
+ space in the Primary Toolbar.
11
+ - Updated dependencies
12
+
13
+ ## 4.0.13
14
+
15
+ ### Patch Changes
16
+
17
+ - Updated dependencies
18
+
3
19
  ## 4.0.12
4
20
 
5
21
  ### Patch Changes
package/dist/cjs/ui/ToolbarButtonComponent.js CHANGED
@@ -22,6 +22,9 @@ var _video = _interopRequireDefault(require("@atlaskit/icon/core/video"));
22
22
  // This const is derived from the breakpoint where the toolbar hides its icons. It is used to hide the text in the AI button.
23
23
  // Derived from values from platform/packages/editor/editor-core/src/ui/Appearance/FullPage/MainToolbar.tsx
24
24
  var LOOM_BUTTON_WIDTH_BREAKPOINT = 1076;
25
+ var iconMinWidthStyle = (0, _react2.css)({
26
+ minWidth: 24
27
+ });
25
28
  var LoomToolbarButtonInternal = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
26
29
  var disabled = _ref.disabled,
27
30
  api = _ref.api,
@@ -53,11 +56,13 @@ var LoomToolbarButtonInternal = /*#__PURE__*/_react.default.forwardRef(function
53
56
  buttonId: _uiMenu.TOOLBAR_BUTTON.RECORD_VIDEO,
54
57
  disabled: disabled,
55
58
  title: label,
56
- iconBefore: (0, _react2.jsx)(_video.default, {
59
+ iconBefore: (0, _react2.jsx)("span", {
60
+ css: iconMinWidthStyle
61
+ }, (0, _react2.jsx)(_video.default, {
57
62
  label: label,
58
63
  color: disabled ? "var(--ds-icon-disabled, #091E424F)" : "var(--ds-icon-subtle, #626F86)",
59
64
  spacing: "spacious"
60
- }),
65
+ })),
61
66
  selected: selected,
62
67
  onBlur: onBlur,
63
68
  onFocus: onFocus,
package/dist/es2019/ui/ToolbarButtonComponent.js CHANGED
@@ -5,7 +5,7 @@
5
5
  import React from 'react';
6
6
 
7
7
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
8
- import { jsx } from '@emotion/react';
8
+ import { jsx, css } from '@emotion/react';
9
9
  import { injectIntl } from 'react-intl-next';
10
10
  import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
11
11
  import { toolbarInsertBlockMessages } from '@atlaskit/editor-common/messages';
@@ -14,6 +14,9 @@ import VideoIcon from '@atlaskit/icon/core/video';
14
14
  // This const is derived from the breakpoint where the toolbar hides its icons. It is used to hide the text in the AI button.
15
15
  // Derived from values from platform/packages/editor/editor-core/src/ui/Appearance/FullPage/MainToolbar.tsx
16
16
  const LOOM_BUTTON_WIDTH_BREAKPOINT = 1076;
17
+ const iconMinWidthStyle = css({
18
+ minWidth: 24
19
+ });
17
20
  const LoomToolbarButtonInternal = /*#__PURE__*/React.forwardRef(({
18
21
  disabled,
19
22
  api,
@@ -49,11 +52,13 @@ const LoomToolbarButtonInternal = /*#__PURE__*/React.forwardRef(({
49
52
  buttonId: TOOLBAR_BUTTON.RECORD_VIDEO,
50
53
  disabled: disabled,
51
54
  title: label,
52
- iconBefore: jsx(VideoIcon, {
55
+ iconBefore: jsx("span", {
56
+ css: iconMinWidthStyle
57
+ }, jsx(VideoIcon, {
53
58
  label: label,
54
59
  color: disabled ? "var(--ds-icon-disabled, #091E424F)" : "var(--ds-icon-subtle, #626F86)",
55
60
  spacing: "spacious"
56
- }),
61
+ })),
57
62
  selected: selected,
58
63
  onBlur: onBlur,
59
64
  onFocus: onFocus,
package/dist/esm/ui/ToolbarButtonComponent.js CHANGED
@@ -5,7 +5,7 @@
5
5
  import React from 'react';
6
6
 
7
7
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
8
- import { jsx } from '@emotion/react';
8
+ import { jsx, css } from '@emotion/react';
9
9
  import { injectIntl } from 'react-intl-next';
10
10
  import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
11
11
  import { toolbarInsertBlockMessages } from '@atlaskit/editor-common/messages';
@@ -14,6 +14,9 @@ import VideoIcon from '@atlaskit/icon/core/video';
14
14
  // This const is derived from the breakpoint where the toolbar hides its icons. It is used to hide the text in the AI button.
15
15
  // Derived from values from platform/packages/editor/editor-core/src/ui/Appearance/FullPage/MainToolbar.tsx
16
16
  var LOOM_BUTTON_WIDTH_BREAKPOINT = 1076;
17
+ var iconMinWidthStyle = css({
18
+ minWidth: 24
19
+ });
17
20
  var LoomToolbarButtonInternal = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
18
21
  var disabled = _ref.disabled,
19
22
  api = _ref.api,
@@ -45,11 +48,13 @@ var LoomToolbarButtonInternal = /*#__PURE__*/React.forwardRef(function (_ref, re
45
48
  buttonId: TOOLBAR_BUTTON.RECORD_VIDEO,
46
49
  disabled: disabled,
47
50
  title: label,
48
- iconBefore: jsx(VideoIcon, {
51
+ iconBefore: jsx("span", {
52
+ css: iconMinWidthStyle
53
+ }, jsx(VideoIcon, {
49
54
  label: label,
50
55
  color: disabled ? "var(--ds-icon-disabled, #091E424F)" : "var(--ds-icon-subtle, #626F86)",
51
56
  spacing: "spacious"
52
- }),
57
+ })),
53
58
  selected: selected,
54
59
  onBlur: onBlur,
55
60
  onFocus: onFocus,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-loom",
3
- "version": "4.0.12",
3
+ "version": "4.0.14",
4
4
  "description": "Loom plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -37,16 +37,16 @@
37
37
  },
38
38
  "dependencies": {
39
39
  "@atlaskit/button": "^23.0.0",
40
- "@atlaskit/editor-common": "^102.16.0",
40
+ "@atlaskit/editor-common": "^103.9.0",
41
41
  "@atlaskit/editor-plugin-analytics": "^2.2.0",
42
- "@atlaskit/editor-plugin-hyperlink": "^4.3.0",
43
- "@atlaskit/editor-plugin-primary-toolbar": "^3.1.0",
44
- "@atlaskit/editor-plugin-quick-insert": "^2.2.0",
42
+ "@atlaskit/editor-plugin-hyperlink": "^4.4.0",
43
+ "@atlaskit/editor-plugin-primary-toolbar": "^3.2.0",
44
+ "@atlaskit/editor-plugin-quick-insert": "^2.4.0",
45
45
  "@atlaskit/editor-plugin-width": "^3.0.0",
46
46
  "@atlaskit/editor-prosemirror": "7.0.0",
47
- "@atlaskit/icon": "^25.4.0",
47
+ "@atlaskit/icon": "^25.6.0",
48
48
  "@atlaskit/platform-feature-flags": "^1.1.0",
49
- "@atlaskit/tokens": "^4.5.0",
49
+ "@atlaskit/tokens": "^4.8.0",
50
50
  "@babel/runtime": "^7.0.0",
51
51
  "@emotion/react": "^11.7.1",
52
52
  "@loomhq/record-sdk": "^2.36.18"
@@ -62,8 +62,8 @@
62
62
  "@atlaskit/editor-plugin-copy-button": "^2.0.0",
63
63
  "@atlaskit/editor-plugin-decorations": "^2.0.0",
64
64
  "@atlaskit/editor-plugin-editor-disabled": "^2.0.0",
65
- "@atlaskit/editor-plugin-feature-flags": "^1.3.0",
66
- "@atlaskit/editor-plugin-floating-toolbar": "^3.3.0",
65
+ "@atlaskit/editor-plugin-feature-flags": "^1.4.0",
66
+ "@atlaskit/editor-plugin-floating-toolbar": "^3.6.0",
67
67
  "@atlaskit/editor-plugin-grid": "^2.0.0",
68
68
  "@testing-library/react": "^13.4.0",
69
69
  "@testing-library/user-event": "^14.4.3",