@atlaskit/inline-edit 13.4.0 → 13.5.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.
- package/CHANGELOG.md +1053 -1040
- package/README.md +2 -1
- package/__perf__/default.tsx +10 -10
- package/__perf__/inline-edit.tsx +31 -36
- package/__perf__/inline-text-field.tsx +9 -9
- package/codemods/12.0.0-lite-mode.ts +4 -4
- package/codemods/__tests__/12.0.0-lite-mode.tsx +21 -21
- package/codemods/__tests__/add-comments-when-validate-found.ts +14 -14
- package/codemods/__tests__/lift-InlineEditStateless-to-default.ts +35 -35
- package/codemods/__tests__/lift-InlineEditableTextField-to-its-entry-point.tsx +21 -21
- package/codemods/__tests__/spread-errorMessage-out-of-fieldProps.tsx +28 -28
- package/codemods/migrates/add-comments-when-validate-found.ts +13 -23
- package/codemods/migrates/lift-InlineEditStateless-to-default.ts +43 -57
- package/codemods/migrates/lift-InlineEditableTextField-to-its-entry-point.ts +29 -42
- package/codemods/migrates/spread-errorMessage-out-of-fieldProps.ts +45 -63
- package/codemods/migrates/utils.ts +62 -70
- package/dist/cjs/inline-edit.js +4 -2
- package/dist/cjs/inline-editable-textfield.js +8 -1
- package/dist/cjs/internal/buttons.js +10 -3
- package/dist/cjs/internal/read-view.js +6 -0
- package/dist/es2019/inline-edit.js +6 -1
- package/dist/es2019/inline-editable-textfield.js +9 -1
- package/dist/es2019/internal/buttons.js +9 -3
- package/dist/es2019/internal/read-view.js +6 -0
- package/dist/esm/inline-edit.js +6 -1
- package/dist/esm/inline-editable-textfield.js +9 -1
- package/dist/esm/internal/buttons.js +9 -3
- package/dist/esm/internal/read-view.js +6 -0
- package/dist/types/internal/buttons.d.ts +3 -0
- package/dist/types/internal/read-view.d.ts +3 -0
- package/dist/types/types.d.ts +2 -2
- package/dist/types-ts4.5/internal/buttons.d.ts +3 -0
- package/dist/types-ts4.5/internal/read-view.d.ts +3 -0
- package/dist/types-ts4.5/types.d.ts +2 -2
- package/extract-react-types/inline-editable-textfield-props.tsx +2 -4
- package/package.json +109 -111
- package/report.api.md +32 -37
|
@@ -1,5 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @jsxRuntime classic
|
|
3
|
+
*/
|
|
1
4
|
/** @jsx jsx */
|
|
2
5
|
import React, { useCallback, useRef, useState } from 'react';
|
|
6
|
+
|
|
7
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
8
|
import { css, jsx } from '@emotion/react';
|
|
4
9
|
import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next';
|
|
5
10
|
import Field from '@atlaskit/form/Field';
|
|
@@ -16,7 +21,7 @@ const fieldStyles = css({
|
|
|
16
21
|
const analyticsAttributes = {
|
|
17
22
|
componentName: 'inlineEdit',
|
|
18
23
|
packageName: "@atlaskit/inline-edit",
|
|
19
|
-
packageVersion: "13.
|
|
24
|
+
packageVersion: "13.5.0"
|
|
20
25
|
};
|
|
21
26
|
const noop = () => {};
|
|
22
27
|
const InnerInlineEdit = props => {
|
|
@@ -1,6 +1,11 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
/**
|
|
3
|
+
* @jsxRuntime classic
|
|
4
|
+
*/
|
|
2
5
|
/** @jsx jsx */
|
|
3
6
|
import { useCallback, useRef } from 'react';
|
|
7
|
+
|
|
8
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
4
9
|
import { css, jsx } from '@emotion/react';
|
|
5
10
|
import ErrorIcon from '@atlaskit/icon/glyph/error';
|
|
6
11
|
import InlineDialog from '@atlaskit/inline-dialog';
|
|
@@ -9,15 +14,18 @@ import { R400 } from '@atlaskit/theme/colors';
|
|
|
9
14
|
import InlineEdit from './inline-edit';
|
|
10
15
|
import { fontSize } from './internal/constants';
|
|
11
16
|
const errorIconContainerStyles = css({
|
|
12
|
-
|
|
17
|
+
paddingInlineEnd: "var(--ds-space-075, 6px)",
|
|
13
18
|
lineHeight: '100%'
|
|
14
19
|
});
|
|
15
20
|
const readViewForTextFieldStyles = css({
|
|
16
21
|
display: 'flex',
|
|
17
22
|
maxWidth: '100%',
|
|
23
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
18
24
|
minHeight: `${8 * 2.5 / fontSize}em`,
|
|
19
25
|
padding: `${"var(--ds-space-100, 8px)"} ${"var(--ds-space-075, 6px)"}`,
|
|
26
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
20
27
|
fontSize: fontSize,
|
|
28
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
21
29
|
lineHeight: 8 * 2.5 / fontSize,
|
|
22
30
|
wordBreak: 'break-word'
|
|
23
31
|
});
|
|
@@ -1,5 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @jsxRuntime classic
|
|
3
|
+
*/
|
|
1
4
|
/** @jsx jsx */
|
|
2
5
|
|
|
6
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
7
|
import { css, jsx } from '@emotion/react';
|
|
4
8
|
import { IconButton } from '@atlaskit/button/new';
|
|
5
9
|
import ConfirmIcon from '@atlaskit/icon/glyph/check';
|
|
@@ -22,21 +26,23 @@ const buttonWrapperBaseStyles = css({
|
|
|
22
26
|
zIndex: 200,
|
|
23
27
|
backgroundColor: `var(--ds-surface-overlay, ${N0})`,
|
|
24
28
|
borderRadius: "var(--ds-border-radius, 3px)",
|
|
29
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
25
30
|
fontSize: fontSize,
|
|
31
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
26
32
|
'&:last-child': {
|
|
27
33
|
marginInlineStart: "var(--ds-space-050, 4px)"
|
|
28
34
|
},
|
|
29
35
|
boxShadow: `var(--ds-shadow-overlay, ${`0 4px 8px -2px ${N50A}, 0 0 1px ${N60A}`})`,
|
|
30
36
|
// These buttons are floating, so they need an override to overlay interaction states
|
|
31
|
-
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles
|
|
37
|
+
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
32
38
|
'& > button': {
|
|
33
39
|
backgroundColor: `var(--ds-surface-overlay, ${N20A})`
|
|
34
40
|
},
|
|
35
|
-
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles
|
|
41
|
+
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
36
42
|
'& > button:hover': {
|
|
37
43
|
backgroundColor: `var(--ds-surface-overlay-hovered, ${N30A})`
|
|
38
44
|
},
|
|
39
|
-
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles
|
|
45
|
+
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
40
46
|
'& > button:active': {
|
|
41
47
|
backgroundColor: "var(--ds-surface-overlay-pressed, rgba(179, 212, 255, 0.6))",
|
|
42
48
|
color: `var(--ds-text, ${B400})`
|
|
@@ -1,5 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @jsxRuntime classic
|
|
3
|
+
*/
|
|
1
4
|
/** @jsx jsx */
|
|
2
5
|
import React, { useRef } from 'react';
|
|
6
|
+
|
|
7
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
8
|
import { css, jsx } from '@emotion/react';
|
|
4
9
|
import { Pressable, xcss } from '@atlaskit/primitives';
|
|
5
10
|
import { N30 } from '@atlaskit/theme/colors';
|
|
@@ -34,6 +39,7 @@ const readViewWrapperStyles = css({
|
|
|
34
39
|
width: 'auto',
|
|
35
40
|
maxWidth: '100%',
|
|
36
41
|
border: '2px solid transparent',
|
|
42
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
37
43
|
borderRadius: borderRadius,
|
|
38
44
|
transition: 'background 0.2s',
|
|
39
45
|
'&:hover': {
|
package/dist/esm/inline-edit.js
CHANGED
|
@@ -2,8 +2,13 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
|
2
2
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
3
3
|
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; }
|
|
4
4
|
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) { _defineProperty(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; }
|
|
5
|
+
/**
|
|
6
|
+
* @jsxRuntime classic
|
|
7
|
+
*/
|
|
5
8
|
/** @jsx jsx */
|
|
6
9
|
import React, { useCallback, useRef, useState } from 'react';
|
|
10
|
+
|
|
11
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
7
12
|
import { css, jsx } from '@emotion/react';
|
|
8
13
|
import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next';
|
|
9
14
|
import Field from '@atlaskit/form/Field';
|
|
@@ -20,7 +25,7 @@ var fieldStyles = css({
|
|
|
20
25
|
var analyticsAttributes = {
|
|
21
26
|
componentName: 'inlineEdit',
|
|
22
27
|
packageName: "@atlaskit/inline-edit",
|
|
23
|
-
packageVersion: "13.
|
|
28
|
+
packageVersion: "13.5.0"
|
|
24
29
|
};
|
|
25
30
|
var noop = function noop() {};
|
|
26
31
|
var InnerInlineEdit = function InnerInlineEdit(props) {
|
|
@@ -1,8 +1,13 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
3
|
var _excluded = ["errorMessage", "isInvalid"];
|
|
4
|
+
/**
|
|
5
|
+
* @jsxRuntime classic
|
|
6
|
+
*/
|
|
4
7
|
/** @jsx jsx */
|
|
5
8
|
import { useCallback, useRef } from 'react';
|
|
9
|
+
|
|
10
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
6
11
|
import { css, jsx } from '@emotion/react';
|
|
7
12
|
import ErrorIcon from '@atlaskit/icon/glyph/error';
|
|
8
13
|
import InlineDialog from '@atlaskit/inline-dialog';
|
|
@@ -11,15 +16,18 @@ import { R400 } from '@atlaskit/theme/colors';
|
|
|
11
16
|
import InlineEdit from './inline-edit';
|
|
12
17
|
import { fontSize } from './internal/constants';
|
|
13
18
|
var errorIconContainerStyles = css({
|
|
14
|
-
|
|
19
|
+
paddingInlineEnd: "var(--ds-space-075, 6px)",
|
|
15
20
|
lineHeight: '100%'
|
|
16
21
|
});
|
|
17
22
|
var readViewForTextFieldStyles = css({
|
|
18
23
|
display: 'flex',
|
|
19
24
|
maxWidth: '100%',
|
|
25
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
20
26
|
minHeight: "".concat(8 * 2.5 / fontSize, "em"),
|
|
21
27
|
padding: "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-075, 6px)"),
|
|
28
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
22
29
|
fontSize: fontSize,
|
|
30
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
23
31
|
lineHeight: 8 * 2.5 / fontSize,
|
|
24
32
|
wordBreak: 'break-word'
|
|
25
33
|
});
|
|
@@ -1,5 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @jsxRuntime classic
|
|
3
|
+
*/
|
|
1
4
|
/** @jsx jsx */
|
|
2
5
|
|
|
6
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
7
|
import { css, jsx } from '@emotion/react';
|
|
4
8
|
import { IconButton } from '@atlaskit/button/new';
|
|
5
9
|
import ConfirmIcon from '@atlaskit/icon/glyph/check';
|
|
@@ -22,21 +26,23 @@ var buttonWrapperBaseStyles = css({
|
|
|
22
26
|
zIndex: 200,
|
|
23
27
|
backgroundColor: "var(--ds-surface-overlay, ".concat(N0, ")"),
|
|
24
28
|
borderRadius: "var(--ds-border-radius, 3px)",
|
|
29
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
25
30
|
fontSize: fontSize,
|
|
31
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
26
32
|
'&:last-child': {
|
|
27
33
|
marginInlineStart: "var(--ds-space-050, 4px)"
|
|
28
34
|
},
|
|
29
35
|
boxShadow: "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N50A, ", 0 0 1px ").concat(N60A), ")"),
|
|
30
36
|
// These buttons are floating, so they need an override to overlay interaction states
|
|
31
|
-
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles
|
|
37
|
+
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
32
38
|
'& > button': {
|
|
33
39
|
backgroundColor: "var(--ds-surface-overlay, ".concat(N20A, ")")
|
|
34
40
|
},
|
|
35
|
-
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles
|
|
41
|
+
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
36
42
|
'& > button:hover': {
|
|
37
43
|
backgroundColor: "var(--ds-surface-overlay-hovered, ".concat(N30A, ")")
|
|
38
44
|
},
|
|
39
|
-
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles
|
|
45
|
+
// eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
40
46
|
'& > button:active': {
|
|
41
47
|
backgroundColor: "var(--ds-surface-overlay-pressed, rgba(179, 212, 255, 0.6))",
|
|
42
48
|
color: "var(--ds-text, ".concat(B400, ")")
|
|
@@ -1,5 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @jsxRuntime classic
|
|
3
|
+
*/
|
|
1
4
|
/** @jsx jsx */
|
|
2
5
|
import React, { useRef } from 'react';
|
|
6
|
+
|
|
7
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
8
|
import { css, jsx } from '@emotion/react';
|
|
4
9
|
import { Pressable, xcss } from '@atlaskit/primitives';
|
|
5
10
|
import { N30 } from '@atlaskit/theme/colors';
|
|
@@ -34,6 +39,7 @@ var readViewWrapperStyles = css({
|
|
|
34
39
|
width: 'auto',
|
|
35
40
|
maxWidth: '100%',
|
|
36
41
|
border: '2px solid transparent',
|
|
42
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
37
43
|
borderRadius: borderRadius,
|
|
38
44
|
transition: 'background 0.2s',
|
|
39
45
|
'&:hover': {
|
package/dist/types/types.d.ts
CHANGED
|
@@ -47,8 +47,8 @@ export interface InlineEditProps<FieldValue> extends CommonProps {
|
|
|
47
47
|
/** Sets whether the component shows the `readView` or the `editView`. This is used to manage the state of the input in stateless inline edit. */
|
|
48
48
|
isEditing?: boolean;
|
|
49
49
|
/**
|
|
50
|
-
|
|
51
|
-
|
|
50
|
+
Saves and confirms the value entered into the field. It exits `editView` and returns to `readView`.
|
|
51
|
+
*/
|
|
52
52
|
onConfirm: (value: any, analyticsEvent: UIAnalyticsEvent) => void;
|
|
53
53
|
/** Handler called when readView is clicked. */
|
|
54
54
|
onEdit?: () => void;
|
|
@@ -47,8 +47,8 @@ export interface InlineEditProps<FieldValue> extends CommonProps {
|
|
|
47
47
|
/** Sets whether the component shows the `readView` or the `editView`. This is used to manage the state of the input in stateless inline edit. */
|
|
48
48
|
isEditing?: boolean;
|
|
49
49
|
/**
|
|
50
|
-
|
|
51
|
-
|
|
50
|
+
Saves and confirms the value entered into the field. It exits `editView` and returns to `readView`.
|
|
51
|
+
*/
|
|
52
52
|
onConfirm: (value: any, analyticsEvent: UIAnalyticsEvent) => void;
|
|
53
53
|
/** Handler called when readView is clicked. */
|
|
54
54
|
onEdit?: () => void;
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
import { type InlineEditableTextfieldProps } from '../src/types';
|
|
2
2
|
|
|
3
|
-
export default function InlineEditableTextfieldProp(
|
|
4
|
-
|
|
5
|
-
) {
|
|
6
|
-
return null;
|
|
3
|
+
export default function InlineEditableTextfieldProp(props: InlineEditableTextfieldProps) {
|
|
4
|
+
return null;
|
|
7
5
|
}
|
package/package.json
CHANGED
|
@@ -1,112 +1,110 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
"prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
|
|
112
|
-
}
|
|
2
|
+
"name": "@atlaskit/inline-edit",
|
|
3
|
+
"version": "13.5.0",
|
|
4
|
+
"description": "An inline edit displays a custom input component that switches between reading and editing on the same page.",
|
|
5
|
+
"publishConfig": {
|
|
6
|
+
"registry": "https://registry.npmjs.org/"
|
|
7
|
+
},
|
|
8
|
+
"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
|
|
9
|
+
"author": "Atlassian Pty Ltd",
|
|
10
|
+
"license": "Apache-2.0",
|
|
11
|
+
"main": "dist/cjs/index.js",
|
|
12
|
+
"module": "dist/esm/index.js",
|
|
13
|
+
"module:es2019": "dist/es2019/index.js",
|
|
14
|
+
"types": "dist/types/index.d.ts",
|
|
15
|
+
"typesVersions": {
|
|
16
|
+
">=4.5 <4.9": {
|
|
17
|
+
"*": [
|
|
18
|
+
"dist/types-ts4.5/*",
|
|
19
|
+
"dist/types-ts4.5/index.d.ts"
|
|
20
|
+
]
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
"sideEffects": false,
|
|
24
|
+
"atlaskit:src": "src/index.ts",
|
|
25
|
+
"homepage": "https://atlassian.design/components/inline-edit/",
|
|
26
|
+
"atlassian": {
|
|
27
|
+
"team": "Design System Team",
|
|
28
|
+
"releaseModel": "continuous",
|
|
29
|
+
"productPushConsumption": [
|
|
30
|
+
"jira"
|
|
31
|
+
],
|
|
32
|
+
"website": {
|
|
33
|
+
"name": "Inline edit",
|
|
34
|
+
"category": "Components"
|
|
35
|
+
},
|
|
36
|
+
"runReact18": true
|
|
37
|
+
},
|
|
38
|
+
"dependencies": {
|
|
39
|
+
"@atlaskit/analytics-next": "^9.3.0",
|
|
40
|
+
"@atlaskit/button": "^17.17.0",
|
|
41
|
+
"@atlaskit/codemod-utils": "^4.2.0",
|
|
42
|
+
"@atlaskit/form": "^10.4.0",
|
|
43
|
+
"@atlaskit/icon": "^22.4.0",
|
|
44
|
+
"@atlaskit/inline-dialog": "^14.2.0",
|
|
45
|
+
"@atlaskit/primitives": "^7.4.0",
|
|
46
|
+
"@atlaskit/textfield": "^6.4.0",
|
|
47
|
+
"@atlaskit/theme": "^12.10.0",
|
|
48
|
+
"@atlaskit/tokens": "^1.51.0",
|
|
49
|
+
"@atlaskit/visually-hidden": "^1.4.0",
|
|
50
|
+
"@babel/runtime": "^7.0.0",
|
|
51
|
+
"@emotion/react": "^11.7.1"
|
|
52
|
+
},
|
|
53
|
+
"peerDependencies": {
|
|
54
|
+
"react": "^16.8.0 || ^17.0.0 || ~18.2.0"
|
|
55
|
+
},
|
|
56
|
+
"devDependencies": {
|
|
57
|
+
"@af/accessibility-testing": "*",
|
|
58
|
+
"@af/integration-testing": "*",
|
|
59
|
+
"@atlaskit/datetime-picker": "^13.5.0",
|
|
60
|
+
"@atlaskit/docs": "*",
|
|
61
|
+
"@atlaskit/ds-lib": "^2.3.0",
|
|
62
|
+
"@atlaskit/section-message": "^6.5.0",
|
|
63
|
+
"@atlaskit/select": "^17.11.0",
|
|
64
|
+
"@atlaskit/ssr": "*",
|
|
65
|
+
"@atlaskit/tag": "^12.3.0",
|
|
66
|
+
"@atlaskit/tag-group": "^10.4.0",
|
|
67
|
+
"@atlaskit/textarea": "^5.5.0",
|
|
68
|
+
"@atlaskit/visual-regression": "*",
|
|
69
|
+
"@emotion/styled": "^11.0.0",
|
|
70
|
+
"@testing-library/dom": "^8.17.1",
|
|
71
|
+
"@testing-library/react": "^12.1.5",
|
|
72
|
+
"ast-types": "^0.13.3",
|
|
73
|
+
"jscodeshift": "^0.13.0",
|
|
74
|
+
"react-dom": "^16.8.0",
|
|
75
|
+
"react-select-event": "^5.5.0",
|
|
76
|
+
"storybook-addon-performance": "^0.16.0",
|
|
77
|
+
"typescript": "~5.4.2",
|
|
78
|
+
"wait-for-expect": "^1.2.0"
|
|
79
|
+
},
|
|
80
|
+
"keywords": [
|
|
81
|
+
"atlaskit",
|
|
82
|
+
"react",
|
|
83
|
+
"ui"
|
|
84
|
+
],
|
|
85
|
+
"techstack": {
|
|
86
|
+
"@atlassian/frontend": {
|
|
87
|
+
"import-structure": "atlassian-conventions"
|
|
88
|
+
},
|
|
89
|
+
"@repo/internal": {
|
|
90
|
+
"dom-events": "use-bind-event-listener",
|
|
91
|
+
"ui-components": "lite-mode",
|
|
92
|
+
"analytics": "analytics-next",
|
|
93
|
+
"design-tokens": [
|
|
94
|
+
"color",
|
|
95
|
+
"spacing"
|
|
96
|
+
],
|
|
97
|
+
"deprecation": "no-deprecated-imports",
|
|
98
|
+
"styling": [
|
|
99
|
+
"emotion",
|
|
100
|
+
"static"
|
|
101
|
+
]
|
|
102
|
+
}
|
|
103
|
+
},
|
|
104
|
+
"af:exports": {
|
|
105
|
+
"./inline-edit": "./src/entry-points/inline-edit.ts",
|
|
106
|
+
"./inline-editable-textfield": "./src/entry-points/inline-editable-textfield.ts",
|
|
107
|
+
"./types": "./src/entry-points/types.ts",
|
|
108
|
+
".": "./src/index.ts"
|
|
109
|
+
}
|
|
110
|
+
}
|
package/report.api.md
CHANGED
|
@@ -2,7 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
## API Report File for "@atlaskit/inline-edit"
|
|
4
4
|
|
|
5
|
-
> Do not edit this file. This report is auto-generated using
|
|
5
|
+
> Do not edit this file. This report is auto-generated using
|
|
6
|
+
> [API Extractor](https://api-extractor.com/).
|
|
6
7
|
> [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
|
|
7
8
|
|
|
8
9
|
### Table of contents
|
|
@@ -22,60 +23,54 @@ import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
|
|
|
22
23
|
|
|
23
24
|
// @public (undocumented)
|
|
24
25
|
interface CommonProps {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
value: any,
|
|
39
|
-
formState: {},
|
|
40
|
-
fieldState: {},
|
|
41
|
-
) => Promise<string | void> | string | void;
|
|
26
|
+
analyticsContext?: Record<string, any>;
|
|
27
|
+
cancelButtonLabel?: string;
|
|
28
|
+
confirmButtonLabel?: string;
|
|
29
|
+
defaultValue: any;
|
|
30
|
+
editButtonLabel?: string;
|
|
31
|
+
hideActionButtons?: boolean;
|
|
32
|
+
isRequired?: boolean;
|
|
33
|
+
keepEditViewOpenOnBlur?: boolean;
|
|
34
|
+
label?: string;
|
|
35
|
+
onCancel?: () => void;
|
|
36
|
+
readViewFitContainerWidth?: boolean;
|
|
37
|
+
startWithEditViewOpen?: boolean;
|
|
38
|
+
validate?: (value: any, formState: {}, fieldState: {}) => Promise<string | void> | string | void;
|
|
42
39
|
}
|
|
43
40
|
|
|
44
41
|
// @public (undocumented)
|
|
45
42
|
interface ExtendedFieldProps<FieldValue> extends FieldProps<FieldValue> {
|
|
46
|
-
|
|
47
|
-
|
|
43
|
+
// (undocumented)
|
|
44
|
+
errorMessage?: string | undefined;
|
|
48
45
|
}
|
|
49
46
|
|
|
50
47
|
// @public (undocumented)
|
|
51
48
|
const InlineEdit: <FieldValue extends unknown = string>(
|
|
52
|
-
|
|
49
|
+
props: InlineEditProps<FieldValue>,
|
|
53
50
|
) => jsx.JSX.Element;
|
|
54
51
|
export default InlineEdit;
|
|
55
52
|
|
|
56
53
|
// @public (undocumented)
|
|
57
|
-
export const InlineEditableTextfield: (
|
|
58
|
-
props: InlineEditableTextfieldProps,
|
|
59
|
-
) => jsx.JSX.Element;
|
|
54
|
+
export const InlineEditableTextfield: (props: InlineEditableTextfieldProps) => jsx.JSX.Element;
|
|
60
55
|
|
|
61
56
|
// @public (undocumented)
|
|
62
57
|
export interface InlineEditableTextfieldProps extends CommonProps {
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
58
|
+
isCompact?: boolean;
|
|
59
|
+
onConfirm: (value: string, analyticsEvent: UIAnalyticsEvent) => void;
|
|
60
|
+
placeholder: string;
|
|
61
|
+
testId?: string;
|
|
67
62
|
}
|
|
68
63
|
|
|
69
64
|
// @public (undocumented)
|
|
70
65
|
export interface InlineEditProps<FieldValue> extends CommonProps {
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
66
|
+
editView: (
|
|
67
|
+
fieldProps: ExtendedFieldProps<FieldValue>,
|
|
68
|
+
ref: React_2.RefObject<any>,
|
|
69
|
+
) => React_2.ReactNode;
|
|
70
|
+
isEditing?: boolean;
|
|
71
|
+
onConfirm: (value: any, analyticsEvent: UIAnalyticsEvent) => void;
|
|
72
|
+
onEdit?: () => void;
|
|
73
|
+
readView: () => React_2.ReactNode;
|
|
79
74
|
}
|
|
80
75
|
|
|
81
76
|
// (No @packageDocumentation comment for this package)
|
|
@@ -89,7 +84,7 @@ export interface InlineEditProps<FieldValue> extends CommonProps {
|
|
|
89
84
|
|
|
90
85
|
```json
|
|
91
86
|
{
|
|
92
|
-
|
|
87
|
+
"react": "^16.8.0"
|
|
93
88
|
}
|
|
94
89
|
```
|
|
95
90
|
|