@atlaskit/inline-edit 15.6.4 → 15.6.6

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/inline-edit
 
+## 15.6.6
+
+### Patch Changes
+
+- [`b8934c531e413`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b8934c531e413) -
+  Internal refactoring
+
+## 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

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); }
@@ -28,7 +29,7 @@ var fieldStyles = null;
 var analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "0.0.0-development"
+  packageVersion: "15.6.5"
 };
 var InnerInlineEdit = function InnerInlineEdit(props) {
   var _props$startWithEditV = props.startWithEditViewOpen,
@@ -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/inline-editable-textfield.js

@@ -55,7 +55,9 @@ var InlineEditableTextfield = function InlineEditableTextfield(props) {
     }
     providedOnCancel === null || providedOnCancel === void 0 || providedOnCancel();
   }, [defaultValue, providedOnCancel]);
-  return /*#__PURE__*/_react.default.createElement(_inlineEdit.default, (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/_react.default.createElement(_inlineEdit.default
+  // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+  , (0, _extends2.default)({}, props, {
     onCancel: onCancel,
     defaultValue: defaultValue,
     editView: function editView(_ref) {

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,13 +9,14 @@ 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;
 const analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "0.0.0-development"
+  packageVersion: "15.6.5"
 };
 const InnerInlineEdit = props => {
   const {
@@ -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/inline-editable-textfield.js

@@ -45,7 +45,9 @@ const InlineEditableTextfield = props => {
     }
     providedOnCancel === null || providedOnCancel === void 0 ? void 0 : providedOnCancel();
   }, [defaultValue, providedOnCancel]);
-  return /*#__PURE__*/React.createElement(InlineEdit, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(InlineEdit
+  // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+  , _extends({}, props, {
     onCancel: onCancel,
     defaultValue: defaultValue,
     editView: ({

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,13 +13,14 @@ 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;
 var analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "0.0.0-development"
+  packageVersion: "15.6.5"
 };
 var InnerInlineEdit = function InnerInlineEdit(props) {
   var _props$startWithEditV = props.startWithEditViewOpen,
@@ -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/inline-editable-textfield.js

@@ -46,7 +46,9 @@ var InlineEditableTextfield = function InlineEditableTextfield(props) {
     }
     providedOnCancel === null || providedOnCancel === void 0 || providedOnCancel();
   }, [defaultValue, providedOnCancel]);
-  return /*#__PURE__*/React.createElement(InlineEdit, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(InlineEdit
+  // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+  , _extends({}, props, {
     onCancel: onCancel,
     defaultValue: defaultValue,
     editView: function editView(_ref) {

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.4",
+	"version": "15.6.6",
 	"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/"
@@ -23,7 +23,7 @@
 	"sideEffects": [
 		"**/*.compiled.css"
 	],
-	"atlaskit:src": "src/index.ts",
+	"atlaskit:src": "src/index.tsx",
 	"homepage": "https://atlassian.design/components/inline-edit/",
 	"atlassian": {
 		"team": "Design System Team",