@atlaskit/editor-plugin-card 18.2.12 → 18.2.13

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 (8) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/ui/PasteDisplayAsMenu.compiled.css +2 -1
  3. package/dist/cjs/ui/PasteDisplayAsMenu.js +5 -2
  4. package/dist/es2019/ui/PasteDisplayAsMenu.compiled.css +2 -1
  5. package/dist/es2019/ui/PasteDisplayAsMenu.js +6 -3
  6. package/dist/esm/ui/PasteDisplayAsMenu.compiled.css +2 -1
  7. package/dist/esm/ui/PasteDisplayAsMenu.js +6 -3
  8. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-plugin-card
2
2
 
3
+ ## 18.2.13
4
+
5
+ ### Patch Changes
6
+
7
+ - [`32f168dee5a99`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/32f168dee5a99) -
8
+ Add tooltips to the "Display as" appearance buttons (URL, Inline, Card, Embed) in the paste
9
+ actions menu.
10
+
3
11
  ## 18.2.12
4
12
 
5
13
  ### Patch Changes
package/dist/cjs/ui/PasteDisplayAsMenu.compiled.css CHANGED
@@ -6,9 +6,9 @@
6
6
  ._18u0u2gc{margin-left:var(--ds-space-100,8px)}
7
7
  ._19bv1b66{padding-left:var(--ds-space-050,4px)}
8
8
  ._19pku2gc{margin-top:var(--ds-space-100,8px)}
9
- ._1bah1b1v{justify-content:space-around}
10
9
  ._1bah1h6o{justify-content:center}
11
10
  ._1bsb1osq{width:100%}
11
+ ._1e0c11p5{display:grid}
12
12
  ._1e0c1txw{display:flex}
13
13
  ._2hwxu2gc{margin-right:var(--ds-space-100,8px)}
14
14
  ._4cvr1h6o{align-items:center}
