@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.
Files changed (37) hide show
  1. package/CHANGELOG.md +1053 -1040
  2. package/README.md +2 -1
  3. package/__perf__/default.tsx +10 -10
  4. package/__perf__/inline-edit.tsx +31 -36
  5. package/__perf__/inline-text-field.tsx +9 -9
  6. package/codemods/12.0.0-lite-mode.ts +4 -4
  7. package/codemods/__tests__/12.0.0-lite-mode.tsx +21 -21
  8. package/codemods/__tests__/add-comments-when-validate-found.ts +14 -14
  9. package/codemods/__tests__/lift-InlineEditStateless-to-default.ts +35 -35
  10. package/codemods/__tests__/lift-InlineEditableTextField-to-its-entry-point.tsx +21 -21
  11. package/codemods/__tests__/spread-errorMessage-out-of-fieldProps.tsx +28 -28
  12. package/codemods/migrates/add-comments-when-validate-found.ts +13 -23
  13. package/codemods/migrates/lift-InlineEditStateless-to-default.ts +43 -57
  14. package/codemods/migrates/lift-InlineEditableTextField-to-its-entry-point.ts +29 -42
  15. package/codemods/migrates/spread-errorMessage-out-of-fieldProps.ts +45 -63
  16. package/codemods/migrates/utils.ts +62 -70
  17. package/dist/cjs/inline-edit.js +4 -2
  18. package/dist/cjs/inline-editable-textfield.js +8 -1
  19. package/dist/cjs/internal/buttons.js +10 -3
  20. package/dist/cjs/internal/read-view.js +6 -0
  21. package/dist/es2019/inline-edit.js +6 -1
  22. package/dist/es2019/inline-editable-textfield.js +9 -1
  23. package/dist/es2019/internal/buttons.js +9 -3
  24. package/dist/es2019/internal/read-view.js +6 -0
  25. package/dist/esm/inline-edit.js +6 -1
  26. package/dist/esm/inline-editable-textfield.js +9 -1
  27. package/dist/esm/internal/buttons.js +9 -3
  28. package/dist/esm/internal/read-view.js +6 -0
  29. package/dist/types/internal/buttons.d.ts +3 -0
  30. package/dist/types/internal/read-view.d.ts +3 -0
  31. package/dist/types/types.d.ts +2 -2
  32. package/dist/types-ts4.5/internal/buttons.d.ts +3 -0
  33. package/dist/types-ts4.5/internal/read-view.d.ts +3 -0
  34. package/dist/types-ts4.5/types.d.ts +2 -2
  35. package/extract-react-types/inline-editable-textfield-props.tsx +2 -4
  36. package/package.json +109 -111
  37. 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.4.0"
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
- paddingRight: "var(--ds-space-075, 6px)",
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': {
@@ -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.4.0"
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
- paddingRight: "var(--ds-space-075, 6px)",
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': {
@@ -1,3 +1,6 @@
1
+ /**
2
+ * @jsxRuntime classic
3
+ */
1
4
  /** @jsx jsx */
2
5
  /// <reference types="react" />
3
6
  import { jsx } from '@emotion/react';
@@ -1,3 +1,6 @@
1
+ /**
2
+ * @jsxRuntime classic
3
+ */
1
4
  /** @jsx jsx */
2
5
  import React from 'react';
3
6
  import { jsx } from '@emotion/react';
@@ -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
- Saves and confirms the value entered into the field. It exits `editView` and returns to `readView`.
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,4 +1,7 @@
1
1
  /// <reference types="react" />
2
+ /**
3
+ * @jsxRuntime classic
4
+ */
2
5
  /** @jsx jsx */
3
6
  import { jsx } from '@emotion/react';
