@atlaskit/primitives 16.4.4 → 17.0.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/primitives
 
+## 17.0.0
+
+### Major Changes
+
+- [`55546332d4ef4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/55546332d4ef4) -
+  Restricted `borderRadius` xcss and cssMap types to only accept tokens, 0, and "inherit".
+  Restricted `borderWidth` types to only accept tokens and 0. Previously any string was allowed,
+  this is no longer the case and will throw a type error.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 16.4.4
 
 ### Patch Changes

package/dist/cjs/compiled/components/anchor.js

@@ -70,7 +70,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/cjs/compiled/components/pressable.js

@@ -61,7 +61,7 @@ var Pressable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/cjs/components/anchor.js

@@ -105,7 +105,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/cjs/components/pressable.js

@@ -97,7 +97,7 @@ var Pressable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/cjs/xcss/style-maps.partial.js

@@ -594,6 +594,14 @@ var metricTextSizeMap = exports.metricTextSizeMap = {
 
 // Margin needs some bespoke types: https://atlassian.slack.com/archives/CKRHB23K8/p1712623192772909
 
+/**
+ * Token functions are currently allowed for borderRadius in xcss to ease migration.
+ * Because 'radius.small' defaults to 3px, we need a mechanism to allow for 4px values to be provided:
+ * This is done by calling the token function - token('radius.small')
+ *
+ * TODO: Remove once shape them is rolled out and fg platform-dst-shape-theme-default removed
+ */
+
 // Generate maps for Box props. backgroundColor, padding, etc
 var spacingProperties = [
 // Used by Box

package/dist/es2019/compiled/components/anchor.js

@@ -56,7 +56,7 @@ const AnchorNoRef = ({
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/es2019/compiled/components/pressable.js

@@ -48,7 +48,7 @@ const Pressable = /*#__PURE__*/forwardRef(({
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/es2019/components/anchor.js

@@ -94,7 +94,7 @@ const AnchorNoRef = ({
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/es2019/components/pressable.js

@@ -86,7 +86,7 @@ const Pressable = /*#__PURE__*/forwardRef(({
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/es2019/xcss/style-maps.partial.js

@@ -1,7 +1,6 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
 import { CURRENT_SURFACE_CSS_VAR } from '@atlaskit/tokens';
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::df710bcd99c0a8704ca36bddb12c2154>>
@@ -589,6 +588,14 @@ export const metricTextSizeMap = {
 
 // Margin needs some bespoke types: https://atlassian.slack.com/archives/CKRHB23K8/p1712623192772909
 
+/**
+ * Token functions are currently allowed for borderRadius in xcss to ease migration.
+ * Because 'radius.small' defaults to 3px, we need a mechanism to allow for 4px values to be provided:
+ * This is done by calling the token function - token('radius.small')
+ *
+ * TODO: Remove once shape them is rolled out and fg platform-dst-shape-theme-default removed
+ */
+
 // Generate maps for Box props. backgroundColor, padding, etc
 const spacingProperties = [
 // Used by Box

package/dist/esm/compiled/components/anchor.js

@@ -61,7 +61,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/esm/compiled/components/pressable.js

@@ -52,7 +52,7 @@ var Pressable = /*#__PURE__*/forwardRef(function (_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/esm/components/anchor.js

@@ -99,7 +99,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/esm/components/pressable.js

@@ -91,7 +91,7 @@ var Pressable = /*#__PURE__*/forwardRef(function (_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "16.4.4",
+    packageVersion: "0.0.0-development",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/esm/xcss/style-maps.partial.js

@@ -4,7 +4,6 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
 import { CURRENT_SURFACE_CSS_VAR } from '@atlaskit/tokens';
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::df710bcd99c0a8704ca36bddb12c2154>>
@@ -589,6 +588,14 @@ export var metricTextSizeMap = {
 
 // Margin needs some bespoke types: https://atlassian.slack.com/archives/CKRHB23K8/p1712623192772909
 
+/**
+ * Token functions are currently allowed for borderRadius in xcss to ease migration.
+ * Because 'radius.small' defaults to 3px, we need a mechanism to allow for 4px values to be provided:
+ * This is done by calling the token function - token('radius.small')
+ *
+ * TODO: Remove once shape them is rolled out and fg platform-dst-shape-theme-default removed
+ */
+
 // Generate maps for Box props. backgroundColor, padding, etc
 var spacingProperties = [
 // Used by Box

package/dist/types/xcss/style-maps.partial.d.ts

@@ -1,5 +1,6 @@
 import { type SerializedStyles } from '@emotion/react';
 import { CURRENT_SURFACE_CSS_VAR, token } from '@atlaskit/tokens';
+import type { CSSTokenMap } from '@atlaskit/tokens/token-names';
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::df710bcd99c0a8704ca36bddb12c2154>>
@@ -617,6 +618,15 @@ export type MetricTextSize = keyof typeof metricTextSizeMap;
  */
 type MarginSpace = AllSpace | 'auto' | '0';
 type PaddingSpace = Space | '0';
+type BorderWidthExtended = BorderWidth | 0 | '0';
+/**
+ * Token functions are currently allowed for borderRadius in xcss to ease migration.
+ * Because 'radius.small' defaults to 3px, we need a mechanism to allow for 4px values to be provided:
+ * This is done by calling the token function - token('radius.small')
+ *
+ * TODO: Remove once shape them is rolled out and fg platform-dst-shape-theme-default removed
+ */
+type BorderRadiusExtended = BorderRadius | 0 | '0' | 'inherit' | CSSTokenMap[BorderRadius];
 type GlobalValue = 'inherit' | 'initial' | 'revert' | 'revert-layer' | 'unset';
 type AutoComplete<T extends string> = T | Omit<string, T>;
 export type TokenisedProps = {
@@ -624,35 +634,35 @@ export type TokenisedProps = {
     blockSize?: Dimension | string;
     borderBlockColor?: AutoComplete<BorderColor>;
     borderBlockEndColor?: AutoComplete<BorderColor>;
-    borderBlockEndWidth?: BorderWidth | string;
+    borderBlockEndWidth?: BorderWidthExtended;
     borderBlockStartColor?: AutoComplete<BorderColor>;
-    borderBlockStartWidth?: BorderWidth | string;
-    borderBlockWidth?: BorderWidth | string;
+    borderBlockStartWidth?: BorderWidthExtended;
+    borderBlockWidth?: BorderWidthExtended;
     borderBottomColor?: AutoComplete<BorderColor>;
-    borderBottomLeftRadius?: BorderRadius | string;
-    borderBottomRightRadius?: BorderRadius | string;
-    borderBottomWidth?: BorderWidth | string;
+    borderBottomLeftRadius?: BorderRadiusExtended;
+    borderBottomRightRadius?: BorderRadiusExtended;
+    borderBottomWidth?: BorderWidthExtended;
     borderColor?: BorderColor;
-    borderEndEndRadius?: BorderRadius | string;
-    borderEndStartRadius?: BorderRadius | string;
+    borderEndEndRadius?: BorderRadiusExtended;
+    borderEndStartRadius?: BorderRadiusExtended;
     borderInlineColor?: AutoComplete<BorderColor>;
     borderInlineEndColor?: AutoComplete<BorderColor>;
-    borderInlineEndWidth?: BorderWidth | string;
+    borderInlineEndWidth?: BorderWidthExtended;
     borderInlineStartColor?: AutoComplete<BorderColor>;
-    borderInlineStartWidth?: BorderWidth | string;
-    borderInlineWidth?: BorderWidth | string;
+    borderInlineStartWidth?: BorderWidthExtended;
+    borderInlineWidth?: BorderWidthExtended;
     borderLeftColor?: AutoComplete<BorderColor>;
-    borderLeftWidth?: BorderWidth | string;
-    borderRadius?: BorderRadius | string;
+    borderLeftWidth?: BorderWidthExtended;
+    borderRadius?: BorderRadiusExtended;
     borderRightColor?: AutoComplete<BorderColor>;
-    borderRightWidth?: BorderWidth | string;
-    borderStartEndRadius?: BorderRadius | string;
-    borderStartStartRadius?: BorderRadius | string;
+    borderRightWidth?: BorderWidthExtended;
+    borderStartEndRadius?: BorderRadiusExtended;
+    borderStartStartRadius?: BorderRadiusExtended;
     borderTopColor?: AutoComplete<BorderColor>;
-    borderTopLeftRadius?: BorderRadius | string;
-    borderTopRightRadius?: BorderRadius | string;
-    borderTopWidth?: BorderWidth | string;
-    borderWidth?: BorderWidth | string;
+    borderTopLeftRadius?: BorderRadiusExtended;
+    borderTopRightRadius?: BorderRadiusExtended;
+    borderTopWidth?: BorderWidthExtended;
+    borderWidth?: BorderWidthExtended;
     bottom?: AutoComplete<AllSpace>;
     boxShadow?: Shadow;
     color?: TextColor;
@@ -694,7 +704,7 @@ export type TokenisedProps = {
     opacity?: AutoComplete<Opacity> | number;
     outlineColor?: BorderColor;
     outlineOffset?: AllSpace;
-    outlineWidth?: BorderWidth | string;
+    outlineWidth?: BorderWidthExtended;
     padding?: PaddingSpace | GlobalValue;
     paddingBlock?: PaddingSpace | GlobalValue;
     paddingBlockEnd?: PaddingSpace | GlobalValue;

package/dist/types-ts4.5/xcss/style-maps.partial.d.ts

@@ -1,5 +1,6 @@
 import { type SerializedStyles } from '@emotion/react';
 import { CURRENT_SURFACE_CSS_VAR, token } from '@atlaskit/tokens';
+import type { CSSTokenMap } from '@atlaskit/tokens/token-names';
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::df710bcd99c0a8704ca36bddb12c2154>>
@@ -617,6 +618,15 @@ export type MetricTextSize = keyof typeof metricTextSizeMap;
  */
 type MarginSpace = AllSpace | 'auto' | '0';
 type PaddingSpace = Space | '0';
+type BorderWidthExtended = BorderWidth | 0 | '0';
+/**
+ * Token functions are currently allowed for borderRadius in xcss to ease migration.
+ * Because 'radius.small' defaults to 3px, we need a mechanism to allow for 4px values to be provided:
+ * This is done by calling the token function - token('radius.small')
+ *
+ * TODO: Remove once shape them is rolled out and fg platform-dst-shape-theme-default removed
+ */
+type BorderRadiusExtended = BorderRadius | 0 | '0' | 'inherit' | CSSTokenMap[BorderRadius];
 type GlobalValue = 'inherit' | 'initial' | 'revert' | 'revert-layer' | 'unset';
 type AutoComplete<T extends string> = T | Omit<string, T>;
 export type TokenisedProps = {
@@ -624,35 +634,35 @@ export type TokenisedProps = {
     blockSize?: Dimension | string;
     borderBlockColor?: AutoComplete<BorderColor>;
     borderBlockEndColor?: AutoComplete<BorderColor>;
-    borderBlockEndWidth?: BorderWidth | string;
+    borderBlockEndWidth?: BorderWidthExtended;
     borderBlockStartColor?: AutoComplete<BorderColor>;
-    borderBlockStartWidth?: BorderWidth | string;
-    borderBlockWidth?: BorderWidth | string;
+    borderBlockStartWidth?: BorderWidthExtended;
+    borderBlockWidth?: BorderWidthExtended;
     borderBottomColor?: AutoComplete<BorderColor>;
-    borderBottomLeftRadius?: BorderRadius | string;
-    borderBottomRightRadius?: BorderRadius | string;
-    borderBottomWidth?: BorderWidth | string;
+    borderBottomLeftRadius?: BorderRadiusExtended;
+    borderBottomRightRadius?: BorderRadiusExtended;
+    borderBottomWidth?: BorderWidthExtended;
     borderColor?: BorderColor;
-    borderEndEndRadius?: BorderRadius | string;
-    borderEndStartRadius?: BorderRadius | string;
+    borderEndEndRadius?: BorderRadiusExtended;
+    borderEndStartRadius?: BorderRadiusExtended;
     borderInlineColor?: AutoComplete<BorderColor>;
     borderInlineEndColor?: AutoComplete<BorderColor>;
-    borderInlineEndWidth?: BorderWidth | string;
+    borderInlineEndWidth?: BorderWidthExtended;
     borderInlineStartColor?: AutoComplete<BorderColor>;
-    borderInlineStartWidth?: BorderWidth | string;
-    borderInlineWidth?: BorderWidth | string;
+    borderInlineStartWidth?: BorderWidthExtended;
+    borderInlineWidth?: BorderWidthExtended;
     borderLeftColor?: AutoComplete<BorderColor>;
-    borderLeftWidth?: BorderWidth | string;
-    borderRadius?: BorderRadius | string;
+    borderLeftWidth?: BorderWidthExtended;
+    borderRadius?: BorderRadiusExtended;
     borderRightColor?: AutoComplete<BorderColor>;
-    borderRightWidth?: BorderWidth | string;
-    borderStartEndRadius?: BorderRadius | string;
-    borderStartStartRadius?: BorderRadius | string;
+    borderRightWidth?: BorderWidthExtended;
+    borderStartEndRadius?: BorderRadiusExtended;
+    borderStartStartRadius?: BorderRadiusExtended;
     borderTopColor?: AutoComplete<BorderColor>;
-    borderTopLeftRadius?: BorderRadius | string;
-    borderTopRightRadius?: BorderRadius | string;
-    borderTopWidth?: BorderWidth | string;
-    borderWidth?: BorderWidth | string;
+    borderTopLeftRadius?: BorderRadiusExtended;
+    borderTopRightRadius?: BorderRadiusExtended;
+    borderTopWidth?: BorderWidthExtended;
+    borderWidth?: BorderWidthExtended;
     bottom?: AutoComplete<AllSpace>;
     boxShadow?: Shadow;
     color?: TextColor;
@@ -694,7 +704,7 @@ export type TokenisedProps = {
     opacity?: AutoComplete<Opacity> | number;
     outlineColor?: BorderColor;
     outlineOffset?: AllSpace;
-    outlineWidth?: BorderWidth | string;
+    outlineWidth?: BorderWidthExtended;
     padding?: PaddingSpace | GlobalValue;
     paddingBlock?: PaddingSpace | GlobalValue;
     paddingBlockEnd?: PaddingSpace | GlobalValue;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/primitives",
-	"version": "16.4.4",
+	"version": "17.0.0",
 	"description": "Primitives are token-backed low-level building blocks.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -134,10 +134,10 @@
 	"dependencies": {
 		"@atlaskit/analytics-next": "^11.1.0",
 		"@atlaskit/app-provider": "^3.2.0",
-		"@atlaskit/css": "^0.18.0",
+		"@atlaskit/css": "^0.19.0",
 		"@atlaskit/ds-lib": "^5.3.0",
 		"@atlaskit/interaction-context": "^3.1.0",
-		"@atlaskit/tokens": "^8.6.0",
+		"@atlaskit/tokens": "^9.0.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.18.6",
@@ -155,7 +155,7 @@
 		"@af/integration-testing": "workspace:^",
 		"@af/visual-regression": "workspace:^",
 		"@atlaskit/avatar": "^25.6.0",
-		"@atlaskit/button": "^23.8.0",
+		"@atlaskit/button": "^23.9.0",
 		"@atlaskit/checkbox": "^17.2.0",
 		"@atlaskit/code": "^17.4.0",
 		"@atlaskit/docs": "^11.2.0",