@@ -23,6 +23,7 @@
23
23
  ._syaz1gmx{color:var(--ds-text-disabled,#080f214a)}
24
24
  ._syazi7uo{color:var(--ds-text,#292a2e)}
25
25
  ._u5f31b66{padding-right:var(--ds-space-050,4px)}
26
+ ._yv0ehkll{grid-template-columns:1fr}
26
27
  ._irr31dpa:hover{background-color:var(--ds-background-neutral-subtle-hovered,#0515240f)}
27
28
  ._irr3ufnl:hover{background-color:var(--ds-background-selected-hovered,#cfe1fd)}
28
29
  ._1di6fcek:active{background-color:var(--ds-background-neutral-subtle-pressed,#0b120e24)}
package/dist/cjs/ui/PasteDisplayAsMenu.js CHANGED
@@ -46,7 +46,7 @@ var SMART_LINK_DISPLAY_AS_PASTE_MENU_SECTION_KEY = exports.SMART_LINK_DISPLAY_AS
46
46
 
47
47
  var styles = {
48
48
  appearanceBox: "_2rko1qi0 _bfhkhfxm _19pku2gc _2hwxu2gc _otyru2gc _18u0u2gc _ca0q1b66 _u5f31b66 _n3td1b66 _19bv1b66",
49
- iconWrapper: "_1e0c1txw _1bsb1osq _1bah1b1v",
49
+ iconWrapper: "_1e0c11p5 _yv0ehkll _1bsb1osq",
50
50
  iconButton: "_2rko1qi0 _1h6d1l7x _1dqonqa1 _189ee4h9 _4cvr1h6o _syazi7uo _1e0c1txw _4t3izwfg _1bah1h6o _1bsb1osq _bfhksm61 _irr31dpa _1di6fcek",
51
51
  iconButtonSelected: "_2rko1qi0 _1h6dq98m _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk15s3 _syazi7uo _1e0c1txw _4t3izwfg _1bah1h6o _1bsb1osq _irr3ufnl _1di6nozp",
52
52
  iconButtonDisabled: "_2rko1qi0 _1h6dbk0g _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk187o _syaz1gmx _1e0c1txw _4t3izwfg _1bah1h6o _1bsb1osq"
@@ -60,6 +60,9 @@ var AppearanceOptionIconButton = function AppearanceOptionIconButton(_ref) {
60
60
  onClick = _ref.onClick;
61
61
  return /*#__PURE__*/_react.default.createElement(_compiled.Box, {
62
62
  xcss: styles.iconWrapper
63
+ }, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarTooltip, {
64
+ content: label,
65
+ position: "bottom"
63
66
  }, /*#__PURE__*/_react.default.createElement(_compiled.Pressable, {
64
67
  xcss: (0, _css.cx)(styles.iconButton, isDisabled && styles.iconButtonDisabled, !isDisabled && currentAppearance === appearance && styles.iconButtonSelected),
65
68
  "aria-label": label,
@@ -68,7 +71,7 @@ var AppearanceOptionIconButton = function AppearanceOptionIconButton(_ref) {
68
71
  onClick: onClick
69
72
  }, /*#__PURE__*/_react.default.createElement(Icon, {
70
73
  label: label
71
- })));
74
+ }))));
72
75
  };
73
76
  var InlineAppearanceIconButton = function InlineAppearanceIconButton(_ref2) {
74
77
  var currentAppearance = _ref2.currentAppearance,
package/dist/es2019/ui/PasteDisplayAsMenu.compiled.css CHANGED
@@ -6,9 +6,9 @@
6
6
  ._18u0u2gc{margin-left:var(--ds-space-100,8px)}
7
7
  ._19bv1b66{padding-left:var(--ds-space-050,4px)}
8
8
  ._19pku2gc{margin-top:var(--ds-space-100,8px)}
9
- ._1bah1b1v{justify-content:space-around}
10
9
  ._1bah1h6o{justify-content:center}
11
10
  ._1bsb1osq{width:100%}
11
+ ._1e0c11p5{display:grid}
12
12
  ._1e0c1txw{display:flex}
13
13
  ._2hwxu2gc{margin-right:var(--ds-space-100,8px)}
14
14
  ._4cvr1h6o{align-items:center}
@@ -23,6 +23,7 @@
23
23
  ._syaz1gmx{color:var(--ds-text-disabled,#080f214a)}
24
24
  ._syazi7uo{color:var(--ds-text,#292a2e)}
25
25
  ._u5f31b66{padding-right:var(--ds-space-050,4px)}
26
+ ._yv0ehkll{grid-template-columns:1fr}
26
27
  ._irr31dpa:hover{background-color:var(--ds-background-neutral-subtle-hovered,#0515240f)}
27
28
  ._irr3ufnl:hover{background-color:var(--ds-background-selected-hovered,#cfe1fd)}
28
29
  ._1di6fcek:active{background-color:var(--ds-background-neutral-subtle-pressed,#0b120e24)}
package/dist/es2019/ui/PasteDisplayAsMenu.js CHANGED
@@ -11,7 +11,7 @@ import { PASTE_MENU, useEditorToolbar } from '@atlaskit/editor-common/toolbar';
11
11
  import { isSupportedInParent } from '@atlaskit/editor-common/utils';
12
12
  import { Fragment } from '@atlaskit/editor-prosemirror/model';
13
13
  import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
14
- import { ToolbarDropdownItemSection, useToolbarDropdownMenu } from '@atlaskit/editor-toolbar';
14
+ import { ToolbarDropdownItemSection, ToolbarTooltip, useToolbarDropdownMenu } from '@atlaskit/editor-toolbar';
15
15
  import MinusIcon from '@atlaskit/icon/core/minus';
16
16
  import SmartLinkCardIcon from '@atlaskit/icon/core/smart-link-card';
17
17
  import SmartLinkEmbedIcon from '@atlaskit/icon/core/smart-link-embed';
@@ -35,7 +35,7 @@ export const SMART_LINK_DISPLAY_AS_PASTE_MENU_SECTION_KEY = 'smart-link-display-
35
35
 
36
36
  const styles = {
37
37
  appearanceBox: "_2rko1qi0 _bfhkhfxm _19pku2gc _2hwxu2gc _otyru2gc _18u0u2gc _ca0q1b66 _u5f31b66 _n3td1b66 _19bv1b66",
38
- iconWrapper: "_1e0c1txw _1bsb1osq _1bah1b1v",
38
+ iconWrapper: "_1e0c11p5 _yv0ehkll _1bsb1osq",
39
39
  iconButton: "_2rko1qi0 _1h6d1l7x _1dqonqa1 _189ee4h9 _4cvr1h6o _syazi7uo _1e0c1txw _4t3izwfg _1bah1h6o _1bsb1osq _bfhksm61 _irr31dpa _1di6fcek",
40
40
  iconButtonSelected: "_2rko1qi0 _1h6dq98m _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk15s3 _syazi7uo _1e0c1txw _4t3izwfg _1bah1h6o _1bsb1osq _irr3ufnl _1di6nozp",
41
41
  iconButtonDisabled: "_2rko1qi0 _1h6dbk0g _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk187o _syaz1gmx _1e0c1txw _4t3izwfg _1bah1h6o _1bsb1osq"
@@ -50,6 +50,9 @@ const AppearanceOptionIconButton = ({
50
50
  }) => {
51
51
  return /*#__PURE__*/React.createElement(Box, {
52
52
  xcss: styles.iconWrapper
53
+ }, /*#__PURE__*/React.createElement(ToolbarTooltip, {
54
+ content: label,
55
+ position: "bottom"
53
56
  }, /*#__PURE__*/React.createElement(Pressable, {
54
57
  xcss: cx(styles.iconButton, isDisabled && styles.iconButtonDisabled, !isDisabled && currentAppearance === appearance && styles.iconButtonSelected),
55
58
  "aria-label": label,
@@ -58,7 +61,7 @@ const AppearanceOptionIconButton = ({
58
61
  onClick: onClick
59
62
  }, /*#__PURE__*/React.createElement(Icon, {
60
63
  label: label
61
- })));
64
+ }))));
62
65
  };
63
66
  const InlineAppearanceIconButton = ({
64
67
  currentAppearance,
package/dist/esm/ui/PasteDisplayAsMenu.compiled.css CHANGED
@@ -6,9 +6,9 @@
6
6
  ._18u0u2gc{margin-left:var(--ds-space-100,8px)}
7
7
  ._19bv1b66{padding-left:var(--ds-space-050,4px)}
8
8
  ._19pku2gc{margin-top:var(--ds-space-100,8px)}
9
- ._1bah1b1v{justify-content:space-around}
10
9
  ._1bah1h6o{justify-content:center}
11
10
  ._1bsb1osq{width:100%}
11
+ ._1e0c11p5{display:grid}
12
12
  ._1e0c1txw{display:flex}
13
13
  ._2hwxu2gc{margin-right:var(--ds-space-100,8px)}
14
14
  ._4cvr1h6o{align-items:center}
@@ -23,6 +23,7 @@
23
23
  ._syaz1gmx{color:var(--ds-text-disabled,#080f214a)}
24
24
  ._syazi7uo{color:var(--ds-text,#292a2e)}
25
25
  ._u5f31b66{padding-right:var(--ds-space-050,4px)}
26
+ ._yv0ehkll{grid-template-columns:1fr}
26
27
  ._irr31dpa:hover{background-color:var(--ds-background-neutral-subtle-hovered,#0515240f)}
27
28
  ._irr3ufnl:hover{background-color:var(--ds-background-selected-hovered,#cfe1fd)}
28
29
  ._1di6fcek:active{background-color:var(--ds-background-neutral-subtle-pressed,#0b120e24)}
package/dist/esm/ui/PasteDisplayAsMenu.js CHANGED
@@ -13,7 +13,7 @@ import { PASTE_MENU, useEditorToolbar } from '@atlaskit/editor-common/toolbar';
13
13
  import { isSupportedInParent } from '@atlaskit/editor-common/utils';
14
14
  import { Fragment } from '@atlaskit/editor-prosemirror/model';
15
15
  import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
16
- import { ToolbarDropdownItemSection, useToolbarDropdownMenu } from '@atlaskit/editor-toolbar';
16
+ import { ToolbarDropdownItemSection, ToolbarTooltip, useToolbarDropdownMenu } from '@atlaskit/editor-toolbar';
17
17
  import MinusIcon from '@atlaskit/icon/core/minus';
18
18
  import SmartLinkCardIcon from '@atlaskit/icon/core/smart-link-card';
19
19
  import SmartLinkEmbedIcon from '@atlaskit/icon/core/smart-link-embed';
@@ -37,7 +37,7 @@ export var SMART_LINK_DISPLAY_AS_PASTE_MENU_SECTION_KEY = 'smart-link-display-as
37
37
 
38
38
  var styles = {
39
39
  appearanceBox: "_2rko1qi0 _bfhkhfxm _19pku2gc _2hwxu2gc _otyru2gc _18u0u2gc _ca0q1b66 _u5f31b66 _n3td1b66 _19bv1b66",
40
- iconWrapper: "_1e0c1txw _1bsb1osq _1bah1b1v",
40
+ iconWrapper: "_1e0c11p5 _yv0ehkll _1bsb1osq",
41
41
  iconButton: "_2rko1qi0 _1h6d1l7x _1dqonqa1 _189ee4h9 _4cvr1h6o _syazi7uo _1e0c1txw _4t3izwfg _1bah1h6o _1bsb1osq _bfhksm61 _irr31dpa _1di6fcek",
42
42
  iconButtonSelected: "_2rko1qi0 _1h6dq98m _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk15s3 _syazi7uo _1e0c1txw _4t3izwfg _1bah1h6o _1bsb1osq _irr3ufnl _1di6nozp",
43
43
  iconButtonDisabled: "_2rko1qi0 _1h6dbk0g _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk187o _syaz1gmx _1e0c1txw _4t3izwfg _1bah1h6o _1bsb1osq"
@@ -51,6 +51,9 @@ var AppearanceOptionIconButton = function AppearanceOptionIconButton(_ref) {
51
51
  onClick = _ref.onClick;
52
52
  return /*#__PURE__*/React.createElement(Box, {
53
53
  xcss: styles.iconWrapper
54
+ }, /*#__PURE__*/React.createElement(ToolbarTooltip, {
55
+ content: label,
56
+ position: "bottom"
54
57
  }, /*#__PURE__*/React.createElement(Pressable, {
55
58
  xcss: cx(styles.iconButton, isDisabled && styles.iconButtonDisabled, !isDisabled && currentAppearance === appearance && styles.iconButtonSelected),
56
59
  "aria-label": label,
@@ -59,7 +62,7 @@ var AppearanceOptionIconButton = function AppearanceOptionIconButton(_ref) {
59
62
  onClick: onClick
60
63
  }, /*#__PURE__*/React.createElement(Icon, {
61
64
  label: label
62
- })));
65
+ }))));
63
66
  };
64
67
  var InlineAppearanceIconButton = function InlineAppearanceIconButton(_ref2) {
65
68
  var currentAppearance = _ref2.currentAppearance,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-card",
3
- "version": "18.2.12",
3
+ "version": "18.2.13",
4
4
  "description": "Card plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -59,7 +59,7 @@
59
59
  "@atlaskit/primitives": "^22.2.0",
60
60
  "@atlaskit/prosemirror-history": "^1.0.0",
61
61
  "@atlaskit/smart-card": "^45.13.0",
62
- "@atlaskit/tmp-editor-statsig": "^135.0.0",
62
+ "@atlaskit/tmp-editor-statsig": "^135.3.0",
63
63
  "@atlaskit/tokens": "^16.3.0",
64
64
  "@babel/runtime": "^7.0.0",
65
65
  "@emotion/react": "^11.7.1",
@@ -69,7 +69,7 @@
69
69
  "uuid": "^3.1.0"
70
70
  },
71
71
  "peerDependencies": {
72
- "@atlaskit/editor-common": "^116.41.0",
72
+ "@atlaskit/editor-common": "^116.44.0",
73
73
  "@atlaskit/link-provider": "^5.2.0",
74
74
  "react": "^18.2.0",
75
75
  "react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"