4
7
  interface ButtonsProp {
@@ -1,3 +1,6 @@
1
+ /**
2
+ * @jsxRuntime classic
3
+ */
1
4
  /** @jsx jsx */
2
5
  import React from 'react';
3
6
  import { jsx } from '@emotion/react';
@@ -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
- Saves and confirms the value entered into the field. It exits `editView` and returns to `readView`.
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
- props: InlineEditableTextfieldProps,
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
- "name": "@atlaskit/inline-edit",
3
- "version": "13.4.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.2.0",
43
- "@atlaskit/icon": "^22.3.0",
44
- "@atlaskit/inline-dialog": "^14.1.0",
45
- "@atlaskit/primitives": "^6.3.0",
46
- "@atlaskit/textfield": "^6.3.0",
47
- "@atlaskit/theme": "^12.8.0",
48
- "@atlaskit/tokens": "^1.49.0",
49
- "@atlaskit/visually-hidden": "^1.3.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.10.0",
64
- "@atlaskit/ssr": "*",
65
- "@atlaskit/tag": "^12.2.0",
66
- "@atlaskit/tag-group": "^10.3.0",
67
- "@atlaskit/textarea": "^5.4.0",
68
- "@atlaskit/visual-regression": "*",
69
- "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
70
- "@emotion/styled": "^11.0.0",
71
- "@testing-library/dom": "^8.17.1",
72
- "@testing-library/react": "^12.1.5",
73
- "ast-types": "^0.13.3",
74
- "jscodeshift": "^0.13.0",
75
- "react-dom": "^16.8.0",
76
- "react-select-event": "^5.5.0",
77
- "storybook-addon-performance": "^0.16.0",
78
- "typescript": "~5.4.2",
79
- "wait-for-expect": "^1.2.0"
80
- },
81
- "keywords": [
82
- "atlaskit",
83
- "react",
84
- "ui"
85
- ],
86
- "techstack": {
87
- "@atlassian/frontend": {
88
- "import-structure": "atlassian-conventions"
89
- },
90
- "@repo/internal": {
91
- "dom-events": "use-bind-event-listener",
92
- "ui-components": "lite-mode",
93
- "analytics": "analytics-next",
94
- "design-tokens": [
95
- "color",
96
- "spacing"
97
- ],
98
- "deprecation": "no-deprecated-imports",
99
- "styling": [
100
- "emotion",
101
- "static"
102
- ]
103
- }
104
- },
105
- "af:exports": {
106
- "./inline-edit": "./src/entry-points/inline-edit.ts",
107
- "./inline-editable-textfield": "./src/entry-points/inline-editable-textfield.ts",
108
- "./types": "./src/entry-points/types.ts",
109
- ".": "./src/index.ts"
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 [API Extractor](https://api-extractor.com/).
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
- analyticsContext?: Record<string, any>;
26
- cancelButtonLabel?: string;
27
- confirmButtonLabel?: string;
28
- defaultValue: any;
29
- editButtonLabel?: string;
30
- hideActionButtons?: boolean;
31
- isRequired?: boolean;
32
- keepEditViewOpenOnBlur?: boolean;
33
- label?: string;
34
- onCancel?: () => void;
35
- readViewFitContainerWidth?: boolean;
36
- startWithEditViewOpen?: boolean;
37
- validate?: (
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
- // (undocumented)
47
- errorMessage?: string | undefined;
43
+ // (undocumented)
44
+ errorMessage?: string | undefined;
48
45
  }
49
46
 
50
47
  // @public (undocumented)
51
48
  const InlineEdit: <FieldValue extends unknown = string>(
52
- props: InlineEditProps<FieldValue>,
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
- isCompact?: boolean;
64
- onConfirm: (value: string, analyticsEvent: UIAnalyticsEvent) => void;
65
- placeholder: string;
66
- testId?: string;
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
- editView: (
72
- fieldProps: ExtendedFieldProps<FieldValue>,
73
- ref: React_2.RefObject<any>,
74
- ) => React_2.ReactNode;
75
- isEditing?: boolean;
76
- onConfirm: (value: any, analyticsEvent: UIAnalyticsEvent) => void;
77
- onEdit?: () => void;
78
- readView: () => React_2.ReactNode;
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
- "react": "^16.8.0"
87
+ "react": "^16.8.0"
93
88
  }
94
89
  ```
95
90