@atlaskit/inline-edit 14.1.1 → 14.1.2

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/inline-edit
 
+## 14.1.2
+
+### Patch Changes
+
+- [#108678](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/108678)
+  [`b4def55c00546`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b4def55c00546) -
+  Update dev depedencies.
+
 ## 14.1.1
 
 ### Patch Changes

package/dist/cjs/inline-edit.js

@@ -1,4 +1,4 @@
-/* inline-edit.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* inline-edit.tsx generated by @compiled/babel-plugin v0.36.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -29,7 +29,7 @@ var fieldStyles = null;
 var analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "14.1.1"
+  packageVersion: "14.1.2"
 };
 var InnerInlineEdit = function InnerInlineEdit(props) {
   var _props$startWithEditV = props.startWithEditViewOpen,

package/dist/cjs/inline-editable-textfield.js

@@ -1,4 +1,4 @@
-/* inline-editable-textfield.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* inline-editable-textfield.tsx generated by @compiled/babel-plugin v0.36.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/internal/buttons.js

@@ -1,4 +1,4 @@
-/* buttons.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* buttons.tsx generated by @compiled/babel-plugin v0.36.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/internal/read-view.compiled.css

@@ -1,6 +1,4 @@
 
-._18s8ze3t{margin:var(--ds-space-0,0)}
-._1yt4ze3t{padding:var(--ds-space-0,0)}
 ._2rko1sit{border-radius:var(--ds-border-radius,3px)}
 ._v564thzt{transition:background .2s}
 ._14ly1bk5:focus+div{border-width:var(--ds-border-width-outline,2px)}
@@ -13,14 +11,22 @@
 ._1xp41p6i:focus+div{border-color:var(--ds-border-focused,#388bff)}
 ._12ji1r31{outline-color:currentColor}
 ._12y3idpf{outline-width:0}
+._18u0ze3t{margin-left:var(--ds-space-0,0)}
+._19bvze3t{padding-left:var(--ds-space-0,0)}
+._19pkze3t{margin-top:var(--ds-space-0,0)}
 ._1bsb1osq{width:100%}
 ._1bsb1wug{width:auto}
 ._1e0c1o8l{display:inline-block}
 ._1e0c1ule{display:block}
 ._1qu2glyw{outline-style:none}
+._2hwxze3t{margin-right:var(--ds-space-0,0)}
 ._bfhk18uv{background-color:initial}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._otyrze3t{margin-bottom:var(--ds-space-0,0)}
 ._p12f1osq{max-width:100%}
 ._r06hglyw{-webkit-appearance:none;appearance:none}
+._u5f3ze3t{padding-right:var(--ds-space-0,0)}
 ._vchhusvi{box-sizing:border-box}
 ._vwz4kb7n{line-height:1}._128midpf:focus-visible{outline-width:0}
 ._mizu1r31:focus-visible{outline-color:currentColor}

package/dist/cjs/internal/read-view.js

@@ -1,4 +1,4 @@
-/* read-view.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* read-view.tsx generated by @compiled/babel-plugin v0.36.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");
@@ -15,7 +15,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var readViewContainerStyles = null;
 var editButtonStyles = {
-  root: "_18s8ze3t _1yt4ze3t _12ji1r31 _1qu2glyw _12y3idpf _189e1grb _1dqoglyw _1h6d1j28 _1e0c1ule _r06hglyw _bfhk18uv _vwz4kb7n _1xp41p6i _14ly1bk5 _1j8znqa1 _mizu1r31 _ra3xglyw _128midpf"
+  root: "_12ji1r31 _1qu2glyw _12y3idpf _189e1grb _1dqoglyw _1h6d1j28 _1e0c1ule _19pkze3t _2hwxze3t _otyrze3t _18u0ze3t _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _r06hglyw _bfhk18uv _vwz4kb7n _1xp41p6i _14ly1bk5 _1j8znqa1 _mizu1r31 _ra3xglyw _128midpf"
 };
 var readViewWrapperStyles = null;
 var readViewFitContainerWidthStyles = null;
@@ -74,4 +74,6 @@ var ReadView = function ReadView(_ref) {
     }
   }, readView()));
 };
+
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 var _default = exports.default = ReadView;

package/dist/es2019/inline-edit.js

@@ -1,4 +1,4 @@
-/* inline-edit.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* inline-edit.tsx generated by @compiled/babel-plugin v0.36.0 */
 import "./inline-edit.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { useCallback, useRef, useState } from 'react';
@@ -15,7 +15,7 @@ const fieldStyles = null;
 const analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "14.1.1"
+  packageVersion: "14.1.2"
 };
 const InnerInlineEdit = props => {
   const {

package/dist/es2019/inline-editable-textfield.js

@@ -1,4 +1,4 @@
-/* inline-editable-textfield.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* inline-editable-textfield.tsx generated by @compiled/babel-plugin v0.36.0 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./inline-editable-textfield.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";

package/dist/es2019/internal/buttons.js

@@ -1,4 +1,4 @@
-/* buttons.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* buttons.tsx generated by @compiled/babel-plugin v0.36.0 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./buttons.compiled.css";
 import * as React from 'react';

package/dist/es2019/internal/read-view.compiled.css

@@ -1,6 +1,4 @@
 
-._18s8ze3t{margin:var(--ds-space-0,0)}
-._1yt4ze3t{padding:var(--ds-space-0,0)}
 ._2rko1sit{border-radius:var(--ds-border-radius,3px)}
 ._v564thzt{transition:background .2s}
 ._14ly1bk5:focus+div{border-width:var(--ds-border-width-outline,2px)}
@@ -13,14 +11,22 @@
 ._1xp41p6i:focus+div{border-color:var(--ds-border-focused,#388bff)}
 ._12ji1r31{outline-color:currentColor}
 ._12y3idpf{outline-width:0}
+._18u0ze3t{margin-left:var(--ds-space-0,0)}
+._19bvze3t{padding-left:var(--ds-space-0,0)}
+._19pkze3t{margin-top:var(--ds-space-0,0)}
 ._1bsb1osq{width:100%}
 ._1bsb1wug{width:auto}
 ._1e0c1o8l{display:inline-block}
 ._1e0c1ule{display:block}
 ._1qu2glyw{outline-style:none}
+._2hwxze3t{margin-right:var(--ds-space-0,0)}
 ._bfhk18uv{background-color:initial}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._otyrze3t{margin-bottom:var(--ds-space-0,0)}
 ._p12f1osq{max-width:100%}
 ._r06hglyw{-webkit-appearance:none;appearance:none}
+._u5f3ze3t{padding-right:var(--ds-space-0,0)}
 ._vchhusvi{box-sizing:border-box}
 ._vwz4kb7n{line-height:1}._128midpf:focus-visible{outline-width:0}
 ._mizu1r31:focus-visible{outline-color:currentColor}

package/dist/es2019/internal/read-view.js

@@ -1,4 +1,4 @@
-/* read-view.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* read-view.tsx generated by @compiled/babel-plugin v0.36.0 */
 import "./read-view.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { useRef } from 'react';
@@ -6,7 +6,7 @@ import { Pressable } from '@atlaskit/primitives/compiled';
 import { N30 } from '@atlaskit/theme/colors';
 const readViewContainerStyles = null;
 const editButtonStyles = {
-  root: "_18s8ze3t _1yt4ze3t _12ji1r31 _1qu2glyw _12y3idpf _189e1grb _1dqoglyw _1h6d1j28 _1e0c1ule _r06hglyw _bfhk18uv _vwz4kb7n _1xp41p6i _14ly1bk5 _1j8znqa1 _mizu1r31 _ra3xglyw _128midpf"
+  root: "_12ji1r31 _1qu2glyw _12y3idpf _189e1grb _1dqoglyw _1h6d1j28 _1e0c1ule _19pkze3t _2hwxze3t _otyrze3t _18u0ze3t _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _r06hglyw _bfhk18uv _vwz4kb7n _1xp41p6i _14ly1bk5 _1j8znqa1 _mizu1r31 _ra3xglyw _128midpf"
 };
 const readViewWrapperStyles = null;
 const readViewFitContainerWidthStyles = null;
@@ -63,4 +63,6 @@ const ReadView = ({
     className: ax(["_2rko1sit _v564thzt _1h6d1j28 _1dqonqa1 _189e1bk5 _1e0c1o8l _vchhusvi _1bsb1wug _p12f1osq _irr314ae", readViewFitContainerWidth && "_1bsb1osq"])
   }, readView()));
 };
