@atlaskit/inline-edit 15.6.3 → 15.6.5

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/inline-edit
 
+## 15.6.5
+
+### Patch Changes
+
+- [`1dc3b51d1f95e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1dc3b51d1f95e) -
+  Fix accessible edit button label rendering as [object Object] when a ReactNode is provided for the
+  label prop
+
+## 15.6.4
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 15.6.3
 
 ### Patch Changes

package/dist/cjs/inline-edit.js

@@ -19,6 +19,7 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
 var _buttons = _interopRequireDefault(require("./internal/buttons"));
+var _getTextFromReactNode = _interopRequireDefault(require("./internal/get-text-from-react-node"));
 var _useButtonFocusHook2 = _interopRequireDefault(require("./internal/hooks/use-button-focus-hook"));
 var _readView = _interopRequireDefault(require("./internal/read-view"));
 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); }
@@ -153,7 +154,8 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
   }, []);
   var concatenatedEditButtonLabel = function concatenatedEditButtonLabel() {
     if (label) {
-      return "".concat(editButtonLabel, ", ").concat(label, ", ").concat(editLabel);
+      var labelText = typeof label === 'string' ? label : (0, _getTextFromReactNode.default)(label);
+      return "".concat(editButtonLabel, ", ").concat(labelText, ", ").concat(editLabel);
     }
     return "".concat(editButtonLabel, ", ").concat(editLabel);
   };

package/dist/cjs/internal/get-text-from-react-node.js

@@ -0,0 +1,33 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+/**
+ * Recursively extracts plain text content from a ReactNode.
+ *
+ * This is useful when a ReactNode needs to be represented as a string,
+ * e.g. for use in an `aria-label` attribute.
+ */
+var _getTextFromReactNode = function getTextFromReactNode(node) {
+  if (node == null || typeof node === 'boolean') {
+    return '';
+  }
+  if (typeof node === 'string') {
+    return node;
+  }
+  if (typeof node === 'number') {
+    return String(node);
+  }
+  if (Array.isArray(node)) {
+    return node.map(_getTextFromReactNode).join('');
+  }
+  if ( /*#__PURE__*/_react.default.isValidElement(node)) {
+    return _getTextFromReactNode(node.props.children);
+  }
+  return '';
+};
+var _default = exports.default = _getTextFromReactNode;

package/dist/es2019/inline-edit.js

@@ -9,6 +9,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import { Pressable } from '@atlaskit/primitives/compiled';
 import VisuallyHidden from '@atlaskit/visually-hidden';
 import Buttons from './internal/buttons';
+import getTextFromReactNode from './internal/get-text-from-react-node';
 import useButtonFocusHook from './internal/hooks/use-button-focus-hook';
 import ReadView from './internal/read-view';
 const fieldStyles = null;
@@ -130,7 +131,8 @@ const InnerInlineEdit = props => {
   }, []);
   const concatenatedEditButtonLabel = () => {
     if (label) {
-      return `${editButtonLabel}, ${label}, ${editLabel}`;
+      const labelText = typeof label === 'string' ? label : getTextFromReactNode(label);
+      return `${editButtonLabel}, ${labelText}, ${editLabel}`;
     }
     return `${editButtonLabel}, ${editLabel}`;
   };

package/dist/es2019/internal/get-text-from-react-node.js

@@ -0,0 +1,27 @@
+import React from 'react';
+
+/**
+ * Recursively extracts plain text content from a ReactNode.
+ *
+ * This is useful when a ReactNode needs to be represented as a string,
+ * e.g. for use in an `aria-label` attribute.
+ */
+const getTextFromReactNode = node => {
+  if (node == null || typeof node === 'boolean') {
+    return '';
+  }
+  if (typeof node === 'string') {
+    return node;
+  }
+  if (typeof node === 'number') {
+    return String(node);
+  }
+  if (Array.isArray(node)) {
+    return node.map(getTextFromReactNode).join('');
+  }
+  if ( /*#__PURE__*/React.isValidElement(node)) {
+    return getTextFromReactNode(node.props.children);
+  }
+  return '';
+};
+export default getTextFromReactNode;

package/dist/esm/inline-edit.js

@@ -13,6 +13,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import { Pressable } from '@atlaskit/primitives/compiled';
 import VisuallyHidden from '@atlaskit/visually-hidden';
 import Buttons from './internal/buttons';
+import getTextFromReactNode from './internal/get-text-from-react-node';
 import useButtonFocusHook from './internal/hooks/use-button-focus-hook';
 import ReadView from './internal/read-view';
 var fieldStyles = null;
@@ -144,7 +145,8 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
   }, []);
   var concatenatedEditButtonLabel = function concatenatedEditButtonLabel() {
     if (label) {
-      return "".concat(editButtonLabel, ", ").concat(label, ", ").concat(editLabel);
+      var labelText = typeof label === 'string' ? label : getTextFromReactNode(label);
+      return "".concat(editButtonLabel, ", ").concat(labelText, ", ").concat(editLabel);
     }
     return "".concat(editButtonLabel, ", ").concat(editLabel);
   };

package/dist/esm/internal/get-text-from-react-node.js

@@ -0,0 +1,27 @@
+import React from 'react';
+
+/**
+ * Recursively extracts plain text content from a ReactNode.
+ *
+ * This is useful when a ReactNode needs to be represented as a string,
+ * e.g. for use in an `aria-label` attribute.
+ */
+var _getTextFromReactNode = function getTextFromReactNode(node) {
+  if (node == null || typeof node === 'boolean') {
+    return '';
+  }
+  if (typeof node === 'string') {
+    return node;
+  }
+  if (typeof node === 'number') {
+    return String(node);
+  }
+  if (Array.isArray(node)) {
+    return node.map(_getTextFromReactNode).join('');
+  }
+  if ( /*#__PURE__*/React.isValidElement(node)) {
+    return _getTextFromReactNode(node.props.children);
+  }
+  return '';
+};
+export default _getTextFromReactNode;

package/dist/types/internal/get-text-from-react-node.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+/**
+ * Recursively extracts plain text content from a ReactNode.
+ *
+ * This is useful when a ReactNode needs to be represented as a string,
+ * e.g. for use in an `aria-label` attribute.
+ */
+declare const getTextFromReactNode: (node: React.ReactNode) => string;
+export default getTextFromReactNode;

package/dist/types-ts4.5/internal/get-text-from-react-node.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+/**
+ * Recursively extracts plain text content from a ReactNode.
+ *
+ * This is useful when a ReactNode needs to be represented as a string,
+ * e.g. for use in an `aria-label` attribute.
+ */
+declare const getTextFromReactNode: (node: React.ReactNode) => string;
+export default getTextFromReactNode;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/inline-edit",
-	"version": "15.6.3",
+	"version": "15.6.5",
 	"description": "An inline edit displays a custom input component that switches between reading and editing on the same page.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -37,7 +37,7 @@
 		"@atlaskit/button": "^23.9.0",
 		"@atlaskit/css": "^0.19.0",
 		"@atlaskit/form": "^15.3.0",
-		"@atlaskit/icon": "^30.0.0",
+		"@atlaskit/icon": "^31.0.0",
 		"@atlaskit/inline-dialog": "^18.0.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^18.0.0",
@@ -54,13 +54,13 @@
 	"devDependencies": {
 		"@af/accessibility-testing": "workspace:^",
 		"@af/integration-testing": "workspace:^",
-		"@atlaskit/datetime-picker": "^17.4.0",
+		"@atlaskit/datetime-picker": "^17.5.0",
 		"@atlaskit/docs": "^11.3.0",
-		"@atlaskit/heading": "^5.2.0",
+		"@atlaskit/heading": "^5.3.0",
 		"@atlaskit/link": "^3.3.0",
 		"@atlaskit/section-message": "^8.12.0",
 		"@atlaskit/select": "^21.7.0",
-		"@atlaskit/tag": "^14.3.0",
+		"@atlaskit/tag": "^14.5.0",
 		"@atlaskit/tag-group": "^12.0.0",
 		"@atlaskit/textarea": "^8.2.0",
 		"@atlassian/ssr-tests": "workspace:^",