@atlaskit/link-create 0.5.6 → 0.6.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 +12 -0
- package/dist/cjs/common/constants.js +1 -1
- package/dist/cjs/common/utils/form/index.js +15 -0
- package/dist/cjs/ui/create-form/async-select/main.js +8 -1
- package/dist/cjs/ui/create-form/main.js +1 -1
- package/dist/cjs/ui/create-form/textfield/main.js +12 -2
- package/dist/cjs/ui/main.js +2 -1
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/common/constants.js +1 -1
- package/dist/es2019/common/utils/form/index.js +8 -0
- package/dist/es2019/ui/create-form/async-select/main.js +10 -1
- package/dist/es2019/ui/create-form/main.js +2 -2
- package/dist/es2019/ui/create-form/textfield/main.js +11 -1
- package/dist/es2019/ui/main.js +3 -2
- package/dist/es2019/version.json +1 -1
- package/dist/esm/common/constants.js +1 -1
- package/dist/esm/common/utils/form/index.js +8 -0
- package/dist/esm/ui/create-form/async-select/main.js +8 -1
- package/dist/esm/ui/create-form/main.js +2 -2
- package/dist/esm/ui/create-form/textfield/main.js +12 -2
- package/dist/esm/ui/main.js +3 -2
- package/dist/esm/version.json +1 -1
- package/dist/types/common/constants.d.ts +1 -1
- package/dist/types/common/utils/form/index.d.ts +7 -0
- package/dist/types/ui/create-form/textfield/main.d.ts +1 -1
- package/dist/types/ui/create-form/textfield/types.d.ts +1 -1
- package/dist/types-ts4.5/common/constants.d.ts +1 -1
- package/dist/types-ts4.5/common/utils/form/index.d.ts +7 -0
- package/dist/types-ts4.5/ui/create-form/textfield/main.d.ts +1 -1
- package/dist/types-ts4.5/ui/create-form/textfield/types.d.ts +1 -1
- package/package.json +5 -5
- package/report.api.md +2 -1
- package/tmp/api-report-tmp.d.ts +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @atlaskit/link-create
|
|
2
2
|
|
|
3
|
+
## 0.6.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`ac3927f0650`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ac3927f0650) - Make modal 480px wide, Update TextField to take isRequired prop w/o default browser validation, remove extra internal spacing in the create form
|
|
8
|
+
|
|
9
|
+
## 0.5.7
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`ffb87e553ea`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ffb87e553ea) - Hides the validation error when user edits the field
|
|
14
|
+
|
|
3
15
|
## 0.5.6
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
|
@@ -8,7 +8,7 @@ var ANALYTICS_CHANNEL = 'media';
|
|
|
8
8
|
exports.ANALYTICS_CHANNEL = ANALYTICS_CHANNEL;
|
|
9
9
|
var COMPONENT_NAME = 'linkCreate';
|
|
10
10
|
exports.COMPONENT_NAME = COMPONENT_NAME;
|
|
11
|
-
var CREATE_FORM_MAX_WIDTH_IN_PX = '
|
|
11
|
+
var CREATE_FORM_MAX_WIDTH_IN_PX = '480';
|
|
12
12
|
exports.CREATE_FORM_MAX_WIDTH_IN_PX = CREATE_FORM_MAX_WIDTH_IN_PX;
|
|
13
13
|
var CREATE_FORM_MIN_HEIGHT_IN_PX = '200';
|
|
14
14
|
exports.CREATE_FORM_MIN_HEIGHT_IN_PX = CREATE_FORM_MIN_HEIGHT_IN_PX;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.validateSubmitErrors = void 0;
|
|
7
|
+
/**
|
|
8
|
+
* This function checks if there have been changes since last submit
|
|
9
|
+
* to let a Field know if it should hide the error message until
|
|
10
|
+
* the next submit, or if it returns to the previous error state
|
|
11
|
+
*/
|
|
12
|
+
var validateSubmitErrors = function validateSubmitErrors(meta) {
|
|
13
|
+
return !!(meta.touched && (meta.error || meta.submitError && !meta.dirtySinceLastSubmit));
|
|
14
|
+
};
|
|
15
|
+
exports.validateSubmitErrors = validateSubmitErrors;
|
|
@@ -11,6 +11,7 @@ var _react = require("react");
|
|
|
11
11
|
var _react2 = require("@emotion/react");
|
|
12
12
|
var _form = require("@atlaskit/form");
|
|
13
13
|
var _select = require("@atlaskit/select");
|
|
14
|
+
var _form2 = require("../../../common/utils/form");
|
|
14
15
|
var _formContext = require("../../../controllers/form-context");
|
|
15
16
|
var _excluded = ["label", "name", "validationHelpText", "isRequired", "testId", "validators", "defaultValue"];
|
|
16
17
|
/** @jsx jsx */
|
|
@@ -45,7 +46,13 @@ function AsyncSelect(_ref) {
|
|
|
45
46
|
defaultValue: defaultValue
|
|
46
47
|
}, function (_ref2) {
|
|
47
48
|
var fieldProps = _ref2.fieldProps,
|
|
49
|
+
meta = _ref2.meta,
|
|
48
50
|
error = _ref2.error;
|
|
49
|
-
|
|
51
|
+
var isInvalid = (0, _form2.validateSubmitErrors)(meta);
|
|
52
|
+
return (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_select.AsyncSelect, (0, _extends2.default)({}, fieldProps, rest, {
|
|
53
|
+
isInvalid: isInvalid
|
|
54
|
+
})), !error && validationHelpText && (0, _react2.jsx)(_form.HelperMessage, null, validationHelpText), isInvalid && (0, _react2.jsx)(_form.ErrorMessage, {
|
|
55
|
+
testId: "".concat(testId, "-error-message")
|
|
56
|
+
}, error));
|
|
50
57
|
}));
|
|
51
58
|
}
|
|
@@ -96,7 +96,7 @@ var CreateForm = function CreateForm(_ref) {
|
|
|
96
96
|
name: "confluence-creation-form",
|
|
97
97
|
"data-testid": testId,
|
|
98
98
|
css: formStyles
|
|
99
|
-
}), (0, _react2.jsx)(
|
|
99
|
+
}), (0, _react2.jsx)("div", null, children), !hideFooter && (0, _react2.jsx)(_form.FormFooter, null, formErrorMessage && (0, _react2.jsx)("div", {
|
|
100
100
|
css: errorStyles,
|
|
101
101
|
"data-testid": "link-create-form-error"
|
|
102
102
|
}, (0, _react2.jsx)(_error.default, {
|
|
@@ -11,8 +11,9 @@ var _react = require("react");
|
|
|
11
11
|
var _react2 = require("@emotion/react");
|
|
12
12
|
var _form = require("@atlaskit/form");
|
|
13
13
|
var _textfield = _interopRequireDefault(require("@atlaskit/textfield"));
|
|
14
|
+
var _form2 = require("../../../common/utils/form");
|
|
14
15
|
var _formContext = require("../../../controllers/form-context");
|
|
15
|
-
var _excluded = ["label", "name", "validationHelpText", "validators", "defaultValue"];
|
|
16
|
+
var _excluded = ["label", "name", "validationHelpText", "validators", "defaultValue", "isRequired"];
|
|
16
17
|
/** @jsx jsx */
|
|
17
18
|
/**
|
|
18
19
|
* A text field utilising the Atlaskit Textfield and Field objects from `@atlaskit/form`.
|
|
@@ -27,6 +28,7 @@ function TextField(_ref) {
|
|
|
27
28
|
validationHelpText = _ref.validationHelpText,
|
|
28
29
|
validators = _ref.validators,
|
|
29
30
|
defaultValue = _ref.defaultValue,
|
|
31
|
+
isRequired = _ref.isRequired,
|
|
30
32
|
restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
31
33
|
var _useFormContext = (0, _formContext.useFormContext)(),
|
|
32
34
|
assignValidator = _useFormContext.assignValidator;
|
|
@@ -46,11 +48,19 @@ function TextField(_ref) {
|
|
|
46
48
|
(0, _react2.jsx)(_form.Field, {
|
|
47
49
|
name: name,
|
|
48
50
|
label: label,
|
|
51
|
+
isRequired: isRequired,
|
|
49
52
|
defaultValue: defaultValue !== null && defaultValue !== void 0 ? defaultValue : ''
|
|
50
53
|
}, function (_ref2) {
|
|
51
54
|
var fieldProps = _ref2.fieldProps,
|
|
55
|
+
meta = _ref2.meta,
|
|
52
56
|
error = _ref2.error;
|
|
53
|
-
|
|
57
|
+
var isInvalid = (0, _form2.validateSubmitErrors)(meta);
|
|
58
|
+
return (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_textfield.default, (0, _extends2.default)({}, fieldProps, restProps, {
|
|
59
|
+
isInvalid: isInvalid,
|
|
60
|
+
isRequired: false // Remove the default browser validation
|
|
61
|
+
})), !error && validationHelpText && (0, _react2.jsx)(_form.HelperMessage, null, validationHelpText), error && isInvalid && (0, _react2.jsx)(_form.ErrorMessage, {
|
|
62
|
+
testId: "".concat(restProps.testId, "-error-message")
|
|
63
|
+
}, error));
|
|
54
64
|
})
|
|
55
65
|
);
|
|
56
66
|
}
|
package/dist/cjs/ui/main.js
CHANGED
|
@@ -93,7 +93,8 @@ var LinkCreateWithModal = function LinkCreateWithModal(props) {
|
|
|
93
93
|
testId: testId,
|
|
94
94
|
shouldScrollInViewport: true,
|
|
95
95
|
onOpenComplete: handleOpenComplete,
|
|
96
|
-
onCloseComplete: handleCloseComplete
|
|
96
|
+
onCloseComplete: handleCloseComplete,
|
|
97
|
+
width: "".concat(_constants.CREATE_FORM_MAX_WIDTH_IN_PX, "px")
|
|
97
98
|
}, (0, _react2.jsx)(_modalDialog.ModalHeader, null, (0, _react2.jsx)(_modalDialog.ModalTitle, null, intl.formatMessage(_messages.messages.heading))), (0, _react2.jsx)(_modalDialog.ModalBody, null, (0, _react2.jsx)(_errorBoundary.ErrorBoundary, null, (0, _react2.jsx)(_formContext.FormContextProvider, null, (0, _react2.jsx)(LinkCreate, props))))));
|
|
98
99
|
};
|
|
99
100
|
var LinkCreateWithAnalyticsContext = (0, _analytics.withLinkCreateAnalyticsContext)( /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
package/dist/cjs/version.json
CHANGED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* This function checks if there have been changes since last submit
|
|
3
|
+
* to let a Field know if it should hide the error message until
|
|
4
|
+
* the next submit, or if it returns to the previous error state
|
|
5
|
+
*/
|
|
6
|
+
export const validateSubmitErrors = meta => {
|
|
7
|
+
return !!(meta.touched && (meta.error || meta.submitError && !meta.dirtySinceLastSubmit));
|
|
8
|
+
};
|
|
@@ -4,6 +4,7 @@ import { Fragment, useEffect } from 'react';
|
|
|
4
4
|
import { jsx } from '@emotion/react';
|
|
5
5
|
import { ErrorMessage, Field, HelperMessage } from '@atlaskit/form';
|
|
6
6
|
import { AsyncSelect as AkAsyncSelect } from '@atlaskit/select';
|
|
7
|
+
import { validateSubmitErrors } from '../../../common/utils/form';
|
|
7
8
|
import { useFormContext } from '../../../controllers/form-context';
|
|
8
9
|
/**
|
|
9
10
|
* An async select utilising the Atlaskit AsyncSelect and Field objects from `@atlaskit/form`.
|
|
@@ -38,6 +39,14 @@ export function AsyncSelect({
|
|
|
38
39
|
defaultValue: defaultValue
|
|
39
40
|
}, ({
|
|
40
41
|
fieldProps,
|
|
42
|
+
meta,
|
|
41
43
|
error
|
|
42
|
-
}) =>
|
|
44
|
+
}) => {
|
|
45
|
+
const isInvalid = validateSubmitErrors(meta);
|
|
46
|
+
return jsx(Fragment, null, jsx(AkAsyncSelect, _extends({}, fieldProps, rest, {
|
|
47
|
+
isInvalid: isInvalid
|
|
48
|
+
})), !error && validationHelpText && jsx(HelperMessage, null, validationHelpText), isInvalid && jsx(ErrorMessage, {
|
|
49
|
+
testId: `${testId}-error-message`
|
|
50
|
+
}, error));
|
|
51
|
+
}));
|
|
43
52
|
}
|
|
@@ -7,7 +7,7 @@ import { useAnalyticsEvents } from '@atlaskit/analytics-next';
|
|
|
7
7
|
import { ButtonGroup } from '@atlaskit/button';
|
|
8
8
|
import LoadingButton from '@atlaskit/button/loading-button';
|
|
9
9
|
import Button from '@atlaskit/button/standard-button';
|
|
10
|
-
import Form, { FormFooter
|
|
10
|
+
import Form, { FormFooter } from '@atlaskit/form';
|
|
11
11
|
import ErrorIcon from '@atlaskit/icon/glyph/error';
|
|
12
12
|
import { ANALYTICS_CHANNEL, CREATE_FORM_MAX_WIDTH_IN_PX } from '../../common/constants';
|
|
13
13
|
import createEventPayload from '../../common/utils/analytics/analytics.codegen';
|
|
@@ -69,7 +69,7 @@ export const CreateForm = ({
|
|
|
69
69
|
name: "confluence-creation-form",
|
|
70
70
|
"data-testid": testId,
|
|
71
71
|
css: formStyles
|
|
72
|
-
}), jsx(
|
|
72
|
+
}), jsx("div", null, children), !hideFooter && jsx(FormFooter, null, formErrorMessage && jsx("div", {
|
|
73
73
|
css: errorStyles,
|
|
74
74
|
"data-testid": "link-create-form-error"
|
|
75
75
|
}, jsx(ErrorIcon, {
|
|
@@ -4,6 +4,7 @@ import { Fragment, useEffect } from 'react';
|
|
|
4
4
|
import { jsx } from '@emotion/react';
|
|
5
5
|
import { ErrorMessage, Field, HelperMessage } from '@atlaskit/form';
|
|
6
6
|
import AkTextfield from '@atlaskit/textfield';
|
|
7
|
+
import { validateSubmitErrors } from '../../../common/utils/form';
|
|
7
8
|
import { useFormContext } from '../../../controllers/form-context';
|
|
8
9
|
/**
|
|
9
10
|
* A text field utilising the Atlaskit Textfield and Field objects from `@atlaskit/form`.
|
|
@@ -18,6 +19,7 @@ export function TextField({
|
|
|
18
19
|
validationHelpText,
|
|
19
20
|
validators,
|
|
20
21
|
defaultValue,
|
|
22
|
+
isRequired,
|
|
21
23
|
...restProps
|
|
22
24
|
}) {
|
|
23
25
|
const {
|
|
@@ -39,12 +41,20 @@ export function TextField({
|
|
|
39
41
|
jsx(Field, {
|
|
40
42
|
name: name,
|
|
41
43
|
label: label,
|
|
44
|
+
isRequired: isRequired,
|
|
42
45
|
defaultValue: defaultValue !== null && defaultValue !== void 0 ? defaultValue : ''
|
|
43
46
|
}, ({
|
|
44
47
|
fieldProps,
|
|
48
|
+
meta,
|
|
45
49
|
error
|
|
46
50
|
}) => {
|
|
47
|
-
|
|
51
|
+
const isInvalid = validateSubmitErrors(meta);
|
|
52
|
+
return jsx(Fragment, null, jsx(AkTextfield, _extends({}, fieldProps, restProps, {
|
|
53
|
+
isInvalid: isInvalid,
|
|
54
|
+
isRequired: false // Remove the default browser validation
|
|
55
|
+
})), !error && validationHelpText && jsx(HelperMessage, null, validationHelpText), error && isInvalid && jsx(ErrorMessage, {
|
|
56
|
+
testId: `${restProps.testId}-error-message`
|
|
57
|
+
}, error));
|
|
48
58
|
})
|
|
49
59
|
);
|
|
50
60
|
}
|
package/dist/es2019/ui/main.js
CHANGED
|
@@ -4,7 +4,7 @@ import { jsx } from '@emotion/react';
|
|
|
4
4
|
import { useIntl } from 'react-intl-next';
|
|
5
5
|
import { AnalyticsContext, useAnalyticsEvents } from '@atlaskit/analytics-next';
|
|
6
6
|
import Modal, { ModalBody, ModalHeader, ModalTitle, ModalTransition } from '@atlaskit/modal-dialog';
|
|
7
|
-
import { ANALYTICS_CHANNEL, COMPONENT_NAME } from '../common/constants';
|
|
7
|
+
import { ANALYTICS_CHANNEL, COMPONENT_NAME, CREATE_FORM_MAX_WIDTH_IN_PX } from '../common/constants';
|
|
8
8
|
import { withLinkCreateAnalyticsContext } from '../common/utils/analytics';
|
|
9
9
|
import createEventPayload from '../common/utils/analytics/analytics.codegen';
|
|
10
10
|
import { LinkCreateCallbackProvider } from '../controllers/callback-context';
|
|
@@ -65,7 +65,8 @@ const LinkCreateWithModal = props => {
|
|
|
65
65
|
testId: testId,
|
|
66
66
|
shouldScrollInViewport: true,
|
|
67
67
|
onOpenComplete: handleOpenComplete,
|
|
68
|
-
onCloseComplete: handleCloseComplete
|
|
68
|
+
onCloseComplete: handleCloseComplete,
|
|
69
|
+
width: `${CREATE_FORM_MAX_WIDTH_IN_PX}px`
|
|
69
70
|
}, jsx(ModalHeader, null, jsx(ModalTitle, null, intl.formatMessage(messages.heading))), jsx(ModalBody, null, jsx(ErrorBoundary, null, jsx(FormContextProvider, null, jsx(LinkCreate, props))))));
|
|
70
71
|
};
|
|
71
72
|
const LinkCreateWithAnalyticsContext = withLinkCreateAnalyticsContext( /*#__PURE__*/memo(({
|
package/dist/es2019/version.json
CHANGED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* This function checks if there have been changes since last submit
|
|
3
|
+
* to let a Field know if it should hide the error message until
|
|
4
|
+
* the next submit, or if it returns to the previous error state
|
|
5
|
+
*/
|
|
6
|
+
export var validateSubmitErrors = function validateSubmitErrors(meta) {
|
|
7
|
+
return !!(meta.touched && (meta.error || meta.submitError && !meta.dirtySinceLastSubmit));
|
|
8
|
+
};
|
|
@@ -6,6 +6,7 @@ import { Fragment, useEffect } from 'react';
|
|
|
6
6
|
import { jsx } from '@emotion/react';
|
|
7
7
|
import { ErrorMessage, Field, HelperMessage } from '@atlaskit/form';
|
|
8
8
|
import { AsyncSelect as AkAsyncSelect } from '@atlaskit/select';
|
|
9
|
+
import { validateSubmitErrors } from '../../../common/utils/form';
|
|
9
10
|
import { useFormContext } from '../../../controllers/form-context';
|
|
10
11
|
/**
|
|
11
12
|
* An async select utilising the Atlaskit AsyncSelect and Field objects from `@atlaskit/form`.
|
|
@@ -38,7 +39,13 @@ export function AsyncSelect(_ref) {
|
|
|
38
39
|
defaultValue: defaultValue
|
|
39
40
|
}, function (_ref2) {
|
|
40
41
|
var fieldProps = _ref2.fieldProps,
|
|
42
|
+
meta = _ref2.meta,
|
|
41
43
|
error = _ref2.error;
|
|
42
|
-
|
|
44
|
+
var isInvalid = validateSubmitErrors(meta);
|
|
45
|
+
return jsx(Fragment, null, jsx(AkAsyncSelect, _extends({}, fieldProps, rest, {
|
|
46
|
+
isInvalid: isInvalid
|
|
47
|
+
})), !error && validationHelpText && jsx(HelperMessage, null, validationHelpText), isInvalid && jsx(ErrorMessage, {
|
|
48
|
+
testId: "".concat(testId, "-error-message")
|
|
49
|
+
}, error));
|
|
43
50
|
}));
|
|
44
51
|
}
|
|
@@ -9,7 +9,7 @@ import { useAnalyticsEvents } from '@atlaskit/analytics-next';
|
|
|
9
9
|
import { ButtonGroup } from '@atlaskit/button';
|
|
10
10
|
import LoadingButton from '@atlaskit/button/loading-button';
|
|
11
11
|
import Button from '@atlaskit/button/standard-button';
|
|
12
|
-
import Form, { FormFooter
|
|
12
|
+
import Form, { FormFooter } from '@atlaskit/form';
|
|
13
13
|
import ErrorIcon from '@atlaskit/icon/glyph/error';
|
|
14
14
|
import { ANALYTICS_CHANNEL, CREATE_FORM_MAX_WIDTH_IN_PX } from '../../common/constants';
|
|
15
15
|
import createEventPayload from '../../common/utils/analytics/analytics.codegen';
|
|
@@ -85,7 +85,7 @@ export var CreateForm = function CreateForm(_ref) {
|
|
|
85
85
|
name: "confluence-creation-form",
|
|
86
86
|
"data-testid": testId,
|
|
87
87
|
css: formStyles
|
|
88
|
-
}), jsx(
|
|
88
|
+
}), jsx("div", null, children), !hideFooter && jsx(FormFooter, null, formErrorMessage && jsx("div", {
|
|
89
89
|
css: errorStyles,
|
|
90
90
|
"data-testid": "link-create-form-error"
|
|
91
91
|
}, jsx(ErrorIcon, {
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
var _excluded = ["label", "name", "validationHelpText", "validators", "defaultValue"];
|
|
3
|
+
var _excluded = ["label", "name", "validationHelpText", "validators", "defaultValue", "isRequired"];
|
|
4
4
|
/** @jsx jsx */
|
|
5
5
|
import { Fragment, useEffect } from 'react';
|
|
6
6
|
import { jsx } from '@emotion/react';
|
|
7
7
|
import { ErrorMessage, Field, HelperMessage } from '@atlaskit/form';
|
|
8
8
|
import AkTextfield from '@atlaskit/textfield';
|
|
9
|
+
import { validateSubmitErrors } from '../../../common/utils/form';
|
|
9
10
|
import { useFormContext } from '../../../controllers/form-context';
|
|
10
11
|
/**
|
|
11
12
|
* A text field utilising the Atlaskit Textfield and Field objects from `@atlaskit/form`.
|
|
@@ -20,6 +21,7 @@ export function TextField(_ref) {
|
|
|
20
21
|
validationHelpText = _ref.validationHelpText,
|
|
21
22
|
validators = _ref.validators,
|
|
22
23
|
defaultValue = _ref.defaultValue,
|
|
24
|
+
isRequired = _ref.isRequired,
|
|
23
25
|
restProps = _objectWithoutProperties(_ref, _excluded);
|
|
24
26
|
var _useFormContext = useFormContext(),
|
|
25
27
|
assignValidator = _useFormContext.assignValidator;
|
|
@@ -39,11 +41,19 @@ export function TextField(_ref) {
|
|
|
39
41
|
jsx(Field, {
|
|
40
42
|
name: name,
|
|
41
43
|
label: label,
|
|
44
|
+
isRequired: isRequired,
|
|
42
45
|
defaultValue: defaultValue !== null && defaultValue !== void 0 ? defaultValue : ''
|
|
43
46
|
}, function (_ref2) {
|
|
44
47
|
var fieldProps = _ref2.fieldProps,
|
|
48
|
+
meta = _ref2.meta,
|
|
45
49
|
error = _ref2.error;
|
|
46
|
-
|
|
50
|
+
var isInvalid = validateSubmitErrors(meta);
|
|
51
|
+
return jsx(Fragment, null, jsx(AkTextfield, _extends({}, fieldProps, restProps, {
|
|
52
|
+
isInvalid: isInvalid,
|
|
53
|
+
isRequired: false // Remove the default browser validation
|
|
54
|
+
})), !error && validationHelpText && jsx(HelperMessage, null, validationHelpText), error && isInvalid && jsx(ErrorMessage, {
|
|
55
|
+
testId: "".concat(restProps.testId, "-error-message")
|
|
56
|
+
}, error));
|
|
47
57
|
})
|
|
48
58
|
);
|
|
49
59
|
}
|
package/dist/esm/ui/main.js
CHANGED
|
@@ -8,7 +8,7 @@ import { jsx } from '@emotion/react';
|
|
|
8
8
|
import { useIntl } from 'react-intl-next';
|
|
9
9
|
import { AnalyticsContext, useAnalyticsEvents } from '@atlaskit/analytics-next';
|
|
10
10
|
import Modal, { ModalBody, ModalHeader, ModalTitle, ModalTransition } from '@atlaskit/modal-dialog';
|
|
11
|
-
import { ANALYTICS_CHANNEL, COMPONENT_NAME } from '../common/constants';
|
|
11
|
+
import { ANALYTICS_CHANNEL, COMPONENT_NAME, CREATE_FORM_MAX_WIDTH_IN_PX } from '../common/constants';
|
|
12
12
|
import { withLinkCreateAnalyticsContext } from '../common/utils/analytics';
|
|
13
13
|
import createEventPayload from '../common/utils/analytics/analytics.codegen';
|
|
14
14
|
import { LinkCreateCallbackProvider } from '../controllers/callback-context';
|
|
@@ -82,7 +82,8 @@ var LinkCreateWithModal = function LinkCreateWithModal(props) {
|
|
|
82
82
|
testId: testId,
|
|
83
83
|
shouldScrollInViewport: true,
|
|
84
84
|
onOpenComplete: handleOpenComplete,
|
|
85
|
-
onCloseComplete: handleCloseComplete
|
|
85
|
+
onCloseComplete: handleCloseComplete,
|
|
86
|
+
width: "".concat(CREATE_FORM_MAX_WIDTH_IN_PX, "px")
|
|
86
87
|
}, jsx(ModalHeader, null, jsx(ModalTitle, null, intl.formatMessage(messages.heading))), jsx(ModalBody, null, jsx(ErrorBoundary, null, jsx(FormContextProvider, null, jsx(LinkCreate, props))))));
|
|
87
88
|
};
|
|
88
89
|
var LinkCreateWithAnalyticsContext = withLinkCreateAnalyticsContext( /*#__PURE__*/memo(function (_ref3) {
|
package/dist/esm/version.json
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export declare const ANALYTICS_CHANNEL = "media";
|
|
2
2
|
export declare const COMPONENT_NAME = "linkCreate";
|
|
3
|
-
export declare const CREATE_FORM_MAX_WIDTH_IN_PX = "
|
|
3
|
+
export declare const CREATE_FORM_MAX_WIDTH_IN_PX = "480";
|
|
4
4
|
export declare const CREATE_FORM_MIN_HEIGHT_IN_PX = "200";
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Meta } from '@atlaskit/form/Field';
|
|
2
|
+
/**
|
|
3
|
+
* This function checks if there have been changes since last submit
|
|
4
|
+
* to let a Field know if it should hide the error message until
|
|
5
|
+
* the next submit, or if it returns to the previous error state
|
|
6
|
+
*/
|
|
7
|
+
export declare const validateSubmitErrors: (meta: Meta) => boolean;
|
|
@@ -6,4 +6,4 @@ import { TextFieldProps } from './types';
|
|
|
6
6
|
* the handleSubmit function passed to the form <Form> that have a key matching the `name`
|
|
7
7
|
* of this text field are shown above the field.
|
|
8
8
|
*/
|
|
9
|
-
export declare function TextField({ label, name, validationHelpText, validators, defaultValue, ...restProps }: TextFieldProps): jsx.JSX.Element;
|
|
9
|
+
export declare function TextField({ label, name, validationHelpText, validators, defaultValue, isRequired, ...restProps }: TextFieldProps): jsx.JSX.Element;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { TextFieldProps as AKTextFieldProps } from '@atlaskit/textfield';
|
|
2
2
|
import { Validator } from '../../../common/types';
|
|
3
|
-
export type TextFieldProps = Omit<AKTextFieldProps, 'name'
|
|
3
|
+
export type TextFieldProps = Omit<AKTextFieldProps, 'name'> & {
|
|
4
4
|
/** Name passed to the <Field>.*/
|
|
5
5
|
name: string;
|
|
6
6
|
label?: string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export declare const ANALYTICS_CHANNEL = "media";
|
|
2
2
|
export declare const COMPONENT_NAME = "linkCreate";
|
|
3
|
-
export declare const CREATE_FORM_MAX_WIDTH_IN_PX = "
|
|
3
|
+
export declare const CREATE_FORM_MAX_WIDTH_IN_PX = "480";
|
|
4
4
|
export declare const CREATE_FORM_MIN_HEIGHT_IN_PX = "200";
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Meta } from '@atlaskit/form/Field';
|
|
2
|
+
/**
|
|
3
|
+
* This function checks if there have been changes since last submit
|
|
4
|
+
* to let a Field know if it should hide the error message until
|
|
5
|
+
* the next submit, or if it returns to the previous error state
|
|
6
|
+
*/
|
|
7
|
+
export declare const validateSubmitErrors: (meta: Meta) => boolean;
|
|
@@ -6,4 +6,4 @@ import { TextFieldProps } from './types';
|
|
|
6
6
|
* the handleSubmit function passed to the form <Form> that have a key matching the `name`
|
|
7
7
|
* of this text field are shown above the field.
|
|
8
8
|
*/
|
|
9
|
-
export declare function TextField({ label, name, validationHelpText, validators, defaultValue, ...restProps }: TextFieldProps): jsx.JSX.Element;
|
|
9
|
+
export declare function TextField({ label, name, validationHelpText, validators, defaultValue, isRequired, ...restProps }: TextFieldProps): jsx.JSX.Element;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { TextFieldProps as AKTextFieldProps } from '@atlaskit/textfield';
|
|
2
2
|
import { Validator } from '../../../common/types';
|
|
3
|
-
export type TextFieldProps = Omit<AKTextFieldProps, 'name'
|
|
3
|
+
export type TextFieldProps = Omit<AKTextFieldProps, 'name'> & {
|
|
4
4
|
/** Name passed to the <Field>.*/
|
|
5
5
|
name: string;
|
|
6
6
|
label?: string;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/link-create",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.0",
|
|
4
4
|
"description": "The driver component of meta creation flow",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -53,14 +53,14 @@
|
|
|
53
53
|
},
|
|
54
54
|
"devDependencies": {
|
|
55
55
|
"@atlaskit/docs": "*",
|
|
56
|
-
"@atlaskit/link-picker": "^1.
|
|
56
|
+
"@atlaskit/link-picker": "^1.23.0",
|
|
57
57
|
"@atlaskit/link-test-helpers": "^4.0.0",
|
|
58
58
|
"@atlaskit/popup": "^1.6.0",
|
|
59
59
|
"@atlaskit/visual-regression": "*",
|
|
60
60
|
"@atlassian/atlassian-frontend-prettier-config-1.0.0": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.0",
|
|
61
|
-
"@atlassian/link-create-confluence": "^
|
|
62
|
-
"@atlassian/link-create-presets": "^
|
|
63
|
-
"@atlassian/link-picker-atlassian-plugin": "^33.
|
|
61
|
+
"@atlassian/link-create-confluence": "^7.0.0",
|
|
62
|
+
"@atlassian/link-create-presets": "^5.0.0",
|
|
63
|
+
"@atlassian/link-picker-atlassian-plugin": "^33.3.0",
|
|
64
64
|
"@testing-library/react": "^12.1.5",
|
|
65
65
|
"@testing-library/user-event": "^14.4.3",
|
|
66
66
|
"fetch-mock": "^8.0.0",
|
package/report.api.md
CHANGED
|
@@ -158,11 +158,12 @@ export function TextField({
|
|
|
158
158
|
validationHelpText,
|
|
159
159
|
validators,
|
|
160
160
|
defaultValue,
|
|
161
|
+
isRequired,
|
|
161
162
|
...restProps
|
|
162
163
|
}: TextFieldProps): jsx.JSX.Element;
|
|
163
164
|
|
|
164
165
|
// @public (undocumented)
|
|
165
|
-
type TextFieldProps = Omit<TextFieldProps_2, '
|
|
166
|
+
type TextFieldProps = Omit<TextFieldProps_2, 'name'> & {
|
|
166
167
|
name: string;
|
|
167
168
|
label?: string;
|
|
168
169
|
validationHelpText?: string;
|
package/tmp/api-report-tmp.d.ts
CHANGED
|
@@ -121,10 +121,10 @@ interface Option_2 {
|
|
|
121
121
|
export { Option_2 as Option }
|
|
122
122
|
|
|
123
123
|
// @public
|
|
124
|
-
export function TextField({ label, name, validationHelpText, validators, defaultValue, ...restProps }: TextFieldProps): jsx.JSX.Element;
|
|
124
|
+
export function TextField({ label, name, validationHelpText, validators, defaultValue, isRequired, ...restProps }: TextFieldProps): jsx.JSX.Element;
|
|
125
125
|
|
|
126
126
|
// @public (undocumented)
|
|
127
|
-
type TextFieldProps = Omit<TextFieldProps_2, '
|
|
127
|
+
type TextFieldProps = Omit<TextFieldProps_2, 'name'> & {
|
|
128
128
|
name: string;
|
|
129
129
|
label?: string;
|
|
130
130
|
validationHelpText?: string;
|