+
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 export default ReadView;

package/dist/esm/inline-edit.js

@@ -1,4 +1,4 @@
-/* inline-edit.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* inline-edit.tsx generated by @compiled/babel-plugin v0.36.0 */
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import "./inline-edit.compiled.css";
@@ -19,7 +19,7 @@ var fieldStyles = null;
 var analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "14.1.1"
+  packageVersion: "14.1.2"
 };
 var InnerInlineEdit = function InnerInlineEdit(props) {
   var _props$startWithEditV = props.startWithEditViewOpen,

package/dist/esm/inline-editable-textfield.js

@@ -1,4 +1,4 @@
-/* inline-editable-textfield.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* inline-editable-textfield.tsx generated by @compiled/babel-plugin v0.36.0 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["errorMessage", "isInvalid"];

package/dist/esm/internal/buttons.js

@@ -1,4 +1,4 @@
-/* buttons.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* buttons.tsx generated by @compiled/babel-plugin v0.36.0 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./buttons.compiled.css";
 import * as React from 'react';

package/dist/esm/internal/read-view.compiled.css

@@ -1,6 +1,4 @@
 
-._18s8ze3t{margin:var(--ds-space-0,0)}
-._1yt4ze3t{padding:var(--ds-space-0,0)}
 ._2rko1sit{border-radius:var(--ds-border-radius,3px)}
 ._v564thzt{transition:background .2s}
 ._14ly1bk5:focus+div{border-width:var(--ds-border-width-outline,2px)}
@@ -13,14 +11,22 @@
 ._1xp41p6i:focus+div{border-color:var(--ds-border-focused,#388bff)}
 ._12ji1r31{outline-color:currentColor}
 ._12y3idpf{outline-width:0}
+._18u0ze3t{margin-left:var(--ds-space-0,0)}
+._19bvze3t{padding-left:var(--ds-space-0,0)}
+._19pkze3t{margin-top:var(--ds-space-0,0)}
 ._1bsb1osq{width:100%}
 ._1bsb1wug{width:auto}
 ._1e0c1o8l{display:inline-block}
 ._1e0c1ule{display:block}
 ._1qu2glyw{outline-style:none}
+._2hwxze3t{margin-right:var(--ds-space-0,0)}
 ._bfhk18uv{background-color:initial}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._otyrze3t{margin-bottom:var(--ds-space-0,0)}
 ._p12f1osq{max-width:100%}
 ._r06hglyw{-webkit-appearance:none;appearance:none}
+._u5f3ze3t{padding-right:var(--ds-space-0,0)}
 ._vchhusvi{box-sizing:border-box}
 ._vwz4kb7n{line-height:1}._128midpf:focus-visible{outline-width:0}
 ._mizu1r31:focus-visible{outline-color:currentColor}

package/dist/esm/internal/read-view.js

@@ -1,4 +1,4 @@
-/* read-view.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* read-view.tsx generated by @compiled/babel-plugin v0.36.0 */
 import "./read-view.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { useRef } from 'react';
@@ -6,7 +6,7 @@ import { Pressable } from '@atlaskit/primitives/compiled';
 import { N30 } from '@atlaskit/theme/colors';
 var readViewContainerStyles = null;
 var editButtonStyles = {
-  root: "_18s8ze3t _1yt4ze3t _12ji1r31 _1qu2glyw _12y3idpf _189e1grb _1dqoglyw _1h6d1j28 _1e0c1ule _r06hglyw _bfhk18uv _vwz4kb7n _1xp41p6i _14ly1bk5 _1j8znqa1 _mizu1r31 _ra3xglyw _128midpf"
+  root: "_12ji1r31 _1qu2glyw _12y3idpf _189e1grb _1dqoglyw _1h6d1j28 _1e0c1ule _19pkze3t _2hwxze3t _otyrze3t _18u0ze3t _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _r06hglyw _bfhk18uv _vwz4kb7n _1xp41p6i _14ly1bk5 _1j8znqa1 _mizu1r31 _ra3xglyw _128midpf"
 };
 var readViewWrapperStyles = null;
 var readViewFitContainerWidthStyles = null;
@@ -65,4 +65,6 @@ var ReadView = function ReadView(_ref) {
     }
   }, readView()));
 };
