@atlaskit/editor-toolbar 1.6.1 → 1.7.0

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 (7) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/cjs/ui/ToolbarDropdownItem.js +26 -2
  3. package/dist/es2019/ui/ToolbarDropdownItem.js +24 -0
  4. package/dist/esm/ui/ToolbarDropdownItem.js +26 -2
  5. package/dist/types/ui/ToolbarDropdownItem.d.ts +9 -3
  6. package/dist/types-ts4.5/ui/ToolbarDropdownItem.d.ts +9 -3
  7. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,19 @@
1
1
  # @atlaskit/editor-toolbar
2
2
 
3
+ ## 1.7.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`cae3f93f31a3f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cae3f93f31a3f) -
8
+ Wire up actions with row menu refactor, add focus, blue, mouseenter and mouseleave events to
9
+ ToolbarDropdownItem
10
+
11
+ ## 1.6.2
12
+
13
+ ### Patch Changes
14
+
15
+ - Updated dependencies
16
+
3
17
  ## 1.6.1
4
18
 
5
19
  ### Patch Changes
package/dist/cjs/ui/ToolbarDropdownItem.js CHANGED
@@ -20,8 +20,8 @@ var _compiled = require("@atlaskit/primitives/compiled");
20
20
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
21
21
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
22
22
  var _ToolbarDropdownMenuContext = require("./ToolbarDropdownMenuContext");
