@atlaskit/form 10.0.0 → 10.1.1

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/form
 
+## 10.1.1
+
+### Patch Changes
+
+-   [#100993](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/100993)
+    [`cb7514abb833`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/cb7514abb833) -
+    Typography tokens for form labels.
+
+## 10.1.0
+
+### Minor Changes
+
+-   [#98612](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/98612)
+    [`7a11b97d325a`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/7a11b97d325a) -
+    Add support for React 18.
+
+### Patch Changes
+
+-   Updated dependencies
+
 ## 10.0.0
 
 ### Major Changes

package/dist/cjs/label.js

@@ -6,23 +6,16 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.Legend = exports.Label = void 0;
 var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
-var _constants = require("@atlaskit/theme/constants");
-var _typography = require("@atlaskit/theme/typography");
 /** @jsx jsx */
 
-var fontFamily = (0, _constants.fontFamily)();
-// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
-var fieldsetLabelStyles = (0, _react.css)([(0, _typography.h200)({
-  theme: {
-    mode: 'light'
-  }
-}), {
+var fieldsetLabelStyles = (0, _react.css)({
   display: 'inline-block',
-  marginTop: 0,
-  marginBottom: "var(--ds-space-050, 4px)",
   color: "var(--ds-text-subtle, ".concat(_colors.N200, ")"),
-  fontFamily: fontFamily
-}]);
+  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)",
+  fontWeight: "var(--ds-font-weight-semibold, 600)",
+  marginBlockEnd: "var(--ds-space-050, 4px)",
+  marginBlockStart: 0
+});
 
 /**
  * __Label__

package/dist/es2019/label.js

@@ -2,21 +2,14 @@
 
 import { css, jsx } from '@emotion/react';
 import { N200 } from '@atlaskit/theme/colors';
-import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
-import { h200 } from '@atlaskit/theme/typography';
-const fontFamily = getFontFamily();
-// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
-const fieldsetLabelStyles = css([h200({
-  theme: {
-    mode: 'light'
-  }
-}), {
+const fieldsetLabelStyles = css({
   display: 'inline-block',
-  marginTop: 0,
-  marginBottom: "var(--ds-space-050, 4px)",
   color: `var(--ds-text-subtle, ${N200})`,
-  fontFamily: fontFamily
-}]);
+  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)",
+  fontWeight: "var(--ds-font-weight-semibold, 600)",
+  marginBlockEnd: "var(--ds-space-050, 4px)",
+  marginBlockStart: 0
+});
 
 /**
  * __Label__

package/dist/esm/label.js

@@ -2,21 +2,14 @@
 
 import { css, jsx } from '@emotion/react';
 import { N200 } from '@atlaskit/theme/colors';
-import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
-import { h200 } from '@atlaskit/theme/typography';
-var fontFamily = getFontFamily();
-// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
-var fieldsetLabelStyles = css([h200({
-  theme: {
-    mode: 'light'
-  }
-}), {
+var fieldsetLabelStyles = css({
   display: 'inline-block',
-  marginTop: 0,
-  marginBottom: "var(--ds-space-050, 4px)",
   color: "var(--ds-text-subtle, ".concat(N200, ")"),
-  fontFamily: fontFamily
-}]);
+  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)",
+  fontWeight: "var(--ds-font-weight-semibold, 600)",
+  marginBlockEnd: "var(--ds-space-050, 4px)",
+  marginBlockStart: 0
+});
 
 /**
  * __Label__

package/dist/types/label.d.ts

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { FC, ReactNode } from 'react';
+import { type FC, type ReactNode } from 'react';
 export interface LabelProps {
     id?: string;
     htmlFor: string;

package/dist/types-ts4.5/label.d.ts

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { FC, ReactNode } from 'react';
+import { type FC, type ReactNode } from 'react';
 export interface LabelProps {
     id?: string;
     htmlFor: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/form",
-  "version": "10.0.0",
+  "version": "10.1.1",
   "description": "A form allows users to input information.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -24,14 +24,15 @@
     "website": {
       "name": "Form",
       "category": "Components"
-    }
+    },
+    "runReact18": true
   },
   "dependencies": {
     "@atlaskit/heading": "^2.2.0",
-    "@atlaskit/icon": "^22.1.0",
-    "@atlaskit/primitives": "^6.1.0",
+    "@atlaskit/icon": "^22.2.0",
+    "@atlaskit/primitives": "^6.2.0",
     "@atlaskit/theme": "^12.8.0",
-    "@atlaskit/tokens": "^1.47.0",
+    "@atlaskit/tokens": "^1.48.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
     "final-form": "^4.20.3",
@@ -41,7 +42,7 @@
     "tiny-invariant": "^1.2.0"
   },
   "peerDependencies": {
-    "react": "^16.8.0"
+    "react": "^16.8.0 || ^17.0.0 || ~18.2.0"
   },
   "devDependencies": {
     "@af/accessibility-testing": "*",