+
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 export default ReadView;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/inline-edit",
-	"version": "14.1.1",
+	"version": "14.1.2",
 	"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/"
@@ -45,7 +45,7 @@
 		"@atlaskit/primitives": "^13.3.0",
 		"@atlaskit/textfield": "^6.7.0",
 		"@atlaskit/theme": "^14.0.0",
-		"@atlaskit/tokens": "^3.1.0",
+		"@atlaskit/tokens": "^3.2.0",
 		"@atlaskit/visually-hidden": "^1.5.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.18.1"
@@ -59,6 +59,8 @@
 		"@atlaskit/datetime-picker": "^15.11.0",
 		"@atlaskit/docs": "*",
 		"@atlaskit/ds-lib": "^3.3.0",
+		"@atlaskit/heading": "^4.0.2",
+		"@atlaskit/link": "*",
 		"@atlaskit/section-message": "^6.8.0",
 		"@atlaskit/select": "^18.9.0",
 		"@atlaskit/ssr": "*",
@@ -67,14 +69,11 @@
 		"@atlaskit/textarea": "^5.7.0",
 		"@atlaskit/visual-regression": "*",
 		"@atlassian/feature-flags-test-utils": "*",
-		"@emotion/styled": "^11.0.0",
-		"@testing-library/dom": "^10.1.0",
 		"@testing-library/react": "^12.1.5",
 		"ast-types": "^0.13.3",
 		"jscodeshift": "^0.13.0",
 		"react-dom": "^16.8.0",
 		"react-select-event": "^5.5.0",
