@atlaskit/form 10.1.1 → 10.2.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 CHANGED
@@ -1,5 +1,14 @@
1
1
  # @atlaskit/form
2
2
 
3
+ ## 10.2.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#99625](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/99625)
8
+ [`f60a622d5890`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f60a622d5890) -
9
+ FormHeader refactor to follow new typography system behind a feature flag. FormHeader title does
10
+ not truncate any more.
11
+
3
12
  ## 10.1.1
4
13
 
5
14
  ### Patch Changes
@@ -1,10 +1,13 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
6
  });
6
7
  exports.default = exports.FormHeaderTitle = exports.FormHeaderDescription = exports.FormHeaderContent = void 0;
7
8
  var _react = require("@emotion/react");
9
+ var _heading = _interopRequireDefault(require("@atlaskit/heading"));
10
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
8
11
  var _primitives = require("@atlaskit/primitives");
9
12
  var _constants = require("@atlaskit/theme/constants");
10
13
  var _typography = require("@atlaskit/theme/typography");
@@ -75,6 +78,8 @@ var FormHeader = function FormHeader(_ref5) {
75
78
  var children = _ref5.children,
76
79
  description = _ref5.description,
77
80
  title = _ref5.title;
78
- return (0, _react.jsx)(FormHeaderWrapper, null, title && (0, _react.jsx)(FormHeaderTitle, null, title), description && (0, _react.jsx)(FormHeaderDescription, null, description), children && (0, _react.jsx)(FormHeaderContent, null, children));
81
+ return (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.form-header-typography-updates_4f1g6') ? (0, _react.jsx)(_primitives.Box, null, title && (0, _react.jsx)(_heading.default, {
82
+ size: "large"
83
+ }, title), description && (0, _react.jsx)(FormHeaderDescription, null, description), children && (0, _react.jsx)(FormHeaderContent, null, children)) : (0, _react.jsx)(FormHeaderWrapper, null, title && (0, _react.jsx)(FormHeaderTitle, null, title), description && (0, _react.jsx)(FormHeaderDescription, null, description), children && (0, _react.jsx)(FormHeaderContent, null, children));
79
84
  };
80
85
  var _default = exports.default = FormHeader;
@@ -1,6 +1,8 @@
1
1
  /** @jsx jsx */
2
2
 
3
3
  import { css, jsx } from '@emotion/react';
4
+ import Heading from '@atlaskit/heading';
5
+ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
4
6
  import { Box, xcss } from '@atlaskit/primitives';
5
7
  import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
6
8
  import { h700 } from '@atlaskit/theme/typography';
@@ -74,7 +76,9 @@ const FormHeader = ({
74
76
  description,
75
77
  title
76
78
  }) => {
77
- return jsx(FormHeaderWrapper, null, title && jsx(FormHeaderTitle, null, title), description && jsx(FormHeaderDescription, null, description), children && jsx(FormHeaderContent, null, children));
79
+ return getBooleanFF('platform.design-system-team.form-header-typography-updates_4f1g6') ? jsx(Box, null, title && jsx(Heading, {
80
+ size: "large"
81
+ }, title), description && jsx(FormHeaderDescription, null, description), children && jsx(FormHeaderContent, null, children)) : jsx(FormHeaderWrapper, null, title && jsx(FormHeaderTitle, null, title), description && jsx(FormHeaderDescription, null, description), children && jsx(FormHeaderContent, null, children));
78
82
  };
79
83
  export default FormHeader;
80
84
  export { FormHeaderContent, FormHeaderDescription, FormHeaderTitle };
@@ -1,6 +1,8 @@
1
1
  /** @jsx jsx */
2
2
 
3
3
  import { css, jsx } from '@emotion/react';
4
+ import Heading from '@atlaskit/heading';
5
+ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
4
6
  import { Box, xcss } from '@atlaskit/primitives';
5
7
  import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
6
8
  import { h700 } from '@atlaskit/theme/typography';
@@ -69,7 +71,9 @@ var FormHeader = function FormHeader(_ref5) {
69
71
  var children = _ref5.children,
70
72
  description = _ref5.description,
71
73
  title = _ref5.title;
72
- return jsx(FormHeaderWrapper, null, title && jsx(FormHeaderTitle, null, title), description && jsx(FormHeaderDescription, null, description), children && jsx(FormHeaderContent, null, children));
74
+ return getBooleanFF('platform.design-system-team.form-header-typography-updates_4f1g6') ? jsx(Box, null, title && jsx(Heading, {
75
+ size: "large"
76
+ }, title), description && jsx(FormHeaderDescription, null, description), children && jsx(FormHeaderContent, null, children)) : jsx(FormHeaderWrapper, null, title && jsx(FormHeaderTitle, null, title), description && jsx(FormHeaderDescription, null, description), children && jsx(FormHeaderContent, null, children));
73
77
  };
74
78
  export default FormHeader;
75
79
  export { FormHeaderContent, FormHeaderDescription, FormHeaderTitle };
@@ -1,5 +1,5 @@
1
1
  /** @jsx jsx */
2
- import { ReactNode } from 'react';
2
+ import { type ReactNode } from 'react';
3
3
  import { jsx } from '@emotion/react';
4
4
  export interface FormHeaderProps {
5
5
  /**
@@ -1,5 +1,5 @@
1
1
  /** @jsx jsx */
2
- import { ReactNode } from 'react';
2
+ import { type ReactNode } from 'react';
3
3
  import { jsx } from '@emotion/react';
4
4
  export interface FormHeaderProps {
5
5
  /**
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/form",
3
- "version": "10.1.1",
3
+ "version": "10.2.0",
4
4
  "description": "A form allows users to input information.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -29,10 +29,11 @@
29
29
  },
30
30
  "dependencies": {
31
31
  "@atlaskit/heading": "^2.2.0",
32
- "@atlaskit/icon": "^22.2.0",
33
- "@atlaskit/primitives": "^6.2.0",
32
+ "@atlaskit/icon": "^22.3.0",
33
+ "@atlaskit/platform-feature-flags": "^0.2.5",
34
+ "@atlaskit/primitives": "^6.3.0",
34
35
  "@atlaskit/theme": "^12.8.0",
35
- "@atlaskit/tokens": "^1.48.0",
36
+ "@atlaskit/tokens": "^1.49.0",
36
37
  "@babel/runtime": "^7.0.0",
37
38
  "@emotion/react": "^11.7.1",
38
39
  "final-form": "^4.20.3",
@@ -49,7 +50,7 @@
49
50
  "@af/integration-testing": "*",
50
51
  "@af/visual-regression": "*",
51
52
  "@atlaskit/banner": "^12.3.0",
52
- "@atlaskit/button": "^17.14.0",
53
+ "@atlaskit/button": "^17.15.0",
53
54
  "@atlaskit/checkbox": "^13.3.0",
54
55
  "@atlaskit/ds-lib": "^2.3.0",
55
56
  "@atlaskit/modal-dialog": "^12.13.0",
@@ -123,5 +124,10 @@
123
124
  ".": "./src/index.tsx"
124
125
  },
125
126
  "homepage": "https://atlassian.design/components/form/",
126
- "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
127
+ "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1",
128
+ "platform-feature-flags": {
129
+ "platform.design-system-team.form-header-typography-updates_4f1g6": {
130
+ "type": "boolean"
131
+ }
132
+ }
127
133
  }