@atlaskit/form 11.0.2 → 11.1.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 +20 -0
- package/dist/cjs/field.compiled.css +1 -0
- package/dist/cjs/field.js +23 -14
- package/dist/cjs/fieldset.compiled.css +1 -0
- package/dist/cjs/fieldset.js +11 -14
- package/dist/cjs/form-footer.compiled.css +4 -0
- package/dist/cjs/form-footer.js +11 -18
- package/dist/cjs/form-header.compiled.css +2 -0
- package/dist/cjs/form-header.js +15 -21
- package/dist/cjs/form-section.compiled.css +2 -0
- package/dist/cjs/form-section.js +17 -21
- package/dist/cjs/label.compiled.css +6 -0
- package/dist/cjs/label.js +15 -24
- package/dist/cjs/messages.compiled.css +10 -0
- package/dist/cjs/messages.js +34 -50
- package/dist/cjs/range-field.js +15 -13
- package/dist/cjs/required-asterisk.compiled.css +3 -0
- package/dist/cjs/required-asterisk.js +13 -21
- package/dist/es2019/field.compiled.css +1 -0
- package/dist/es2019/field.js +18 -15
- package/dist/es2019/fieldset.compiled.css +1 -0
- package/dist/es2019/fieldset.js +8 -13
- package/dist/es2019/form-footer.compiled.css +4 -0
- package/dist/es2019/form-footer.js +8 -17
- package/dist/es2019/form-header.compiled.css +2 -0
- package/dist/es2019/form-header.js +12 -20
- package/dist/es2019/form-section.compiled.css +2 -0
- package/dist/es2019/form-section.js +14 -20
- package/dist/es2019/label.compiled.css +6 -0
- package/dist/es2019/label.js +11 -22
- package/dist/es2019/messages.compiled.css +10 -0
- package/dist/es2019/messages.js +27 -48
- package/dist/es2019/range-field.js +21 -24
- package/dist/es2019/required-asterisk.compiled.css +3 -0
- package/dist/es2019/required-asterisk.js +10 -20
- package/dist/esm/field.compiled.css +1 -0
- package/dist/esm/field.js +18 -15
- package/dist/esm/fieldset.compiled.css +1 -0
- package/dist/esm/fieldset.js +8 -13
- package/dist/esm/form-footer.compiled.css +4 -0
- package/dist/esm/form-footer.js +8 -17
- package/dist/esm/form-header.compiled.css +2 -0
- package/dist/esm/form-header.js +12 -20
- package/dist/esm/form-section.compiled.css +2 -0
- package/dist/esm/form-section.js +14 -20
- package/dist/esm/label.compiled.css +6 -0
- package/dist/esm/label.js +11 -22
- package/dist/esm/messages.compiled.css +10 -0
- package/dist/esm/messages.js +29 -48
- package/dist/esm/range-field.js +15 -13
- package/dist/esm/required-asterisk.compiled.css +3 -0
- package/dist/esm/required-asterisk.js +10 -20
- package/dist/types/checkbox-field.d.ts +1 -1
- package/dist/types/field.d.ts +1 -2
- package/dist/types/fieldset.d.ts +2 -3
- package/dist/types/form-footer.d.ts +3 -3
- package/dist/types/form-header.d.ts +2 -3
- package/dist/types/form-section.d.ts +2 -3
- package/dist/types/label.d.ts +0 -1
- package/dist/types/messages.d.ts +4 -14
- package/dist/types/required-asterisk.d.ts +2 -2
- package/dist/types-ts4.5/checkbox-field.d.ts +1 -1
- package/dist/types-ts4.5/field.d.ts +1 -2
- package/dist/types-ts4.5/fieldset.d.ts +2 -3
- package/dist/types-ts4.5/form-footer.d.ts +3 -3
- package/dist/types-ts4.5/form-header.d.ts +2 -3
- package/dist/types-ts4.5/form-section.d.ts +2 -3
- package/dist/types-ts4.5/label.d.ts +0 -1
- package/dist/types-ts4.5/messages.d.ts +4 -14
- package/dist/types-ts4.5/required-asterisk.d.ts +2 -2
- package/package.json +27 -22
- package/__perf__/default.tsx +0 -56
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,25 @@
|
|
|
1
1
|
# @atlaskit/form
|
|
2
2
|
|
|
3
|
+
## 11.1.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#109060](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/109060)
|
|
8
|
+
[`4660ec858a305`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/4660ec858a305) -
|
|
9
|
+
Update `React` from v16 to v18
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- Updated dependencies
|
|
14
|
+
|
|
15
|
+
## 11.0.3
|
|
16
|
+
|
|
17
|
+
### Patch Changes
|
|
18
|
+
|
|
19
|
+
- [#107240](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/107240)
|
|
20
|
+
[`5255a1a097bad`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5255a1a097bad) -
|
|
21
|
+
Update dependencies and remove unused internal exports.
|
|
22
|
+
|
|
3
23
|
## 11.0.2
|
|
4
24
|
|
|
5
25
|
### Patch Changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._1pfhu2gc{margin-block-start:var(--ds-space-100,8px)}
|
package/dist/cjs/field.js
CHANGED
|
@@ -1,35 +1,44 @@
|
|
|
1
|
+
/* field.tsx generated by @compiled/babel-plugin v0.36.0 */
|
|
1
2
|
"use strict";
|
|
2
3
|
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
+
var _typeof3 = require("@babel/runtime/helpers/typeof");
|
|
4
6
|
Object.defineProperty(exports, "__esModule", {
|
|
5
7
|
value: true
|
|
6
8
|
});
|
|
7
9
|
exports.default = Field;
|
|
10
|
+
require("./field.compiled.css");
|
|
11
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
12
|
+
var React = _react;
|
|
13
|
+
var _runtime = require("@compiled/react/runtime");
|
|
8
14
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
15
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
10
16
|
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
11
|
-
var _react = require("react");
|
|
12
|
-
var _react2 = require("@emotion/react");
|
|
13
17
|
var _tinyInvariant = _interopRequireDefault(require("tiny-invariant"));
|
|
14
18
|
var _useId = require("@atlaskit/ds-lib/use-id");
|
|
15
19
|
var _fieldIdContext = require("./field-id-context");
|
|
16
20
|
var _form = require("./form");
|
|
17
21
|
var _label = require("./label");
|
|
18
22
|
var _requiredAsterisk = _interopRequireDefault(require("./required-asterisk"));
|
|
23
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
24
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof3(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; }
|
|
19
25
|
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; }
|
|
20
|
-
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) { (0, _defineProperty2.default)(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; }
|
|
21
|
-
|
|
22
|
-
* @jsx jsx
|
|
23
|
-
*/ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
24
|
-
var fieldWrapperStyles = (0, _react2.css)({
|
|
25
|
-
marginBlockStart: "var(--ds-space-100, 8px)"
|
|
26
|
-
});
|
|
26
|
+
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) { (0, _defineProperty2.default)(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; }
|
|
27
|
+
var fieldWrapperStyles = null;
|
|
27
28
|
function isEvent(event) {
|
|
28
29
|
return Boolean(event && event.target);
|
|
29
30
|
}
|
|
30
31
|
function isFunction(x) {
|
|
31
32
|
return typeof x === 'function';
|
|
32
33
|
}
|
|
34
|
+
|
|
35
|
+
// Must be exported to satisfy error TS4023 from Jira builds
|
|
36
|
+
// src/packages/servicedesk/virtual-agent/common/src/ui/base-text-field/index.tsx(10,14):
|
|
37
|
+
// error TS4023: Exported variable `BaseTextField` has or is using name
|
|
38
|
+
// `FieldComponentProps` from external module
|
|
39
|
+
// `/opt/atlassian/pipelines/agent/build/jira/tsDist/@atlaskit__form/app/src/field`
|
|
40
|
+
// but cannot be named.
|
|
41
|
+
|
|
33
42
|
function usePreviousRef(current) {
|
|
34
43
|
var ref = (0, _react.useRef)(current);
|
|
35
44
|
|
|
@@ -244,14 +253,14 @@ function Field(props) {
|
|
|
244
253
|
'aria-labelledby': "".concat(fieldId, "-label"),
|
|
245
254
|
id: fieldId
|
|
246
255
|
});
|
|
247
|
-
return
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
}, props.label &&
|
|
256
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
257
|
+
"data-testid": props.testId,
|
|
258
|
+
className: (0, _runtime.ax)(["_1pfhu2gc"])
|
|
259
|
+
}, props.label && /*#__PURE__*/React.createElement(_label.Label, {
|
|
251
260
|
htmlFor: fieldId,
|
|
252
261
|
id: "".concat(fieldId, "-label"),
|
|
253
262
|
testId: props.testId && "".concat(props.testId, "--label")
|
|
254
|
-
}, props.label, props.isRequired &&
|
|
263
|
+
}, props.label, props.isRequired && /*#__PURE__*/React.createElement(_requiredAsterisk.default, null), props.elementAfterLabel), /*#__PURE__*/React.createElement(_fieldIdContext.FieldId.Provider, {
|
|
255
264
|
value: fieldId
|
|
256
265
|
}, props.children({
|
|
257
266
|
fieldProps: extendedFieldProps,
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._1pfhu2gc{margin-block-start:var(--ds-space-100,8px)}
|
package/dist/cjs/fieldset.js
CHANGED
|
@@ -1,21 +1,18 @@
|
|
|
1
|
+
/* fieldset.tsx generated by @compiled/babel-plugin v0.36.0 */
|
|
1
2
|
"use strict";
|
|
2
3
|
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
|
4
6
|
value: true
|
|
5
7
|
});
|
|
6
8
|
exports.default = void 0;
|
|
7
|
-
|
|
9
|
+
require("./fieldset.compiled.css");
|
|
10
|
+
var React = _interopRequireWildcard(require("react"));
|
|
11
|
+
var _runtime = require("@compiled/react/runtime");
|
|
8
12
|
var _label = require("./label");
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
15
|
-
|
|
16
|
-
var fieldSetStyles = (0, _react.css)({
|
|
17
|
-
marginBlockStart: "var(--ds-space-100, 8px)"
|
|
18
|
-
});
|
|
13
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
14
|
+
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; }
|
|
15
|
+
var fieldSetStyles = null;
|
|
19
16
|
|
|
20
17
|
/**
|
|
21
18
|
* __Fieldset__
|
|
@@ -30,8 +27,8 @@ var fieldSetStyles = (0, _react.css)({
|
|
|
30
27
|
var Fieldset = function Fieldset(_ref) {
|
|
31
28
|
var children = _ref.children,
|
|
32
29
|
legend = _ref.legend;
|
|
33
|
-
return
|
|
34
|
-
|
|
35
|
-
}, legend &&
|
|
30
|
+
return /*#__PURE__*/React.createElement("fieldset", {
|
|
31
|
+
className: (0, _runtime.ax)(["_1pfhu2gc"])
|
|
32
|
+
}, legend && /*#__PURE__*/React.createElement(_label.Legend, null, legend), children);
|
|
36
33
|
};
|
|
37
34
|
var _default = exports.default = Fieldset;
|
package/dist/cjs/form-footer.js
CHANGED
|
@@ -1,25 +1,18 @@
|
|
|
1
|
+
/* form-footer.tsx generated by @compiled/babel-plugin v0.36.0 */
|
|
1
2
|
"use strict";
|
|
2
3
|
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
|
4
6
|
value: true
|
|
5
7
|
});
|
|
6
8
|
exports.default = FormFooter;
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
var formFooterWrapperStyles = (0, _react.css)({
|
|
16
|
-
display: 'flex',
|
|
17
|
-
justifyContent: 'flex-end',
|
|
18
|
-
marginBlockStart: "var(--ds-space-300, 24px)"
|
|
19
|
-
});
|
|
20
|
-
var justifyContentStyles = (0, _react.css)({
|
|
21
|
-
justifyContent: 'flex-start'
|
|
22
|
-
});
|
|
9
|
+
require("./form-footer.compiled.css");
|
|
10
|
+
var React = _interopRequireWildcard(require("react"));
|
|
11
|
+
var _runtime = require("@compiled/react/runtime");
|
|
12
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
13
|
+
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; }
|
|
14
|
+
var formFooterWrapperStyles = null;
|
|
15
|
+
var justifyContentStyles = null;
|
|
23
16
|
|
|
24
17
|
/**
|
|
25
18
|
* __Form footer__
|
|
@@ -34,7 +27,7 @@ function FormFooter(_ref) {
|
|
|
34
27
|
var _ref$align = _ref.align,
|
|
35
28
|
align = _ref$align === void 0 ? 'end' : _ref$align,
|
|
36
29
|
children = _ref.children;
|
|
37
|
-
return
|
|
38
|
-
|
|
30
|
+
return /*#__PURE__*/React.createElement("footer", {
|
|
31
|
+
className: (0, _runtime.ax)(["_1e0c1txw _1bahesu3 _1pfh1ejb", align === 'start' && "_1bah1y6m"])
|
|
39
32
|
}, children);
|
|
40
33
|
}
|
package/dist/cjs/form-header.js
CHANGED
|
@@ -1,27 +1,21 @@
|
|
|
1
|
+
/* form-header.tsx generated by @compiled/babel-plugin v0.36.0 */
|
|
2
|
+
/* eslint-disable @atlaskit/design-system/use-primitives */
|
|
1
3
|
"use strict";
|
|
2
4
|
|
|
3
5
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
6
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
4
7
|
Object.defineProperty(exports, "__esModule", {
|
|
5
8
|
value: true
|
|
6
9
|
});
|
|
7
10
|
exports.default = void 0;
|
|
8
|
-
|
|
11
|
+
require("./form-header.compiled.css");
|
|
12
|
+
var React = _interopRequireWildcard(require("react"));
|
|
13
|
+
var _runtime = require("@compiled/react/runtime");
|
|
9
14
|
var _heading = _interopRequireDefault(require("@atlaskit/heading"));
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
*/
|
|
15
|
-
|
|
16
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
17
|
-
|
|
18
|
-
var formHeaderContentStyles = (0, _primitives.xcss)({
|
|
19
|
-
minWidth: '100%',
|
|
20
|
-
marginBlockStart: 'space.100'
|
|
21
|
-
});
|
|
22
|
-
var formHeaderDescriptionStyles = (0, _primitives.xcss)({
|
|
23
|
-
marginBlockStart: 'space.100'
|
|
24
|
-
});
|
|
15
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
16
|
+
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; }
|
|
17
|
+
var formHeaderContentStyles = null;
|
|
18
|
+
var formHeaderDescriptionStyles = null;
|
|
25
19
|
|
|
26
20
|
/**
|
|
27
21
|
* __Form header__.
|
|
@@ -37,12 +31,12 @@ var FormHeader = function FormHeader(_ref) {
|
|
|
37
31
|
var children = _ref.children,
|
|
38
32
|
description = _ref.description,
|
|
39
33
|
title = _ref.title;
|
|
40
|
-
return
|
|
34
|
+
return /*#__PURE__*/React.createElement("div", null, title && /*#__PURE__*/React.createElement(_heading.default, {
|
|
41
35
|
size: "large"
|
|
42
|
-
}, title), description &&
|
|
43
|
-
|
|
44
|
-
}, description), children &&
|
|
45
|
-
|
|
36
|
+
}, title), description && /*#__PURE__*/React.createElement("div", {
|
|
37
|
+
className: (0, _runtime.ax)(["_1pfhu2gc"])
|
|
38
|
+
}, description), children && /*#__PURE__*/React.createElement("div", {
|
|
39
|
+
className: (0, _runtime.ax)(["_1ul91osq _1pfhu2gc"])
|
|
46
40
|
}, children));
|
|
47
41
|
};
|
|
48
42
|
var _default = exports.default = FormHeader;
|
package/dist/cjs/form-section.js
CHANGED
|
@@ -1,36 +1,32 @@
|
|
|
1
|
+
/* form-section.tsx generated by @compiled/babel-plugin v0.36.0 */
|
|
1
2
|
"use strict";
|
|
2
3
|
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
4
6
|
Object.defineProperty(exports, "__esModule", {
|
|
5
7
|
value: true
|
|
6
8
|
});
|
|
7
9
|
exports.default = void 0;
|
|
8
|
-
|
|
10
|
+
require("./form-section.compiled.css");
|
|
11
|
+
var React = _interopRequireWildcard(require("react"));
|
|
12
|
+
var _runtime = require("@compiled/react/runtime");
|
|
9
13
|
var _heading = _interopRequireDefault(require("@atlaskit/heading"));
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
*/
|
|
15
|
-
|
|
16
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
17
|
-
|
|
18
|
-
var formSectionDescriptionStyles = (0, _primitives.xcss)({
|
|
19
|
-
marginBlockStart: 'space.100'
|
|
20
|
-
});
|
|
21
|
-
var formSectionWrapperStyles = (0, _primitives.xcss)({
|
|
22
|
-
marginBlockStart: 'space.300'
|
|
23
|
-
});
|
|
14
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
15
|
+
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; }
|
|
16
|
+
var formSectionDescriptionStyles = null;
|
|
17
|
+
var formSectionWrapperStyles = null;
|
|
24
18
|
var FormSectionWrapper = function FormSectionWrapper(_ref) {
|
|
25
19
|
var children = _ref.children;
|
|
26
|
-
|
|
27
|
-
|
|
20
|
+
// eslint-disable-next-line @atlaskit/design-system/use-primitives
|
|
21
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
22
|
+
className: (0, _runtime.ax)(["_1pfh1ejb"])
|
|
28
23
|
}, children);
|
|
29
24
|
};
|
|
30
25
|
var FormSectionDescription = function FormSectionDescription(_ref2) {
|
|
31
26
|
var children = _ref2.children;
|
|
32
|
-
|
|
33
|
-
|
|
27
|
+
// eslint-disable-next-line @atlaskit/design-system/use-primitives
|
|
28
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
29
|
+
className: (0, _runtime.ax)(["_1pfhu2gc"])
|
|
34
30
|
}, children);
|
|
35
31
|
};
|
|
36
32
|
|
|
@@ -48,8 +44,8 @@ var FormSection = function FormSection(_ref3) {
|
|
|
48
44
|
var children = _ref3.children,
|
|
49
45
|
description = _ref3.description,
|
|
50
46
|
title = _ref3.title;
|
|
51
|
-
return
|
|
47
|
+
return /*#__PURE__*/React.createElement(FormSectionWrapper, null, title && /*#__PURE__*/React.createElement(_heading.default, {
|
|
52
48
|
size: "medium"
|
|
53
|
-
}, title), description &&
|
|
49
|
+
}, title), description && /*#__PURE__*/React.createElement(FormSectionDescription, null, description), children);
|
|
54
50
|
};
|
|
55
51
|
var _default = exports.default = FormSection;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
._11c8qk37{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
|
|
2
|
+
._1e0c1o8l{display:inline-block}
|
|
3
|
+
._1pfhze3t{margin-block-start:var(--ds-space-0,0)}
|
|
4
|
+
._6rth1b66{margin-block-end:var(--ds-space-050,4px)}
|
|
5
|
+
._k48pmoej{font-weight:var(--ds-font-weight-bold,700)}
|
|
6
|
+
._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
|
package/dist/cjs/label.js
CHANGED
|
@@ -1,25 +1,17 @@
|
|
|
1
|
+
/* label.tsx generated by @compiled/babel-plugin v0.36.0 */
|
|
1
2
|
"use strict";
|
|
2
3
|
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
|
4
6
|
value: true
|
|
5
7
|
});
|
|
6
|
-
exports.
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
14
|
-
|
|
15
|
-
var fieldsetLabelStyles = (0, _react.css)({
|
|
16
|
-
display: 'inline-block',
|
|
17
|
-
color: "var(--ds-text-subtle, #44546F)",
|
|
18
|
-
font: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
|
|
19
|
-
fontWeight: "var(--ds-font-weight-bold, 700)",
|
|
20
|
-
marginBlockEnd: "var(--ds-space-050, 4px)",
|
|
21
|
-
marginBlockStart: "var(--ds-space-0, 0px)"
|
|
22
|
-
});
|
|
8
|
+
exports.Legend = exports.Label = void 0;
|
|
9
|
+
require("./label.compiled.css");
|
|
10
|
+
var React = _interopRequireWildcard(require("react"));
|
|
11
|
+
var _runtime = require("@compiled/react/runtime");
|
|
12
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
13
|
+
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; }
|
|
14
|
+
var fieldsetLabelStyles = null;
|
|
23
15
|
|
|
24
16
|
/**
|
|
25
17
|
* __Label__
|
|
@@ -34,11 +26,11 @@ var Label = exports.Label = function Label(_ref) {
|
|
|
34
26
|
htmlFor = _ref.htmlFor,
|
|
35
27
|
id = _ref.id,
|
|
36
28
|
testId = _ref.testId;
|
|
37
|
-
return
|
|
38
|
-
css: fieldsetLabelStyles,
|
|
29
|
+
return /*#__PURE__*/React.createElement("label", {
|
|
39
30
|
id: id,
|
|
40
31
|
htmlFor: htmlFor,
|
|
41
|
-
"data-testid": testId
|
|
32
|
+
"data-testid": testId,
|
|
33
|
+
className: (0, _runtime.ax)(["_11c8qk37 _1e0c1o8l _syaz1gjq _k48pmoej _6rth1b66 _1pfhze3t"])
|
|
42
34
|
}, children);
|
|
43
35
|
};
|
|
44
36
|
|
|
@@ -49,8 +41,7 @@ var Label = exports.Label = function Label(_ref) {
|
|
|
49
41
|
*/
|
|
50
42
|
var Legend = exports.Legend = function Legend(_ref2) {
|
|
51
43
|
var children = _ref2.children;
|
|
52
|
-
return
|
|
53
|
-
|
|
44
|
+
return /*#__PURE__*/React.createElement("legend", {
|
|
45
|
+
className: (0, _runtime.ax)(["_11c8qk37 _1e0c1o8l _syaz1gjq _k48pmoej _6rth1b66 _1pfhze3t"])
|
|
54
46
|
}, children);
|
|
55
|
-
};
|
|
56
|
-
var _default = exports.default = Label;
|
|
47
|
+
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
._11c8qk37{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
|
|
2
|
+
._zulp12x7{gap:var(--ds-space-075,6px)}
|
|
3
|
+
._1bah1q9y{justify-content:baseline}
|
|
4
|
+
._1e0c1txw{display:flex}
|
|
5
|
+
._1pfh1b66{margin-block-start:var(--ds-space-050,4px)}
|
|
6
|
+
._4cvr1h6o{align-items:center}
|
|
7
|
+
._4t3i7vkz{height:1pc}
|
|
8
|
+
._syaz1wmz{color:var(--ds-text-subtlest,#6b778c)}
|
|
9
|
+
._syaze6sf{color:var(--ds-text-danger,#ae2a19)}
|
|
10
|
+
._syazy73q{color:var(--ds-text-success,#216e4e)}
|
package/dist/cjs/messages.js
CHANGED
|
@@ -1,24 +1,22 @@
|
|
|
1
|
+
/* messages.tsx generated by @compiled/babel-plugin v0.36.0 */
|
|
1
2
|
"use strict";
|
|
2
3
|
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
4
6
|
Object.defineProperty(exports, "__esModule", {
|
|
5
7
|
value: true
|
|
6
8
|
});
|
|
7
|
-
exports.ValidMessage = exports.
|
|
9
|
+
exports.ValidMessage = exports.MessageWrapper = exports.HelperMessage = exports.ErrorMessage = void 0;
|
|
10
|
+
require("./messages.compiled.css");
|
|
11
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
12
|
+
var React = _react;
|
|
13
|
+
var _runtime = require("@compiled/react/runtime");
|
|
8
14
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
9
|
-
var _react = require("react");
|
|
10
|
-
var _react2 = require("@emotion/react");
|
|
11
15
|
var _error = _interopRequireDefault(require("@atlaskit/icon/utility/migration/error"));
|
|
12
16
|
var _successEditorSuccess = _interopRequireDefault(require("@atlaskit/icon/utility/migration/success--editor-success"));
|
|
13
|
-
var _colors = require("@atlaskit/theme/colors");
|
|
14
17
|
var _fieldIdContext = require("./field-id-context");
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
* @jsx jsx
|
|
18
|
-
*/
|
|
19
|
-
|
|
20
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
21
|
-
|
|
18
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
19
|
+
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; }
|
|
22
20
|
/**
|
|
23
21
|
* API for the internal `<Message />` component. This is not public API.
|
|
24
22
|
*/
|
|
@@ -27,43 +25,29 @@ var _fieldIdContext = require("./field-id-context");
|
|
|
27
25
|
* Public API of the various message components.
|
|
28
26
|
*/
|
|
29
27
|
|
|
30
|
-
var messageStyles =
|
|
31
|
-
display: 'flex',
|
|
32
|
-
justifyContent: 'baseline',
|
|
33
|
-
gap: "var(--ds-space-075, 6px)",
|
|
34
|
-
font: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
|
|
35
|
-
marginBlockStart: "var(--ds-space-050, 4px)"
|
|
36
|
-
});
|
|
28
|
+
var messageStyles = null;
|
|
37
29
|
var messageAppearanceStyles = {
|
|
38
|
-
default:
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
valid: (0, _react2.css)({
|
|
45
|
-
color: "var(--ds-text-success, #216E4E)"
|
|
46
|
-
})
|
|
30
|
+
default: "_syaz1wmz",
|
|
31
|
+
error: "_syaze6sf",
|
|
32
|
+
valid: "_syazy73q"
|
|
33
|
+
};
|
|
34
|
+
var iconWrapperStyles = {
|
|
35
|
+
root: "_1e0c1txw _4t3i7vkz _4cvr1h6o"
|
|
47
36
|
};
|
|
48
|
-
var iconWrapperStyles = (0, _react2.css)({
|
|
49
|
-
display: 'flex',
|
|
50
|
-
height: '16px',
|
|
51
|
-
alignItems: 'center'
|
|
52
|
-
});
|
|
53
37
|
var IconWrapper = function IconWrapper(_ref) {
|
|
54
38
|
var children = _ref.children;
|
|
55
|
-
return
|
|
56
|
-
|
|
39
|
+
return /*#__PURE__*/React.createElement("span", {
|
|
40
|
+
className: (0, _runtime.ax)([iconWrapperStyles.root])
|
|
57
41
|
}, children);
|
|
58
42
|
};
|
|
59
43
|
var messageIcons = {
|
|
60
|
-
error:
|
|
44
|
+
error: /*#__PURE__*/React.createElement(_error.default, {
|
|
61
45
|
LEGACY_margin: "0 -2px 0 0",
|
|
62
46
|
color: "currentColor",
|
|
63
47
|
LEGACY_size: "small",
|
|
64
48
|
label: "error"
|
|
65
49
|
}),
|
|
66
|
-
valid:
|
|
50
|
+
valid: /*#__PURE__*/React.createElement(_successEditorSuccess.default, {
|
|
67
51
|
LEGACY_margin: "0 -2px 0 0",
|
|
68
52
|
color: "currentColor",
|
|
69
53
|
LEGACY_size: "small",
|
|
@@ -98,16 +82,16 @@ var Message = function Message(_ref2) {
|
|
|
98
82
|
* If the child is just a string, this is not required and we can use one
|
|
99
83
|
* less DOM element.
|
|
100
84
|
*/
|
|
101
|
-
var content = typeof children === 'string' ? children :
|
|
102
|
-
return
|
|
103
|
-
css: [messageStyles, messageAppearanceStyles[appearance]],
|
|
85
|
+
var content = typeof children === 'string' ? children : /*#__PURE__*/React.createElement("span", null, children);
|
|
86
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
104
87
|
"data-testid": testId,
|
|
105
88
|
id: fieldId,
|
|
106
89
|
ref: messageRef
|
|
107
90
|
// For backwards compatability, if there is a wrapper, aria-live is not needed
|
|
108
91
|
,
|
|
109
|
-
"aria-live": !hasMessageWrapper ? 'polite' : undefined
|
|
110
|
-
|
|
92
|
+
"aria-live": !hasMessageWrapper ? 'polite' : undefined,
|
|
93
|
+
className: (0, _runtime.ax)(["_zulp12x7 _11c8qk37 _1e0c1txw _1bah1q9y _1pfh1b66", messageAppearanceStyles[appearance]])
|
|
94
|
+
}, icon && /*#__PURE__*/React.createElement(IconWrapper, null, icon), content);
|
|
111
95
|
};
|
|
112
96
|
|
|
113
97
|
/**
|
|
@@ -120,8 +104,8 @@ var Message = function Message(_ref2) {
|
|
|
120
104
|
var HelperMessage = exports.HelperMessage = function HelperMessage(_ref3) {
|
|
121
105
|
var children = _ref3.children,
|
|
122
106
|
testId = _ref3.testId;
|
|
123
|
-
return
|
|
124
|
-
return
|
|
107
|
+
return /*#__PURE__*/React.createElement(_fieldIdContext.FieldId.Consumer, null, function (fieldId) {
|
|
108
|
+
return /*#__PURE__*/React.createElement(Message, {
|
|
125
109
|
fieldId: fieldId ? "".concat(fieldId, "-helper") : undefined,
|
|
126
110
|
testId: testId
|
|
127
111
|
}, children);
|
|
@@ -138,8 +122,8 @@ var HelperMessage = exports.HelperMessage = function HelperMessage(_ref3) {
|
|
|
138
122
|
var ErrorMessage = exports.ErrorMessage = function ErrorMessage(_ref4) {
|
|
139
123
|
var children = _ref4.children,
|
|
140
124
|
testId = _ref4.testId;
|
|
141
|
-
return
|
|
142
|
-
return
|
|
125
|
+
return /*#__PURE__*/React.createElement(_fieldIdContext.FieldId.Consumer, null, function (fieldId) {
|
|
126
|
+
return /*#__PURE__*/React.createElement(Message, {
|
|
143
127
|
appearance: "error",
|
|
144
128
|
fieldId: fieldId ? "".concat(fieldId, "-error") : undefined,
|
|
145
129
|
testId: testId
|
|
@@ -157,8 +141,8 @@ var ErrorMessage = exports.ErrorMessage = function ErrorMessage(_ref4) {
|
|
|
157
141
|
var ValidMessage = exports.ValidMessage = function ValidMessage(_ref5) {
|
|
158
142
|
var children = _ref5.children,
|
|
159
143
|
testId = _ref5.testId;
|
|
160
|
-
return
|
|
161
|
-
return
|
|
144
|
+
return /*#__PURE__*/React.createElement(_fieldIdContext.FieldId.Consumer, null, function (fieldId) {
|
|
145
|
+
return /*#__PURE__*/React.createElement(Message, {
|
|
162
146
|
appearance: "valid",
|
|
163
147
|
fieldId: fieldId ? "".concat(fieldId, "-valid") : undefined,
|
|
164
148
|
testId: testId
|
|
@@ -172,7 +156,7 @@ var ValidMessage = exports.ValidMessage = function ValidMessage(_ref5) {
|
|
|
172
156
|
* A message wrapper context allows the children to check
|
|
173
157
|
* if it is contained within the MessageWrapper.
|
|
174
158
|
*/
|
|
175
|
-
var MessageWrapperContext =
|
|
159
|
+
var MessageWrapperContext = /*#__PURE__*/(0, _react.createContext)({
|
|
176
160
|
isWrapper: false
|
|
177
161
|
});
|
|
178
162
|
|
|
@@ -190,9 +174,9 @@ var MessageWrapper = exports.MessageWrapper = function MessageWrapper(_ref6) {
|
|
|
190
174
|
var contextValue = {
|
|
191
175
|
isWrapper: true
|
|
192
176
|
};
|
|
193
|
-
return
|
|
177
|
+
return /*#__PURE__*/React.createElement(MessageWrapperContext.Provider, {
|
|
194
178
|
value: contextValue
|
|
195
|
-
},
|
|
179
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
196
180
|
"aria-live": "polite",
|
|
197
181
|
"data-testid": "message-wrapper"
|
|
198
182
|
}, children));
|
package/dist/cjs/range-field.js
CHANGED
|
@@ -24,24 +24,26 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
24
24
|
* - [Code](https://atlaskit.atlassian.com/packages/design-system/form/docs/fields#rangefield-reference)
|
|
25
25
|
* - [Usage](https://atlaskit.atlassian.com/packages/design-system/form/docs/fields#rangefield-reference)
|
|
26
26
|
*/
|
|
27
|
-
var RangeField = function RangeField(
|
|
28
|
-
var children =
|
|
29
|
-
strippedProps = (0, _objectWithoutProperties2.default)(
|
|
30
|
-
// isInvalid and isRequired are specifically invalid for range inputs
|
|
27
|
+
var RangeField = function RangeField(_ref) {
|
|
28
|
+
var children = _ref.children,
|
|
29
|
+
strippedProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
31
30
|
return (
|
|
32
31
|
/*#__PURE__*/
|
|
33
32
|
// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
|
|
34
33
|
_react.default.createElement(_field.default, (0, _extends2.default)({}, strippedProps, {
|
|
35
34
|
transform: Number
|
|
36
|
-
}), function (
|
|
37
|
-
var
|
|
38
|
-
isInvalid =
|
|
39
|
-
isRequired =
|
|
40
|
-
fieldProps = (0, _objectWithoutProperties2.default)(
|
|
41
|
-
rest = (0, _objectWithoutProperties2.default)(
|
|
42
|
-
return
|
|
43
|
-
|
|
44
|
-
|
|
35
|
+
}), function (_ref2) {
|
|
36
|
+
var _ref2$fieldProps = _ref2.fieldProps,
|
|
37
|
+
isInvalid = _ref2$fieldProps.isInvalid,
|
|
38
|
+
isRequired = _ref2$fieldProps.isRequired,
|
|
39
|
+
fieldProps = (0, _objectWithoutProperties2.default)(_ref2$fieldProps, _excluded2),
|
|
40
|
+
rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded3);
|
|
41
|
+
return (
|
|
42
|
+
// isInvalid and isRequired are specifically invalid for range inputs
|
|
43
|
+
children(_objectSpread({
|
|
44
|
+
fieldProps: fieldProps
|
|
45
|
+
}, rest))
|
|
46
|
+
);
|
|
45
47
|
})
|
|
46
48
|
);
|
|
47
49
|
};
|