23
- var _excluded = ["children", "data-testid", "aria-haspopup", "aria-disabled", "aria-pressed", "aria-keyshortcuts", "onClick", "tabIndex", "href", "target", "rel", "title"],
24
- _excluded2 = ["onClick", "elemBefore", "elemAfter", "elemAfterText", "isSelected", "children", "isDisabled", "hasNestedDropdownMenu", "triggerRef", "title", "shouldTitleWrap", "testId", "ariaKeyshortcuts", "href", "target", "rel"];
23
+ var _excluded = ["children", "data-testid", "aria-haspopup", "aria-disabled", "aria-pressed", "aria-keyshortcuts", "onClick", "onBlur", "onFocus", "onMouseEnter", "onMouseLeave", "tabIndex", "href", "target", "rel", "title"],
24
+ _excluded2 = ["onClick", "onBlur", "onFocus", "onMouseEnter", "onMouseLeave", "elemBefore", "elemAfter", "elemAfterText", "isSelected", "children", "isDisabled", "hasNestedDropdownMenu", "triggerRef", "title", "shouldTitleWrap", "testId", "ariaKeyshortcuts", "href", "target", "rel"];
25
25
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
26
26
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
27
27
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -41,6 +41,10 @@ var CustomDropdownMenuItemButton = /*#__PURE__*/(0, _react.forwardRef)(function
41
41
  ariaPressed = _ref['aria-pressed'],
42
42
  ariaKeyshortcuts = _ref['aria-keyshortcuts'],
43
43
  onClick = _ref.onClick,
44
+ onBlur = _ref.onBlur,
45
+ onFocus = _ref.onFocus,
46
+ onMouseEnter = _ref.onMouseEnter,
47
+ onMouseLeave = _ref.onMouseLeave,
44
48
  tabIndex = _ref.tabIndex,
45
49
  title = _ref.title,
46
50
  dataExtensionItemKey = _ref['data-extension-item-key'];
@@ -49,6 +53,10 @@ var CustomDropdownMenuItemButton = /*#__PURE__*/(0, _react.forwardRef)(function
49
53
  testId: testId,
50
54
  xcss: (0, _css.cx)(styles.toolbarDropdownItem, ariaDisabled ? styles.disabled : ariaPressed ? styles.selected : styles.enabled),
51
55
  onClick: onClick,
56
+ onBlur: onBlur,
57
+ onFocus: onFocus,
58
+ onMouseEnter: onMouseEnter,
59
+ onMouseLeave: onMouseLeave,
52
60
  tabIndex: tabIndex,
53
61
  "aria-haspopup": ariaHasPopup,
54
62
  "aria-expanded": ariaHasPopup ? ariaPressed ? true : false : undefined,
@@ -72,6 +80,10 @@ var CustomDropdownMenuItemAnchor = /*#__PURE__*/(0, _react.forwardRef)(function
72
80
  ariaPressed = _ref2['aria-pressed'],
73
81
  ariaKeyshortcuts = _ref2['aria-keyshortcuts'],
74
82
  onClick = _ref2.onClick,
83
+ onBlur = _ref2.onBlur,
84
+ onFocus = _ref2.onFocus,
85
+ onMouseEnter = _ref2.onMouseEnter,
86
+ onMouseLeave = _ref2.onMouseLeave,
75
87
  tabIndex = _ref2.tabIndex,
76
88
  href = _ref2.href,
77
89
  target = _ref2.target,
@@ -83,6 +95,10 @@ var CustomDropdownMenuItemAnchor = /*#__PURE__*/(0, _react.forwardRef)(function
83
95
  testId: testId,
84
96
  xcss: (0, _css.cx)(styles.toolbarDropdownItem, styles.anchor, ariaDisabled ? styles.disabled : ariaPressed ? styles.selected : styles.enabled),
85
97
  onClick: onClick,
98
+ onBlur: onBlur,
99
+ onFocus: onFocus,
100
+ onMouseEnter: onMouseEnter,
101
+ onMouseLeave: onMouseLeave,
86
102
  tabIndex: tabIndex,
87
103
  "aria-haspopup": ariaHasPopup,
88
104
  "aria-expanded": ariaHasPopup ? ariaPressed ? true : false : undefined,
@@ -103,6 +119,10 @@ var CustomDropdownMenuItemAnchor = /*#__PURE__*/(0, _react.forwardRef)(function
103
119
  });
104
120
  var ToolbarDropdownItem = exports.ToolbarDropdownItem = function ToolbarDropdownItem(_ref3) {
105
121
  var _onClick = _ref3.onClick,
122
+ onBlur = _ref3.onBlur,
123
+ onFocus = _ref3.onFocus,
124
+ onMouseEnter = _ref3.onMouseEnter,
125
+ onMouseLeave = _ref3.onMouseLeave,
106
126
  elemBefore = _ref3.elemBefore,
107
127
  elemAfter = _ref3.elemAfter,
108
128
  elemAfterText = _ref3.elemAfterText,
@@ -142,6 +162,10 @@ var ToolbarDropdownItem = exports.ToolbarDropdownItem = function ToolbarDropdown
142
162
  }
143
163
  _onClick === null || _onClick === void 0 || _onClick(e);
144
164
  },
165
+ onBlur: onBlur,
166
+ onFocus: onFocus,
167
+ onMouseEnter: onMouseEnter,
168
+ onMouseLeave: onMouseLeave,
145
169
  elemBefore: elemBefore,
146
170
  elemAfter: injectedElemAfter,
147
171
  isSelected: isSelected,
package/dist/es2019/ui/ToolbarDropdownItem.js CHANGED
@@ -26,6 +26,10 @@ const CustomDropdownMenuItemButton = /*#__PURE__*/forwardRef(({
26
26
  'aria-pressed': ariaPressed,
27
27
  'aria-keyshortcuts': ariaKeyshortcuts,
28
28
  onClick,
29
+ onBlur,
30
+ onFocus,
31
+ onMouseEnter,
32
+ onMouseLeave,
29
33
  tabIndex,
30
34
  title,
31
35
  'data-extension-item-key': dataExtensionItemKey
@@ -34,6 +38,10 @@ const CustomDropdownMenuItemButton = /*#__PURE__*/forwardRef(({
34
38
  testId: testId,
35
39
  xcss: cx(styles.toolbarDropdownItem, ariaDisabled ? styles.disabled : ariaPressed ? styles.selected : styles.enabled),
36
40
  onClick: onClick,
41
+ onBlur: onBlur,
42
+ onFocus: onFocus,
43
+ onMouseEnter: onMouseEnter,
44
+ onMouseLeave: onMouseLeave,
37
45
  tabIndex: tabIndex,
38
46
  "aria-haspopup": ariaHasPopup,
39
47
  "aria-expanded": ariaHasPopup ? ariaPressed ? true : false : undefined,
@@ -56,6 +64,10 @@ const CustomDropdownMenuItemAnchor = /*#__PURE__*/forwardRef(({
56
64
  'aria-pressed': ariaPressed,
57
65
  'aria-keyshortcuts': ariaKeyshortcuts,
58
66
  onClick,
67
+ onBlur,
68
+ onFocus,
69
+ onMouseEnter,
70
+ onMouseLeave,
59
71
  tabIndex,
60
72
  href,
61
73
  target,
@@ -67,6 +79,10 @@ const CustomDropdownMenuItemAnchor = /*#__PURE__*/forwardRef(({
67
79
  testId: testId,
68
80
  xcss: cx(styles.toolbarDropdownItem, styles.anchor, ariaDisabled ? styles.disabled : ariaPressed ? styles.selected : styles.enabled),
69
81
  onClick: onClick,
82
+ onBlur: onBlur,
83
+ onFocus: onFocus,
84
+ onMouseEnter: onMouseEnter,
85
+ onMouseLeave: onMouseLeave,
70
86
  tabIndex: tabIndex,
71
87
  "aria-haspopup": ariaHasPopup,
72
88
  "aria-expanded": ariaHasPopup ? ariaPressed ? true : false : undefined,
@@ -86,6 +102,10 @@ const CustomDropdownMenuItemAnchor = /*#__PURE__*/forwardRef(({
86
102
  }, dataAttributes), children));
87
103
  export const ToolbarDropdownItem = ({
88
104
  onClick,
105
+ onBlur,
106
+ onFocus,
107
+ onMouseEnter,
108
+ onMouseLeave,
89
109
  elemBefore,
90
110
  elemAfter,
91
111
  elemAfterText,
@@ -126,6 +146,10 @@ export const ToolbarDropdownItem = ({
126
146
  }
127
147
  onClick === null || onClick === void 0 ? void 0 : onClick(e);
128
148
  },
149
+ onBlur: onBlur,
150
+ onFocus: onFocus,
151
+ onMouseEnter: onMouseEnter,
152
+ onMouseLeave: onMouseLeave,
129
153
  elemBefore: elemBefore,
130
154
  elemAfter: injectedElemAfter,
131
155
  isSelected: isSelected,
package/dist/esm/ui/ToolbarDropdownItem.js CHANGED
@@ -2,8 +2,8 @@
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  import _extends from "@babel/runtime/helpers/extends";
4
4
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
5
- var _excluded = ["children", "data-testid", "aria-haspopup", "aria-disabled", "aria-pressed", "aria-keyshortcuts", "onClick", "tabIndex", "href", "target", "rel", "title"],
6
- _excluded2 = ["onClick", "elemBefore", "elemAfter", "elemAfterText", "isSelected", "children", "isDisabled", "hasNestedDropdownMenu", "triggerRef", "title", "shouldTitleWrap", "testId", "ariaKeyshortcuts", "href", "target", "rel"];
5
+ var _excluded = ["children", "data-testid", "aria-haspopup", "aria-disabled", "aria-pressed", "aria-keyshortcuts", "onClick", "onBlur", "onFocus", "onMouseEnter", "onMouseLeave", "tabIndex", "href", "target", "rel", "title"],
6
+ _excluded2 = ["onClick", "onBlur", "onFocus", "onMouseEnter", "onMouseLeave", "elemBefore", "elemAfter", "elemAfterText", "isSelected", "children", "isDisabled", "hasNestedDropdownMenu", "triggerRef", "title", "shouldTitleWrap", "testId", "ariaKeyshortcuts", "href", "target", "rel"];
7
7
  import "./ToolbarDropdownItem.compiled.css";
8
8
  import { ax, ix } from "@compiled/react/runtime";
9
9
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -32,6 +32,10 @@ var CustomDropdownMenuItemButton = /*#__PURE__*/forwardRef(function (_ref, ref)
32
32
  ariaPressed = _ref['aria-pressed'],
33
33
  ariaKeyshortcuts = _ref['aria-keyshortcuts'],
34
34
  onClick = _ref.onClick,
35
+ onBlur = _ref.onBlur,
36
+ onFocus = _ref.onFocus,
37
+ onMouseEnter = _ref.onMouseEnter,
38
+ onMouseLeave = _ref.onMouseLeave,
35
39
  tabIndex = _ref.tabIndex,
36
40
  title = _ref.title,
37
41
  dataExtensionItemKey = _ref['data-extension-item-key'];
@@ -40,6 +44,10 @@ var CustomDropdownMenuItemButton = /*#__PURE__*/forwardRef(function (_ref, ref)
40
44
  testId: testId,
41
45
  xcss: cx(styles.toolbarDropdownItem, ariaDisabled ? styles.disabled : ariaPressed ? styles.selected : styles.enabled),
42
46
  onClick: onClick,
47
+ onBlur: onBlur,
48
+ onFocus: onFocus,
49
+ onMouseEnter: onMouseEnter,
50
+ onMouseLeave: onMouseLeave,
43
51
  tabIndex: tabIndex,
44
52
  "aria-haspopup": ariaHasPopup,
45
53
  "aria-expanded": ariaHasPopup ? ariaPressed ? true : false : undefined,
@@ -63,6 +71,10 @@ var CustomDropdownMenuItemAnchor = /*#__PURE__*/forwardRef(function (_ref2, ref)
63
71
  ariaPressed = _ref2['aria-pressed'],
64
72
  ariaKeyshortcuts = _ref2['aria-keyshortcuts'],
65
73
  onClick = _ref2.onClick,
74
+ onBlur = _ref2.onBlur,
75
+ onFocus = _ref2.onFocus,
76
+ onMouseEnter = _ref2.onMouseEnter,
77
+ onMouseLeave = _ref2.onMouseLeave,
66
78
  tabIndex = _ref2.tabIndex,
67
79
  href = _ref2.href,
68
80
  target = _ref2.target,
@@ -74,6 +86,10 @@ var CustomDropdownMenuItemAnchor = /*#__PURE__*/forwardRef(function (_ref2, ref)
74
86
  testId: testId,
75
87
  xcss: cx(styles.toolbarDropdownItem, styles.anchor, ariaDisabled ? styles.disabled : ariaPressed ? styles.selected : styles.enabled),
76
88
  onClick: onClick,
89
+ onBlur: onBlur,
90
+ onFocus: onFocus,
91
+ onMouseEnter: onMouseEnter,
92
+ onMouseLeave: onMouseLeave,
77
93
  tabIndex: tabIndex,
78
94
  "aria-haspopup": ariaHasPopup,
79
95
  "aria-expanded": ariaHasPopup ? ariaPressed ? true : false : undefined,
@@ -94,6 +110,10 @@ var CustomDropdownMenuItemAnchor = /*#__PURE__*/forwardRef(function (_ref2, ref)
94
110
  });
95
111
  export var ToolbarDropdownItem = function ToolbarDropdownItem(_ref3) {
96
112
  var _onClick = _ref3.onClick,
113
+ onBlur = _ref3.onBlur,
114
+ onFocus = _ref3.onFocus,
115
+ onMouseEnter = _ref3.onMouseEnter,
116
+ onMouseLeave = _ref3.onMouseLeave,
97
117
  elemBefore = _ref3.elemBefore,
98
118
  elemAfter = _ref3.elemAfter,
99
119
  elemAfterText = _ref3.elemAfterText,
@@ -133,6 +153,10 @@ export var ToolbarDropdownItem = function ToolbarDropdownItem(_ref3) {
133
153
  }
134
154
  _onClick === null || _onClick === void 0 || _onClick(e);
135
155
  },
156
+ onBlur: onBlur,
157
+ onFocus: onFocus,
158
+ onMouseEnter: onMouseEnter,
159
+ onMouseLeave: onMouseLeave,
136
160
  elemBefore: elemBefore,
137
161
  elemAfter: injectedElemAfter,
138
162
  isSelected: isSelected,
package/dist/types/ui/ToolbarDropdownItem.d.ts CHANGED
@@ -3,7 +3,13 @@ import type { ReactNode, Ref } from 'react';
3
3
  import type { CustomItemComponentProps } from '@atlaskit/menu/types';
4
4
  import type { DataAttributes } from '../types';
5
5
  type TextStyle = 'normal' | 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6';
6
- export type CustomDropdownMenuItemButtonProps = CustomItemComponentProps & {
6
+ export type ToolbarDropdownItemInteractionProps = {
7
+ onBlur?: React.FocusEventHandler;
8
+ onFocus?: React.FocusEventHandler;
9
+ onMouseEnter?: React.MouseEventHandler;
10
+ onMouseLeave?: React.MouseEventHandler;
11
+ };
12
+ export type CustomDropdownMenuItemButtonProps = CustomItemComponentProps & ToolbarDropdownItemInteractionProps & {
7
13
  'aria-disabled'?: boolean;
8
14
  'aria-haspopup'?: boolean;
9
15
  'aria-keyshortcuts'?: string;
@@ -11,7 +17,7 @@ export type CustomDropdownMenuItemButtonProps = CustomItemComponentProps & {
11
17
  'data-extension-item-key'?: string;
12
18
  title?: string;
13
19
  };
14
- type ToolbarDropdownItemProps = {
20
+ type ToolbarDropdownItemProps = ToolbarDropdownItemInteractionProps & {
15
21
  ariaKeyshortcuts?: string;
16
22
  children?: React.ReactNode;
17
23
  elemAfter?: ReactNode;
@@ -30,5 +36,5 @@ type ToolbarDropdownItemProps = {
30
36
  title?: string;
31
37
  triggerRef?: Ref<HTMLButtonElement>;
32
38
  } & DataAttributes;
33
- export declare const ToolbarDropdownItem: ({ onClick, elemBefore, elemAfter, elemAfterText, isSelected, children, isDisabled, hasNestedDropdownMenu, triggerRef, title, shouldTitleWrap, testId, ariaKeyshortcuts, href, target, rel, ...dataAttributes }: ToolbarDropdownItemProps) => React.JSX.Element;
39
+ export declare const ToolbarDropdownItem: ({ onClick, onBlur, onFocus, onMouseEnter, onMouseLeave, elemBefore, elemAfter, elemAfterText, isSelected, children, isDisabled, hasNestedDropdownMenu, triggerRef, title, shouldTitleWrap, testId, ariaKeyshortcuts, href, target, rel, ...dataAttributes }: ToolbarDropdownItemProps) => React.JSX.Element;
34
40
  export {};
package/dist/types-ts4.5/ui/ToolbarDropdownItem.d.ts CHANGED
@@ -3,7 +3,13 @@ import type { ReactNode, Ref } from 'react';
3
3
  import type { CustomItemComponentProps } from '@atlaskit/menu/types';
4
4
  import type { DataAttributes } from '../types';
5
5
  type TextStyle = 'normal' | 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6';
6
- export type CustomDropdownMenuItemButtonProps = CustomItemComponentProps & {
6
+ export type ToolbarDropdownItemInteractionProps = {
7
+ onBlur?: React.FocusEventHandler;
8
+ onFocus?: React.FocusEventHandler;
9
+ onMouseEnter?: React.MouseEventHandler;
10
+ onMouseLeave?: React.MouseEventHandler;
11
+ };
12
+ export type CustomDropdownMenuItemButtonProps = CustomItemComponentProps & ToolbarDropdownItemInteractionProps & {
7
13
  'aria-disabled'?: boolean;
8
14
  'aria-haspopup'?: boolean;
9
15
  'aria-keyshortcuts'?: string;
@@ -11,7 +17,7 @@ export type CustomDropdownMenuItemButtonProps = CustomItemComponentProps & {
11
17
  'data-extension-item-key'?: string;
12
18
  title?: string;
13
19
  };
14
- type ToolbarDropdownItemProps = {
20
+ type ToolbarDropdownItemProps = ToolbarDropdownItemInteractionProps & {
15
21
  ariaKeyshortcuts?: string;
16
22
  children?: React.ReactNode;
17
23
  elemAfter?: ReactNode;
@@ -30,5 +36,5 @@ type ToolbarDropdownItemProps = {
30
36
  title?: string;
31
37
  triggerRef?: Ref<HTMLButtonElement>;
32
38
  } & DataAttributes;
33
- export declare const ToolbarDropdownItem: ({ onClick, elemBefore, elemAfter, elemAfterText, isSelected, children, isDisabled, hasNestedDropdownMenu, triggerRef, title, shouldTitleWrap, testId, ariaKeyshortcuts, href, target, rel, ...dataAttributes }: ToolbarDropdownItemProps) => React.JSX.Element;
39
+ export declare const ToolbarDropdownItem: ({ onClick, onBlur, onFocus, onMouseEnter, onMouseLeave, elemBefore, elemAfter, elemAfterText, isSelected, children, isDisabled, hasNestedDropdownMenu, triggerRef, title, shouldTitleWrap, testId, ariaKeyshortcuts, href, target, rel, ...dataAttributes }: ToolbarDropdownItemProps) => React.JSX.Element;
34
40
  export {};
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "publishConfig": {
4
4
  "registry": "https://registry.npmjs.org/"
5
5
  },
6
- "version": "1.6.1",
6
+ "version": "1.7.0",
7
7
  "description": "Common UI for Toolbars across the platform",
8
8
  "atlassian": {
9
9
  "react-compiler": {
@@ -37,7 +37,7 @@
37
37
  "@atlaskit/platform-feature-flags": "^1.1.0",
38
38
  "@atlaskit/popup": "^4.20.0",
39
39
  "@atlaskit/primitives": "^19.0.0",
40
- "@atlaskit/tmp-editor-statsig": "^81.3.0",
40
+ "@atlaskit/tmp-editor-statsig": "^82.0.0",
41
41
  "@atlaskit/tokens": "^13.0.0",
42
42
  "@atlaskit/tooltip": "^22.2.0",
43
43
  "@babel/runtime": "^7.0.0",