-		"storybook-addon-performance": "^0.17.3",
 		"typescript": "~5.4.2"
 	},
 	"keywords": [

package/__perf__/default.tsx

@@ -1,18 +0,0 @@
-import React, { useState } from 'react';
-
-import Textfield from '@atlaskit/textfield';
-
-import InlineEdit from '../src';
-
-export default () => {
-	const [editValue, setEditValue] = useState('Field value');
-	return (
-		<InlineEdit
-			defaultValue={editValue}
-			label="Inline edit"
-			editView={(fieldProps) => <Textfield {...fieldProps} autoFocus />}
-			readView={() => <div>{editValue || 'Click to enter value'}</div>}
-			onConfirm={(value) => setEditValue(value)}
-		/>
-	);
-};

package/__perf__/inline-edit.tsx

@@ -1,50 +0,0 @@
-import React, { useState } from 'react';
-
-import { fireEvent } from '@testing-library/dom';
-import { type InteractionTaskArgs, type PublicInteractionTask } from 'storybook-addon-performance';
-
-import { type FieldProps } from '@atlaskit/form';
-import Textfield from '@atlaskit/textfield';
-
-import InlineEdit from '../src';
-
-const InlineEditExample = () => {
-	const [editValue, setEditValue] = useState('Field value');
-	const renderEditView = (fieldProps: FieldProps<any>) => <Textfield {...fieldProps} autoFocus />;
-	const renderReadView = () => (
-		<div data-testid="read-view">{editValue || 'Click to enter value'}</div>
-	);
-
-	return (
-		<InlineEdit
-			defaultValue={editValue}
-			label="Inline edit"
-			editView={renderEditView}
-			readView={renderReadView}
-			onConfirm={setEditValue}
-			validate={() => {}}
-		/>
-	);
-};
-
-const interactionTasks: PublicInteractionTask[] = [
-	{
-		name: 'Change inline edit status',
-		description: 'Activate on input',
-		run: async ({ container }: InteractionTaskArgs): Promise<void> => {
-			const readView = container.querySelector('[data-testid="read-view"]');
-			fireEvent.click(readView!);
-		},
-	},
-];
-
-InlineEditExample.story = {
-	name: 'InlineEdit Component',
-	parameters: {
-		performance: {
-			interactions: interactionTasks,
-		},
-	},
-};
-
-export default InlineEditExample;

package/__perf__/inline-text-field.tsx

@@ -1,16 +0,0 @@
-import React, { useState } from 'react';
-
-import { InlineEditableTextfield } from '../src';
-
-export default () => {
-	const [editValue, setEditValue] = useState('Field value');
-
-	return (
-		<InlineEditableTextfield
-			defaultValue={editValue}
-			label="Inline editable textfield"
-			onConfirm={(value) => setEditValue(value)}
-			placeholder="Click to enter text"
-		/>
-	);
-};